mirror of
https://github.com/christianvidalwolf-prog/Craze-Data-check.git
synced 2026-08-03 13:05:25 +02:00
feat: short description AI targeting 30% length + checkbox sync for near-duplicate dimensions
- EditPanel: short description prompts now target ~30% of the long description character count, preserving key highlights as flowing prose - DimensionsView: near-duplicate clusters expanded view replaced with a flat checkbox list (SKU + name + current dims per row), a target-dimension dropdown, and a "Sync N selected" button that unifies inner dimensions across selected products via ConfirmModal Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Christian Vidal Wolf
co-authored by
Claude Sonnet 4.6
Claude Sonnet 4.6
parent
24042a6aed
commit
8fa001c6ed
@@ -296,7 +296,12 @@ export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureStat
|
||||
{nearDuplicateClusters.length} cluster{nearDuplicateClusters.length !== 1 ? 's' : ''} with dimensions differing <1 cm per axis
|
||||
</span>
|
||||
</div>
|
||||
{nearDuplicateClusters.map((cluster, ci) => (
|
||||
{nearDuplicateClusters.map((cluster, ci) => {
|
||||
const allClusterRows = cluster.groups.flatMap(g => g.rows);
|
||||
const selection = clusterSelections[ci] ?? new Set<number>();
|
||||
const targetKey = clusterSyncTargets[ci] ?? cluster.groups[0].key;
|
||||
|
||||
return (
|
||||
<div key={ci} className="border border-violet-500/25 bg-violet-500/5 rounded-lg overflow-hidden">
|
||||
<button
|
||||
onClick={() => {
|
||||
@@ -307,38 +312,103 @@ export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureStat
|
||||
className="w-full flex items-center gap-4 p-3 hover:bg-violet-500/10 transition-colors text-left"
|
||||
>
|
||||
{expandedNearDuplicates.has(ci) ? <ChevronDown className="w-4 h-4 text-slate-500 shrink-0" /> : <ChevronRight className="w-4 h-4 text-slate-500 shrink-0" />}
|
||||
<div className="flex items-center gap-3 flex-wrap">
|
||||
<div className="flex items-center gap-3 flex-wrap flex-1">
|
||||
{cluster.groups.map((g, gi) => (
|
||||
<span key={g.key} className="font-mono text-xs text-violet-300 bg-violet-400/10 px-2 py-0.5 rounded">
|
||||
{g.key} cm
|
||||
<span className="text-slate-500 ml-1">({cluster.volumes[gi].toLocaleString()} cm³)</span>
|
||||
</span>
|
||||
))}
|
||||
<span className="text-xs text-violet-400/70">
|
||||
— max diff {cluster.maxDiffPct.toFixed(1)} cm
|
||||
</span>
|
||||
<span className="text-xs text-violet-400/70">— max diff {cluster.maxDiffPct.toFixed(1)} cm</span>
|
||||
</div>
|
||||
<span className="text-xs text-slate-500 shrink-0">{allClusterRows.length} products</span>
|
||||
</button>
|
||||
|
||||
{expandedNearDuplicates.has(ci) && (
|
||||
<div className="border-t border-violet-500/20 px-4 py-3 space-y-2">
|
||||
{cluster.groups.map((g, gi) => (
|
||||
<div key={g.key} className="flex items-start gap-4 text-xs">
|
||||
<span className="font-mono text-violet-300 w-32 shrink-0 pt-0.5">{g.key} cm</span>
|
||||
<div>
|
||||
<span className="text-slate-400">{cluster.volumes[gi].toLocaleString()} cm³</span>
|
||||
<span className="text-slate-600 mx-2">·</span>
|
||||
<span className="text-slate-500">{g.rows.length} product{g.rows.length !== 1 ? 's' : ''}: </span>
|
||||
<span className="text-slate-400">
|
||||
{g.rows.slice(0, 5).map(r => r.row[COLUMNS.ARTICLE_NO]).join(', ')}
|
||||
{g.rows.length > 5 && <span className="text-slate-600"> +{g.rows.length - 5} more</span>}
|
||||
<div className="border-t border-violet-500/20">
|
||||
{/* Sync toolbar */}
|
||||
<div className="flex items-center gap-3 px-4 py-2.5 bg-violet-500/5 border-b border-violet-500/10 flex-wrap">
|
||||
<span className="text-xs text-slate-400">Sync selected to:</span>
|
||||
<select
|
||||
value={targetKey}
|
||||
onChange={e => setClusterSyncTargets(prev => ({ ...prev, [ci]: e.target.value }))}
|
||||
className="bg-slate-800 border border-slate-700 rounded px-2 py-1 text-xs text-white focus:outline-none focus:border-violet-500"
|
||||
>
|
||||
{cluster.groups.map(g => {
|
||||
const repr = g.rows[0].row;
|
||||
return (
|
||||
<option key={g.key} value={g.key}>
|
||||
{repr[COLUMNS.INNER_L]} × {repr[COLUMNS.INNER_W]} × {repr[COLUMNS.INNER_H]} cm
|
||||
</option>
|
||||
);
|
||||
})}
|
||||
</select>
|
||||
<button
|
||||
disabled={selection.size === 0}
|
||||
onClick={() => setPendingNearDupSync({ clusterIndex: ci, targetGroupKey: targetKey, selectedIndices: Array.from(selection) })}
|
||||
className="flex items-center gap-1.5 px-3 py-1 bg-violet-600/20 text-violet-400 hover:bg-violet-600 hover:text-white rounded text-xs font-medium transition-colors disabled:opacity-40 disabled:cursor-not-allowed"
|
||||
>
|
||||
<Layers className="w-3 h-3" />
|
||||
Sync {selection.size} selected
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setClusterSelections(prev => ({ ...prev, [ci]: new Set(allClusterRows.map(r => r.index)) }))}
|
||||
className="text-xs text-slate-500 hover:text-slate-300 transition-colors"
|
||||
>
|
||||
Select all
|
||||
</button>
|
||||
{selection.size > 0 && (
|
||||
<button
|
||||
onClick={() => setClusterSelections(prev => ({ ...prev, [ci]: new Set() }))}
|
||||
className="text-xs text-slate-500 hover:text-slate-300 transition-colors"
|
||||
>
|
||||
Clear
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Flat product list */}
|
||||
<div className="divide-y divide-violet-500/10">
|
||||
{allClusterRows.map(({ row, index }) => {
|
||||
const isSelected = selection.has(index);
|
||||
return (
|
||||
<div
|
||||
key={index}
|
||||
className={cn(
|
||||
"flex items-center gap-3 px-4 py-2.5 hover:bg-violet-500/5 cursor-pointer transition-colors",
|
||||
isSelected && "bg-violet-500/10"
|
||||
)}
|
||||
onClick={() => setClusterSelections(prev => {
|
||||
const current = new Set(prev[ci] ?? []);
|
||||
if (current.has(index)) current.delete(index); else current.add(index);
|
||||
return { ...prev, [ci]: current };
|
||||
})}
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={isSelected}
|
||||
onChange={() => {}}
|
||||
onClick={e => e.stopPropagation()}
|
||||
className="rounded border-slate-600 bg-slate-700 text-violet-600 focus:ring-violet-500 shrink-0"
|
||||
/>
|
||||
<div className="flex-1 min-w-0">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="font-mono text-xs text-slate-300 font-medium shrink-0">{row[COLUMNS.ARTICLE_NO]}</span>
|
||||
<span className="text-xs text-slate-500 truncate">{row[COLUMNS.ARTICLE_NAME]}</span>
|
||||
</div>
|
||||
</div>
|
||||
<span className="font-mono text-xs text-violet-300 bg-violet-400/10 px-2 py-0.5 rounded shrink-0">
|
||||
{row[COLUMNS.INNER_L]} × {row[COLUMNS.INNER_W]} × {row[COLUMNS.INNER_H]} cm
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -523,6 +593,16 @@ export function DimensionsView({ data, headers, onEdit, onSaveRow, onCaptureStat
|
||||
type="warning"
|
||||
confirmText="Sync Group"
|
||||
/>
|
||||
|
||||
<ConfirmModal
|
||||
isOpen={!!pendingNearDupSync}
|
||||
onConfirm={executeNearDupSync}
|
||||
onCancel={() => setPendingNearDupSync(null)}
|
||||
title="Sync Inner Dimensions"
|
||||
message={`Update inner dimensions to ${pendingNearDupSync?.targetGroupKey} cm for ${pendingNearDupSync?.selectedIndices.length} selected product${(pendingNearDupSync?.selectedIndices.length ?? 0) !== 1 ? 's' : ''}?`}
|
||||
type="warning"
|
||||
confirmText="Sync Dimensions"
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user