feat: reverse charge VAT (ruta 20-32) + mobile UX improvements (#50)
* fix: include reversed entries in all reports (general ledger, trial balance, VAT, SIE, NE, INK2) Reversed entries (storno) must appear alongside their original posted entries in reports for a complete audit trail. Previously, filtering by status='posted' excluded them, causing discrepancies when corrections had been made. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: semi-manual invoice payment booking with editable journal lines When marking an invoice as paid, users now see a dialog where they can: - Choose which bank/cash account the payment goes to (1910, 1920, 1930, etc.) - Review and edit the proposed journal entry lines before committing - The happy path remains fast — lines are pre-filled correctly Implementation: - Pure proposePaymentLines() function for line computation (accrual + cash) - PaymentBookingDialog with AccountCombobox, balance validation, date picker - API accepts optional custom lines, falls back to auto-generation without them - 18 tests (8 unit + 10 API) all passing Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: address Greptile review — validation fallback, balance check, error handling - P1: Return 400 on invalid body instead of silently falling back to auto-generated lines (split JSON parse from schema validation) - P1: Add server-side balance check for custom lines before committing (debit must equal credit, totalDebit > 0) - P2: Wrap PaymentBookingDialog init() in try/catch with toast on failure and auto-close instead of silent empty state - Add 2 new tests: unbalanced lines → 400, invalid schema → 400 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: OAuth callback redirect for local dev and timeout resilience - Pass redirectUri dynamically from NEXT_PUBLIC_APP_URL so OAuth callbacks work on localhost (not just production) - Encode consentId/provider in OAuth state (base64url JSON) so the callback doesn't depend on session storage - Add skipAuth flag to extension API routes for OAuth callbacks (external provider redirects have no user session cookie) - Wrap AbortError in descriptive timeout messages in arcim-client - Make preview endpoint resilient to partial failures (company info and SIE fetch are individually non-blocking) - Simplify login page (remove unused magic link auth mode) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: create journal entry before marking invoice as paid Move journal entry creation before the invoice status update so that if accounting fails, the invoice is not permanently marked paid without a corresponding entry. Previously the error was silently swallowed. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: update mark-paid tests for journal-first ordering Reorder mock queue to match new flow (settings before update), update failure test to expect 500 instead of silent success, add try-catch with proper error response in route handler. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * feat: add reverse charge VAT (ruta 20-32) and improve mobile UX across dashboard Add full reverse charge (omvänd skattskyldighet) support to the VAT declaration: - Map accounts 2614/2624/2634 to ruta 30/31/32 for self-assessed output VAT - Calculate purchase bases (ruta 20-24) from supplier invoices by supplier type - Include ruta 30-32 in ruta 49 formula and totalOutputVat summary - Display reverse charge section in reports UI and composition chart - Add comprehensive test coverage for all reverse charge scenarios Improve mobile UX across the app: - Convert nav drawer to bottom sheet with drag handle and safe area padding - Add mobile card layout for PaymentBookingDialog journal lines - Replace settings tab pills with dropdown selector on mobile - Make wizard step indicators responsive (collapsed on mobile) - Ensure all dialog footers stack buttons full-width on mobile - Add 44px minimum touch targets throughout - Make onboarding buttons full-width on mobile Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> * fix: address Greptile review — indentation, query efficiency, tab dedup - Fix misleading try-block indentation in mark-paid route - Filter reversed entries at DB level (.eq('status', 'posted')) instead of fetching then discarding in memory - Extract shared settingsTabs array so mobile Select and desktop TabsList stay in sync automatically Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.6
parent
f33806cd15
commit
ceec8c02a8
@@ -315,7 +315,7 @@ export default function DashboardNav({ companyName, entityType, uncategorizedTra
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
{/* Mobile menu drawer */}
|
||||
{/* Mobile menu — bottom sheet */}
|
||||
{isMobileMenuOpen && (
|
||||
<>
|
||||
{/* Backdrop */}
|
||||
@@ -327,39 +327,41 @@ export default function DashboardNav({ companyName, entityType, uncategorizedTra
|
||||
onClick={closeMobileMenu}
|
||||
aria-hidden="true"
|
||||
/>
|
||||
{/* Drawer */}
|
||||
{/* Bottom sheet */}
|
||||
<div
|
||||
className={cn(
|
||||
"md:hidden fixed right-0 top-0 bottom-0 w-72 bg-card border-l border-border/40 z-50 overflow-y-auto",
|
||||
"md:hidden fixed inset-x-0 bottom-0 z-50 bg-card rounded-t-2xl border-t border-border/40 overflow-y-auto overscroll-contain",
|
||||
isClosing
|
||||
? "animate-out slide-out-to-right duration-200"
|
||||
: "animate-in slide-in-from-right duration-300"
|
||||
? "animate-out slide-out-to-bottom duration-200"
|
||||
: "animate-in slide-in-from-bottom duration-300"
|
||||
)}
|
||||
style={{ maxHeight: '85dvh', paddingBottom: 'env(safe-area-inset-bottom, 0px)' }}
|
||||
role="dialog"
|
||||
aria-label="Navigeringsmeny"
|
||||
>
|
||||
<div className="p-4 border-b border-border/40 flex items-center justify-between">
|
||||
<div>
|
||||
<p className="font-medium truncate">{companyName}</p>
|
||||
<p className="text-xs text-muted-foreground">Meny</p>
|
||||
</div>
|
||||
{/* Drag handle */}
|
||||
<div className="flex justify-center pt-3 pb-1 sticky top-0 bg-card rounded-t-2xl">
|
||||
<div className="w-8 h-1 rounded-full bg-muted-foreground/25" />
|
||||
</div>
|
||||
|
||||
{/* Header */}
|
||||
<div className="px-4 pb-2 flex items-center justify-between">
|
||||
<p className="font-medium text-sm truncate">{companyName}</p>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
className="h-8 w-8 -mr-1"
|
||||
onClick={closeMobileMenu}
|
||||
aria-label="Stäng meny"
|
||||
>
|
||||
<X className="h-5 w-5" />
|
||||
<X className="h-4 w-4" />
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Grouped navigation */}
|
||||
<div className="p-2">
|
||||
{/* Main section */}
|
||||
<div className="mb-4">
|
||||
<p className="px-3 py-2 text-xs font-medium text-muted-foreground uppercase tracking-wider">
|
||||
Huvudmeny
|
||||
</p>
|
||||
{/* Navigation */}
|
||||
<div className="px-2">
|
||||
{/* Main items */}
|
||||
<div className="space-y-0.5">
|
||||
{mainItems.map((item) => {
|
||||
const Icon = item.icon
|
||||
const active = isActive(item.href)
|
||||
@@ -369,51 +371,65 @@ export default function DashboardNav({ companyName, entityType, uncategorizedTra
|
||||
href={item.href}
|
||||
onClick={closeMobileMenu}
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-3 py-2.5 rounded-lg transition-colors',
|
||||
'flex items-center gap-3 px-3 min-h-[44px] rounded-lg transition-colors',
|
||||
active
|
||||
? 'bg-primary/10 text-primary font-medium'
|
||||
: 'text-muted-foreground hover:bg-secondary/50 hover:text-foreground'
|
||||
: 'text-foreground active:bg-muted/60'
|
||||
)}
|
||||
>
|
||||
<Icon className="h-5 w-5" />
|
||||
{item.label}
|
||||
<Icon className={cn("h-[18px] w-[18px] flex-shrink-0", active ? "text-primary" : "text-muted-foreground")} />
|
||||
<span className="text-sm">{item.label}</span>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
|
||||
{/* Finance section */}
|
||||
<div className="mb-4">
|
||||
<p className="px-3 py-2 text-xs font-medium text-muted-foreground uppercase tracking-wider">
|
||||
Finans
|
||||
</p>
|
||||
{/* Finans divider */}
|
||||
<div className="flex items-center gap-3 my-1.5 px-3">
|
||||
<span className="text-[10px] font-semibold text-muted-foreground/60 uppercase tracking-[0.08em]">Finans</span>
|
||||
<div className="flex-1 h-px bg-border/30" />
|
||||
</div>
|
||||
|
||||
{/* Finance items */}
|
||||
<div className="space-y-0.5">
|
||||
{finansItems.map((item) => {
|
||||
const Icon = item.icon
|
||||
const active = isActive(item.href)
|
||||
const badge = item.href === '/transactions' && uncategorizedTransactionCount > 0
|
||||
? uncategorizedTransactionCount
|
||||
: null
|
||||
return (
|
||||
<Link
|
||||
key={item.href}
|
||||
href={item.href}
|
||||
onClick={closeMobileMenu}
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-3 py-2.5 rounded-lg transition-colors',
|
||||
'flex items-center gap-3 px-3 min-h-[44px] rounded-lg transition-colors',
|
||||
active
|
||||
? 'bg-primary/10 text-primary font-medium'
|
||||
: 'text-muted-foreground hover:bg-secondary/50 hover:text-foreground'
|
||||
: 'text-foreground active:bg-muted/60'
|
||||
)}
|
||||
>
|
||||
<Icon className="h-5 w-5" />
|
||||
{item.label}
|
||||
<Icon className={cn("h-[18px] w-[18px] flex-shrink-0", active ? "text-primary" : "text-muted-foreground")} />
|
||||
<span className="text-sm flex-1">{item.label}</span>
|
||||
{badge !== null && (
|
||||
<span className="min-w-[20px] h-[20px] flex items-center justify-center rounded-full bg-primary/15 text-primary text-[10px] font-semibold px-1.5">
|
||||
{badge > 99 ? '99+' : badge}
|
||||
</span>
|
||||
)}
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
|
||||
{/* Other section */}
|
||||
<div className="mb-4">
|
||||
<p className="px-3 py-2 text-xs font-medium text-muted-foreground uppercase tracking-wider">
|
||||
Övrigt
|
||||
</p>
|
||||
{/* Övrigt divider */}
|
||||
<div className="flex items-center gap-3 my-1.5 px-3">
|
||||
<span className="text-[10px] font-semibold text-muted-foreground/60 uppercase tracking-[0.08em]">Övrigt</span>
|
||||
<div className="flex-1 h-px bg-border/30" />
|
||||
</div>
|
||||
|
||||
{/* Other items */}
|
||||
<div className="space-y-0.5">
|
||||
{övrigtItems.map((item) => {
|
||||
const Icon = item.icon
|
||||
const active = isActive(item.href)
|
||||
@@ -423,33 +439,33 @@ export default function DashboardNav({ companyName, entityType, uncategorizedTra
|
||||
href={item.href}
|
||||
onClick={closeMobileMenu}
|
||||
className={cn(
|
||||
'flex items-center gap-3 px-3 py-2.5 rounded-lg transition-colors',
|
||||
'flex items-center gap-3 px-3 min-h-[44px] rounded-lg transition-colors',
|
||||
active
|
||||
? 'bg-primary/10 text-primary font-medium'
|
||||
: 'text-muted-foreground hover:bg-secondary/50 hover:text-foreground'
|
||||
: 'text-foreground active:bg-muted/60'
|
||||
)}
|
||||
>
|
||||
<Icon className="h-5 w-5" />
|
||||
{item.label}
|
||||
<Icon className={cn("h-[18px] w-[18px] flex-shrink-0", active ? "text-primary" : "text-muted-foreground")} />
|
||||
<span className="text-sm">{item.label}</span>
|
||||
</Link>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Logout */}
|
||||
<div className="pt-4 border-t border-border/40">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="w-full justify-start text-muted-foreground hover:text-foreground"
|
||||
onClick={() => {
|
||||
closeMobileMenu()
|
||||
handleLogout()
|
||||
}}
|
||||
>
|
||||
<LogOut className="mr-3 h-5 w-5" />
|
||||
{isSandbox ? 'Avsluta sandbox' : 'Logga ut'}
|
||||
</Button>
|
||||
</div>
|
||||
{/* Logout */}
|
||||
<div className="px-2 py-2 mt-1 border-t border-border/30">
|
||||
<Button
|
||||
variant="ghost"
|
||||
className="w-full justify-start text-muted-foreground active:text-foreground text-sm h-11 px-3"
|
||||
onClick={() => {
|
||||
closeMobileMenu()
|
||||
handleLogout()
|
||||
}}
|
||||
>
|
||||
<LogOut className="mr-3 h-[18px] w-[18px]" />
|
||||
{isSandbox ? 'Avsluta sandbox' : 'Logga ut'}
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -7,6 +7,7 @@ import { Button } from '@/components/ui/button'
|
||||
import { Input } from '@/components/ui/input'
|
||||
import { Switch } from '@/components/ui/switch'
|
||||
import { useToast } from '@/components/ui/use-toast'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { ConfirmationDialog } from '@/components/ui/confirmation-dialog'
|
||||
import Link from 'next/link'
|
||||
import {
|
||||
@@ -1513,10 +1514,16 @@ export default function ArcimMigrationWorkspace(_props: WorkspaceComponentProps)
|
||||
<CardContent className="pt-6">
|
||||
<div className="space-y-2">
|
||||
<div className="flex justify-between text-sm">
|
||||
<span className="sm:hidden text-primary font-medium">
|
||||
Steg {currentUserStepIndex + 1}/{userSteps.length}: {STEP_LABELS[step]}
|
||||
</span>
|
||||
{userSteps.map((s) => (
|
||||
<span
|
||||
key={s}
|
||||
className={userSteps.indexOf(s) <= currentUserStepIndex ? 'font-medium text-primary' : 'text-muted-foreground'}
|
||||
className={cn(
|
||||
'hidden sm:inline',
|
||||
userSteps.indexOf(s) <= currentUserStepIndex ? 'font-medium text-primary' : 'text-muted-foreground'
|
||||
)}
|
||||
>
|
||||
{STEP_LABELS[s]}
|
||||
</span>
|
||||
|
||||
@@ -225,12 +225,71 @@ export default function PaymentBookingDialog({
|
||||
type="date"
|
||||
value={paymentDate}
|
||||
onChange={(e) => setPaymentDate(e.target.value)}
|
||||
className="w-48"
|
||||
className="w-full sm:w-48"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Journal entry lines */}
|
||||
<div className="space-y-2">
|
||||
{/* Mobile card layout */}
|
||||
<div className="sm:hidden space-y-3">
|
||||
{lines.map((line, index) => (
|
||||
<div key={index} className="rounded-lg border bg-card p-3 space-y-2">
|
||||
<div className="flex items-start gap-2">
|
||||
<div className="flex-1">
|
||||
<AccountCombobox
|
||||
value={line.account_number}
|
||||
accounts={accounts}
|
||||
onChange={(val) => updateLine(index, 'account_number', val)}
|
||||
/>
|
||||
</div>
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-8 w-8 p-0 min-h-[44px] min-w-[44px] shrink-0 -mr-1 -mt-1"
|
||||
onClick={() => removeLine(index)}
|
||||
disabled={lines.length <= 2}
|
||||
>
|
||||
<Trash2 className="h-3.5 w-3.5" />
|
||||
</Button>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<div className="space-y-1">
|
||||
<Label className="text-xs text-muted-foreground">Debet</Label>
|
||||
<Input
|
||||
type="number"
|
||||
step="0.01"
|
||||
min="0"
|
||||
placeholder="0,00"
|
||||
value={line.debit_amount}
|
||||
onChange={(e) => updateLine(index, 'debit_amount', e.target.value)}
|
||||
className="font-mono text-right"
|
||||
inputMode="decimal"
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
<Label className="text-xs text-muted-foreground">Kredit</Label>
|
||||
<Input
|
||||
type="number"
|
||||
step="0.01"
|
||||
min="0"
|
||||
placeholder="0,00"
|
||||
value={line.credit_amount}
|
||||
onChange={(e) => updateLine(index, 'credit_amount', e.target.value)}
|
||||
className="font-mono text-right"
|
||||
inputMode="decimal"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
<Button type="button" variant="outline" size="sm" onClick={addLine} className="w-full">
|
||||
<Plus className="mr-1 h-3.5 w-3.5" /> Lägg till rad
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{/* Desktop table layout */}
|
||||
<div className="hidden sm:block space-y-2">
|
||||
{/* Header */}
|
||||
<div className="grid grid-cols-[1fr_120px_120px_32px] gap-2 text-xs font-medium text-muted-foreground px-1">
|
||||
<span>Konto</span>
|
||||
@@ -316,10 +375,10 @@ export default function PaymentBookingDialog({
|
||||
)}
|
||||
|
||||
<DialogFooter>
|
||||
<Button variant="outline" onClick={() => onOpenChange(false)} disabled={isSubmitting}>
|
||||
<Button variant="outline" onClick={() => onOpenChange(false)} disabled={isSubmitting} className="w-full sm:w-auto min-h-11">
|
||||
Avbryt
|
||||
</Button>
|
||||
<Button onClick={handleSubmit} disabled={!isBalanced || isSubmitting || !isInitialized}>
|
||||
<Button onClick={handleSubmit} disabled={!isBalanced || isSubmitting || !isInitialized} className="w-full sm:w-auto min-h-11">
|
||||
{isSubmitting && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
|
||||
Bekräfta & bokför
|
||||
</Button>
|
||||
|
||||
@@ -104,11 +104,12 @@ export default function Step1EntityType({ initialData, onNext, isSaving }: Step1
|
||||
})}
|
||||
</div>
|
||||
|
||||
<div className="flex justify-end">
|
||||
<div className="flex flex-col-reverse sm:flex-row sm:justify-end gap-3">
|
||||
<Button
|
||||
onClick={handleNext}
|
||||
disabled={!selected || isSaving}
|
||||
size="lg"
|
||||
className="w-full sm:w-auto"
|
||||
>
|
||||
{isSaving ? (
|
||||
<>
|
||||
|
||||
@@ -139,17 +139,18 @@ export default function Step2CompanyDetails({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between pt-4">
|
||||
<div className="flex flex-col-reverse sm:flex-row sm:justify-between gap-3 pt-4">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
onClick={onBack}
|
||||
disabled={isSaving}
|
||||
className="w-full sm:w-auto"
|
||||
>
|
||||
<ArrowLeft className="mr-2 h-4 w-4" />
|
||||
Tillbaka
|
||||
</Button>
|
||||
<Button type="submit" disabled={isSaving}>
|
||||
<Button type="submit" disabled={isSaving} className="w-full sm:w-auto">
|
||||
{isSaving ? (
|
||||
<>
|
||||
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
||||
|
||||
@@ -754,17 +754,18 @@ export default function Step3TaxRegistration({
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between pt-4">
|
||||
<div className="flex flex-col-reverse sm:flex-row sm:justify-between gap-3 pt-4">
|
||||
<Button
|
||||
type="button"
|
||||
variant="ghost"
|
||||
onClick={onBack}
|
||||
disabled={isSaving}
|
||||
className="w-full sm:w-auto"
|
||||
>
|
||||
<ArrowLeft className="mr-2 h-4 w-4" />
|
||||
Tillbaka
|
||||
</Button>
|
||||
<Button type="submit" disabled={isSaving}>
|
||||
<Button type="submit" disabled={isSaving} className="w-full sm:w-auto">
|
||||
{isSaving ? (
|
||||
<>
|
||||
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
||||
|
||||
@@ -15,6 +15,9 @@ const COLORS = [
|
||||
'hsl(var(--chart-2))',
|
||||
'hsl(var(--chart-3))',
|
||||
'hsl(var(--chart-4))',
|
||||
'hsl(var(--chart-1) / 0.6)',
|
||||
'hsl(var(--chart-2) / 0.6)',
|
||||
'hsl(var(--chart-3) / 0.6)',
|
||||
]
|
||||
|
||||
export function VatCompositionChart({ rutor }: VatCompositionChartProps) {
|
||||
@@ -23,6 +26,9 @@ export function VatCompositionChart({ rutor }: VatCompositionChartProps) {
|
||||
{ name: 'Utgående 25%', value: rutor.ruta10 },
|
||||
{ name: 'Utgående 12%', value: rutor.ruta11 },
|
||||
{ name: 'Utgående 6%', value: rutor.ruta12 },
|
||||
{ name: 'Omvänd 25%', value: rutor.ruta30 },
|
||||
{ name: 'Omvänd 12%', value: rutor.ruta31 },
|
||||
{ name: 'Omvänd 6%', value: rutor.ruta32 },
|
||||
{ name: 'Ingående moms', value: rutor.ruta48 },
|
||||
]
|
||||
return segments.filter((s) => s.value > 0)
|
||||
|
||||
@@ -23,7 +23,7 @@ export default function InboxZeroState({ hasTransactions, onCreateTransaction }:
|
||||
<p className="text-sm text-muted-foreground text-center max-w-sm mb-6">
|
||||
Importera kontoutdrag från din bank eller lägg till transaktioner manuellt för att komma igång.
|
||||
</p>
|
||||
<div className="flex gap-2">
|
||||
<div className="flex flex-col sm:flex-row gap-2 w-full sm:w-auto px-4 sm:px-0">
|
||||
<Button asChild>
|
||||
<Link href="/import">
|
||||
<Upload className="mr-2 h-4 w-4" />
|
||||
|
||||
@@ -67,11 +67,12 @@ export function ConfirmationDialog({
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
disabled={isSubmitting}
|
||||
className="min-h-11 w-full sm:w-auto"
|
||||
>
|
||||
Tillbaka
|
||||
</Button>
|
||||
{extraActions}
|
||||
<Button onClick={onConfirm} disabled={isSubmitting}>
|
||||
<Button onClick={onConfirm} disabled={isSubmitting} className="min-h-11 w-full sm:w-auto">
|
||||
{isSubmitting ? (
|
||||
<>
|
||||
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
||||
|
||||
@@ -78,6 +78,7 @@ export function DestructiveConfirmDialog({
|
||||
variant="outline"
|
||||
onClick={() => onOpenChange(false)}
|
||||
disabled={isLoading}
|
||||
className="min-h-11 w-full sm:w-auto"
|
||||
>
|
||||
{cancelLabel}
|
||||
</Button>
|
||||
@@ -85,11 +86,10 @@ export function DestructiveConfirmDialog({
|
||||
variant={variant === 'destructive' ? 'destructive' : 'default'}
|
||||
onClick={handleConfirm}
|
||||
disabled={isLoading}
|
||||
className={
|
||||
variant === 'warning'
|
||||
? 'bg-warning hover:bg-warning/90 text-warning-foreground'
|
||||
: undefined
|
||||
}
|
||||
className={cn(
|
||||
'min-h-11 w-full sm:w-auto',
|
||||
variant === 'warning' && 'bg-warning hover:bg-warning/90 text-warning-foreground'
|
||||
)}
|
||||
>
|
||||
{isLoading ? (
|
||||
<Loader2 className="mr-2 h-4 w-4 animate-spin" />
|
||||
|
||||
@@ -72,7 +72,7 @@ const DialogFooter = ({
|
||||
}: React.HTMLAttributes<HTMLDivElement>) => (
|
||||
<div
|
||||
className={cn(
|
||||
"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
|
||||
"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end sm:space-x-2 sm:gap-0",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
|
||||
Reference in New Issue
Block a user