refactor: simplify KPI to 4 metrics and update CLAUDE.md (#83)

KPI page: removed operational grid (Intäktstillväxt, Kostnadsandel,
Snittbetaltid — all usually empty or redundant). Now shows 4 cards
(Resultat, Kassa, Kundfordringar, Moms) + trend chart. Removed unused
fields from KPIReport type and simplified API route.

CLAUDE.md: documented MCP server extension, API key infrastructure,
OAuth 2.1 flow, gnubok-mcp npm package, KPI page, cookieless Supabase
client, and updated migration count (65 → 70).

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

CLAUDE.md

@@ -30,7 +30,7 @@ npm run setup:extensions # Regenerate extension registry from extensions.config.
 - **All journal entry creation** routes through `lib/bookkeeping/engine.ts` via `createJournalEntry()`.
 - **API routes** that emit events must call `ensureInitialized()` (from `lib/init.ts`) at module level.
 - **Event bus** (`lib/events/bus.ts`) is a module-level singleton. Handlers run via `Promise.allSettled`.
-- **Supabase clients**: browser (`lib/supabase/client.ts`), server with cookies (`createClient()` from `server.ts`), service role (`createServiceClient()`).
+- **Supabase clients**: browser (`lib/supabase/client.ts`), server with cookies (`createClient()` from `server.ts`), service role (`createServiceClient()`), cookieless service role for API key auth (`createServiceClientNoCookies()` from `lib/auth/api-keys.ts`).
 - **Extension system**: Opt-in via `extensions.config.json`. Core builds and runs with zero extensions.
 - **NE-bilaga, INK2 declaration, SRU export, and full archive export** are core reports (in `lib/reports/`), not extensions.
 - **AI consent gate** (`lib/extensions/ai-consent.ts`): AI extensions (`receipt-ocr`, `ai-categorization`, `ai-chat`) require user consent before API calls. Returns `403 AI_CONSENT_REQUIRED` if missing.
@@ -111,6 +111,29 @@ Extensions are opt-in plugins in `extensions/general/<name>/`, controlled by `ex
 
 ---
 
+## MCP Server & API Keys
+
+gnubok exposes its bookkeeping engine as an MCP (Model Context Protocol) server, letting users do bookkeeping through Claude Desktop, Claude Code, or any MCP-compatible client.
+
+**MCP extension** (`extensions/general/mcp-server/`): 10 tools — transactions, categorization, customers, invoices, trial balance, VAT report, KPI report, income statement. JSON-RPC 2.0 protocol implemented directly (no SDK dependency). Endpoint: `/api/extensions/ext/mcp-server/mcp`.
+
+**API key infrastructure** (`lib/auth/api-keys.ts`, `api_keys` table): SHA-256 hashed keys with `gnubok_sk_` prefix. Rate limited at 100 RPM via atomic DB RPC (`validate_and_increment_api_key`). `createServiceClientNoCookies()` creates a Supabase service client without cookies for API key auth — all queries filter by `user_id` (defense in depth).
+
+**OAuth 2.1** for Claude Desktop connectors (beta — Claude's callback has a known issue, see #78):
+- `.well-known/oauth-protected-resource` and `.well-known/oauth-authorization-server` — discovery endpoints (excluded from auth middleware)
+- `/api/mcp-oauth/authorize` — consent page + auth code generation
+- `/api/mcp-oauth/token` — PKCE verification + API key creation
+- `/api/mcp-oauth/register` — dynamic client registration
+- Stateless encrypted auth codes (AES-256-GCM via `lib/auth/oauth-codes.ts`)
+- Single-use enforcement via `oauth_used_codes` table
+- Redirect URI allowlist: `claude.ai/api/*`, `claude.com/api/*`, `localhost`
+
+**npm package** (`packages/gnubok-mcp`): Published as `gnubok-mcp` on npm. Stdio-to-HTTP bridge for Claude Desktop. Users configure `npx gnubok-mcp` with their API key.
+
+**KPI page** (`/kpi`): 4 metrics (Resultat, Kassa, Kundfordringar, Moms) + monthly trend chart. API at `/api/reports/kpi`.
+
+---
+
 ## API Route Pattern
 
 ```typescript
@@ -153,7 +176,7 @@ export async function POST(request: Request) {
 
 ## Database & Migrations
 
-**Location**: `supabase/migrations/` — 65 files. Early migrations use sequential numbering (`20240101000001`–`20240101000038`), later ones use real timestamps.
+**Location**: `supabase/migrations/` — 70 files. Early migrations use sequential numbering (`20240101000001`–`20240101000038`), later ones use real timestamps.
 
 ### Migration Rules
 

app/(dashboard)/kpi/page.tsx

@@ -4,7 +4,6 @@ import { useState, useEffect } from 'react'
 import { Label } from '@/components/ui/label'
 import { Card, CardContent } from '@/components/ui/card'
 import { KPIHeroCards } from '@/components/kpi/KPIHeroCards'
-import { KPIOperationalGrid } from '@/components/kpi/KPIOperationalGrid'
 import { KPITrendChart } from '@/components/kpi/KPITrendChart'
 import type { FiscalPeriod, KPIReport } from '@/types'
 
@@ -108,7 +107,6 @@ export default function KpiPage() {
       {!isLoadingReport && !error && report && (
         <>
           <KPIHeroCards report={report} />
-          <KPIOperationalGrid report={report} />
           {report.months.length > 0 && <KPITrendChart months={report.months} />}
         </>
       )}
@@ -138,16 +136,6 @@ function LoadingSkeleton() {
           </Card>
         ))}
       </div>
-      <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
-        {[1, 2, 3, 4].map((i) => (
-          <Card key={i}>
-            <CardContent className="p-5 space-y-2">
-              <div className="h-3 bg-muted rounded w-24 animate-pulse" />
-              <div className="h-6 bg-muted rounded w-20 animate-pulse" />
-            </CardContent>
-          </Card>
-        ))}
-      </div>
       <Card>
         <CardContent className="p-5 space-y-3">
           <div className="h-4 bg-muted rounded w-40 animate-pulse" />

app/api/reports/kpi/route.ts

@@ -4,13 +4,7 @@ import { generateIncomeStatement } from '@/lib/reports/income-statement'
 import { generateTrialBalance } from '@/lib/reports/trial-balance'
 import { generateARLedger } from '@/lib/reports/ar-ledger'
 import { generateMonthlyBreakdown } from '@/lib/reports/monthly-breakdown'
-import {
+import { calculateCashPosition } from '@/lib/reports/kpi'
-  calculateGrossMargin,
-  calculateCashPosition,
-  calculateRevenueGrowth,
-  calculateExpenseRatio,
-  calculateAvgPaymentDays,
-} from '@/lib/reports/kpi'
 import type { KPIReport } from '@/types'
 
 export async function GET(request: Request) {
@@ -24,7 +18,6 @@ export async function GET(request: Request) {
     return NextResponse.json({ error: 'period_id is required' }, { status: 400 })
   }
 
-  // Fetch fiscal period info
   const { data: period, error: periodError } = await supabase
     .from('fiscal_periods')
     .select('*')
@@ -36,31 +29,15 @@ export async function GET(request: Request) {
     return NextResponse.json({ error: 'Fiscal period not found' }, { status: 404 })
   }
 
-  // Run independent queries in parallel
+  const [incomeStatement, trialBalanceResult, arLedger, monthlyBreakdown] =
-  const [
+    await Promise.all([
-    incomeStatement,
+      generateIncomeStatement(supabase, user.id, periodId),
-    trialBalanceResult,
+      generateTrialBalance(supabase, user.id, periodId),
-    arLedger,
+      generateARLedger(supabase, user.id),
-    monthlyBreakdown,
+      generateMonthlyBreakdown(supabase, user.id, periodId),
-    paidInvoicesResult,
+    ])
-  ] = await Promise.all([
-    generateIncomeStatement(supabase, user.id, periodId),
-    generateTrialBalance(supabase, user.id, periodId),
-    generateARLedger(supabase, user.id),
-    generateMonthlyBreakdown(supabase, user.id, periodId),
-    supabase
-      .from('invoices')
-      .select('invoice_date, paid_at')
-      .eq('user_id', user.id)
-      .eq('status', 'paid')
-      .not('paid_at', 'is', null)
-      .gte('invoice_date', period.period_start)
-      .lte('invoice_date', period.period_end),
-  ])
 
-  const paidInvoices = (paidInvoicesResult.data || []) as { invoice_date: string; paid_at: string }[]
+  // VAT liability from trial balance (output VAT - input VAT)
-
-  // Calculate VAT liability from trial balance (output VAT - input VAT)
   const vatOutputAccounts = ['2611', '2621', '2631']
   const vatInputAccounts = ['2641', '2645']
   const outputVat = trialBalanceResult.rows
@@ -69,33 +46,13 @@ export async function GET(request: Request) {
   const inputVat = trialBalanceResult.rows
     .filter((r) => vatInputAccounts.includes(r.account_number))
     .reduce((sum, r) => sum + (r.closing_debit - r.closing_credit), 0)
-  const vatLiability = Math.round((outputVat - inputVat) * 100) / 100
-
-  // Revenue growth: only for closed periods, compare with previous period
-  let revenueGrowth: number | null = null
-  if (period.is_closed && period.previous_period_id) {
-    const prevStatement = await generateIncomeStatement(
-      supabase,
-      user.id,
-      period.previous_period_id
-    )
-    revenueGrowth = calculateRevenueGrowth(
-      incomeStatement.total_revenue,
-      prevStatement.total_revenue
-    )
-  }
 
   const report: KPIReport = {
-    grossMargin: calculateGrossMargin(incomeStatement),
     netResult: incomeStatement.net_result,
     cashPosition: calculateCashPosition(trialBalanceResult.rows),
     outstandingReceivables: arLedger.total_outstanding,
     overdueReceivables: arLedger.total_overdue,
-    revenueGrowth,
+    vatLiability: Math.round((outputVat - inputVat) * 100) / 100,
-    expenseRatio: calculateExpenseRatio(incomeStatement),
-    avgPaymentDays: calculateAvgPaymentDays(paidInvoices),
-    paidInvoiceCount: paidInvoices.length,
-    vatLiability,
     totalRevenue: incomeStatement.total_revenue,
     totalExpenses: incomeStatement.total_expenses,
     periodComplete: period.is_closed,

components/kpi/KPIHeroCards.tsx

@@ -11,17 +11,6 @@ interface KPIHeroCardsProps {
 export function KPIHeroCards({ report }: KPIHeroCardsProps) {
   return (
     <div className="grid grid-cols-2 md:grid-cols-4 gap-4">
-      {/* Gross margin */}
-      <Card>
-        <CardContent className="p-5">
-          <p className="text-xs text-muted-foreground mb-1">Bruttomarginal</p>
-          <p className="font-display text-xl tabular-nums tracking-tight">
-            {report.grossMargin !== null ? `${report.grossMargin}%` : '—'}
-          </p>
-          <p className="text-xs text-muted-foreground mt-1">av intäkter</p>
-        </CardContent>
-      </Card>
-
       {/* Net result */}
       <Card>
         <CardContent className="p-5">
@@ -64,6 +53,21 @@ export function KPIHeroCards({ report }: KPIHeroCardsProps) {
           )}
         </CardContent>
       </Card>
+
+      {/* VAT liability */}
+      <Card>
+        <CardContent className="p-5">
+          <p className="text-xs text-muted-foreground mb-1">Moms</p>
+          <p className={`font-display text-xl tabular-nums tracking-tight ${
+            report.vatLiability > 0 ? 'text-[hsl(var(--chart-2))]' : 'text-[hsl(var(--chart-1))]'
+          }`}>
+            {formatCurrency(Math.abs(report.vatLiability))}
+          </p>
+          <p className="text-xs text-muted-foreground mt-1">
+            {report.vatLiability > 0 ? 'att betala' : report.vatLiability < 0 ? 'att återfå' : 'jämnt'}
+          </p>
+        </CardContent>
+      </Card>
     </div>
   )
 }

components/kpi/KPIOperationalGrid.tsx

@@ -1,99 +0,0 @@
-'use client'
-
-import { Card, CardContent } from '@/components/ui/card'
-import { TrendingUp, TrendingDown, Info } from 'lucide-react'
-import { formatCurrency } from '@/lib/utils'
-import type { KPIReport } from '@/types'
-
-interface KPIOperationalGridProps {
-  report: KPIReport
-}
-
-export function KPIOperationalGrid({ report }: KPIOperationalGridProps) {
-  return (
-    <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
-      {/* Revenue growth */}
-      <Card>
-        <CardContent className="p-5">
-          <p className="text-xs text-muted-foreground mb-1">Intäktstillväxt</p>
-          {!report.periodComplete ? (
-            <p className="text-sm text-muted-foreground">Välj ett avslutat räkenskapsår</p>
-          ) : report.revenueGrowth !== null ? (
-            <div className="flex items-center gap-2">
-              {report.revenueGrowth >= 0 ? (
-                <TrendingUp className="h-4 w-4 text-[hsl(var(--chart-1))]" />
-              ) : (
-                <TrendingDown className="h-4 w-4 text-[hsl(var(--chart-2))]" />
-              )}
-              <p className={`font-display text-xl tabular-nums tracking-tight ${
-                report.revenueGrowth >= 0 ? 'text-[hsl(var(--chart-1))]' : 'text-[hsl(var(--chart-2))]'
-              }`}>
-                {report.revenueGrowth > 0 ? '+' : ''}{report.revenueGrowth}%
-              </p>
-            </div>
-          ) : (
-            <p className="text-sm text-muted-foreground">Första räkenskapsåret</p>
-          )}
-        </CardContent>
-      </Card>
-
-      {/* Expense ratio */}
-      <Card>
-        <CardContent className="p-5">
-          <p className="text-xs text-muted-foreground mb-1">Kostnadsandel</p>
-          {report.expenseRatio !== null ? (
-            <>
-              <p className="font-display text-xl tabular-nums tracking-tight">
-                {report.expenseRatio}%
-              </p>
-              <div className="mt-2 h-1.5 rounded-full bg-muted overflow-hidden">
-                <div
-                  className="h-full rounded-full bg-[hsl(var(--chart-2))]/60 transition-all"
-                  style={{ width: `${Math.min(report.expenseRatio, 100)}%` }}
-                />
-              </div>
-            </>
-          ) : (
-            <p className="text-sm text-muted-foreground">Inga intäkter</p>
-          )}
-        </CardContent>
-      </Card>
-
-      {/* Avg payment days */}
-      <Card>
-        <CardContent className="p-5">
-          <div className="flex items-center gap-1.5 mb-1">
-            <p className="text-xs text-muted-foreground">Snittbetaltid</p>
-            {report.avgPaymentDays === null && (
-              <span title="Kräver minst 5 betalda fakturor med betalningsdatum. Sätts via fakturering i gnubok eller bankmatchning.">
-                <Info className="h-3 w-3 text-muted-foreground/60" />
-              </span>
-            )}
-          </div>
-          {report.avgPaymentDays !== null ? (
-            <p className="font-display text-xl tabular-nums tracking-tight">
-              {report.avgPaymentDays} <span className="text-sm font-normal text-muted-foreground">dagar</span>
-            </p>
-          ) : (
-            <p className="text-sm text-muted-foreground">Inte tillräckligt med data</p>
-          )}
-        </CardContent>
-      </Card>
-
-      {/* VAT liability */}
-      <Card>
-        <CardContent className="p-5">
-          <p className="text-xs text-muted-foreground mb-1">Momsskuld</p>
-          <p className={`font-display text-xl tabular-nums tracking-tight ${
-            report.vatLiability > 0 ? 'text-[hsl(var(--chart-2))]' : 'text-[hsl(var(--chart-1))]'
-          }`}>
-            {formatCurrency(Math.abs(report.vatLiability))}
-          </p>
-          <p className="text-xs text-muted-foreground mt-1">
-            {report.vatLiability > 0 ? 'Att betala' : report.vatLiability < 0 ? 'Att återfå' : 'Jämnt'}
-          </p>
-        </CardContent>
-      </Card>
-    </div>
-  )
-}

types/index.ts

@@ -1999,15 +1999,10 @@ export interface VatBreakdownItem {
 
 // KPI Report
 export interface KPIReport {
-  grossMargin: number | null       // percentage, null if no revenue
   netResult: number                // SEK
   cashPosition: number             // SEK (sum of 19xx account balances)
   outstandingReceivables: number   // SEK
   overdueReceivables: number       // SEK
-  revenueGrowth: number | null     // percentage, null if no prior period or current period incomplete
-  expenseRatio: number | null      // percentage, null if no revenue
-  avgPaymentDays: number | null    // days, null if < 5 paid invoices with paid_at
-  paidInvoiceCount: number         // how many invoices had paid_at data (for gating)
   vatLiability: number             // SEK, ruta 49 (positive = owe, negative = refund)
   totalRevenue: number             // SEK
   totalExpenses: number            // SEK