Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 757e9a7aa7 | |||
| 79e3152ce8 | |||
| be251c8a40 | |||
| 019b941bdb | |||
| 2d162ff3c0 |
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"version": "1.10.2",
|
||||
"last_build": "2026-04-15-1754",
|
||||
"codename": "ModularAdmin",
|
||||
"commit": "d9e592cc"
|
||||
"version": "1.10.8",
|
||||
"last_build": "2026-04-15-1948",
|
||||
"codename": "AccessibleUI",
|
||||
"commit": "79e3152c"
|
||||
}
|
||||
@@ -252,10 +252,10 @@ export default function InventoryPage() {
|
||||
<div className="p-3 md:p-4 bg-primary/10 rounded-3xl text-primary border border-primary/20 shadow-xl shadow-primary/5">
|
||||
<Package size={28} className="md:w-8 md:h-8" />
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-2xl md:text-3xl font-black tracking-tight text-white leading-tight">Inventory Catalog</h1>
|
||||
<p className="text-[10px] md:text-xs text-slate-500 font-bold mt-0.5">Enterprise Stock Overview</p>
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-2xl md:text-3xl font-black tracking-tight text-white leading-tight">Inventory Catalog</h1>
|
||||
<p className="text-xs md:text-sm text-slate-400 font-bold mt-1 uppercase tracking-widest">Enterprise Stock Overview</p>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setShowBoxManager(true)}
|
||||
className="ml-auto p-3 bg-slate-900 border border-slate-800 text-slate-400 rounded-2xl hover:text-primary transition-all active:scale-95 shadow-xl"
|
||||
@@ -311,12 +311,12 @@ export default function InventoryPage() {
|
||||
<div className="w-10 h-10 rounded-2xl bg-primary/10 flex items-center justify-center text-primary transition-colors">
|
||||
<Layers size={20} />
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<h3 className="font-bold text-lg">{cat}</h3>
|
||||
<p className="text-[9px] font-black text-slate-400">
|
||||
{inventory.filter(i => i.category === cat).length} Item types in stock
|
||||
</p>
|
||||
</div>
|
||||
<div className="text-left">
|
||||
<h3 className="font-bold text-lg">{cat}</h3>
|
||||
<p className="text-xs font-bold text-slate-400 mt-1 uppercase tracking-tight">
|
||||
{inventory.filter(i => i.category === cat).length} Item types in stock
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
{expandedCategory === cat ? <ChevronDown size={20} className="text-primary" /> : <ChevronRight size={20} className="text-slate-600" />}
|
||||
@@ -353,20 +353,20 @@ export default function InventoryPage() {
|
||||
<div className="w-8 h-8 rounded-xl bg-green-500/10 flex items-center justify-center text-green-500 shrink-0">
|
||||
<Package size={14} />
|
||||
</div>
|
||||
<div className="truncate">
|
||||
<h4 className="font-bold text-slate-200 truncate">{item.name}</h4>
|
||||
<p className="text-[10px] text-slate-500 truncate mt-0.5">{item.specs}</p>
|
||||
</div>
|
||||
<div className="truncate">
|
||||
<h4 className="font-bold text-slate-200 truncate">{item.name}</h4>
|
||||
<p className="text-xs text-slate-400 truncate mt-1">{item.specs}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-right shrink-0">
|
||||
<span className={cn(
|
||||
"text-lg font-black",
|
||||
item.quantity <= item.min_quantity ? "text-amber-500" : "text-primary"
|
||||
)}>
|
||||
{item.quantity}
|
||||
</span>
|
||||
<p className="text-xs text-slate-600 font-bold">Stock</p>
|
||||
</div>
|
||||
{item.quantity}
|
||||
</span>
|
||||
<p className="text-sm text-slate-500 font-bold uppercase tracking-tight">Stock</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
@@ -389,12 +389,12 @@ export default function InventoryPage() {
|
||||
<div className="w-full max-w-lg bg-slate-900 border-x border-t sm:border border-slate-800 rounded-t-[2.5rem] sm:rounded-[2.5rem] shadow-2xl p-5 sm:p-8 overflow-hidden animate-in slide-in-from-bottom-10 duration-300">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h3 className="text-xl font-black tracking-tight flex items-center gap-2">
|
||||
{isEditing ? "Edit Item" : selectedItem.name}
|
||||
{!isEditing && (
|
||||
<span className="text-[10px] bg-slate-800 text-slate-400 px-2 py-0.5 rounded-md font-black uppercase">
|
||||
In Stock: {selectedItem.quantity}
|
||||
</span>
|
||||
)}
|
||||
{isEditing ? "Edit Item" : selectedItem.name}
|
||||
{!isEditing && (
|
||||
<span className="text-xs bg-slate-800 text-slate-300 px-3 py-1 rounded-lg font-bold uppercase tracking-tight">
|
||||
In Stock: {selectedItem.quantity}
|
||||
</span>
|
||||
)}
|
||||
</h3>
|
||||
<div className="flex gap-2">
|
||||
{!isEditing && (
|
||||
@@ -431,8 +431,8 @@ export default function InventoryPage() {
|
||||
|
||||
{isEditing ? (
|
||||
<div className="max-h-[60vh] overflow-y-auto pr-2 space-y-4 mb-6 scrollbar-hide">
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Item Name</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Item Name</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.name || ''}
|
||||
@@ -440,8 +440,8 @@ export default function InventoryPage() {
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-xl py-3 px-4 text-sm font-bold outline-none text-slate-100 placeholder:text-slate-700"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Part Number</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Part Number</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.part_number || ''}
|
||||
@@ -450,8 +450,8 @@ export default function InventoryPage() {
|
||||
/>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Category</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Category</label>
|
||||
<input
|
||||
type="text"
|
||||
list="existing-categories"
|
||||
@@ -466,8 +466,8 @@ export default function InventoryPage() {
|
||||
))}
|
||||
</datalist>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Item Type</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Item Type</label>
|
||||
<input
|
||||
type="text"
|
||||
list="existing-types"
|
||||
@@ -476,8 +476,8 @@ export default function InventoryPage() {
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-xl py-3 px-4 text-sm font-bold outline-none text-slate-100"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Connector</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Connector</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.connector || ''}
|
||||
@@ -486,8 +486,8 @@ export default function InventoryPage() {
|
||||
placeholder="e.g. LC/UPC"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Size / Length</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Size / Length</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.size || ''}
|
||||
@@ -496,8 +496,8 @@ export default function InventoryPage() {
|
||||
placeholder="e.g. 1.6TB"
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Item Color</label>
|
||||
<div className="col-span-2">
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Item Color</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.color || ''}
|
||||
@@ -506,8 +506,8 @@ export default function InventoryPage() {
|
||||
placeholder="e.g. Blue"
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Box / Container Label</label>
|
||||
<div className="col-span-2">
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Box / Container Label</label>
|
||||
<div className="relative flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
@@ -534,16 +534,16 @@ export default function InventoryPage() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">Specs / Comments</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Specs / Comments</label>
|
||||
<textarea
|
||||
value={editedItem.specs || ''}
|
||||
onChange={e => setEditedItem({...editedItem, specs: e.target.value})}
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-xl py-3 px-4 text-sm font-bold outline-none text-slate-100 h-20 resize-none"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-[11px] font-black text-slate-500 ml-1 uppercase tracking-wider">OCR Matching Key</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">OCR Matching Key</label>
|
||||
<textarea
|
||||
value={editedItem.ocr_text || ''}
|
||||
onChange={e => setEditedItem({...editedItem, ocr_text: e.target.value})}
|
||||
@@ -567,9 +567,9 @@ export default function InventoryPage() {
|
||||
adjustType === t.id ? "bg-slate-800 shadow-lg" : "text-slate-500"
|
||||
)}
|
||||
>
|
||||
<t.icon size={20} className={adjustType === t.id ? t.color : ""} />
|
||||
<span className="text-xs font-black mt-1">{t.label}</span>
|
||||
</button>
|
||||
<t.icon size={20} className={adjustType === t.id ? t.color : ""} />
|
||||
<span className="text-sm font-bold mt-1.5 uppercase tracking-tight">{t.label}</span>
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
@@ -641,8 +641,8 @@ export default function InventoryPage() {
|
||||
</div>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1">Name</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Name</label>
|
||||
<input
|
||||
type="text"
|
||||
value={catEditedName}
|
||||
@@ -650,8 +650,8 @@ export default function InventoryPage() {
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-xl py-3 px-4 text-sm outline-none text-slate-100"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1">Description</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 uppercase tracking-tight">Description</label>
|
||||
<textarea
|
||||
value={catEditedDesc}
|
||||
onChange={e => setCatEditedDesc(e.target.value)}
|
||||
@@ -736,18 +736,18 @@ export default function InventoryPage() {
|
||||
<p className="text-xs text-slate-500 font-bold mt-0.5">{itemCount} items linked</p>
|
||||
</div>
|
||||
<div className="flex gap-2 shrink-0">
|
||||
<button
|
||||
onClick={() => setSelectedBoxLabel(box)}
|
||||
className="flex-1 py-3 bg-primary text-white text-[11px] font-black rounded-xl flex items-center justify-center gap-2 hover:bg-blue-500 transition-colors shadow-lg shadow-primary/10 active:scale-95"
|
||||
>
|
||||
<Printer size={14} /> Print Label
|
||||
</button>
|
||||
<button
|
||||
onClick={() => { setSearchQuery(box); setShowBoxManager(false); setBoxSearchQuery(''); }}
|
||||
className="px-4 py-3 bg-slate-900 border border-slate-800 text-slate-400 text-[11px] font-bold rounded-xl hover:bg-slate-800 active:scale-95"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setSelectedBoxLabel(box)}
|
||||
className="flex-1 py-3 bg-primary text-white text-xs font-black rounded-xl flex items-center justify-center gap-2 hover:bg-blue-500 transition-colors shadow-lg shadow-primary/10 active:scale-95"
|
||||
>
|
||||
<Printer size={14} /> Print Label
|
||||
</button>
|
||||
<button
|
||||
onClick={() => { setSearchQuery(box); setShowBoxManager(false); setBoxSearchQuery(''); }}
|
||||
className="px-4 py-3 bg-slate-900 border border-slate-800 text-slate-400 text-xs font-bold rounded-xl hover:bg-slate-800 active:scale-95"
|
||||
>
|
||||
View
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@@ -757,9 +757,9 @@ export default function InventoryPage() {
|
||||
</div>
|
||||
|
||||
<div className="p-6 py-4 bg-slate-950/50 border-t border-slate-800 text-center flex items-center justify-center gap-2">
|
||||
<div className="w-1 h-1 rounded-full bg-primary animate-pulse" />
|
||||
<p className="text-[10px] text-slate-500 font-bold font-mono">TFM aInventory • Box management mode</p>
|
||||
</div>
|
||||
<div className="w-1 h-1 rounded-full bg-primary animate-pulse" />
|
||||
<p className="text-xs text-slate-400 font-bold font-mono">TFM aInventory • Box management mode</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -775,11 +775,10 @@ export default function InventoryPage() {
|
||||
</h2>
|
||||
|
||||
<div className="w-full aspect-[2/1] bg-white flex flex-col items-center justify-center overflow-hidden" dangerouslySetInnerHTML={{ __html: generateBarcode128(selectedBoxLabel) }} />
|
||||
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<p className="text-[10px] font-black tracking-[0.2em] text-black/50">TFM INVENTORY BOX LABEL</p>
|
||||
<img src={getQRCodeURL(selectedBoxLabel)} className="w-24 h-24" alt="QR Code" />
|
||||
</div>
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<p className="text-xs font-black tracking-[0.2em] text-black/50">TFM INVENTORY BOX LABEL</p>
|
||||
<img src={getQRCodeURL(selectedBoxLabel)} className="w-24 h-24" alt="QR Code" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-col gap-3 no-print">
|
||||
|
||||
@@ -124,7 +124,7 @@ export default function LoginPage() {
|
||||
<div className="pt-2 grid grid-cols-2 gap-3">
|
||||
<button
|
||||
onClick={() => setIsEnterprise(true)}
|
||||
className="flex items-center justify-center gap-2 py-4 rounded-2xl border border-dashed border-slate-700 text-slate-500 hover:text-white hover:border-slate-500 transition-all font-bold text-[10px]"
|
||||
className="flex items-center justify-center gap-2 py-4 rounded-2xl border border-dashed border-slate-700 text-slate-500 hover:text-white hover:border-slate-500 transition-all font-bold text-xs"
|
||||
>
|
||||
<Lock size={12} />
|
||||
Enterprise
|
||||
@@ -134,7 +134,7 @@ export default function LoginPage() {
|
||||
setSelectedUserForLogin({ username: '' });
|
||||
// We use an empty username object to trigger the manual input view
|
||||
}}
|
||||
className="flex items-center justify-center gap-2 py-4 rounded-2xl border border-primary/20 bg-primary/5 text-primary hover:bg-primary/10 transition-all font-bold text-[10px]"
|
||||
className="flex items-center justify-center gap-2 py-4 rounded-2xl border border-primary/20 bg-primary/5 text-primary hover:bg-primary/10 transition-all font-bold text-xs"
|
||||
>
|
||||
<User size={12} />
|
||||
Manual Login
|
||||
|
||||
@@ -95,7 +95,7 @@ export default function LogsPage() {
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-2xl md:text-3xl font-black tracking-tight text-white leading-tight">Operations Audit</h1>
|
||||
<p className="text-[10px] md:text-xs text-slate-500 font-bold uppercase tracking-widest mt-0.5">Real-time Intervention Tracking</p>
|
||||
<p className="text-xs md:text-sm text-slate-400 font-bold uppercase tracking-widest mt-0.5">Real-time Intervention Tracking</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -103,7 +103,7 @@ export default function LogsPage() {
|
||||
<button
|
||||
onClick={loadData}
|
||||
disabled={loading}
|
||||
className="flex items-center gap-2 px-5 py-2.5 bg-slate-900 border border-slate-800 text-slate-400 hover:text-white rounded-2xl text-[10px] font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl"
|
||||
className="flex items-center gap-2 px-5 py-2.5 bg-slate-900 border border-slate-800 text-slate-400 hover:text-white rounded-2xl text-xs font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl"
|
||||
>
|
||||
<RefreshCw size={14} className={cn(loading && "animate-spin")} />
|
||||
Sync Logs
|
||||
@@ -153,10 +153,10 @@ export default function LogsPage() {
|
||||
<button
|
||||
onClick={() => setFilterAction('ALL')}
|
||||
className={cn(
|
||||
"px-5 py-2 rounded-full text-[10px] font-black transition-all whitespace-nowrap border uppercase tracking-widest",
|
||||
"px-5 py-2 rounded-full text-xs font-bold transition-all whitespace-nowrap border uppercase tracking-widest",
|
||||
filterAction === 'ALL'
|
||||
? "bg-white text-slate-950 border-white shadow-xl shadow-white/10"
|
||||
: "bg-slate-900/50 text-slate-500 border-slate-800 hover:border-slate-700"
|
||||
: "bg-slate-900/50 text-slate-400 border-slate-800 hover:border-slate-700"
|
||||
)}
|
||||
>
|
||||
All Streams
|
||||
@@ -166,10 +166,10 @@ export default function LogsPage() {
|
||||
key={f}
|
||||
onClick={() => setFilterAction(f)}
|
||||
className={cn(
|
||||
"px-5 py-2 rounded-full text-[10px] font-black transition-all whitespace-nowrap border uppercase tracking-widest",
|
||||
"px-5 py-2 rounded-full text-xs font-bold transition-all whitespace-nowrap border uppercase tracking-widest",
|
||||
filterAction === f
|
||||
? "bg-primary text-white border-primary shadow-xl shadow-primary/10"
|
||||
: "bg-slate-900/50 text-slate-500 border-slate-800 hover:border-slate-700"
|
||||
: "bg-slate-900/50 text-slate-400 border-slate-800 hover:border-slate-700"
|
||||
)}
|
||||
>
|
||||
{f}
|
||||
@@ -182,7 +182,7 @@ export default function LogsPage() {
|
||||
{loading ? (
|
||||
<div className="flex flex-col items-center justify-center py-32 text-slate-600 gap-4 animate-pulse">
|
||||
<div className="w-10 h-10 border-4 border-primary/20 border-t-primary rounded-full animate-spin" />
|
||||
<p className="text-[10px] font-black tracking-widest uppercase italic">Securing Audit Stream...</p>
|
||||
<p className="text-xs font-black tracking-widest uppercase italic">Securing Audit Stream...</p>
|
||||
</div>
|
||||
) : filteredLogs.length === 0 ? (
|
||||
<div className="bg-slate-900/20 border border-slate-800/50 border-dashed rounded-[2.5rem] py-20 flex flex-col items-center justify-center text-center gap-6">
|
||||
@@ -205,7 +205,7 @@ export default function LogsPage() {
|
||||
<div className="flex-1 min-w-0 z-10 flex items-center gap-4">
|
||||
{/* Compact Action Badge */}
|
||||
<div className={cn(
|
||||
"text-[8px] font-black px-2 py-1 rounded-lg border min-w-[75px] text-center uppercase tracking-tighter",
|
||||
"text-[10px] font-black px-3 py-1.5 rounded-lg border min-w-[85px] text-center uppercase tracking-tight",
|
||||
log.action.includes('CHECK_IN') ? "bg-green-500/10 text-green-500 border-green-500/20" :
|
||||
(log.action.includes('TRASH') ? "bg-rose-500/10 text-rose-500 border-rose-500/20" :
|
||||
(log.action.includes('DB') ? "bg-sky-500/10 text-sky-400 border-sky-500/20" :
|
||||
@@ -216,13 +216,13 @@ export default function LogsPage() {
|
||||
</div>
|
||||
|
||||
<div className="flex-1 min-w-0">
|
||||
<h3 className="text-sm font-bold text-slate-100 group-hover:text-primary transition-colors truncate">
|
||||
<h3 className="text-base font-bold text-slate-100 group-hover:text-primary transition-colors truncate">
|
||||
{log.resolved_name}
|
||||
</h3>
|
||||
<div className="flex items-center gap-2 mt-0.5">
|
||||
<span className="text-[9px] font-black text-slate-500 uppercase tracking-tighter shrink-0">{log.username || 'System'}</span>
|
||||
<span className="w-0.5 h-0.5 rounded-full bg-slate-800 shrink-0" />
|
||||
<span className="text-[9px] text-slate-600 font-bold tabular-nums truncate">
|
||||
<span className="text-[11px] font-bold text-slate-400 uppercase tracking-tight shrink-0">{log.username || 'System'}</span>
|
||||
<span className="w-1 h-1 rounded-full bg-slate-800 shrink-0" />
|
||||
<span className="text-[11px] text-slate-400 font-medium tabular-nums truncate">
|
||||
{new Date(log.timestamp).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })} · {new Date(log.timestamp).toLocaleDateString()}
|
||||
</span>
|
||||
</div>
|
||||
@@ -250,7 +250,7 @@ export default function LogsPage() {
|
||||
<div className="flex justify-between items-start">
|
||||
<div className="space-y-1 pr-4">
|
||||
<div className={cn(
|
||||
"text-[9px] font-black px-3 py-1 rounded-full border inline-block uppercase tracking-widest",
|
||||
"text-xs font-bold px-4 py-1.5 rounded-full border inline-block uppercase tracking-widest",
|
||||
selectedLog.action.includes('CHECK_IN') ? "bg-green-500/10 text-green-500 border-green-500/30" :
|
||||
(selectedLog.action.includes('TRASH') ? "bg-rose-500/10 text-rose-500 border-rose-500/30" : "bg-primary/10 text-primary border-primary/30")
|
||||
)}>
|
||||
@@ -267,11 +267,11 @@ export default function LogsPage() {
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="space-y-1 bg-slate-950/50 p-4 rounded-2xl border border-slate-800/50">
|
||||
<p className="text-[9px] font-black text-slate-600 uppercase tracking-widest">Protocol Operator</p>
|
||||
<p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">Protocol Operator</p>
|
||||
<p className="text-sm font-black text-slate-200">{selectedLog.username || 'Automated Process'}</p>
|
||||
</div>
|
||||
<div className="space-y-1 bg-slate-950/50 p-4 rounded-2xl border border-slate-800/50">
|
||||
<p className="text-[9px] font-black text-slate-600 uppercase tracking-widest">Quantity Delta</p>
|
||||
<p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest">Quantity Delta</p>
|
||||
<p className={cn(
|
||||
"text-xl font-black tabular-nums",
|
||||
(selectedLog.quantity_change || 0) > 0 ? "text-green-500" : "text-rose-500"
|
||||
@@ -285,7 +285,7 @@ export default function LogsPage() {
|
||||
|
||||
<div className="space-y-5">
|
||||
<div className="space-y-1">
|
||||
<p className="text-[9px] font-black text-slate-600 uppercase tracking-widest ml-1">Universal Timestamp</p>
|
||||
<p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest ml-1">Universal Timestamp</p>
|
||||
<p className="text-xs font-bold text-slate-400 bg-slate-950/30 p-4 rounded-2xl border border-slate-800/30 tabular-nums">
|
||||
{new Date(selectedLog.timestamp).toLocaleString(undefined, { dateStyle: 'full', timeStyle: 'medium' })}
|
||||
</p>
|
||||
@@ -305,8 +305,8 @@ export default function LogsPage() {
|
||||
{Object.entries(snap).map(([key, val]) => (
|
||||
(val && key !== 'image_url' && key !== 'id') ? (
|
||||
<div key={key} className="bg-slate-950/20 p-3 rounded-xl border border-slate-800/20">
|
||||
<p className="text-[7px] font-black text-slate-600 uppercase mb-1 tracking-tighter opacity-70">{key.replace('_', ' ')}</p>
|
||||
<p className="text-[10px] font-bold text-slate-400 truncate" title={String(val)}>{String(val)}</p>
|
||||
<p className="text-[10px] font-bold text-slate-500 uppercase mb-1 tracking-tight opacity-70">{key.replace('_', ' ')}</p>
|
||||
<p className="text-xs font-bold text-slate-300 truncate" title={String(val)}>{String(val)}</p>
|
||||
</div>
|
||||
) : null
|
||||
))}
|
||||
@@ -318,8 +318,8 @@ export default function LogsPage() {
|
||||
|
||||
{selectedLog.details && (
|
||||
<div className="space-y-1.5">
|
||||
<p className="text-[9px] font-black text-slate-600 uppercase tracking-widest ml-1">Intervention Details</p>
|
||||
<div className="bg-primary/5 text-primary/80 p-5 rounded-3xl border border-primary/10 text-xs font-bold leading-relaxed italic shadow-inner">
|
||||
<p className="text-[11px] font-bold text-slate-500 uppercase tracking-widest ml-1">Intervention Details</p>
|
||||
<div className="bg-primary/5 text-primary/80 p-5 rounded-3xl border border-primary/10 text-sm font-medium leading-relaxed italic shadow-inner">
|
||||
"{selectedLog.details}"
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -459,21 +459,8 @@ export default function Home() {
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-lg md:text-xl font-black tracking-normal text-white leading-none">
|
||||
TFM <span className="font-mono text-primary bg-primary/5 px-2 py-0.5 rounded-lg border border-primary/10 ml-1">aInventory</span>
|
||||
</h1>
|
||||
<div className="flex items-center gap-2 mt-1">
|
||||
<p className="text-xs font-bold text-slate-500 font-mono">
|
||||
Version {versionData.version}
|
||||
</p>
|
||||
<span className="w-1 h-1 rounded-full bg-slate-800" />
|
||||
<button
|
||||
className="text-xs font-black text-primary/80 hover:text-primary transition-colors flex items-center gap-1"
|
||||
>
|
||||
<User size={8} />
|
||||
{currentUser?.username || 'Guest'}
|
||||
</button>
|
||||
</div>
|
||||
<h1 className="text-2xl md:text-3xl font-black tracking-tight text-white leading-tight">Admin Control</h1>
|
||||
<p className="text-xs md:text-sm text-slate-400 font-bold tracking-tight mt-1 uppercase tracking-widest leading-relaxed">System Configuration & Security</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -482,14 +469,14 @@ export default function Home() {
|
||||
{isScannerReady && (
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-1.5 h-1.5 rounded-full bg-green-500 shadow-[0_0_8px_rgba(34,197,94,0.6)]" />
|
||||
<span className="text-[10px] sm:text-xs font-black text-green-500/90 whitespace-nowrap">
|
||||
<span className="text-xs font-black text-green-500/90 whitespace-nowrap">
|
||||
Scanner: OK
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex items-center gap-2">
|
||||
<div className={`w-1.5 h-1.5 rounded-full ${isOnline ? 'bg-green-500 animate-pulse shadow-[0_0_8px_rgba(34,197,94,0.6)]' : 'bg-rose-500 shadow-[0_0_8px_rgba(244,63,94,0.6)]'}`} />
|
||||
<span className={`text-[10px] sm:text-xs font-black whitespace-nowrap ${isOnline ? 'text-green-500/90' : 'text-rose-500/90'}`}>
|
||||
<span className={`text-xs font-black whitespace-nowrap ${isOnline ? 'text-green-500/90' : 'text-rose-500/90'}`}>
|
||||
Sync: {isOnline ? 'Active' : 'Offline'}
|
||||
</span>
|
||||
</div>
|
||||
@@ -534,11 +521,11 @@ export default function Home() {
|
||||
<div className="space-y-4">
|
||||
<div className="flex justify-between items-center">
|
||||
<h2 className="text-lg font-semibold">scanning...</h2>
|
||||
<button
|
||||
<button
|
||||
onClick={() => setShowScanner(false)}
|
||||
className="text-sm text-slate-400 hover:text-white"
|
||||
className="p-2.5 bg-slate-900 border border-slate-800 text-slate-400 rounded-xl hover:text-rose-500 transition-all active:scale-95"
|
||||
>
|
||||
Cancel
|
||||
<X size={18} />
|
||||
</button>
|
||||
</div>
|
||||
<Scanner onScanSuccess={onScanSuccess} onOCRMatch={onOCRMatch} />
|
||||
@@ -552,14 +539,7 @@ export default function Home() {
|
||||
<Smartphone className="w-10 h-10 text-primary group-hover:scale-110 transition-transform" />
|
||||
</button>
|
||||
|
||||
<div>
|
||||
<p className="text-lg font-medium">tap to start scanning</p>
|
||||
<p className="text-sm text-slate-400">Scan labels to {mode.replace('_', ' ')} items</p>
|
||||
</div>
|
||||
|
||||
<div className="w-full h-px bg-slate-800/50 my-2" />
|
||||
|
||||
<div className="w-full flex justify-center">
|
||||
<div className="w-full flex justify-center mt-4">
|
||||
<button
|
||||
onClick={() => setShowOnboarding(true)}
|
||||
className="w-full flex flex-col items-center justify-center p-8 rounded-[2rem] bg-indigo-500/5 border border-indigo-500/20 group hover:border-indigo-500/50 transition-all font-black text-indigo-400 gap-4"
|
||||
@@ -596,7 +576,7 @@ export default function Home() {
|
||||
<h3 className="text-xl font-black tracking-tight flex items-center gap-2">
|
||||
{isEditing ? "Edit Metadata" : selectedItem.name}
|
||||
{!isEditing && (
|
||||
<span className="text-[10px] bg-slate-800 text-slate-400 px-2 py-0.5 rounded-md font-black uppercase tracking-tight shadow-sm border border-slate-700/50">
|
||||
<span className="text-[11px] bg-slate-800 text-slate-400 px-2 py-0.5 rounded-md font-black uppercase tracking-tight shadow-sm border border-slate-700/50">
|
||||
In Stock: {selectedItem.quantity}
|
||||
</span>
|
||||
)}
|
||||
@@ -635,18 +615,19 @@ export default function Home() {
|
||||
|
||||
{isEditing ? (
|
||||
<div className="space-y-4 mb-8">
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Item Name</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.name || ''}
|
||||
onChange={e => setEditedItem({ ...editedItem, name: e.target.value })}
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-xl py-3 px-4 text-sm outline-none text-slate-100 placeholder-slate-700"
|
||||
placeholder="e.g. Solid State Drive"
|
||||
/>
|
||||
<div>
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-xs text-slate-400 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Name</label>
|
||||
<textarea
|
||||
value={editedItem.name || ''}
|
||||
onChange={(e) => setEditedItem({ ...editedItem, name: e.target.value })}
|
||||
className="bg-transparent w-full text-lg font-bold outline-none text-white placeholder:text-slate-700 resize-none h-8 leading-tight selection:bg-primary/30 py-0"
|
||||
placeholder="SSD, SFP, Cable..."
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Part Number</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Part Number</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.part_number || ''}
|
||||
@@ -656,8 +637,8 @@ export default function Home() {
|
||||
/>
|
||||
</div>
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Category Group</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Category Group</label>
|
||||
<input
|
||||
type="text"
|
||||
list="existing-categories"
|
||||
@@ -672,8 +653,8 @@ export default function Home() {
|
||||
))}
|
||||
</datalist>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Item Type</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Item Type</label>
|
||||
<input
|
||||
type="text"
|
||||
list="existing-types"
|
||||
@@ -683,8 +664,8 @@ export default function Home() {
|
||||
placeholder="e.g. spare parts"
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-xs font-black text-slate-500 ml-1">Box / Container Label</label>
|
||||
<div className="col-span-2">
|
||||
<label className="text-sm font-bold text-slate-400 ml-1">Box / Container Label</label>
|
||||
<div className="relative flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
@@ -710,8 +691,8 @@ export default function Home() {
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Connector</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Connector</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.connector || ''}
|
||||
@@ -720,8 +701,8 @@ export default function Home() {
|
||||
placeholder="e.g. LC/UPC"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Size / Length</label>
|
||||
<div>
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Size / Length</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.size || ''}
|
||||
@@ -730,8 +711,8 @@ export default function Home() {
|
||||
placeholder="e.g. 5m / 1600GB"
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">Item Color</label>
|
||||
<div className="col-span-2">
|
||||
<label className="text-sm font-bold text-slate-400 ml-1 tracking-tight">Item Color</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editedItem.color || ''}
|
||||
@@ -740,8 +721,8 @@ export default function Home() {
|
||||
placeholder="e.g. Black"
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-xs font-black text-slate-500 ml-1">Description</label>
|
||||
<div className="col-span-2">
|
||||
<label className="text-sm font-bold text-slate-400 ml-1">Description</label>
|
||||
<textarea
|
||||
value={editedItem.description || ''}
|
||||
onChange={e => setEditedItem({ ...editedItem, description: e.target.value })}
|
||||
@@ -749,8 +730,8 @@ export default function Home() {
|
||||
placeholder="Item description..."
|
||||
/>
|
||||
</div>
|
||||
<div className="col-span-2">
|
||||
<label className="text-xs font-black text-slate-500 ml-1 tracking-tight">OCR Matching Key</label>
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-xs text-slate-400 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">OCR Matching Key</label>
|
||||
<textarea
|
||||
value={editedItem.ocr_text || ''}
|
||||
onChange={e => setEditedItem({ ...editedItem, ocr_text: e.target.value })}
|
||||
@@ -792,8 +773,9 @@ export default function Home() {
|
||||
<Minus size={24} />
|
||||
</button>
|
||||
<div className="text-center">
|
||||
<span className="text-5xl font-black tabular-nums">{adjustQty}</span>
|
||||
</div>
|
||||
<span className="text-xs font-black tabular-nums">{zoom.toFixed(1)}x</span>
|
||||
<span className="text-[10px] text-primary/80 font-bold uppercase tracking-tight">Zoom</span>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setAdjustQty(adjustQty + 1)}
|
||||
className="w-12 h-12 rounded-full border border-slate-800 flex items-center justify-center text-slate-400 active:bg-slate-800"
|
||||
@@ -876,23 +858,19 @@ export default function Home() {
|
||||
className="w-full text-left bg-slate-950/50 hover:bg-slate-800 border border-slate-800/80 p-4 rounded-2xl flex items-center gap-4 transition-all active:scale-[0.98] group"
|
||||
>
|
||||
<div className="flex-1 min-w-0">
|
||||
<p className="text-sm font-black text-white group-hover:text-primary transition-colors truncate">{item.name}</p>
|
||||
<div className="flex items-center gap-2 mt-1">
|
||||
<span className="text-[10px] font-mono text-slate-500">{item.part_number}</span>
|
||||
<span className="w-1 h-1 rounded-full bg-slate-800" />
|
||||
<span className="text-[10px] font-bold text-slate-400">Stock: {item.quantity}</span>
|
||||
</div>
|
||||
<p className="text-sm font-black text-white italic text-center">Protocol Detected</p>
|
||||
<p className="text-xs text-slate-400 font-bold uppercase tracking-widest text-center mt-1">Select identity from label matrix</p>
|
||||
</div>
|
||||
<ChevronRight size={18} className="text-slate-600 group-hover:text-primary" />
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setBoxMatches([])}
|
||||
className="w-full py-4 mt-2 rounded-[1.5rem] font-black text-sm bg-slate-800 text-white hover:bg-slate-700 transition-colors shrink-0"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
onClick={handleLogin}
|
||||
className="w-full bg-primary text-white font-black py-5 rounded-[1.5rem] shadow-2xl shadow-primary/20 hover:shadow-primary/30 active:scale-95 transition-all uppercase text-xs tracking-widest border border-primary/20"
|
||||
>
|
||||
Initialize Session
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
@@ -902,7 +880,7 @@ export default function Home() {
|
||||
<footer className="mt-20 mb-8 flex flex-col items-center gap-2 opacity-30">
|
||||
<p className="text-xs font-bold">Powered by TFM Group Software</p>
|
||||
<div className="h-px w-12 bg-slate-800" />
|
||||
<p className="text-[9px] font-mono">v{versionData.version} • {versionData.last_build} • BUILD: dev-{(versionData as any).commit || 'N/A'}</p>
|
||||
<p className="text-[11px] font-mono text-slate-500">v{versionData.version} • {versionData.last_build} • BUILD: dev-{(versionData as any).commit || 'N/A'}</p>
|
||||
</footer>
|
||||
</div>
|
||||
</PageShell>
|
||||
|
||||
@@ -321,7 +321,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
</div>
|
||||
|
||||
<div className="absolute top-6 left-1/2 -translate-x-1/2 bg-black/60 backdrop-blur-md px-4 py-1.5 rounded-full border border-white/10">
|
||||
<span className="text-[10px] font-black text-white uppercase tracking-widest flex items-center gap-2">
|
||||
<span className="text-xs font-black text-white uppercase tracking-widest flex items-center gap-2">
|
||||
<div className="w-1.5 h-1.5 rounded-full bg-red-500 animate-pulse" />
|
||||
Live Viewfinder
|
||||
</span>
|
||||
@@ -395,7 +395,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
|
||||
<div className="flex-1 overflow-y-auto space-y-2 pr-1 scrollbar-hide">
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Name</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Name</label>
|
||||
<textarea
|
||||
value={extractedItems[editingIndex].Item || extractedItems[editingIndex].name || ''}
|
||||
onChange={(e) => updateEditingItem({ Item: e.target.value })}
|
||||
@@ -406,7 +406,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="bg-slate-900/80 py-3 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Category</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Category</label>
|
||||
<input
|
||||
type="text"
|
||||
list="onboarding-categories"
|
||||
@@ -422,7 +422,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
</datalist>
|
||||
</div>
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Type</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Type</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].Type || extractedItems[editingIndex].type || ''}
|
||||
list="onboarding-types"
|
||||
@@ -438,7 +438,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
<div className="bg-slate-900/80 py-3 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Color</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Item Color</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].Color || extractedItems[editingIndex].color || ''}
|
||||
onChange={(e) => updateEditingItem({ Color: e.target.value })}
|
||||
@@ -447,7 +447,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
/>
|
||||
</div>
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Box / Container</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Box / Container</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].box_label || ''}
|
||||
list="onboarding-boxes"
|
||||
@@ -462,7 +462,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Description</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Description</label>
|
||||
<textarea
|
||||
value={extractedItems[editingIndex].Description || extractedItems[editingIndex].description || ''}
|
||||
onChange={(e) => updateEditingItem({ Description: e.target.value })}
|
||||
@@ -473,7 +473,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
|
||||
<div className="grid grid-cols-2 gap-3">
|
||||
<div className="bg-slate-900/80 py-3 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Connector</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Connector</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].Connector || extractedItems[editingIndex].connector || ''}
|
||||
onChange={(e) => updateEditingItem({ Connector: e.target.value })}
|
||||
@@ -482,7 +482,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
/>
|
||||
</div>
|
||||
<div className="bg-slate-900/80 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Size / Length</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Size / Length</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].Size || extractedItems[editingIndex].size || ''}
|
||||
onChange={(e) => updateEditingItem({ Size: e.target.value })}
|
||||
@@ -493,7 +493,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
</div>
|
||||
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">OCR Matching Key</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">OCR Matching Key</label>
|
||||
<textarea
|
||||
value={extractedItems[editingIndex].OCR || extractedItems[editingIndex].ocr_text || ''}
|
||||
onChange={(e) => updateEditingItem({ OCR: e.target.value })}
|
||||
@@ -504,7 +504,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
|
||||
<div className="grid grid-cols-2 gap-2">
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Part Number</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors tracking-tight uppercase">Part Number</label>
|
||||
<input
|
||||
value={extractedItems[editingIndex].PartNr || extractedItems[editingIndex].part_number || ''}
|
||||
onChange={(e) => updateEditingItem({ PartNr: e.target.value })}
|
||||
@@ -513,7 +513,7 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
/>
|
||||
</div>
|
||||
<div className="bg-slate-900/80 py-2.5 px-4 rounded-[1.2rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-[10px] text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors uppercase tracking-tighter">Initial Qty</label>
|
||||
<label className="text-xs text-slate-500 font-bold mb-0.5 block group-focus-within:text-primary transition-colors uppercase tracking-tighter">Initial Qty</label>
|
||||
<input
|
||||
type="number"
|
||||
value={extractedItems[editingIndex].quantity || 1}
|
||||
@@ -559,10 +559,10 @@ export default function AIOnboarding({ onCancel, onComplete, categories, invento
|
||||
<h4 className="font-black text-slate-100 truncate">{item.Item || item.name || "Unknown Item"}</h4>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
<span className="text-[10px] font-black uppercase px-2 py-0.5 bg-slate-800 text-slate-400 rounded-md tracking-wider">
|
||||
<span className="text-xs font-black uppercase px-2 py-0.5 bg-slate-800 text-slate-400 rounded-md tracking-wider">
|
||||
{item.Type || item.type || "Generic"}
|
||||
</span>
|
||||
<span className="text-[10px] font-black uppercase px-2 py-0.5 bg-slate-800 text-slate-500 rounded-md tracking-wider">
|
||||
<span className="text-xs font-black uppercase px-2 py-0.5 bg-slate-800 text-slate-500 rounded-md tracking-wider">
|
||||
{item.PartNr || item.part_number || "No P/N"}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -70,7 +70,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
<Shield size={40} className="italic" />
|
||||
</div>
|
||||
<h2 className="text-3xl font-black text-white tracking-tight">Protocol Access</h2>
|
||||
<p className="text-slate-500 text-[10px] font-black uppercase tracking-widest">Select operator profile to initialize</p>
|
||||
<p className="text-slate-500 text-xs font-black uppercase tracking-widest">Select operator profile to initialize</p>
|
||||
</div>
|
||||
|
||||
<div className="grid gap-3.5">
|
||||
@@ -88,7 +88,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-slate-100 font-black text-sm tracking-tight">{user.username}</p>
|
||||
<p className="text-[9px] text-slate-600 font-black uppercase tracking-widest mt-0.5">{user.role}</p>
|
||||
<p className="text-xs text-slate-600 font-black uppercase tracking-widest mt-0.5">{user.role}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="p-1.5 rounded-full bg-slate-900/50 text-slate-700 group-hover:text-primary group-hover:bg-primary/10 transition-all">
|
||||
@@ -99,7 +99,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
<div className="pt-4">
|
||||
<button
|
||||
onClick={() => setIsEnterprise(true)}
|
||||
className="w-full flex items-center justify-center gap-3 py-5 rounded-[1.5rem] border border-dashed border-slate-800 text-slate-600 hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-all font-black text-[10px] uppercase tracking-widest"
|
||||
className="w-full flex items-center justify-center gap-3 py-5 rounded-[1.5rem] border border-dashed border-slate-800 text-slate-600 hover:text-primary hover:border-primary/40 hover:bg-primary/5 transition-all font-black text-xs uppercase tracking-widest"
|
||||
>
|
||||
<Lock size={14} />
|
||||
Enterprise Directory
|
||||
@@ -109,10 +109,10 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
) : isEnterprise ? (
|
||||
<div className="space-y-5 animate-in slide-in-from-bottom-5 duration-300">
|
||||
<div className="flex justify-between items-center px-1">
|
||||
<p className="text-[10px] font-black text-slate-600 uppercase tracking-widest italic">LDAP Authentication</p>
|
||||
<p className="text-xs font-black text-slate-600 uppercase tracking-widest italic">LDAP Authentication</p>
|
||||
<button
|
||||
onClick={() => setIsEnterprise(false)}
|
||||
className="text-[10px] font-black text-primary hover:underline uppercase tracking-tighter"
|
||||
className="text-xs font-black text-primary hover:underline uppercase tracking-tighter"
|
||||
>
|
||||
Profile Swap
|
||||
</button>
|
||||
@@ -146,7 +146,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
|
||||
<button
|
||||
onClick={handleLogin}
|
||||
className="w-full bg-primary text-white font-black py-5 rounded-[1.5rem] shadow-2xl shadow-primary/20 hover:shadow-primary/30 active:scale-95 transition-all uppercase text-[10px] tracking-widest border border-primary/20"
|
||||
className="w-full bg-primary text-white font-black py-5 rounded-[1.5rem] shadow-2xl shadow-primary/20 hover:shadow-primary/30 active:scale-95 transition-all uppercase text-xs tracking-widest border border-primary/20"
|
||||
>
|
||||
Initialize Session
|
||||
</button>
|
||||
@@ -159,7 +159,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
<Shield size={20} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[9px] font-black text-slate-600 uppercase tracking-widest">Active Profile</p>
|
||||
<p className="text-xs font-black text-slate-600 uppercase tracking-widest">Active Profile</p>
|
||||
<p className="text-white font-black tracking-tight">{selectedUserForLogin.username}</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -188,7 +188,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
|
||||
<button
|
||||
onClick={handleLogin}
|
||||
className="w-full bg-primary text-white font-black py-5 rounded-[1.5rem] shadow-2xl shadow-primary/20 hover:shadow-primary/30 active:scale-95 transition-all uppercase text-[10px] tracking-widest border border-primary/20"
|
||||
className="w-full bg-primary text-white font-black py-5 rounded-[1.5rem] shadow-2xl shadow-primary/20 hover:shadow-primary/30 active:scale-95 transition-all uppercase text-xs tracking-widest border border-primary/20"
|
||||
>
|
||||
Unlock Account
|
||||
</button>
|
||||
@@ -197,7 +197,7 @@ const IdentityCheckOverlay = memo(({ show, users, onAuthenticated }: IdentityChe
|
||||
</div>
|
||||
|
||||
{users.length === 0 && (
|
||||
<div className="text-center p-8 text-slate-700 animate-pulse font-black text-[10px] uppercase tracking-[0.2em]">
|
||||
<div className="text-center p-8 text-slate-700 animate-pulse font-black text-xs uppercase tracking-[0.2em]">
|
||||
Synchronizing User Tokens...
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -257,11 +257,11 @@ export default function Scanner({ onScanSuccess, onOCRMatch, paused }: ScannerPr
|
||||
<div className="p-6 bg-slate-900/90 backdrop-blur-xl border-t border-slate-800 flex flex-col gap-4">
|
||||
<div className="flex flex-col items-center gap-1">
|
||||
<p className="text-sm font-black text-white italic text-center">Protocol Detected</p>
|
||||
<p className="text-[10px] text-slate-500 font-black uppercase tracking-widest text-center">Select identity from label matrix</p>
|
||||
<p className="text-xs text-slate-500 font-black uppercase tracking-widest text-center">Select identity from label matrix</p>
|
||||
</div>
|
||||
<button
|
||||
onClick={() => { setIsSelecting(false); setCapturedImage(null); setCountdown(4); }}
|
||||
className="w-full py-4 bg-slate-800 hover:bg-slate-700 text-white rounded-2xl font-black text-[10px] uppercase tracking-widest transition-all active:scale-95 border border-slate-700"
|
||||
className="w-full py-4 bg-slate-800 hover:bg-slate-700 text-white rounded-2xl font-black text-xs uppercase tracking-widest transition-all active:scale-95 border border-slate-700"
|
||||
>
|
||||
Abort Cycle
|
||||
</button>
|
||||
@@ -315,7 +315,7 @@ export default function Scanner({ onScanSuccess, onOCRMatch, paused }: ScannerPr
|
||||
className="h-14 px-5 bg-slate-800/80 hover:bg-slate-700 border border-slate-700 text-white rounded-2xl flex flex-col items-center justify-center shadow-lg transition-all active:scale-95 shrink-0"
|
||||
>
|
||||
<span className="text-xs font-black tabular-nums">{zoom.toFixed(1)}x</span>
|
||||
<span className="text-[8px] text-primary font-black uppercase tracking-tighter">Zoom</span>
|
||||
<span className="text-xs text-primary font-black uppercase tracking-tighter">Zoom</span>
|
||||
</button>
|
||||
)}
|
||||
|
||||
@@ -323,13 +323,13 @@ export default function Scanner({ onScanSuccess, onOCRMatch, paused }: ScannerPr
|
||||
{ocrProcessing ? (
|
||||
<>
|
||||
<RefreshCw className="animate-spin text-primary" size={18} />
|
||||
<span className="text-[10px] font-black text-slate-200 uppercase tracking-widest leading-none">Analyzing</span>
|
||||
<span className="text-xs font-black text-slate-200 uppercase tracking-widest leading-none">Analyzing</span>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Search className={cn("text-slate-600 transition-colors group-hover:text-primary", !isStarted && "opacity-20")} size={18} />
|
||||
<div className="flex flex-col">
|
||||
<span className="text-[8px] text-slate-500 font-black leading-none uppercase tracking-widest">Optical Assist</span>
|
||||
<span className="text-xs text-slate-500 font-black leading-none uppercase tracking-widest">Optical Assist</span>
|
||||
<span className="text-xs font-black text-primary leading-tight uppercase tabular-nums">
|
||||
{countdown === 0 ? "Scanning" : `${countdown}s Cycle`}
|
||||
</span>
|
||||
@@ -347,7 +347,7 @@ export default function Scanner({ onScanSuccess, onOCRMatch, paused }: ScannerPr
|
||||
|
||||
<div className="w-full flex justify-center items-center gap-2">
|
||||
<div className="w-1 h-1 rounded-full bg-green-500 animate-pulse" />
|
||||
<p className="text-[9px] text-slate-600 font-black uppercase tracking-[0.15em]">
|
||||
<p className="text-xs text-slate-600 font-black uppercase tracking-[0.15em]">
|
||||
Optical Data Stream Active
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -12,12 +12,12 @@ export default function StatCard({ label, value, icon: Icon }: StatCardProps) {
|
||||
<div className="flex justify-between items-center gap-2 p-3.5 bg-slate-900/50 backdrop-blur-md border border-slate-800/50 rounded-2xl shadow-sm transition-all hover:bg-slate-900/80" role="status">
|
||||
<div className="flex items-center gap-2.5 min-w-0">
|
||||
{Icon && <Icon className="w-5 h-5 text-primary flex-shrink-0" aria-hidden="true" />}
|
||||
<span className="text-sm md:text-base text-slate-400 font-medium truncate">
|
||||
<span className="text-base md:text-lg text-slate-300 font-semibold truncate">
|
||||
{label}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<span className="text-lg md:text-xl font-black text-white whitespace-nowrap tabular-nums">
|
||||
<span className="text-2xl md:text-3xl font-black text-white whitespace-nowrap tabular-nums">
|
||||
{value}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -64,7 +64,7 @@ export default function AiManager({
|
||||
<div>
|
||||
<p className={cn("text-xs font-black tracking-tight", p.active ? "text-white" : "text-slate-200")}>{p.name}</p>
|
||||
<p className={cn(
|
||||
"text-[9px] font-black mt-0.5 px-0.5 rounded",
|
||||
"text-xs font-bold mt-1 px-0.5 rounded",
|
||||
p.active
|
||||
? (p.configured ? "text-emerald-200" : "text-rose-100")
|
||||
: (p.configured ? "text-emerald-500" : "text-rose-500")
|
||||
@@ -74,7 +74,7 @@ export default function AiManager({
|
||||
</div>
|
||||
</div>
|
||||
{p.active && (
|
||||
<div className="bg-white/20 px-2 py-0.5 rounded-full text-[8px] font-black text-white tracking-tighter">
|
||||
<div className="bg-white/20 px-2.5 py-1 rounded-full text-xs font-black text-white tracking-tight">
|
||||
Active
|
||||
</div>
|
||||
)}
|
||||
@@ -86,12 +86,12 @@ export default function AiManager({
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="p-2 bg-indigo-500/10 rounded-lg text-indigo-400"><Lock size={14} /></div>
|
||||
<h3 className="text-xs font-black text-slate-200 tracking-tight">Provider Access Keys</h3>
|
||||
<h3 className="text-sm font-bold text-slate-200 tracking-tight">Provider Access Keys</h3>
|
||||
</div>
|
||||
<button
|
||||
onClick={onSaveAiKeys}
|
||||
disabled={isSavingKeys}
|
||||
className="px-6 py-2.5 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-[10px] font-black transition-all active:scale-95 shadow-xl shadow-indigo-600/10 tracking-tight border border-indigo-500/30 flex items-center gap-2"
|
||||
className="px-6 py-2.5 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-sm font-black transition-all active:scale-95 shadow-xl shadow-indigo-600/10 tracking-tight border border-indigo-500/30 flex items-center gap-2"
|
||||
>
|
||||
{isSavingKeys ? <RotateCcw size={14} className="animate-spin" /> : <Lock size={14} />}
|
||||
{isSavingKeys ? "Storing..." : "Store Keys"}
|
||||
@@ -100,7 +100,7 @@ export default function AiManager({
|
||||
|
||||
<div className="grid md:grid-cols-2 gap-6">
|
||||
<div className="space-y-2">
|
||||
<label className="text-[9px] font-black text-slate-500 tracking-tight ml-1">Gemini Api Key</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Gemini Api Key</label>
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="password"
|
||||
@@ -113,7 +113,7 @@ export default function AiManager({
|
||||
onClick={() => onTestAiKey('gemini')}
|
||||
disabled={isTestingKeys.gemini}
|
||||
className={cn(
|
||||
"px-4 py-2 rounded-xl text-[9px] font-black tracking-tighter transition-all border shadow-lg flex items-center gap-1.5",
|
||||
"px-4 py-2 rounded-xl text-xs font-bold tracking-tight transition-all border shadow-lg flex items-center gap-1.5",
|
||||
isTestingKeys.gemini
|
||||
? "bg-slate-800 border-slate-700 text-slate-500 cursor-wait"
|
||||
: "bg-indigo-600 border-indigo-500 text-white hover:bg-indigo-500"
|
||||
@@ -125,7 +125,7 @@ export default function AiManager({
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<label className="text-[9px] font-black text-slate-500 tracking-tight ml-1">Claude Api Key</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Claude Api Key</label>
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="password"
|
||||
@@ -138,7 +138,7 @@ export default function AiManager({
|
||||
onClick={() => onTestAiKey('claude')}
|
||||
disabled={isTestingKeys.claude}
|
||||
className={cn(
|
||||
"px-4 py-2 rounded-xl text-[9px] font-black uppercase tracking-tighter transition-all border shadow-lg flex items-center gap-1.5",
|
||||
"px-4 py-2 rounded-xl text-xs font-bold tracking-tight transition-all border shadow-lg flex items-center gap-1.5",
|
||||
isTestingKeys.claude
|
||||
? "bg-slate-800 border-slate-700 text-slate-500 cursor-wait"
|
||||
: "bg-indigo-600 border-indigo-500 text-white hover:bg-indigo-500"
|
||||
@@ -155,11 +155,11 @@ export default function AiManager({
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-2">
|
||||
<div className="flex items-center justify-between px-1">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight">System Prompt (Vision Extraction)</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight">System Prompt (Vision Extraction)</label>
|
||||
<button
|
||||
onClick={onUpdatePrompt}
|
||||
disabled={isSavingPrompt}
|
||||
className="px-6 py-2 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-[10px] font-black transition-all active:scale-95 shadow-xl shadow-indigo-600/10 tracking-tight border border-indigo-500/30 flex items-center gap-2"
|
||||
className="px-6 py-2 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-sm font-black transition-all active:scale-95 shadow-xl shadow-indigo-600/10 tracking-tight border border-indigo-500/30 flex items-center gap-2"
|
||||
>
|
||||
{isSavingPrompt ? <RotateCcw size={14} className="animate-spin" /> : <FileText size={14} />}
|
||||
{isSavingPrompt ? "Saving..." : "Save Prompt"}
|
||||
@@ -168,12 +168,12 @@ export default function AiManager({
|
||||
<textarea
|
||||
value={aiPrompt}
|
||||
onChange={(e) => setAiPrompt(e.target.value)}
|
||||
className="w-full bg-slate-950/80 border border-slate-800 rounded-2xl p-6 text-[11px] font-mono font-bold text-slate-300 leading-relaxed outline-none focus:border-purple-500/50 transition-all min-h-[200px] custom-scrollbar shadow-inner"
|
||||
className="w-full bg-slate-950/80 border border-slate-800 rounded-2xl p-6 text-xs font-mono font-bold text-slate-300 leading-relaxed outline-none focus:border-purple-500/50 transition-all min-h-[200px] custom-scrollbar shadow-inner"
|
||||
/>
|
||||
</div>
|
||||
<div className="bg-purple-500/5 border border-purple-500/10 rounded-2xl p-4 flex gap-4 items-start">
|
||||
<div className="p-2 bg-purple-500/10 rounded-lg text-purple-400 shrink-0"><Shield size={14} /></div>
|
||||
<p className="text-[10px] font-bold text-slate-500 leading-relaxed">
|
||||
<p className="text-xs font-medium text-slate-400 leading-relaxed">
|
||||
This prompt instructs the Vision AI core on label interpretation. Ensure it defines explicit mapping for technical attributes like <span className="text-purple-400">Item</span>, <span className="text-purple-400">Type</span>, and <span className="text-purple-400">Part Number</span> to avoid extraction null-pointers and ensure inventory data integrity.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -33,7 +33,7 @@ export default function CategoryManager({
|
||||
</div>
|
||||
<button
|
||||
onClick={onAddCategory}
|
||||
className="flex items-center gap-2 bg-indigo-600 hover:bg-indigo-500 text-white px-6 py-3 rounded-xl text-xs font-black transition-all shadow-xl shadow-indigo-600/10 active:scale-95 border border-indigo-500/30 tracking-tight"
|
||||
className="flex items-center gap-2 bg-indigo-600 hover:bg-indigo-500 text-white px-6 py-3 rounded-xl text-sm font-black transition-all shadow-xl shadow-indigo-600/10 active:scale-95 border border-indigo-500/30 tracking-tight"
|
||||
>
|
||||
<Plus size={14} /> New Group
|
||||
</button>
|
||||
@@ -44,7 +44,7 @@ export default function CategoryManager({
|
||||
<div key={cat.id} className="p-4 bg-slate-950/40 border border-slate-800/50 rounded-2xl flex items-center justify-between group hover:border-primary/40 transition-all">
|
||||
<div className="min-w-0 pr-4">
|
||||
<p className="text-sm font-bold text-slate-200 group-hover:text-primary transition-colors">{cat.name}</p>
|
||||
<p className="text-[10px] text-slate-500 font-medium mt-0.5">{cat.description || 'General storage'}</p>
|
||||
<p className="text-xs text-slate-500 font-medium mt-0.5">{cat.description || 'General storage'}</p>
|
||||
</div>
|
||||
<div className="flex gap-1 shrink-0">
|
||||
<button
|
||||
@@ -84,7 +84,7 @@ export default function CategoryManager({
|
||||
</div>
|
||||
<div className="space-y-6">
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Group Identifier</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Group Identifier</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editCatForm.name}
|
||||
@@ -93,14 +93,14 @@ export default function CategoryManager({
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Strategic Description</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Strategic Description</label>
|
||||
<textarea
|
||||
value={editCatForm.description}
|
||||
onChange={(e) => setEditCatForm({...editCatForm, description: e.target.value})}
|
||||
className="w-full bg-slate-950 border border-slate-800 rounded-2xl py-4 px-5 text-sm text-white focus:border-primary outline-none transition-all h-32 resize-none"
|
||||
/>
|
||||
</div>
|
||||
<button onClick={onUpdateCategorySubmit} className="w-full bg-indigo-600 hover:bg-indigo-500 text-white font-black py-4 rounded-2xl shadow-xl shadow-indigo-600/20 active:scale-95 transition-all text-xs mb-4 tracking-tight">
|
||||
<button onClick={onUpdateCategorySubmit} className="w-full bg-indigo-600 hover:bg-indigo-500 text-white font-black py-4 rounded-2xl shadow-xl shadow-indigo-600/20 active:scale-95 transition-all text-sm mb-4 tracking-tight">
|
||||
Update Asset Group
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -45,22 +45,22 @@ export default function DatabaseManager({
|
||||
|
||||
<div className="flex flex-col sm:flex-row sm:items-center justify-between gap-6">
|
||||
<div className="space-y-1 sm:pr-6">
|
||||
<p className="text-[10px] font-black text-slate-500 tracking-tight">Database Health</p>
|
||||
<p className="text-xs font-bold text-slate-500 tracking-tight uppercase">Database Health</p>
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="w-2 h-2 rounded-full bg-green-500 animate-pulse shadow-[0_0_8px_rgba(34,197,94,0.3)]" />
|
||||
<span className="text-sm font-bold text-slate-200">Operational</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="sm:pl-6 sm:border-l border-slate-800">
|
||||
<p className="text-[10px] font-black text-slate-500 tracking-tight">Last Backup</p>
|
||||
<p className="text-xs font-bold text-slate-500 tracking-tight uppercase">Last Backup</p>
|
||||
<p className="text-sm font-bold text-slate-200 tabular-nums">{dbStats.backup_count > 0 ? 'Verified' : 'Pending...'}</p>
|
||||
</div>
|
||||
<div className="ml-auto">
|
||||
<button
|
||||
onClick={onCreateBackup}
|
||||
disabled={isBackingUp}
|
||||
className="flex items-center gap-2 px-5 py-3 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-[10px] font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl shadow-indigo-600/10 tracking-tight"
|
||||
>
|
||||
<button
|
||||
onClick={onCreateBackup}
|
||||
disabled={isBackingUp}
|
||||
className="flex items-center gap-2 px-5 py-3 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-sm font-black transition-all active:scale-95 disabled:opacity-50 shadow-xl shadow-indigo-600/10 tracking-tight"
|
||||
>
|
||||
{isBackingUp ? <RotateCcw size={14} className="animate-spin" /> : <Database size={14} />}
|
||||
{isBackingUp ? "Snapshotting..." : "Force Backup"}
|
||||
</button>
|
||||
@@ -75,14 +75,14 @@ export default function DatabaseManager({
|
||||
<History size={20} />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-black text-white tracking-tight">Storage Policy</h3>
|
||||
<p className="text-[10px] text-slate-500 font-bold tracking-tight">Retention & Maintenance</p>
|
||||
</div>
|
||||
<h3 className="text-lg font-black text-white tracking-tight">Storage Policy</h3>
|
||||
<p className="text-xs text-slate-400 font-bold tracking-tight">Retention & Maintenance</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid sm:grid-cols-3 gap-6">
|
||||
<div className="space-y-2">
|
||||
<label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
|
||||
<label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
|
||||
<History size={10} /> Max Backups
|
||||
</label>
|
||||
<input
|
||||
@@ -93,7 +93,7 @@ export default function DatabaseManager({
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
|
||||
<label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
|
||||
<Clock size={10} /> Schedule (Hour)
|
||||
</label>
|
||||
<input
|
||||
@@ -105,7 +105,7 @@ export default function DatabaseManager({
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-2">
|
||||
<label className="text-[9px] font-black text-slate-500 tracking-tight ml-1 flex items-center gap-2">
|
||||
<label className="text-xs font-bold text-slate-500 tracking-tight ml-1 flex items-center gap-2 uppercase">
|
||||
<Zap size={10} /> Frequency (Days)
|
||||
</label>
|
||||
<input
|
||||
@@ -121,10 +121,10 @@ export default function DatabaseManager({
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="flex items-center justify-between px-1">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight">Recovery Points</label>
|
||||
<div className="text-[10px] font-black text-indigo-400 tracking-tight bg-indigo-500/5 px-3 py-1 rounded-full border border-indigo-500/10">
|
||||
{formatSize(dbStats.total_size_bytes)} Used
|
||||
</div>
|
||||
<label className="text-xs font-bold text-slate-500 tracking-tight">Recovery Points</label>
|
||||
<div className="text-xs font-bold text-indigo-400 tracking-tight bg-indigo-500/5 px-3 py-1 rounded-full border border-indigo-500/10">
|
||||
{formatSize(dbStats.total_size_bytes)} Used
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="space-y-2 pr-2 overflow-y-auto max-h-[300px] scrollbar-thin scrollbar-thumb-slate-800 scrollbar-track-transparent">
|
||||
@@ -135,10 +135,10 @@ export default function DatabaseManager({
|
||||
<Database size={14} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[11px] font-bold text-slate-200">{bak.filename}</p>
|
||||
<p className="text-[9px] text-slate-500 font-bold tabular-nums">
|
||||
{new Date(bak.created_at).toLocaleString()} • {formatSize(bak.size_bytes)}
|
||||
</p>
|
||||
<p className="text-xs font-bold text-slate-200">{bak.filename}</p>
|
||||
<p className="text-[11px] text-slate-400 font-medium tabular-nums">
|
||||
{new Date(bak.created_at).toLocaleString()} • {formatSize(bak.size_bytes)}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
@@ -154,12 +154,12 @@ export default function DatabaseManager({
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-2 gap-4 pt-2">
|
||||
<button
|
||||
onClick={onExport}
|
||||
className="flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-indigo-500/50 text-indigo-400 rounded-2xl text-[10px] font-black transition-all active:scale-95 tracking-tight shadow-xl shadow-black/20"
|
||||
>
|
||||
<Download size={14} /> Export Database
|
||||
</button>
|
||||
<button
|
||||
onClick={onExport}
|
||||
className="flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-indigo-500/50 text-indigo-400 rounded-2xl text-sm font-black transition-all active:scale-95 tracking-tight shadow-xl shadow-black/20"
|
||||
>
|
||||
<Download size={14} /> Export Database
|
||||
</button>
|
||||
<div className="relative">
|
||||
<input
|
||||
type="file"
|
||||
@@ -167,9 +167,9 @@ export default function DatabaseManager({
|
||||
onChange={onImport}
|
||||
className="absolute inset-0 opacity-0 cursor-pointer z-10"
|
||||
/>
|
||||
<button className="w-full flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-rose-500/50 text-rose-500 rounded-2xl text-[10px] font-black transition-all tracking-tight shadow-xl shadow-black/20">
|
||||
<Upload size={14} /> Import Database
|
||||
</button>
|
||||
<button className="w-full flex items-center justify-center gap-2 py-4 bg-slate-950 border border-slate-800 hover:border-rose-500/50 text-rose-500 rounded-2xl text-sm font-black transition-all tracking-tight shadow-xl shadow-black/20">
|
||||
<Upload size={14} /> Import Database
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -34,7 +34,7 @@ export default function IdentityManager({
|
||||
</div>
|
||||
<button
|
||||
onClick={onAddUser}
|
||||
className="flex items-center gap-2 px-5 py-2.5 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-xs font-black transition-all shadow-xl shadow-indigo-600/10 active:scale-95 border border-indigo-500/30 tracking-tight"
|
||||
className="flex items-center gap-2 px-5 py-2.5 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl text-sm font-black transition-all shadow-xl shadow-indigo-600/10 active:scale-95 border border-indigo-500/30 tracking-tight"
|
||||
>
|
||||
<UserPlus size={16} /> Add User
|
||||
</button>
|
||||
@@ -52,7 +52,7 @@ export default function IdentityManager({
|
||||
</div>
|
||||
<div className="min-w-0">
|
||||
<p className="text-sm font-bold text-slate-200 truncate">{user.username}</p>
|
||||
<p className="text-[9px] text-slate-500 font-black tracking-tight capitalize">{user.role}</p>
|
||||
<p className="text-[11px] text-slate-400 font-bold tracking-tight capitalize">{user.role}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-1.5 ml-2">
|
||||
@@ -91,7 +91,7 @@ export default function IdentityManager({
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Username</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Username</label>
|
||||
<input
|
||||
type="text"
|
||||
value={editUserForm.username}
|
||||
@@ -100,7 +100,7 @@ export default function IdentityManager({
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">New Password (Leave Empty To Keep)</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">New Password (Leave Empty To Keep)</label>
|
||||
<input
|
||||
type="password"
|
||||
value={editUserForm.password}
|
||||
@@ -110,7 +110,7 @@ export default function IdentityManager({
|
||||
/>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Role</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Role</label>
|
||||
<select
|
||||
value={editUserForm.role}
|
||||
onChange={(e) => setEditUserForm({ ...editUserForm, role: e.target.value })}
|
||||
|
||||
@@ -37,8 +37,8 @@ export default function LdapManager({
|
||||
<Power size={14} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[10px] font-black text-slate-200 tracking-tight leading-none">Ldap Authorization</p>
|
||||
<p className={cn("text-[8px] font-bold mt-1", ldapConfig.ldap_enabled ? "text-green-500/80" : "text-slate-600")}>
|
||||
<p className="text-xs font-bold text-slate-200 tracking-tight leading-none">Ldap Authorization</p>
|
||||
<p className={cn("text-[11px] font-bold mt-1.5", ldapConfig.ldap_enabled ? "text-green-500/80" : "text-slate-500")}>
|
||||
{ldapConfig.ldap_enabled ? "External Directory Active" : "Internal Authentication Only"}
|
||||
</p>
|
||||
</div>
|
||||
@@ -59,7 +59,7 @@ export default function LdapManager({
|
||||
|
||||
<div className="grid sm:grid-cols-2 gap-4">
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Ldap Uri</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Ldap Uri</label>
|
||||
<div className="relative">
|
||||
<Server className="absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-700" size={14} />
|
||||
<input
|
||||
@@ -72,7 +72,7 @@ export default function LdapManager({
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Context Dn</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Context Dn</label>
|
||||
<div className="relative">
|
||||
<Shield className="absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-700" size={14} />
|
||||
<input
|
||||
@@ -88,7 +88,7 @@ export default function LdapManager({
|
||||
|
||||
<div className="grid sm:grid-cols-2 gap-4">
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">User Dn Template</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">User Dn Template</label>
|
||||
<div className="relative">
|
||||
<User className="absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-700" size={14} />
|
||||
<input
|
||||
@@ -101,7 +101,7 @@ export default function LdapManager({
|
||||
</div>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<label className="text-[10px] font-black text-slate-500 tracking-tight ml-1">Groups Base Dn</label>
|
||||
<label className="text-sm font-bold text-slate-400 tracking-tight ml-1">Groups Base Dn</label>
|
||||
<div className="relative">
|
||||
<Layers className="absolute left-3.5 top-1/2 -translate-y-1/2 text-slate-700" size={14} />
|
||||
<input
|
||||
@@ -124,8 +124,8 @@ export default function LdapManager({
|
||||
<Lock size={14} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[10px] font-black text-slate-200 tracking-tight leading-none">Use Tls</p>
|
||||
<p className={cn("text-[8px] font-bold mt-1", ldapConfig.use_tls ? "text-indigo-400/80" : "text-slate-600")}>
|
||||
<p className="text-xs font-bold text-slate-200 tracking-tight leading-none">Use Tls</p>
|
||||
<p className={cn("text-[11px] font-bold mt-1.5", ldapConfig.use_tls ? "text-indigo-400/80" : "text-slate-500")}>
|
||||
{ldapConfig.use_tls ? "Encrypted Channel" : "Standard Link"}
|
||||
</p>
|
||||
</div>
|
||||
@@ -148,14 +148,14 @@ export default function LdapManager({
|
||||
<button
|
||||
onClick={onTestLdap}
|
||||
disabled={testingLdap}
|
||||
className="flex-1 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl py-3 text-xs font-black shadow-xl shadow-indigo-600/10 transition-all active:scale-95 disabled:opacity-50 flex items-center justify-center gap-2 border border-indigo-500/30"
|
||||
className="flex-1 bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl py-3 text-sm font-black shadow-xl shadow-indigo-600/10 transition-all active:scale-95 disabled:opacity-50 flex items-center justify-center gap-2 border border-indigo-500/30"
|
||||
>
|
||||
{testingLdap ? <RotateCcw size={14} className="animate-spin" /> : <Wifi size={14} />}
|
||||
Test Connection
|
||||
</button>
|
||||
<button
|
||||
onClick={onUpdateLdap}
|
||||
className="flex-[2] bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl py-3 text-xs font-black shadow-xl shadow-indigo-600/10 transition-all active:scale-95 flex items-center justify-center gap-2 border border-indigo-500/30 tracking-tight"
|
||||
className="flex-[2] bg-indigo-600 hover:bg-indigo-500 text-white rounded-xl py-3 text-sm font-black shadow-xl shadow-indigo-600/10 transition-all active:scale-95 flex items-center justify-center gap-2 border border-indigo-500/30 tracking-tight"
|
||||
>
|
||||
<Shield size={14} /> Save LDAP Policy
|
||||
</button>
|
||||
|
||||
1
frontend/tsconfig.tsbuildinfo
Normal file
1
frontend/tsconfig.tsbuildinfo
Normal file
File diff suppressed because one or more lines are too long
@@ -15,13 +15,13 @@ BACKEND_SSL_PORT=8918
|
||||
FRONTEND_PORT=8917
|
||||
FRONTEND_SSL_PORT=8919
|
||||
|
||||
# Security & AI
|
||||
# Security
|
||||
JWT_SECRET_KEY=change_me_in_production
|
||||
|
||||
# AI
|
||||
GEMINI_API_KEY=AIzaSyAajthWG2agpDLyJHY11U5qFLP4WnV5z0w
|
||||
CLAUDE_API_KEY=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
|
||||
|
||||
# External Access (CORS)
|
||||
# Comma-separated list of extra IPs or FQDNs allowed to connect (e.g. Tailscale, VPN)
|
||||
EXTRA_ALLOWED_ORIGINS=100.78.182.27
|
||||
|
||||
# --- Automatically Added Keys ---
|
||||
CLAUDE_API_KEY=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
|
||||
|
||||
Reference in New Issue
Block a user