bede/tfm_ainventory
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Build [v1.14.31]

Browse Source
This commit is contained in:
Daniel Bedeleanu
2026-04-25 12:53:41 +03:00
parent d0f166a370
commit de8c5c7135
42 changed files with 441 additions and 354 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
frontend/components/StockAdjustmentPanel.tsx
View File

@@ -63,12 +63,12 @@ export default function StockAdjustmentPanel({
return (
<div data-testid="stock-adjustment-form" className="fixed inset-0 z-50 flex items-end sm:items-center justify-center p-4 bg-background/80 animate-in fade-in duration-200">
<div className="w-full max-w-lg bg-surface border border-slate-800 rounded-[2.5rem] shadow-2xl p-4 md:p-6 overflow-hidden animate-in slide-in-from-bottom-10 duration-300">
<div className="w-full max-w-lg bg-surface border border-border rounded-none shadow-none p-4 md:p-6 overflow-hidden animate-in slide-in-from-bottom-10 duration-300">
<div className="flex justify-between items-center mb-3 md:mb-4">
<h3 className="text-xl font-normal tracking-tight flex items-center gap-2">
<span data-testid="adjustment-item-name">{isEditing ? "Edit Metadata" : selectedItem.name}</span>
{!isEditing && (
<span data-testid="current-quantity" className="text-[11px] bg-slate-800 text-secondary px-2 py-0.5 rounded-md font-normal tracking-tight shadow-sm border border-slate-700/50">
<span data-testid="current-quantity" className="text-[11px] bg-surface-bright text-secondary px-2 py-0.5 rounded-none font-normal tracking-tight shadow-none border border-border/50">
In Stock: {selectedItem.quantity}
</span>
)}
@@ -77,7 +77,7 @@ export default function StockAdjustmentPanel({
{!isEditing && (
<button
onClick={() => onEdit(selectedItem)}
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-slate-800 rounded-full text-secondary"
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-surface-bright rounded-none text-secondary"
>
<Edit2 size={20} />
</button>
@@ -85,7 +85,7 @@ export default function StockAdjustmentPanel({
{isEditing && (
<button
onClick={onDeleteItem}
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-red-500/20 rounded-full text-red-500"
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-red-500/20 rounded-none text-red-500"
>
<Trash2 size={20} />
</button>
@@ -93,7 +93,7 @@ export default function StockAdjustmentPanel({
<button
onClick={onCancel}
data-testid="adjustment-cancel"
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-slate-800 rounded-full"
className="p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 hover:bg-surface-bright rounded-none"
>
<X size={20} />
</button>
@@ -103,7 +103,7 @@ export default function StockAdjustmentPanel({
{isEditing ? (
<div className="space-y-2 md:space-y-3 mb-4 md:mb-6">
<div>
<div className="bg-surface py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
<div className="bg-surface py-2.5 px-4 rounded-none border border-border focus-within:border-primary/50 transition-colors group">
<label className="text-xs text-secondary font-normal mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight">Item Name</label>
<textarea
value={editedItem.name || ''}
@@ -119,7 +119,7 @@ export default function StockAdjustmentPanel({
type="text"
value={editedItem.part_number || ''}
onChange={e => onEditChange({ ...editedItem, part_number: e.target.value })}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl font-mono outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl font-mono outline-none text-secondary"
placeholder="e.g. PN-12345"
/>
</div>
@@ -131,7 +131,7 @@ export default function StockAdjustmentPanel({
list="existing-categories"
value={editedItem.category || ''}
onChange={e => onEditChange({ ...editedItem, category: e.target.value })}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary placeholder:text-muted"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary placeholder:text-muted"
placeholder="e.g. storage"
/>
<datalist id="existing-categories">
@@ -147,7 +147,7 @@ export default function StockAdjustmentPanel({
list="existing-types"
value={editedItem.type || ''}
onChange={e => onEditChange({...editedItem, type: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
placeholder="e.g. spare parts"
/>
</div>
@@ -159,7 +159,7 @@ export default function StockAdjustmentPanel({
list="existing-boxes"
value={editedItem.box_label || ''}
onChange={e => onEditChange({...editedItem, box_label: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 pl-4 pr-12 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary placeholder:text-muted focus:border-primary transition-colors"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 pl-4 pr-12 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary placeholder:text-muted focus:border-primary transition-colors"
placeholder="e.g. SFPs 40G Cisco"
/>
<button
@@ -169,8 +169,8 @@ export default function StockAdjustmentPanel({
toast.success("Scanning for BOX label...");
}}
className={cn(
"absolute right-2 p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 rounded-lg transition-all",
fieldScanning?.active ? "bg-primary text-white animate-pulse" : "text-muted hover:bg-slate-800"
"absolute right-2 p-2 lg:p-3 xl:p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 rounded-none transition-all",
fieldScanning?.active ? "bg-primary text-white animate-pulse" : "text-muted hover:bg-surface-bright"
)}
>
<Camera size={18} />
@@ -183,7 +183,7 @@ export default function StockAdjustmentPanel({
type="text"
value={editedItem.connector || ''}
onChange={e => onEditChange({...editedItem, connector: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
placeholder="e.g. LC/UPC"
/>
</div>
@@ -193,7 +193,7 @@ export default function StockAdjustmentPanel({
type="text"
value={editedItem.size || ''}
onChange={e => onEditChange({...editedItem, size: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
placeholder="e.g. 5m / 1600GB"
/>
</div>
@@ -203,7 +203,7 @@ export default function StockAdjustmentPanel({
type="text"
value={editedItem.color || ''}
onChange={e => onEditChange({...editedItem, color: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
placeholder="e.g. Black"
/>
</div>
@@ -212,16 +212,16 @@ export default function StockAdjustmentPanel({
<textarea
value={editedItem.description || ''}
onChange={e => onEditChange({ ...editedItem, description: e.target.value })}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary resize-none h-20"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary resize-none h-20"
placeholder="Item description..."
/>
</div>
<div className="bg-surface py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
<div className="bg-surface py-2.5 px-4 rounded-none border border-border focus-within:border-primary/50 transition-colors group">
<label className="text-xs text-secondary font-normal mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight">Item ID or Code</label>
<textarea
value={editedItem.ocr_text || ''}
onChange={e => onEditChange({ ...editedItem, ocr_text: e.target.value })}
className="w-full bg-background border border-slate-800 rounded-xl py-3 px-4 text-sm font-normal outline-none text-secondary resize-none h-12"
className="w-full bg-background border border-border rounded-none py-3 px-4 text-sm font-normal outline-none text-secondary resize-none h-12"
placeholder="e.g., SKU-12345 or barcode text..."
/>
</div>
@@ -229,7 +229,7 @@ export default function StockAdjustmentPanel({
</div>
) : (
<>
<div className="flex p-1 bg-background rounded-2xl mb-4 md:mb-6">
<div className="flex p-1 bg-background rounded-none mb-4 md:mb-6">
{[
{ id: 'ADD', label: 'Buy More', icon: Plus, color: 'text-primary' },
{ id: 'REMOVE', label: 'Subtract', icon: Minus, color: 'text-amber-500' },
@@ -239,8 +239,8 @@ export default function StockAdjustmentPanel({
key={t.id}
onClick={() => onTypeChange(t.id as 'ADD' | 'REMOVE' | 'TRASH')}
className={cn(
"flex-1 flex flex-col items-center py-3 lg:py-4 xl:py-5 rounded-xl transition-all",
adjustType === t.id ? "bg-slate-800 shadow-lg" : "text-muted"
"flex-1 flex flex-col items-center py-3 lg:py-4 xl:py-5 rounded-none transition-all",
adjustType === t.id ? "bg-surface-bright shadow-none" : "text-muted"
)}
>
<t.icon size={20} className={adjustType === t.id ? t.color : ""} />
@@ -253,7 +253,7 @@ export default function StockAdjustmentPanel({
<div className="flex items-center gap-2 md:gap-4">
<button
onClick={() => onQuantityChange(Math.max(1, adjustQty - 1))}
className="w-12 h-12 rounded-full border border-slate-800 flex items-center justify-center text-secondary active:bg-slate-800"
className="w-12 h-12 rounded-none border border-border flex items-center justify-center text-secondary active:bg-surface-bright"
>
<Minus size={24} />
</button>
@@ -263,14 +263,14 @@ export default function StockAdjustmentPanel({
</div>
<button
onClick={() => onQuantityChange(adjustQty + 1)}
className="w-12 h-12 rounded-full border border-slate-800 flex items-center justify-center text-secondary active:bg-slate-800"
className="w-12 h-12 rounded-none border border-border flex items-center justify-center text-secondary active:bg-surface-bright"
>
<Plus size={24} />
</button>
</div>
{adjustType === 'TRASH' && (
<div className="w-full bg-red-500/5 border border-red-500/20 p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 rounded-2xl animate-in shake duration-500">
<div className="w-full bg-red-500/5 border border-red-500/20 p-4 lg:p-5 xl:p-6 lg:p-8 xl:p-10 rounded-none animate-in shake duration-500">
<div className="flex items-center gap-2 mb-3">
<AlertTriangle size={16} className="text-red-500" />
<span className="text-sm font-normal text-red-400">Waste Declaration</span>
@@ -278,7 +278,7 @@ export default function StockAdjustmentPanel({
<select
value={trashReason}
onChange={(e) => onReasonChange(e.target.value)}
className="w-full bg-background border border-slate-800 rounded-xl py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
className="w-full bg-background border border-border rounded-none py-3 lg:py-4 xl:py-5 px-4 lg:px-5 xl:px-6 text-sm lg:text-base xl:text-lg lg:text-xl xl:text-2xl lg:text-3xl xl:text-4xl outline-none text-secondary"
>
<option>Damaged</option>
<option>Expired</option>
@@ -296,11 +296,11 @@ export default function StockAdjustmentPanel({
onClick={isEditing ? onUpdateItem : onAdjustStock}
data-testid="adjustment-submit"
className={cn(
"w-full py-5 rounded-[1.8rem] font-normal text-lg transition-all active:scale-[0.98] shadow-2xl",
"w-full py-5 rounded-none font-normal text-lg transition-all active:scale-[0.98] shadow-none",
isEditing ? "bg-slate-100 text-slate-900" : (
adjustType === 'ADD' ? "bg-primary shadow-primary/20 text-white" :
adjustType === 'REMOVE' ? "bg-amber-600 shadow-amber-500/20 text-white" :
"bg-red-600 shadow-red-500/20 text-white"
adjustType === 'ADD' ? "bg-primary shadow-none text-white" :
adjustType === 'REMOVE' ? "bg-amber-600 shadow-none text-white" :
"bg-red-600 shadow-none text-white"
)
)}
>