EmilandClaude Opus 4.6
44231d0000
Replace CategoryExpandedDialog with TransactionBookingDialog that embeds the JournalEntryForm for full manual booking. Add /api/transactions/[id]/book endpoint. Add VAT treatment selector to CategoryExpandedDialog. Add booking buttons to TransactionHistoryList and improve TransactionInboxCard actions. Fix animation timing in transactions page state updates. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
95 lines
3.4 KiB
TypeScript
95 lines
3.4 KiB
TypeScript
'use client'
|
|
|
|
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from '@/components/ui/dialog'
|
|
import { formatCurrency, formatDate } from '@/lib/utils'
|
|
import { ArrowUpRight, ArrowDownRight } from 'lucide-react'
|
|
import JournalEntryForm from '@/components/bookkeeping/JournalEntryForm'
|
|
import type { FormLine } from '@/components/bookkeeping/JournalEntryForm'
|
|
import type { TransactionWithInvoice } from './transaction-types'
|
|
|
|
interface TransactionBookingDialogProps {
|
|
open: boolean
|
|
onOpenChange: (open: boolean) => void
|
|
transaction: TransactionWithInvoice | null
|
|
onBooked: (transactionId: string, journalEntryId: string) => void
|
|
}
|
|
|
|
function buildInitialLines(transaction: TransactionWithInvoice): FormLine[] {
|
|
const amount = Math.round(Math.abs(transaction.amount_sek ?? transaction.amount) * 100) / 100
|
|
const amountStr = amount.toFixed(2)
|
|
const isExpense = transaction.amount < 0
|
|
|
|
if (isExpense) {
|
|
return [
|
|
{ account_number: '', debit_amount: amountStr, credit_amount: '', line_description: '' },
|
|
{ account_number: '1930', debit_amount: '', credit_amount: amountStr, line_description: 'Företagskonto' },
|
|
]
|
|
}
|
|
|
|
return [
|
|
{ account_number: '1930', debit_amount: amountStr, credit_amount: '', line_description: 'Företagskonto' },
|
|
{ account_number: '', debit_amount: '', credit_amount: amountStr, line_description: '' },
|
|
]
|
|
}
|
|
|
|
export default function TransactionBookingDialog({
|
|
open,
|
|
onOpenChange,
|
|
transaction,
|
|
onBooked,
|
|
}: TransactionBookingDialogProps) {
|
|
if (!transaction) return null
|
|
|
|
const isIncome = transaction.amount > 0
|
|
|
|
return (
|
|
<Dialog open={open} onOpenChange={onOpenChange}>
|
|
<DialogContent className="max-w-2xl max-h-[90vh] overflow-y-auto">
|
|
<DialogHeader>
|
|
<DialogTitle>Bokför transaktion</DialogTitle>
|
|
<DialogDescription>
|
|
Skapa en verifikation för transaktionen
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
|
|
{/* Transaction summary */}
|
|
<div className="flex items-center gap-3 rounded-lg border p-3">
|
|
<div
|
|
className={`h-9 w-9 rounded-full flex items-center justify-center flex-shrink-0 ${
|
|
isIncome
|
|
? 'bg-success/10 text-success'
|
|
: 'bg-destructive/10 text-destructive'
|
|
}`}
|
|
>
|
|
{isIncome ? (
|
|
<ArrowUpRight className="h-4 w-4" />
|
|
) : (
|
|
<ArrowDownRight className="h-4 w-4" />
|
|
)}
|
|
</div>
|
|
<div className="flex-1 min-w-0">
|
|
<p className="font-medium text-sm truncate">{transaction.description}</p>
|
|
<p className="text-xs text-muted-foreground">{formatDate(transaction.date)}</p>
|
|
</div>
|
|
<p className={`font-medium text-sm flex-shrink-0 ${isIncome ? 'text-success' : ''}`}>
|
|
{isIncome ? '+' : ''}
|
|
{formatCurrency(transaction.amount, transaction.currency)}
|
|
</p>
|
|
</div>
|
|
|
|
<JournalEntryForm
|
|
key={transaction.id}
|
|
embedded
|
|
initialLines={buildInitialLines(transaction)}
|
|
initialDate={transaction.date}
|
|
initialDescription={transaction.description}
|
|
submitUrl={`/api/transactions/${transaction.id}/book`}
|
|
sourceType="bank_transaction"
|
|
sourceId={transaction.id}
|
|
onEntryCreated={(entryId) => onBooked(transaction.id, entryId)}
|
|
/>
|
|
</DialogContent>
|
|
</Dialog>
|
|
)
|
|
}
|