834cc4d0e8
* fix(dialogs): kill horizontal overflow in dialogs and cut the worst modal copy Overflow hardening: - DialogTitle/DialogDescription and SheetTitle/SheetDescription get break-words at the primitive, so long unbroken interpolated strings (emails, product names, org numbers) can no longer widen any dialog. - AccountCombobox's non-flat dropdown is portaled to document.body with viewport-clamped geometry (new pure helper account-combobox-position.ts, unit-tested), the same fix info-tooltip.tsx applies to TooltipContent: the 34rem panel inside a scrollable DialogContent was the root cause of sideways-scrolling dialogs. Outside-click checks the portaled node, position tracks scroll/resize (capture phase), wheel/touchmove stop at the panel so react-remove-scroll's modal lock cannot block its scrolling, and DialogContent/SheetContent treat data-dialog-companion nodes as inside interactions so clicking the panel never dismisses the dialog. The flat variant is unchanged. - StrikeLinesDialog/CorrectionEntryDialog line rows switch bare 1fr grid tracks to minmax(0,1fr) and wrap the sm:contents-promoted AccountCombobox in a min-w-0 cell (SendInvoiceDialog's pattern). - New dialog-overflow-risk ratchet in no-new-antipatterns.mjs: bare fr tracks in dialog hosts, whitespace-nowrap inside DialogContent regions outside an allowlist, and unportaled >=20rem overlays; baselined at the post-fix 7 files. Copy reduction (convention 7, MatchVoucherDialog precedent): - New shared RattelseExplainer (HelpPopover) carries the "a posted verifikat cannot be edited directly" framing once; CorrectionEntryDialog, StrikeLinesDialog, RecordateEntryDialog and CorrectMetadataDialog drop their permanent inline explainer boxes and keep at most one sentence inline (hardcoded Swedish: verifikat surface). - SendInvoiceDialog keeps the actual addresses inline and moves the fixed CC/BCC framing plus the extra-address rules behind a HelpPopover (recipient_additional_hint replaced by recipient_help_fixed and recipient_help_additional in both messages files). - HelpPopover panels gain pointer-events-auto and the companion marker so they are actually interactive inside modal dialogs. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(bookkeeping): mechanism-accurate rattelse copy and calmer dropdown repositioning The shared RattelseExplainer claimed every rattelse is logged with who/when in the verifikat's rattelsehistorik, which is only true for the inline strike-and-replace track (StrikeLinesDialog, CorrectMetadataDialog). The storno dialogs (CorrectionEntryDialog, RecordateEntryDialog) never write that log: their BFL 5 kap 5 trail is the storno chain. The shared component now keeps only the universally true framing sentence, and each dialog's popover carries the trail sentence matching its own mechanism. AccountCombobox's capture-phase scroll/resize handler now skips setState when the recomputed position is shallow-equal to the current one (isSameDropdownPosition in the pure position helper, unit-tested) and ignores scroll events originating inside the portaled panel itself, so scrolling the account list no longer churns re-renders. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: Jakob Wennberg <311770904+jakobwennberg-oss@users.noreply.github.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
157 lines
5.7 KiB
TypeScript
157 lines
5.7 KiB
TypeScript
'use client'
|
|
|
|
import { useState, useEffect } from 'react'
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
} from '@/components/ui/dialog'
|
|
import { Button } from '@/components/ui/button'
|
|
import RattelseExplainer from '@/components/bookkeeping/RattelseExplainer'
|
|
import { Input } from '@/components/ui/input'
|
|
import { Label } from '@/components/ui/label'
|
|
import { useToast } from '@/components/ui/use-toast'
|
|
import { getErrorMessage } from '@/lib/errors/get-error-message'
|
|
import type { JournalEntry } from '@/types'
|
|
|
|
interface Props {
|
|
entry: JournalEntry
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
onCorrected: () => void
|
|
}
|
|
|
|
/**
|
|
* Metadata rättelse (BFL 5 kap 9 §): correct the verifikationstext and/or
|
|
* the date (within the same fiscal period) of a posted verifikat without an
|
|
* ändringsverifikation. Who/when is recorded in the immutable rättelse log
|
|
* and shown in the verifikat's history. Stays Swedish (verifikat surface,
|
|
* .claude/rules/i18n.md).
|
|
*/
|
|
export default function CorrectMetadataDialog({ entry, open, onOpenChange, onCorrected }: Props) {
|
|
const { toast } = useToast()
|
|
const [description, setDescription] = useState('')
|
|
const [entryDate, setEntryDate] = useState('')
|
|
const [isSubmitting, setIsSubmitting] = useState(false)
|
|
|
|
useEffect(() => {
|
|
if (open) {
|
|
setDescription(entry.description || '')
|
|
setEntryDate(entry.entry_date?.slice(0, 10) || '')
|
|
}
|
|
}, [open, entry.id]) // eslint-disable-line react-hooks/exhaustive-deps
|
|
|
|
const descriptionChanged = description.trim() !== (entry.description || '')
|
|
const dateChanged = entryDate !== (entry.entry_date?.slice(0, 10) || '')
|
|
const hasChange = (descriptionChanged && description.trim().length > 0) || (dateChanged && entryDate.length > 0)
|
|
|
|
async function handleSubmit() {
|
|
if (!hasChange) return
|
|
setIsSubmitting(true)
|
|
try {
|
|
const payload: { description?: string; entry_date?: string } = {}
|
|
if (descriptionChanged && description.trim().length > 0) payload.description = description.trim()
|
|
if (dateChanged && entryDate.length > 0) payload.entry_date = entryDate
|
|
|
|
const res = await fetch(`/api/bookkeeping/journal-entries/${entry.id}/correct-metadata`, {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify(payload),
|
|
})
|
|
const result = await res.json()
|
|
if (!res.ok) {
|
|
const error = new Error('Failed to correct metadata') as Error & { body?: unknown; status?: number }
|
|
error.body = result
|
|
error.status = res.status
|
|
throw error
|
|
}
|
|
toast({
|
|
title: 'Verifikationen rättad',
|
|
description: 'Ändringen har loggats i verifikatets rättelsehistorik.',
|
|
})
|
|
onOpenChange(false)
|
|
onCorrected()
|
|
} catch (err) {
|
|
const anyErr = err as { body?: unknown; status?: number }
|
|
toast({
|
|
title: 'Kunde inte rätta verifikationen',
|
|
description: getErrorMessage(anyErr.body ?? err, { context: 'journal_entry', statusCode: anyErr.status }),
|
|
variant: 'destructive',
|
|
})
|
|
} finally {
|
|
setIsSubmitting(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className="sm:max-w-md">
|
|
<DialogHeader>
|
|
{/* Convention 7: the how-it-works copy lives behind the "?", not in
|
|
the dialog flow. */}
|
|
<div className="flex items-center gap-2">
|
|
<DialogTitle>Ändra text eller datum</DialogTitle>
|
|
<RattelseExplainer>
|
|
<p>
|
|
Verifikationstexten och datumet kan rättas här utan
|
|
ändringsverifikation.
|
|
</p>
|
|
<p>
|
|
Varje rättelse loggas med vem och när, och det ursprungliga
|
|
innehållet förblir synligt i verifikatets rättelsehistorik.
|
|
</p>
|
|
<p>
|
|
Om månaden redan är momsdeklarerad kan en datumflytt påverka
|
|
den inlämnade deklarationen.
|
|
</p>
|
|
</RattelseExplainer>
|
|
</div>
|
|
<DialogDescription>
|
|
Datumet kan bara flyttas inom samma bokföringsperiod: använd
|
|
"Flytta till annat datum" för att byta period.
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
|
|
<div className="space-y-4">
|
|
<div className="space-y-1">
|
|
<Label htmlFor="rattelse-description">Verifikationstext</Label>
|
|
<Input
|
|
id="rattelse-description"
|
|
value={description}
|
|
onChange={(e) => setDescription(e.target.value)}
|
|
maxLength={500}
|
|
/>
|
|
</div>
|
|
<div className="space-y-1">
|
|
<Label htmlFor="rattelse-date">Datum</Label>
|
|
<Input
|
|
id="rattelse-date"
|
|
type="date"
|
|
value={entryDate}
|
|
onChange={(e) => setEntryDate(e.target.value)}
|
|
disabled={['storno', 'opening_balance', 'year_end'].includes(entry.source_type)}
|
|
/>
|
|
{['storno', 'opening_balance', 'year_end'].includes(entry.source_type) && (
|
|
<p className="text-xs text-muted-foreground">
|
|
Datumet på den här verifikationstypen kan inte ändras.
|
|
</p>
|
|
)}
|
|
</div>
|
|
</div>
|
|
|
|
<DialogFooter>
|
|
<Button variant="outline" onClick={() => onOpenChange(false)} disabled={isSubmitting}>
|
|
Avbryt
|
|
</Button>
|
|
<Button onClick={handleSubmit} disabled={!hasChange || isSubmitting}>
|
|
{isSubmitting ? 'Rättar...' : 'Spara rättelse'}
|
|
</Button>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|