From d5410a518f94ab5aff715852db1cf514e8a2730f Mon Sep 17 00:00:00 2001 From: Mattsson <111893710+mattssonn@users.noreply.github.com> Date: Tue, 7 Apr 2026 15:53:30 +0200 Subject: [PATCH] Mobile view fixes (#188) * fix: make new user checklist mobile responsive Adjust spacing, padding, typography, and indentation for small screens so the onboarding welcome screen works well on mobile devices. * fix: make expenses and bookkeeping verification views mobile responsive - Expenses/new: stack form grids on mobile, replace line items table with card layout, full-width action buttons - Expenses/[id]: stack header and actions, card layout for line items and payments, single-column info grid on mobile - JournalEntryList: unify verification lines into card layout for all screen sizes, hide redundant line descriptions that duplicate account name or entry description, stack filter bar and action buttons on mobile * fix: remove stray )); in provider_consents migration Syntax error on line 35 caused MIGRATIONS_FAILED on the Supabase staging branch. * fix: enhance mobile responsiveness for invoices page and update dialog styles --- app/(dashboard)/expenses/[id]/page.tsx | 171 ++++-- app/(dashboard)/expenses/new/page.tsx | 223 +++++--- app/(dashboard)/invoices/page.tsx | 19 +- components/bookkeeping/JournalEntryList.tsx | 172 +++--- components/onboarding/NewUserChecklist.tsx | 56 +- components/ui/dialog.tsx | 2 +- extensions/general/mcp-server/server.ts | 16 +- .../20260402010000_provider_consents.sql | 1 - ...407120000_add_missing_customer_columns.sql | 8 + ...0_add_missing_company_settings_columns.sql | 23 + .../20260407120200_sync_missing_schema.sql | 539 ++++++++++++++++++ 11 files changed, 957 insertions(+), 273 deletions(-) create mode 100644 supabase/migrations/20260407120000_add_missing_customer_columns.sql create mode 100644 supabase/migrations/20260407120100_add_missing_company_settings_columns.sql create mode 100644 supabase/migrations/20260407120200_sync_missing_schema.sql diff --git a/app/(dashboard)/expenses/[id]/page.tsx b/app/(dashboard)/expenses/[id]/page.tsx index 578e51fc..24de5058 100644 --- a/app/(dashboard)/expenses/[id]/page.tsx +++ b/app/(dashboard)/expenses/[id]/page.tsx @@ -170,13 +170,13 @@ export default function ExpenseDetailPage() { return (
{/* Header */} -
-
- -
-
+
+

Utgift #{invoice.arrival_number}

@@ -184,39 +184,40 @@ export default function ExpenseDetailPage() { {status.label}
-

+

{invoice.supplier?.name} · Faktura {invoice.supplier_invoice_number}

{/* Context-aware actions */} -
+
{invoice.status === 'registered' && ( <> - - )} {['approved', 'overdue'].includes(invoice.status) && ( <> - - )} {invoice.status === 'partially_paid' && ( - @@ -231,7 +232,7 @@ export default function ExpenseDetailPage() { {/* Info grid */} -
+
Leverantör

@@ -282,28 +283,51 @@ export default function ExpenseDetailPage() { {/* Line items */} {items.length > 0 && (

- - - - - - - - - - - - {items.map((item) => ( - - - - - - + {/* Desktop: table */} +
+
BeskrivningKontoMoms%BeloppMoms
{item.description}{Math.round(item.vat_rate * 100)}%{formatAmount(item.line_total)}{formatAmount(item.vat_amount)}
+ + + + + + + - ))} - -
BeskrivningKontoMoms%BeloppMoms
+ + + {items.map((item) => ( + + {item.description} + + {Math.round(item.vat_rate * 100)}% + {formatAmount(item.line_total)} + {formatAmount(item.vat_amount)} + + ))} + + +
+ + {/* Mobile: stacked cards */} +
+ {items.map((item) => ( +
+
+ {item.description || 'Ingen beskrivning'} + +
+
+ Belopp + {formatAmount(item.line_total)} +
+
+ Moms ({Math.round(item.vat_rate * 100)}%) + {formatAmount(item.vat_amount)} +
+
+ ))} +
{/* Amounts summary */}
@@ -351,32 +375,59 @@ export default function ExpenseDetailPage() { {payments.length > 0 && (

Betalningshistorik

- - - - - - - - - - - {payments.map((p) => ( - - - - - + + {/* Desktop: table */} +
+
DatumBeloppVerifikationAnteckning
{p.payment_date}{formatAmount(p.amount)} {p.currency} - {p.journal_entry_id ? ( - - {p.journal_entry_id.substring(0, 8)}... - - ) : '-'} - {p.notes || '-'}
+ + + + + + - ))} - -
DatumBeloppVerifikationAnteckning
+ + + {payments.map((p) => ( + + {p.payment_date} + {formatAmount(p.amount)} {p.currency} + + {p.journal_entry_id ? ( + + {p.journal_entry_id.substring(0, 8)}... + + ) : '-'} + + {p.notes || '-'} + + ))} + + +
+ + {/* Mobile: stacked cards */} +
+ {payments.map((p) => ( +
+
+ {p.payment_date} + {formatAmount(p.amount)} {p.currency} +
+ {p.journal_entry_id && ( +
+ Verifikation + + {p.journal_entry_id.substring(0, 8)}... + +
+ )} + {p.notes && ( +

{p.notes}

+ )} +
+ ))} +
)} diff --git a/app/(dashboard)/expenses/new/page.tsx b/app/(dashboard)/expenses/new/page.tsx index 04427e23..c65f2e22 100644 --- a/app/(dashboard)/expenses/new/page.tsx +++ b/app/(dashboard)/expenses/new/page.tsx @@ -360,7 +360,7 @@ export default function NewExpensePage() { Faktura -
+
-
+
@@ -422,12 +422,13 @@ export default function NewExpensePage() { {/* Section 2: Kontering */} - + Kontering - - - - - - - - - - - - - {fields.map((field, index) => ( - - - - - - - ))} - -
KontoBeskrivningBelopp (exkl.)MomssatsMoms
- ( - handleAccountChange(index, val)} - /> + {/* Desktop: table layout */} +
+ + + + + + + + + + + + + {fields.map((field, index) => ( + + + + + + + - - + + ))} + +
KontoBeskrivningBelopp (exkl.)MomssatsMoms
+ ( + handleAccountChange(index, val)} + /> + )} + /> + + + + + + ( + + )} + /> + + {formatAmount(itemTotals[index]?.vatAmount || 0)} + + {fields.length > 1 && ( + )} - /> - - - +
+
+ + {/* Mobile: stacked card layout */} +
+ {fields.map((field, index) => ( +
+
+ Rad {index + 1} + {fields.length > 1 && ( + + )} +
+
+ + ( + handleAccountChange(index, val)} + /> + )} + /> +
+
+ + +
+
+
+ -
+ +
+ )} /> -
- {formatAmount(itemTotals[index]?.vatAmount || 0)} - - {fields.length > 1 && ( - - )} -
+
+
+
+ Moms + {formatAmount(itemTotals[index]?.vatAmount || 0)} kr +
+
+ ))} +
{/* Totals */} -
-
+
+
Netto (exkl. moms) - {formatAmount(subtotal)} kr + {formatAmount(subtotal)} kr
-
+
Moms - {formatAmount(totalVat)} kr + {formatAmount(totalVat)} kr
-
+
Totalt - {formatAmount(total)} kr + {formatAmount(total)} kr
@@ -551,7 +636,7 @@ export default function NewExpensePage() { {advancedOpen && ( -
+
{/* Submit */} -
- -
- + {/* Mobile: dropdown select */} + + {/* Desktop: tab bar */} + Alla Obetalda diff --git a/components/bookkeeping/JournalEntryList.tsx b/components/bookkeeping/JournalEntryList.tsx index cfd6ba86..3d93bcbd 100644 --- a/components/bookkeeping/JournalEntryList.tsx +++ b/components/bookkeeping/JournalEntryList.tsx @@ -10,6 +10,7 @@ import { Switch } from '@/components/ui/switch' import { ArrowDownNarrowWide, ArrowUpNarrowWide, ChevronDown, ChevronRight, Paperclip, AlertTriangle, Loader2, BookOpen, X } from 'lucide-react' import { Input } from '@/components/ui/input' import { AccountNumber } from '@/components/ui/account-number' +import { getAccountDescription } from '@/lib/bookkeeping/account-descriptions' import JournalEntryAttachments from '@/components/bookkeeping/JournalEntryAttachments' import CorrectionEntryDialog from '@/components/bookkeeping/CorrectionEntryDialog' import JournalEntryStatusBadge from '@/components/bookkeeping/JournalEntryStatusBadge' @@ -176,26 +177,40 @@ export default function JournalEntryList({ periodId }: Props) { return (
{/* Filters and sorting */} -
-
- - - {showMissingOnly && ( - - {filteredEntries.length} - - )} +
+
+
+ + + {showMissingOnly && ( + + {filteredEntries.length} + + )} +
+
{entry.status === 'posted' && entry.source_type !== 'storno' && entry.source_type !== 'correction' && (