Delete features (#218)

* Implement company and account deletion features

- Add event types for company and account deletion to CoreEvent.
- Enhance Supabase middleware to handle company context resolution and cookie management for archived companies.
- Create API routes for deleting accounts and companies, including necessary validations and event emissions.
- Implement tests for account and company deletion endpoints to ensure proper functionality and error handling.
- Add retention notice component to inform users about bookkeeping data retention during destructive actions.
- Create database migrations to support soft deletion of companies and anonymization of user accounts, ensuring compliance with retention laws.

* feat: enhance account deletion process and update user notifications

* Add service client for onboarding completion check and update escape hatch visibility

* Enhance invite flow and email handling for company members

* Refactor company context and RLS policies for active company isolation

- Update `switchCompany` to remove unnecessary revalidation as client handles navigation.
- Revise `getActiveCompanyId` to prioritize `user_preferences` and validate against non-archived memberships.
- Modify `setActiveCompany` to ensure `user_preferences` is the authoritative source while maintaining cookie compatibility.
- Enhance middleware to resolve active company using `user_preferences` and fallback to first non-archived membership.
- Introduce new API route `/api/company/current` to fetch the active company ID for cross-tab synchronization.
- Implement `CompanyTabSync` component for real-time active company enforcement across tabs.
- Create migration for RLS policies to enforce single-active-company isolation using `current_active_company_id()`.

* feat: implement viewer role enforcement for write permissions

- Added `useCanWrite` hook to determine if the current user has write permissions based on their role in the active company.
- Updated various components (JournalEntryForm, CustomerForm, DeadlineForm, etc.) to disable write actions and show a lock icon with a tooltip for users without write permissions.
- Introduced `requireWritePermission` function to enforce write permissions at the API level, returning a 403 response for viewers.
- Created tests to verify the behavior of the viewer role and write permissions.
- Added database migration to enforce read-only access for viewers at the database level.

components/settings/AccountDangerZone.tsx

@@ -1,8 +1,9 @@
 'use client'
 
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import { useRouter } from 'next/navigation'
 import Link from 'next/link'
+import { createClient } from '@/lib/supabase/client'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'
 import { Label } from '@/components/ui/label'
@@ -14,37 +15,89 @@ import {
   DialogHeader,
   DialogTitle,
 } from '@/components/ui/dialog'
-import { AlertTriangle, ExternalLink, Loader2 } from 'lucide-react'
+import { RetentionNotice } from '@/components/ui/retention-notice'
+import { ExternalLink, Loader2 } from 'lucide-react'
 import { SupportLink } from '@/components/ui/support-link'
 
+interface Blocker {
+  id: string
+  name: string
+}
+
 export function AccountDangerZone() {
   const router = useRouter()
+  const [email, setEmail] = useState<string | null>(null)
+  const [blockers, setBlockers] = useState<Blocker[]>([])
+  const [blockersLoading, setBlockersLoading] = useState(true)
   const [showDialog, setShowDialog] = useState(false)
   const [confirmText, setConfirmText] = useState('')
   const [isDeleting, setIsDeleting] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+
+  useEffect(() => {
+    let cancelled = false
+
+    async function load() {
+      const supabase = createClient()
+      const { data: { user } } = await supabase.auth.getUser()
+      if (!cancelled) setEmail(user?.email ?? null)
+
+      try {
+        const res = await fetch('/api/company?owned=true&archived=false')
+        if (res.ok) {
+          const body = await res.json()
+          if (!cancelled) setBlockers(body.data ?? [])
+        }
+      } finally {
+        if (!cancelled) setBlockersLoading(false)
+      }
+    }
+
+    load()
+    return () => {
+      cancelled = true
+    }
+  }, [])
 
   async function handleDelete() {
-    if (confirmText !== 'RADERA') return
+    if (!email) return
+    if (confirmText.trim().toLowerCase() !== email.toLowerCase()) return
+
     setIsDeleting(true)
+    setError(null)
 
     try {
       const response = await fetch('/api/account/delete', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ confirm: 'RADERA' }),
+        body: JSON.stringify({ confirm_email: email }),
       })
 
+      if (response.status === 409) {
+        const body = await response.json()
+        // Precondition tripped mid-flow — refresh the list and show inline.
+        setBlockers(body.blockers ?? [])
+        setError(body.error || 'Du måste radera eller överlåta dina företag först.')
+        setIsDeleting(false)
+        setShowDialog(false)
+        return
+      }
+
       if (!response.ok) {
-        const result = await response.json()
-        throw new Error(result.error || 'Kunde inte radera kontot')
+        const body = await response.json().catch(() => ({}))
+        throw new Error(body.error || 'Kunde inte radera kontot')
       }
 
       router.push('/login')
-    } catch {
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Kunde inte radera kontot')
       setIsDeleting(false)
     }
   }
 
+  const hasBlockers = blockers.length > 0
+  const canDelete = !hasBlockers && !blockersLoading
+
   return (
     <>
       <section className="space-y-4 border-t border-border/8 pt-8">
@@ -52,25 +105,38 @@ export function AccountDangerZone() {
           Radera konto
         </h2>
 
-        <div className="rounded-lg border border-destructive/30 bg-destructive/5 p-4">
-          <div className="flex gap-3">
-            <AlertTriangle className="h-5 w-5 text-destructive shrink-0 mt-0.5" />
-            <div className="space-y-2 text-sm">
-              <p className="font-medium text-destructive">Denna åtgärd kan inte ångras</p>
-              <p className="text-muted-foreground">
-                All din data raderas permanent — bokföring, fakturor, verifikationer, dokument och inställningar.
-              </p>
-              <p className="text-muted-foreground">
-                Enligt bokföringslagen (BFL 7 kap. 2§) ska räkenskapsinformation bevaras i 7 år.
-                Du ansvarar själv för att exportera och arkivera din bokföringsdata.
-              </p>
-              <p className="text-muted-foreground">
-                Har du frågor?{' '}
-                <SupportLink variant="inline" subject="Fråga om kontoradering" />
-              </p>
-            </div>
+        {hasBlockers && (
+          <div className="rounded-lg border border-border/60 bg-muted/30 p-4 space-y-3">
+            <p className="text-sm font-medium">Företag du äger</p>
+            <p className="text-sm text-muted-foreground">
+              Radera eller överlåt alla företag innan du raderar kontot.
+            </p>
+            <ul className="space-y-2">
+              {blockers.map((b) => (
+                <li
+                  key={b.id}
+                  className="flex items-center justify-between rounded-md border border-border/40 bg-background px-3 py-2"
+                >
+                  <span className="text-sm font-medium">{b.name}</span>
+                  <Button variant="ghost" size="sm" asChild>
+                    <Link href="/settings/company">Hantera</Link>
+                  </Button>
+                </li>
+              ))}
+            </ul>
           </div>
-        </div>
+        )}
+
+        <RetentionNotice variant="account" />
+
+        <p className="text-sm text-muted-foreground">
+          Har du frågor?{' '}
+          <SupportLink variant="inline" subject="Fråga om kontoradering" />
+        </p>
+
+        {error && !showDialog && (
+          <p className="text-sm text-destructive">{error}</p>
+        )}
 
         <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
           <Button variant="outline" className="w-full sm:w-auto" asChild>
@@ -83,37 +149,55 @@ export function AccountDangerZone() {
             variant="destructive"
             className="w-full sm:w-auto"
             onClick={() => setShowDialog(true)}
+            disabled={!canDelete}
           >
             Radera mitt konto
           </Button>
         </div>
       </section>
 
-      <Dialog open={showDialog} onOpenChange={(open) => {
-        setShowDialog(open)
-        if (!open) setConfirmText('')
-      }}>
+      <Dialog
+        open={showDialog}
+        onOpenChange={(open) => {
+          if (isDeleting) return
+          setShowDialog(open)
+          if (!open) {
+            setConfirmText('')
+            setError(null)
+          }
+        }}
+      >
         <DialogContent>
           <DialogHeader>
             <DialogTitle>Radera konto permanent</DialogTitle>
             <DialogDescription>
-              All din data raderas permanent. Skriv <strong>RADERA</strong> nedan för att bekräfta.
+              Ditt konto avidentifieras och du loggas ut från alla enheter.
+              Du kan inte skapa ett nytt konto med samma e-postadress — kontakta support
+              om du vill återaktivera kontot i framtiden.
             </DialogDescription>
           </DialogHeader>
           <div className="space-y-2">
-            <Label htmlFor="delete-confirm">Bekräfta genom att skriva RADERA</Label>
+            <Label htmlFor="delete-confirm">
+              Skriv din e-postadress (<strong>{email}</strong>) för att bekräfta
+            </Label>
             <Input
               id="delete-confirm"
+              type="email"
               value={confirmText}
               onChange={(e) => setConfirmText(e.target.value)}
-              placeholder="RADERA"
+              placeholder={email ?? ''}
               autoComplete="off"
             />
+            {error && <p className="text-sm text-destructive">{error}</p>}
           </div>
           <DialogFooter>
             <Button
               variant="outline"
-              onClick={() => { setShowDialog(false); setConfirmText('') }}
+              onClick={() => {
+                setShowDialog(false)
+                setConfirmText('')
+                setError(null)
+              }}
               disabled={isDeleting}
             >
               Avbryt
@@ -121,7 +205,11 @@ export function AccountDangerZone() {
             <Button
               variant="destructive"
               onClick={handleDelete}
-              disabled={confirmText !== 'RADERA' || isDeleting}
+              disabled={
+                !email ||
+                confirmText.trim().toLowerCase() !== email.toLowerCase() ||
+                isDeleting
+              }
             >
               {isDeleting ? (
                 <>
@@ -129,7 +217,7 @@ export function AccountDangerZone() {
                   Raderar...
                 </>
               ) : (
-                'Radera permanent'
+                'Radera konto'
               )}
             </Button>
           </DialogFooter>

components/settings/CompanyDangerZone.tsx

@@ -0,0 +1,162 @@
+'use client'
+
+import { useState } from 'react'
+import { useRouter } from 'next/navigation'
+import Link from 'next/link'
+import { useCompany } from '@/contexts/CompanyContext'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { Label } from '@/components/ui/label'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog'
+import { RetentionNotice } from '@/components/ui/retention-notice'
+import { ExternalLink, Loader2 } from 'lucide-react'
+import { useToast } from '@/components/ui/use-toast'
+
+/**
+ * Danger zone for the currently-active company. Only visible to owners.
+ *
+ * Archive = soft delete: companies.archived_at is stamped via
+ * POST /api/company/[id]/delete. All bookkeeping data is retained per
+ * BFL 7 kap. 2§; the row just disappears from the user's UI.
+ *
+ * TODO(bankid): once users have a linked BankID identity, wrap the
+ * confirm step in a BankID signature gate. Guarded behind a
+ * capabilities.bankIdLinked boolean fetched from the user profile.
+ */
+export function CompanyDangerZone() {
+  const router = useRouter()
+  const { toast } = useToast()
+  const { company, role } = useCompany()
+
+  const [showDialog, setShowDialog] = useState(false)
+  const [confirmText, setConfirmText] = useState('')
+  const [isDeleting, setIsDeleting] = useState(false)
+
+  if (!company || role !== 'owner') return null
+
+  async function handleDelete() {
+    if (!company) return
+    if (confirmText.trim() !== company.name.trim()) return
+
+    setIsDeleting(true)
+    try {
+      const res = await fetch(`/api/company/${company.id}/delete`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ confirm_name: confirmText }),
+      })
+
+      if (!res.ok) {
+        const body = await res.json().catch(() => ({}))
+        throw new Error(body.error || 'Kunde inte radera företaget')
+      }
+
+      toast({ title: 'Företaget raderades', description: company.name })
+      // Stay inside settings. If the user had another company, the dashboard
+      // layout will resolve it and /settings/account still renders as
+      // normal. If this was their last company, the layout falls into the
+      // no-company shell rooted at /settings/account.
+      router.push('/settings/account')
+      router.refresh()
+    } catch (err) {
+      toast({
+        title: 'Kunde inte radera företaget',
+        description: err instanceof Error ? err.message : 'Försök igen.',
+        variant: 'destructive',
+      })
+      setIsDeleting(false)
+    }
+  }
+
+  return (
+    <>
+      <section className="space-y-4 border-t border-border/8 pt-8">
+        <h2 className="text-sm font-medium uppercase tracking-wider text-destructive/80">
+          Radera företag
+        </h2>
+
+        <RetentionNotice variant="company" />
+
+        <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
+          <Button variant="outline" className="w-full sm:w-auto" asChild>
+            <Link href="/reports?type=full-archive">
+              <ExternalLink className="mr-2 h-4 w-4" />
+              Exportera fullständigt arkiv
+            </Link>
+          </Button>
+          <Button
+            variant="destructive"
+            className="w-full sm:w-auto"
+            onClick={() => setShowDialog(true)}
+          >
+            Radera företag
+          </Button>
+        </div>
+      </section>
+
+      <Dialog
+        open={showDialog}
+        onOpenChange={(open) => {
+          if (isDeleting) return
+          setShowDialog(open)
+          if (!open) setConfirmText('')
+        }}
+      >
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Radera {company.name}</DialogTitle>
+            <DialogDescription>
+              Företaget döljs från gnubok. Bokföringen behålls säkert i 7 år enligt BFL.
+              Skriv företagets namn exakt för att bekräfta.
+            </DialogDescription>
+          </DialogHeader>
+          <div className="space-y-2">
+            <Label htmlFor="company-delete-confirm">
+              Skriv <strong>{company.name}</strong> för att bekräfta
+            </Label>
+            <Input
+              id="company-delete-confirm"
+              value={confirmText}
+              onChange={(e) => setConfirmText(e.target.value)}
+              placeholder={company.name}
+              autoComplete="off"
+            />
+          </div>
+          <DialogFooter>
+            <Button
+              variant="outline"
+              onClick={() => {
+                setShowDialog(false)
+                setConfirmText('')
+              }}
+              disabled={isDeleting}
+            >
+              Avbryt
+            </Button>
+            <Button
+              variant="destructive"
+              onClick={handleDelete}
+              disabled={confirmText.trim() !== company.name.trim() || isDeleting}
+            >
+              {isDeleting ? (
+                <>
+                  <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                  Raderar...
+                </>
+              ) : (
+                'Radera företag'
+              )}
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </>
+  )
+}

components/settings/SettingsFormWrapper.tsx

@@ -2,8 +2,9 @@
 
 import { useState, useRef, useEffect, useCallback } from 'react'
 import { Button } from '@/components/ui/button'
-import { Loader2, Check } from 'lucide-react'
+import { Loader2, Check, Lock } from 'lucide-react'
 import { useToast } from '@/components/ui/use-toast'
+import { useCanWrite } from '@/lib/hooks/use-can-write'
 
 type SaveResult =
   | Record<string, unknown>
@@ -17,6 +18,7 @@ interface SettingsFormWrapperProps {
 
 export function SettingsFormWrapper({ children, onSave, className }: SettingsFormWrapperProps) {
   const { toast } = useToast()
+  const { canWrite } = useCanWrite()
   const [isSaving, setIsSaving] = useState(false)
   const [saved, setSaved] = useState(false)
   const timerRef = useRef<ReturnType<typeof setTimeout>>(undefined)
@@ -82,12 +84,22 @@ export function SettingsFormWrapper({ children, onSave, className }: SettingsFor
             Sparat
           </span>
         )}
-        <Button type="submit" disabled={isSaving} size="sm">
+        <Button
+          type="submit"
+          disabled={isSaving || !canWrite}
+          size="sm"
+          title={!canWrite ? 'Du har endast läsbehörighet i detta företag' : undefined}
+        >
           {isSaving ? (
             <>
               <Loader2 className="mr-2 h-3.5 w-3.5 animate-spin" />
               Sparar...
             </>
+          ) : !canWrite ? (
+            <>
+              <Lock className="mr-2 h-3.5 w-3.5" />
+              Spara ändringar
+            </>
           ) : (
             'Spara ändringar'
           )}