Settings layout tweaks

This commit is contained in:
2025-01-11 14:58:59 -05:00
parent eed032735d
commit 50ead64356

View File

@@ -747,83 +747,6 @@ export function Settings() {
)}
</CardContent>
</Card>
{/* Database Management Card */}
<Card>
<CardHeader>
<CardTitle>Database Management</CardTitle>
<CardDescription>Reset database or metrics tables</CardDescription>
</CardHeader>
<CardContent className="space-y-4">
<div className="flex gap-4">
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
variant="destructive"
disabled={isResetting || isImporting || isUpdating || isResettingMetrics}
>
Reset Database
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
<AlertDialogDescription>
This action cannot be undone. This will permanently delete all data from the database.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleResetDB}>Continue</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
variant="secondary"
disabled={isResetting || isImporting || isUpdating || isResettingMetrics}
>
Reset Metrics Only
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Reset metrics tables?</AlertDialogTitle>
<AlertDialogDescription>
This will clear all metrics tables while preserving your core data (products, orders, etc.).
You can then recalculate metrics with the Import Data function.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleResetMetrics}>Continue</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
{resetProgress && (
<div className="mt-4">
<Progress value={Number(resetProgress.percentage)} className="mb-2" />
<p className="text-sm text-muted-foreground">
{resetProgress.message || 'Resetting database...'}
</p>
</div>
)}
{resetMetricsProgress && (
<div className="mt-4">
<Progress value={Number(resetMetricsProgress.percentage)} className="mb-2" />
<p className="text-sm text-muted-foreground">
{resetMetricsProgress.message || 'Resetting metrics...'}
</p>
</div>
)}
</CardContent>
</Card>
{/* Add new Metrics Calculation Card */}
<Card>
<CardHeader>
@@ -864,6 +787,85 @@ export function Settings() {
</CardContent>
</Card>
{/* Database Management Card */}
<Card>
<CardHeader>
<CardTitle>Database Management</CardTitle>
<CardDescription>Reset database or metrics tables</CardDescription>
</CardHeader>
<CardContent className="space-y-4">
<div className="flex flex-wrap gap-2">
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
variant="destructive"
className="flex-1 min-w-[140px]"
disabled={isResetting || isImporting || isUpdating || isResettingMetrics}
>
Reset Database
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Are you absolutely sure?</AlertDialogTitle>
<AlertDialogDescription>
This action cannot be undone. This will permanently delete all data from the database.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleResetDB}>Continue</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
<AlertDialog>
<AlertDialogTrigger asChild>
<Button
variant="destructive"
className="flex-1 min-w-[140px]"
disabled={isResetting || isImporting || isUpdating || isResettingMetrics}
>
Reset Metrics Only
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Reset metrics tables?</AlertDialogTitle>
<AlertDialogDescription>
This action cannot be undone. This will permanently delete all data from metrics-related tables.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel>
<AlertDialogAction onClick={handleResetMetrics}>Continue</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
{resetProgress && (
<div className="mt-4">
<Progress value={Number(resetProgress.percentage)} className="mb-2" />
<p className="text-sm text-muted-foreground">
{resetProgress.message || 'Resetting database...'}
</p>
</div>
)}
{resetMetricsProgress && (
<div className="mt-4">
<Progress value={Number(resetMetricsProgress.percentage)} className="mb-2" />
<p className="text-sm text-muted-foreground">
{resetMetricsProgress.message || 'Resetting metrics...'}
</p>
</div>
)}
</CardContent>
</Card>
{/* Show progress outside cards if no operation is running but we have progress state */}
{!isUpdating && !isImporting && !isResetting && !isResettingMetrics && !isCalculatingMetrics &&
(updateProgress || importProgress || resetProgress || resetMetricsProgress || metricsProgress) && (