fix: move import button below renames panel
Move the "Import n files" button from the sticky header bar to below the renames confirmation panel, so the user reviews renames first before importing. Co-Authored-By: Paperclip <noreply@paperclip.ing>
This commit is contained in:
parent
86bb3d25cc
commit
0b829ea20b
1 changed files with 29 additions and 27 deletions
|
|
@ -902,35 +902,23 @@ export function CompanyImport() {
|
||||||
<>
|
<>
|
||||||
{/* Sticky import action bar */}
|
{/* Sticky import action bar */}
|
||||||
<div className="sticky top-0 z-10 border-b border-border bg-background px-5 py-3">
|
<div className="sticky top-0 z-10 border-b border-border bg-background px-5 py-3">
|
||||||
<div className="flex flex-wrap items-center justify-between gap-3">
|
<div className="flex flex-wrap items-center gap-4 text-sm">
|
||||||
<div className="flex items-center gap-4 text-sm">
|
<span className="font-medium">
|
||||||
<span className="font-medium">
|
Import preview
|
||||||
Import preview
|
</span>
|
||||||
|
<span className="text-muted-foreground">
|
||||||
|
{selectedCount} / {totalFiles} file{totalFiles === 1 ? "" : "s"} selected
|
||||||
|
</span>
|
||||||
|
{conflicts.length > 0 && (
|
||||||
|
<span className="text-amber-500">
|
||||||
|
{conflicts.length} rename{conflicts.length === 1 ? "" : "s"}
|
||||||
</span>
|
</span>
|
||||||
<span className="text-muted-foreground">
|
)}
|
||||||
{selectedCount} / {totalFiles} file{totalFiles === 1 ? "" : "s"} selected
|
{importPreview.errors.length > 0 && (
|
||||||
|
<span className="text-destructive">
|
||||||
|
{importPreview.errors.length} error{importPreview.errors.length === 1 ? "" : "s"}
|
||||||
</span>
|
</span>
|
||||||
{conflicts.length > 0 && (
|
)}
|
||||||
<span className="text-amber-500">
|
|
||||||
{conflicts.length} rename{conflicts.length === 1 ? "" : "s"}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
{importPreview.errors.length > 0 && (
|
|
||||||
<span className="text-destructive">
|
|
||||||
{importPreview.errors.length} error{importPreview.errors.length === 1 ? "" : "s"}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<Button
|
|
||||||
size="sm"
|
|
||||||
onClick={() => importMutation.mutate()}
|
|
||||||
disabled={importMutation.isPending || hasErrors || selectedCount === 0}
|
|
||||||
>
|
|
||||||
<Download className="mr-1.5 h-3.5 w-3.5" />
|
|
||||||
{importMutation.isPending
|
|
||||||
? "Importing..."
|
|
||||||
: `Import ${selectedCount} file${selectedCount === 1 ? "" : "s"}`}
|
|
||||||
</Button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -945,6 +933,20 @@ export function CompanyImport() {
|
||||||
onToggleConfirm={handleConflictToggleConfirm}
|
onToggleConfirm={handleConflictToggleConfirm}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
|
{/* Import button — below renames */}
|
||||||
|
<div className="mx-5 mt-3">
|
||||||
|
<Button
|
||||||
|
size="sm"
|
||||||
|
onClick={() => importMutation.mutate()}
|
||||||
|
disabled={importMutation.isPending || hasErrors || selectedCount === 0}
|
||||||
|
>
|
||||||
|
<Download className="mr-1.5 h-3.5 w-3.5" />
|
||||||
|
{importMutation.isPending
|
||||||
|
? "Importing..."
|
||||||
|
: `Import ${selectedCount} file${selectedCount === 1 ? "" : "s"}`}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
{/* Warnings */}
|
{/* Warnings */}
|
||||||
{importPreview.warnings.length > 0 && (
|
{importPreview.warnings.length > 0 && (
|
||||||
<div className="mx-5 mt-3 rounded-md border border-amber-500/30 bg-amber-500/5 px-4 py-3">
|
<div className="mx-5 mt-3 rounded-md border border-amber-500/30 bg-amber-500/5 px-4 py-3">
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue