319 lines
9.5 KiB
TypeScript
319 lines
9.5 KiB
TypeScript
"use client";
|
|
import { useState } from "react";
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogFooter,
|
|
DialogHeader,
|
|
DialogTitle,
|
|
} from "@/components/ui/dialog";
|
|
import { previewAutoCatalog } from "@/lib/furni/auto-catalog";
|
|
import { compareFurniture } from "@/lib/furni/studio-inspection";
|
|
import {
|
|
FurnitureComparison,
|
|
useFurnitureInspection,
|
|
} from "./furniture-inspector";
|
|
import type { FurniItem } from "./studio-types";
|
|
import { useSourceAssetChecks } from "./use-source-asset-checks";
|
|
|
|
export function ImportReview({
|
|
items,
|
|
sourceId,
|
|
source,
|
|
translation,
|
|
onCancel,
|
|
onConfirm,
|
|
}: {
|
|
items: FurniItem[];
|
|
sourceId?: string;
|
|
source: string;
|
|
translation: string;
|
|
onCancel: () => void;
|
|
onConfirm: (items: FurniItem[]) => void;
|
|
}) {
|
|
const inspection = useFurnitureInspection(
|
|
items.map((item) => item.classname),
|
|
);
|
|
const assets = useSourceAssetChecks(items, sourceId, inspection);
|
|
const unavailable = assets.items.filter((item) => item.state === "missing");
|
|
const [expanded, setExpanded] = useState(items[0]?.classname ?? "");
|
|
const [step, setStep] = useState<"review" | "confirm">("review");
|
|
const [page, setPage] = useState(0);
|
|
const localByName = new Map(
|
|
inspection.items.map((item) => [item.classname, item]),
|
|
);
|
|
const complete = items.every((item) => localByName.has(item.classname));
|
|
const ready = items.filter((item) => {
|
|
const local = localByName.get(item.classname);
|
|
return local && compareFurniture(item, local).state !== "conflict";
|
|
});
|
|
const blocked = items.filter((item) => {
|
|
const local = localByName.get(item.classname);
|
|
return local && compareFurniture(item, local).state === "conflict";
|
|
}).length;
|
|
const existing = items.filter((item) => {
|
|
const local = localByName.get(item.classname);
|
|
return (
|
|
local &&
|
|
local.sql.length > 0 &&
|
|
compareFurniture(item, local).state !== "conflict"
|
|
);
|
|
}).length;
|
|
const pageItems = (step === "review" ? items : ready).slice(
|
|
page * 50,
|
|
(page + 1) * 50,
|
|
);
|
|
const pageCount = Math.max(
|
|
1,
|
|
Math.ceil((step === "review" ? items : ready).length / 50),
|
|
);
|
|
return (
|
|
<Dialog
|
|
open
|
|
onOpenChange={(open) => {
|
|
if (!open) onCancel();
|
|
}}
|
|
>
|
|
<DialogContent className="flex max-h-[90dvh] w-[calc(100vw-2rem)] max-w-3xl sm:max-w-3xl flex-col overflow-hidden border-[var(--admin-border)] bg-[var(--admin-surface)] text-[var(--admin-text)]">
|
|
<DialogHeader>
|
|
<DialogTitle>
|
|
{step === "review"
|
|
? "Review furniture import"
|
|
: "Confirm furniture import"}
|
|
</DialogTitle>
|
|
<DialogDescription>
|
|
1. Select → 2. Review → 3. Import
|
|
</DialogDescription>
|
|
</DialogHeader>
|
|
<div className="min-h-0 flex-1 space-y-4 overflow-y-auto">
|
|
<div className="rounded-lg bg-[var(--admin-canvas)] p-3 text-sm">
|
|
<p>
|
|
<strong>Source:</strong> {source}
|
|
</p>
|
|
<p>
|
|
<strong>Destination:</strong> local catalog, furnidata, .nitro and
|
|
icons
|
|
</p>
|
|
<p>
|
|
<strong>Translation:</strong> {translation}
|
|
</p>
|
|
<p>
|
|
<strong>Selection:</strong> {items.length} furniture items
|
|
</p>
|
|
</div>
|
|
{assets.loading && !inspection.loading && (
|
|
<p role="status">
|
|
Checking source files… {assets.items.length} checked
|
|
</p>
|
|
)}
|
|
{assets.error && (
|
|
<div role="alert">
|
|
<p>{assets.error}</p>
|
|
<Button variant="outline" onClick={assets.retry}>
|
|
Retry source check
|
|
</Button>
|
|
</div>
|
|
)}
|
|
{assets.items.some((item) => item.state === "unknown") && (
|
|
<p className="text-sm text-[var(--admin-warning)]">
|
|
Some sources could not be verified. The import will still try to
|
|
download their files.
|
|
</p>
|
|
)}
|
|
{unavailable.map((check) => (
|
|
<section
|
|
key={check.classname}
|
|
className="rounded-lg border border-[var(--admin-border)] p-3 space-y-2"
|
|
>
|
|
<p className="text-sm font-medium">
|
|
Source files not found by preliminary check: {check.classname}
|
|
</p>
|
|
<p className="text-xs text-[var(--admin-text-muted)]">
|
|
You can continue. The importer will try the original furniture
|
|
files and verify them before creating its SQL entry.
|
|
</p>
|
|
</section>
|
|
))}
|
|
{inspection.loading ? (
|
|
<p role="status">Checking local data and assets…</p>
|
|
) : inspection.error ? (
|
|
<div role="alert">
|
|
<p>{inspection.error}</p>
|
|
<Button variant="outline" onClick={inspection.retry}>
|
|
Retry inspection
|
|
</Button>
|
|
</div>
|
|
) : !complete ? (
|
|
<p role="alert">
|
|
Inspection is incomplete. Close and retry before importing.
|
|
</p>
|
|
) : (
|
|
<>
|
|
<p role="status" className="text-sm">
|
|
{ready.length} ready to import · {existing} already in SQL
|
|
(complete missing data) · {blocked} conflicts ·{" "}
|
|
{unavailable.length} source file warnings
|
|
</p>
|
|
{inspection.items.some(
|
|
(item) =>
|
|
!item.furnidataReadable ||
|
|
item.icon.exists === null ||
|
|
item.nitro.exists === null,
|
|
) && (
|
|
<p className="text-sm text-[var(--admin-warning)]">
|
|
Some local files could not be verified. Review the item
|
|
details before continuing.
|
|
</p>
|
|
)}
|
|
{step === "review" ? (
|
|
<div className="space-y-2">
|
|
{pageItems.map((item) => {
|
|
const local = localByName.get(item.classname);
|
|
if (!local) return null;
|
|
const comparison = compareFurniture(item, local);
|
|
return (
|
|
<div
|
|
key={item.classname}
|
|
className="rounded-lg border border-[var(--admin-border)]"
|
|
>
|
|
<button
|
|
type="button"
|
|
aria-expanded={expanded === item.classname}
|
|
onClick={() =>
|
|
setExpanded(
|
|
expanded === item.classname ? "" : item.classname,
|
|
)
|
|
}
|
|
className="flex min-h-11 w-full items-center justify-between gap-3 p-3 text-left text-sm"
|
|
>
|
|
<span className="min-w-0 break-words">
|
|
{item.name}
|
|
<span className="block text-xs text-[var(--admin-text-muted)]">
|
|
{item.classname}
|
|
</span>
|
|
</span>
|
|
<span>
|
|
{comparison.state === "new"
|
|
? "New"
|
|
: comparison.state === "changed"
|
|
? "Differences"
|
|
: comparison.state === "conflict"
|
|
? "Conflict"
|
|
: comparison.state === "unknown"
|
|
? "Not fully verified"
|
|
: "Present"}
|
|
</span>
|
|
</button>
|
|
{expanded === item.classname && (
|
|
<div className="border-t border-[var(--admin-border)] p-3">
|
|
<FurnitureComparison item={item} local={local} />
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
})}
|
|
</div>
|
|
) : (
|
|
<>
|
|
<p className="text-sm">
|
|
Only the {ready.length} eligible items below will be
|
|
submitted. Existing furniture keeps its local IDs, SQL
|
|
settings and catalog offers. Missing assets and catalog
|
|
entries are completed; furnidata is refreshed. Conflicts are
|
|
excluded.
|
|
</p>
|
|
<p className="text-xs text-[var(--admin-text-muted)]">
|
|
Automatic categories and prices below are estimates. Source
|
|
rules may override them; final results appear in the import
|
|
summary.
|
|
</p>
|
|
<ul className="space-y-2">
|
|
{pageItems.map((item) => {
|
|
const placement = previewAutoCatalog(
|
|
item.classname,
|
|
item.type,
|
|
);
|
|
return (
|
|
<li
|
|
key={item.classname}
|
|
className="rounded-md border border-[var(--admin-border)] p-2 text-sm"
|
|
>
|
|
<strong>{item.name}</strong>
|
|
<p>
|
|
{placement.categoryLabel} · {placement.credits}{" "}
|
|
credits + {placement.points} points
|
|
</p>
|
|
</li>
|
|
);
|
|
})}
|
|
</ul>
|
|
</>
|
|
)}
|
|
</>
|
|
)}
|
|
</div>
|
|
{!inspection.loading && !inspection.error && pageCount > 1 && (
|
|
<div className="flex items-center justify-between gap-2 text-sm">
|
|
<Button
|
|
variant="outline"
|
|
disabled={page === 0}
|
|
onClick={() => setPage((value) => value - 1)}
|
|
>
|
|
Previous items
|
|
</Button>
|
|
<span>
|
|
Page {page + 1} / {pageCount}
|
|
</span>
|
|
<Button
|
|
variant="outline"
|
|
disabled={page + 1 === pageCount}
|
|
onClick={() => setPage((value) => value + 1)}
|
|
>
|
|
Next items
|
|
</Button>
|
|
</div>
|
|
)}
|
|
<DialogFooter>
|
|
<Button
|
|
variant="outline"
|
|
onClick={
|
|
step === "confirm"
|
|
? () => {
|
|
setStep("review");
|
|
setPage(0);
|
|
}
|
|
: onCancel
|
|
}
|
|
>
|
|
{step === "confirm" ? "Back to review" : "Cancel"}
|
|
</Button>
|
|
<Button
|
|
style={{
|
|
backgroundColor: "var(--admin-accent)",
|
|
color: "var(--admin-accent-foreground)",
|
|
}}
|
|
disabled={
|
|
inspection.loading ||
|
|
!!inspection.error ||
|
|
!complete ||
|
|
ready.length === 0
|
|
}
|
|
onClick={() => {
|
|
if (step === "review") {
|
|
setStep("confirm");
|
|
setPage(0);
|
|
} else onConfirm(ready);
|
|
}}
|
|
>
|
|
{step === "review"
|
|
? "Continue to confirmation"
|
|
: `Start import (${ready.length})`}
|
|
</Button>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|