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:
Dotta 2026-03-16 09:47:29 -05:00
parent 86bb3d25cc
commit 0b829ea20b

View file

@ -902,8 +902,7 @@ 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>
@ -921,17 +920,6 @@ export function CompanyImport() {
</span> </span>
)} )}
</div> </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>
{/* Conflict resolution list */} {/* Conflict resolution list */}
@ -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">