Fix/import data (#200)
* fix: enhance import data handling and consent management across components * feat: Enhance SIE import functionality with validation and error handling improvements - Added validation errors and warnings state management in SIEImportWizard. - Improved error handling for duplicate, validation, and parsing errors during SIE file import. - Enhanced user feedback with actionable guidance for common import errors. - Updated SIEUploadStep to display validation errors and warnings. - Improved error messages in API routes for better clarity and user experience. - Added file size and type validation in the SIE parse route. - Enhanced parsing logic to provide more detailed error messages for unbalanced vouchers and missing amounts. - Created a new storage bucket for SIE file archival in Supabase with appropriate policies for user access. - Updated tests to reflect changes in error messages and validation logic. * fix: Improve type assertion for response in getPage method * Update extensions/general/arcim-migration/lib/migration-orchestrator.ts Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com> * Update supabase/migrations/20260408130000_sie_files_storage_bucket.sql Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com> * fix: Add company ID verification for consent handling in accept and disconnect endpoints --------- Co-authored-by: greptile-apps[bot] <165735046+greptile-apps[bot]@users.noreply.github.com>
This commit is contained in:
Mattsson
co-authored by
greptile-apps[bot]
greptile-apps[bot]
parent
6c79f21679
commit
211033410c
@@ -3,7 +3,7 @@
|
||||
import { useState, useCallback, useEffect } from 'react'
|
||||
import { Card, CardContent, CardHeader, CardTitle, CardDescription } from '@/components/ui/card'
|
||||
import { Progress } from '@/components/ui/progress'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { Button, buttonVariants } from '@/components/ui/button'
|
||||
import { Input } from '@/components/ui/input'
|
||||
import { Switch } from '@/components/ui/switch'
|
||||
import { useToast } from '@/components/ui/use-toast'
|
||||
@@ -483,8 +483,9 @@ function ConnectStep({
|
||||
</label>
|
||||
<Input
|
||||
id="apiToken"
|
||||
name="apiToken_nocomplete"
|
||||
type="password"
|
||||
autoComplete="off"
|
||||
autoComplete="new-password"
|
||||
placeholder={provider === 'briox' ? 'Klistra in din applikationstoken' : 'Klistra in din API-nyckel'}
|
||||
value={apiToken}
|
||||
onChange={(e) => setApiToken(e.target.value)}
|
||||
@@ -498,7 +499,8 @@ function ConnectStep({
|
||||
</label>
|
||||
<Input
|
||||
id="companyId"
|
||||
autoComplete="off"
|
||||
name="companyId_nocomplete"
|
||||
autoComplete="new-password"
|
||||
placeholder={isClientCredentials ? 'GUID från företagsinställningar' : 'GUID från URL:en, t.ex. 14ccad83-67f6-49bd-...'}
|
||||
value={companyId}
|
||||
onChange={(e) => setCompanyId(e.target.value)}
|
||||
@@ -614,13 +616,14 @@ function PreviewStep({
|
||||
<p className="text-xs text-muted-foreground">
|
||||
Bokföringsdata (kontoplan, verifikationer och balanser) måste importeras via SIE-fil innan kunder, leverantörer och fakturor kan hämtas. Exportera en SIE-fil från {ARCIM_PROVIDERS.find(p => p.id === preview.consent.provider)?.name ?? 'ditt bokföringssystem'} och ladda upp den i gnubok.
|
||||
</p>
|
||||
<Button asChild variant="outline" size="sm" className="mt-3">
|
||||
<Link href="/import?mode=sie">
|
||||
<BookOpen className="mr-2 h-4 w-4" />
|
||||
Gå till SIE-importen
|
||||
<ExternalLink className="ml-2 h-3.5 w-3.5" />
|
||||
</Link>
|
||||
</Button>
|
||||
<Link
|
||||
href="/import?mode=sie"
|
||||
className={cn(buttonVariants({ variant: 'outline', size: 'sm' }), 'mt-3')}
|
||||
>
|
||||
<BookOpen className="mr-2 h-4 w-4" />
|
||||
Gå till SIE-importen
|
||||
<ExternalLink className="ml-2 h-3.5 w-3.5" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -1855,6 +1858,15 @@ export default function ArcimMigrationWorkspace(_props: WorkspaceComponentProps)
|
||||
setMigrationResults(data.results)
|
||||
}
|
||||
|
||||
// Mark consent as fully accepted now that import is complete
|
||||
if (consentId) {
|
||||
await fetch('/api/extensions/ext/arcim-migration/accept', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ consentId }),
|
||||
}).catch(() => { /* best-effort */ })
|
||||
}
|
||||
|
||||
setMigrationProgress(100)
|
||||
setStep('result')
|
||||
|
||||
|
||||
@@ -49,8 +49,10 @@ export default function ImportResultStep({ result, onNewImport }: ImportResultSt
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
{result.success
|
||||
? 'Din bokföring har importerats framgångsrikt.'
|
||||
: 'Det uppstod fel under importen. Se detaljer nedan.'}
|
||||
? skipped && skipped.total > 0
|
||||
? `Din bokföring har importerats. ${result.journalEntriesCreated} verifikationer skapades, ${skipped.total} hoppades över — se detaljer nedan.`
|
||||
: 'Din bokföring har importerats framgångsrikt.'
|
||||
: 'Det uppstod fel under importen. Läs felmeddelanden nedan för att förstå vad som gick snett och hur du kan åtgärda det.'}
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
</Card>
|
||||
@@ -109,7 +111,7 @@ export default function ImportResultStep({ result, onNewImport }: ImportResultSt
|
||||
Fel ({result.errors.length})
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="space-y-2 max-h-48 overflow-y-auto">
|
||||
{result.errors.map((error, i) => (
|
||||
<div key={i} className="text-sm flex gap-2">
|
||||
@@ -118,6 +120,16 @@ export default function ImportResultStep({ result, onNewImport }: ImportResultSt
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
{!result.success && (
|
||||
<div className="text-sm text-muted-foreground border-t pt-3 space-y-1">
|
||||
<p className="font-medium">Vad kan du göra?</p>
|
||||
<ul className="list-disc list-inside space-y-0.5 text-muted-foreground">
|
||||
<li>Kontrollera att SIE-filen exporterades korrekt från källsystemet</li>
|
||||
<li>Prova att exportera filen igen och ladda upp på nytt</li>
|
||||
<li>Om felet kvarstår, kontakta support med felmeddelandet ovan</li>
|
||||
</ul>
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
@@ -282,31 +282,55 @@ export default function SIEPreviewStep({
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Issues */}
|
||||
{(errors.length > 0 || warnings.length > 0) && (
|
||||
<Card className={errors.length > 0 ? 'border-destructive/50' : 'border-warning/50'}>
|
||||
{/* Errors */}
|
||||
{errors.length > 0 && (
|
||||
<Card className="border-destructive/50">
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
{errors.length > 0 ? (
|
||||
<XCircle className="h-5 w-5 text-destructive" />
|
||||
) : (
|
||||
<AlertCircle className="h-5 w-5 text-warning" />
|
||||
)}
|
||||
{errors.length > 0 ? 'Fel' : 'Varningar'}
|
||||
<XCircle className="h-5 w-5 text-destructive" />
|
||||
Tolkningsfel ({errors.length})
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Dessa fel hittades under tolkningen av SIE-filen och kan påverka importresultatet.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-2 max-h-48 overflow-y-auto">
|
||||
{errors.map((issue, i) => (
|
||||
<div key={`error-${i}`} className="text-sm flex gap-2 text-destructive">
|
||||
<XCircle className="h-4 w-4 flex-shrink-0 mt-0.5" />
|
||||
<span>Rad {issue.line}: {issue.message}</span>
|
||||
<span>
|
||||
<span className="font-mono text-xs opacity-70">Rad {issue.line}</span>{' '}
|
||||
{issue.message}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
|
||||
{/* Warnings */}
|
||||
{warnings.length > 0 && (
|
||||
<Card className="border-warning/50">
|
||||
<CardHeader>
|
||||
<CardTitle className="flex items-center gap-2">
|
||||
<AlertCircle className="h-5 w-5 text-warning" />
|
||||
Varningar ({warnings.length})
|
||||
</CardTitle>
|
||||
<CardDescription>
|
||||
Dessa varningar blockerar inte importen men bör granskas.
|
||||
</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<div className="space-y-2 max-h-48 overflow-y-auto">
|
||||
{warnings.map((issue, i) => (
|
||||
<div key={`warning-${i}`} className="text-sm flex gap-2 text-warning">
|
||||
<AlertCircle className="h-4 w-4 flex-shrink-0 mt-0.5" />
|
||||
<span>Rad {issue.line}: {issue.message}</span>
|
||||
<span>
|
||||
<span className="font-mono text-xs opacity-70">Rad {issue.line}</span>{' '}
|
||||
{issue.message}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import { useState, useCallback, useEffect } from 'react'
|
||||
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
|
||||
import { Progress } from '@/components/ui/progress'
|
||||
import { Upload, FileText, AlertCircle, CheckCircle, Loader2 } from 'lucide-react'
|
||||
import { Upload, FileText, AlertCircle, CheckCircle, Loader2, XCircle } from 'lucide-react'
|
||||
|
||||
const LOADING_PHASES = [
|
||||
{ message: 'Läser fil...', progress: 10 },
|
||||
@@ -17,9 +17,11 @@ interface SIEUploadStepProps {
|
||||
isLoading: boolean
|
||||
error: string | null
|
||||
errorType?: 'duplicate' | 'duplicate_period' | 'validation' | 'parse'
|
||||
validationErrors?: string[]
|
||||
validationWarnings?: string[]
|
||||
}
|
||||
|
||||
export default function SIEUploadStep({ onFileSelect, isLoading, error, errorType }: SIEUploadStepProps) {
|
||||
export default function SIEUploadStep({ onFileSelect, isLoading, error, errorType, validationErrors, validationWarnings }: SIEUploadStepProps) {
|
||||
const [isDragging, setIsDragging] = useState(false)
|
||||
const [selectedFile, setSelectedFile] = useState<File | null>(null)
|
||||
const [loadingPhase, setLoadingPhase] = useState(0)
|
||||
@@ -159,16 +161,78 @@ export default function SIEUploadStep({ onFileSelect, isLoading, error, errorTyp
|
||||
|
||||
{/* Error display */}
|
||||
{error && (
|
||||
<div className="mt-4 p-4 bg-destructive/10 border border-destructive/20 rounded-lg flex gap-3">
|
||||
<AlertCircle className="h-5 w-5 text-destructive flex-shrink-0 mt-0.5" />
|
||||
<div>
|
||||
<p className="font-medium text-destructive">
|
||||
{errorType === 'duplicate' || errorType === 'duplicate_period'
|
||||
? 'Filen har redan importerats'
|
||||
: 'Kunde inte läsa filen'}
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">{error}</p>
|
||||
<div className="mt-4 space-y-3">
|
||||
<div className={`p-4 rounded-lg flex gap-3 ${
|
||||
errorType === 'duplicate' || errorType === 'duplicate_period'
|
||||
? 'bg-warning/10 border border-warning/20'
|
||||
: 'bg-destructive/10 border border-destructive/20'
|
||||
}`}>
|
||||
<AlertCircle className={`h-5 w-5 flex-shrink-0 mt-0.5 ${
|
||||
errorType === 'duplicate' || errorType === 'duplicate_period'
|
||||
? 'text-warning'
|
||||
: 'text-destructive'
|
||||
}`} />
|
||||
<div className="space-y-1.5 min-w-0">
|
||||
<p className={`font-medium ${
|
||||
errorType === 'duplicate' || errorType === 'duplicate_period'
|
||||
? 'text-warning'
|
||||
: 'text-destructive'
|
||||
}`}>
|
||||
{errorType === 'duplicate' && 'Filen har redan importerats'}
|
||||
{errorType === 'duplicate_period' && 'Överlappande räkenskapsår'}
|
||||
{errorType === 'validation' && 'Filen innehåller valideringsfel'}
|
||||
{errorType === 'parse' && 'Kunde inte tolka filen'}
|
||||
{!errorType && 'Ett fel uppstod'}
|
||||
</p>
|
||||
<p className="text-sm text-muted-foreground">{error}</p>
|
||||
|
||||
{/* Actionable guidance */}
|
||||
<div className="text-sm text-muted-foreground pt-1 border-t border-border/50 mt-2">
|
||||
{errorType === 'duplicate' && (
|
||||
<p>Om du vill importera om filen, ta först bort den tidigare importen under Bokföring.</p>
|
||||
)}
|
||||
{errorType === 'duplicate_period' && (
|
||||
<p>Varje räkenskapsår kan bara importeras en gång. Ta bort den befintliga importen först om du vill ersätta den.</p>
|
||||
)}
|
||||
{errorType === 'validation' && (
|
||||
<p>Prova att exportera filen igen från ditt bokföringsprogram. Om felet kvarstår, kontrollera att alla verifikationer är korrekt bokförda i källsystemet.</p>
|
||||
)}
|
||||
{errorType === 'parse' && (
|
||||
<p>Kontrollera att filen är en SIE4-fil exporterad från ett bokföringsprogram (Fortnox, Visma, Bokio etc). Filen kan vara skadad om den redigerats manuellt.</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Validation errors list */}
|
||||
{validationErrors && validationErrors.length > 0 && (
|
||||
<div className="p-4 bg-destructive/5 border border-destructive/15 rounded-lg space-y-2">
|
||||
<p className="text-sm font-medium text-destructive">Fel som blockerar import ({validationErrors.length})</p>
|
||||
<div className="space-y-1.5 max-h-48 overflow-y-auto">
|
||||
{validationErrors.map((err, i) => (
|
||||
<div key={i} className="text-sm flex gap-2">
|
||||
<XCircle className="h-4 w-4 text-destructive flex-shrink-0 mt-0.5" />
|
||||
<span className="text-muted-foreground">{err}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Validation warnings list */}
|
||||
{validationWarnings && validationWarnings.length > 0 && (
|
||||
<div className="p-4 bg-warning/5 border border-warning/15 rounded-lg space-y-2">
|
||||
<p className="text-sm font-medium text-warning">Varningar ({validationWarnings.length})</p>
|
||||
<div className="space-y-1.5 max-h-32 overflow-y-auto">
|
||||
{validationWarnings.map((warn, i) => (
|
||||
<div key={i} className="text-sm flex gap-2">
|
||||
<AlertCircle className="h-4 w-4 text-warning flex-shrink-0 mt-0.5" />
|
||||
<span className="text-muted-foreground">{warn}</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</CardContent>
|
||||
|
||||
Reference in New Issue
Block a user