Add/csv import options (#420)

* feat(import): add customer and supplier parsing functionality - Implemented customer file parsing in `lib/import/customers/parser.ts` with support for Excel and CSV formats. - Created types for detected customer columns and parsed customer rows in `lib/import/customers/types.ts`. - Added tests for customer classification logic in `lib/import/shared/__tests__/classify.test.ts`. - Developed classification functions for customers and suppliers in `lib/import/shared/classify.ts`. - Introduced shared column utility functions in `lib/import/shared/column-utils.ts`. - Implemented supplier file parsing in `lib/import/suppliers/parser.ts` with validation for various fields. - Created types for detected supplier columns and parsed supplier rows in `lib/import/suppliers/types.ts`. - Added tests for supplier column detection and parsing in `lib/import/suppliers/__tests__/column-detector.test.ts` and `lib/import/suppliers/__tests__/parser.test.ts`. * fix(labels): update 'Svenskt företag' to 'Svenskt företag eller organisation' for clarity * feat(import): refactor encoding handling for Swedish files and add tests for character preservation * feat(recapt): implement clearRecaptIdentity function and integrate into logout flow * feat(bookkeeping): implement copy functionality and next voucher sequence retrieval * feat(import): enhance customer and supplier import functionality with normalization and event handling
2026-05-08 15:42:06 +02:00
parent 6c5c49f588
commit 81e9dd224e
62 changed files with 4468 additions and 124 deletions
@@ -0,0 +1,135 @@
+'use client'
+
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Button } from '@/components/ui/button'
+import { CheckCircle2, XCircle, ArrowRight, AlertTriangle } from 'lucide-react'
+import Link from 'next/link'
+
+export type RegisterResult = {
+  success: boolean
+  created: number
+  updated: number
+  skipped: number
+  failed: number
+  errors: { row_index: number; name: string; reason: string }[]
+}
+
+interface RegisterResultStepProps {
+  entity: 'customers' | 'suppliers'
+  result: RegisterResult
+  onNewImport: () => void
+}
+
+const ENTITY_COPY = {
+  customers: {
+    successTitle: 'Kunder importerade',
+    failTitle: 'Importen misslyckades',
+    listLabel: 'Visa alla kunder',
+    listHref: '/customers',
+  },
+  suppliers: {
+    successTitle: 'Leverantörer importerade',
+    failTitle: 'Importen misslyckades',
+    listLabel: 'Visa alla leverantörer',
+    listHref: '/suppliers',
+  },
+} as const
+
+export default function RegisterResultStep({
+  entity,
+  result,
+  onNewImport,
+}: RegisterResultStepProps) {
+  const copy = ENTITY_COPY[entity]
+  const totalProcessed = result.created + result.updated + result.skipped + result.failed
+  const isPartial = result.failed > 0 && result.created + result.updated > 0
+
+  return (
+    <Card>
+      <CardHeader>
+        <div className="flex items-center gap-3">
+          {result.success ? (
+            <CheckCircle2 className="h-6 w-6 text-success" />
+          ) : isPartial ? (
+            <AlertTriangle className="h-6 w-6 text-warning" />
+          ) : (
+            <XCircle className="h-6 w-6 text-destructive" />
+          )}
+          <CardTitle>
+            {result.success
+              ? copy.successTitle
+              : isPartial
+                ? 'Import slutförd med fel'
+                : copy.failTitle}
+          </CardTitle>
+        </div>
+      </CardHeader>
+      <CardContent className="space-y-6">
+        {/* Stats */}
+        <div className="grid grid-cols-2 sm:grid-cols-4 gap-3">
+          <Stat label="Skapade" value={result.created} accent="success" />
+          <Stat label="Uppdaterade" value={result.updated} accent="warning" />
+          <Stat label="Hoppades över" value={result.skipped} />
+          <Stat label="Misslyckades" value={result.failed} accent={result.failed > 0 ? 'destructive' : 'muted'} />
+        </div>
+
+        {totalProcessed === 0 && (
+          <p className="text-sm text-muted-foreground">Inga rader bearbetades.</p>
+        )}
+
+        {/* Errors */}
+        {result.errors.length > 0 && (
+          <div className="space-y-2">
+            <h4 className="text-sm font-medium">Rader som inte kunde importeras</h4>
+            <div className="rounded-lg border border-destructive/30 bg-destructive/5 max-h-60 overflow-y-auto">
+              <ul className="divide-y divide-destructive/20">
+                {result.errors.map((e, i) => (
+                  <li key={i} className="px-3 py-2 text-sm">
+                    <span className="font-medium">Rad {e.row_index}: {e.name}</span>
+                    <span className="text-muted-foreground"> — {e.reason}</span>
+                  </li>
+                ))}
+              </ul>
+            </div>
+          </div>
+        )}
+
+        <div className="flex flex-wrap gap-3">
+          <Button asChild>
+            <Link href={copy.listHref}>
+              {copy.listLabel}
+              <ArrowRight className="h-4 w-4 ml-2" />
+            </Link>
+          </Button>
+          <Button variant="ghost" onClick={onNewImport}>Ny import</Button>
+        </div>
+      </CardContent>
+    </Card>
+  )
+}
+
+function Stat({
+  label,
+  value,
+  accent,
+}: {
+  label: string
+  value: number
+  accent?: 'success' | 'warning' | 'destructive' | 'muted'
+}) {
+  return (
+    <div className="rounded-lg border bg-muted/30 p-4 text-center">
+      <p
+        className={
+          accent === 'success' ? 'text-2xl font-semibold tabular-nums text-success' :
+          accent === 'warning' ? 'text-2xl font-semibold tabular-nums text-warning' :
+          accent === 'destructive' ? 'text-2xl font-semibold tabular-nums text-destructive' :
+          'text-2xl font-semibold tabular-nums'
+        }
+      >
+        {value}
+      </p>
+      <p className="text-sm text-muted-foreground mt-1">{label}</p>
+    </div>
+  )
+}