feat(reports): catalog as one dry table with band groups and Senast öppnad (#1147)

The founder-picked Tabellen variant from the rest-of-nav 2 concept:
the report library becomes a single dry table where band rows carry the
accounting taxonomy, each report is one clickable line with its
description in muted ink, and a Senast oppnad column replaces the
recents shelf (RecentReportsShelf deleted). useRecentReports now stores
slug+timestamp pairs (legacy plain-slug entries parse as undated).
FiscalYearSelector swaps to the house FyPicker chip, help moves behind
the ? popover, catalog footnote as pgnote. Entity gating, dimension
gating, route-owning reports and the persisted FY choice all unchanged.

9341 tests pass, lint clean, guards pass. sv+en keys added.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>

app/(dashboard)/reports/page.tsx

@@ -4,22 +4,23 @@ import { useState } from 'react'
 import { useRouter } from 'next/navigation'
 import { useTranslations } from 'next-intl'
 import { Skeleton } from '@/components/ui/skeleton'
-import { Card, CardContent } from '@/components/ui/card'
 import { PageHeader } from '@/components/ui/page-header'
+import { HelpPopover } from '@/components/ui/help-popover'
 import { EmptyState } from '@/components/ui/empty-state'
 import { useCompany } from '@/contexts/CompanyContext'
 import { useCompanySettings } from '@/components/settings/useSettings'
-import { FiscalYearSelector } from '@/components/common/FiscalYearSelector'
+import { FyPicker } from '@/components/common/FyPicker'
 import { ReportLibrary } from '@/components/reports/ReportLibrary'
-import { RecentReportsShelf } from '@/components/reports/RecentReportsShelf'
 import { useRecentReports } from '@/components/reports/useRecentReports'
 import { getReport } from '@/lib/reports/catalog'
 
 /**
- * Reports library landing. A calm, grouped index of every report: selecting
- * one opens the focused /reports/[slug] route. The fiscal year picked here
- * persists (FiscalYearSelector localStorage) and is restored on the focused
- * page, so the choice carries across without URL plumbing.
+ * Reports catalog landing (concept "Tabellen"): one dry table grouped by
+ * accounting taxonomy, with a "Senast öppnad" column instead of a separate
+ * recents shelf. Selecting a report opens the focused /reports/[slug] route.
+ * The fiscal year picked here persists (FyPicker localStorage) and is
+ * restored on the focused page, so the choice carries across without URL
+ * plumbing.
  */
 export default function ReportsPage() {
   const router = useRouter()
@@ -28,7 +29,7 @@ export default function ReportsPage() {
   const { company } = useCompany()
   const { settings } = useCompanySettings()
   const t = useTranslations('reports')
-  const { recents, pushRecent } = useRecentReports(company?.id)
+  const { openedAt, pushRecent } = useRecentReports(company?.id)
 
   // Open a report. Route-owning reports (cash flow, annual report, KPI, SIE)
   // navigate to their own page; the rest open the focused /reports/[slug] route.
@@ -50,8 +51,13 @@ export default function ReportsPage() {
     <div className="space-y-8">
       <PageHeader
         title={t('title')}
+        help={
+          <HelpPopover>
+            <p>{t('help_text')}</p>
+          </HelpPopover>
+        }
         action={
-          <FiscalYearSelector
+          <FyPicker
             value={selectedPeriod || null}
             onChange={(id) => setSelectedPeriod(id || '')}
             includeAllOption={false}
@@ -62,14 +68,10 @@ export default function ReportsPage() {
       />
 
       {isLoadingInit ? (
-        <div className="space-y-6">
-          <Skeleton className="h-4 w-40" />
-          <Card>
-            <CardContent className="p-6 space-y-4">
-              <Skeleton className="h-5 w-32" />
-              <Skeleton className="h-64" />
-            </CardContent>
-          </Card>
+        <div className="space-y-3">
+          {[1, 2, 3, 4, 5, 6].map((i) => (
+            <Skeleton key={i} className="h-9 w-full" />
+          ))}
         </div>
       ) : !selectedPeriod ? (
         <EmptyState
@@ -79,18 +81,17 @@ export default function ReportsPage() {
           actionHref="/settings"
         />
       ) : (
-        <div className="space-y-8">
-          <RecentReportsShelf
-            slugs={recents}
-            entityType={company?.entity_type}
-            onOpen={openReport}
-          />
+        <>
           <ReportLibrary
             entityType={company?.entity_type}
             dimensionsEnabled={settings?.dimensions_enabled === true}
+            openedAt={openedAt}
             onOpen={openReport}
           />
-        </div>
+          <p className="px-1 text-xs leading-5 text-muted-foreground">
+            {t('catalog_footnote')}
+          </p>
+        </>
       )}
     </div>
   )