style: synchronize icons for categories and items v1.2.5
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
|
||||
import { useState, useRef } from 'react';
|
||||
import { toast } from 'react-hot-toast';
|
||||
import { Camera, Check, RefreshCw, X, Image as ImageIcon, Sparkles, Hash, Layout } from 'lucide-react';
|
||||
import { Camera, Check, RefreshCw, X, Image as ImageIcon, Sparkles, Hash, Layout, Layers, Package, ChevronDown } from 'lucide-react';
|
||||
import { inventoryApi } from '@/lib/api';
|
||||
|
||||
interface AIOnboardingProps {
|
||||
@@ -176,20 +176,29 @@ export default function AIOnboarding({ onCancel, onComplete, categories }: AIOnb
|
||||
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<div className="bg-slate-900/80 p-5 rounded-[1.5rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-xs text-slate-500 font-bold mb-1 block group-focus-within:text-primary transition-colors">Category Group</label>
|
||||
<select
|
||||
value={extractedData.category || ''}
|
||||
onChange={(e) => setExtractedData({...extractedData, category: e.target.value})}
|
||||
className="bg-transparent w-full font-bold outline-none text-slate-200"
|
||||
>
|
||||
<option value="" className="bg-slate-900 font-bold">Other / New</option>
|
||||
{categories.map(c => (
|
||||
<option key={c.id} value={c.name} className="bg-slate-900">{c.name}</option>
|
||||
))}
|
||||
</select>
|
||||
<div className="flex items-center gap-1.5 mb-1 ml-1 group-focus-within:text-primary transition-colors">
|
||||
<Layers size={12} />
|
||||
<label className="text-xs text-slate-500 font-bold">Category Group</label>
|
||||
</div>
|
||||
<div className="relative flex items-center">
|
||||
<select
|
||||
value={extractedData.category || ''}
|
||||
onChange={(e) => setExtractedData({...extractedData, category: e.target.value})}
|
||||
className="bg-transparent w-full font-bold outline-none text-slate-200 appearance-none"
|
||||
>
|
||||
<option value="" className="bg-slate-900 font-bold">Other / New</option>
|
||||
{categories.map(c => (
|
||||
<option key={c.id} value={c.name} className="bg-slate-900">{c.name}</option>
|
||||
))}
|
||||
</select>
|
||||
<ChevronDown size={14} className="absolute right-0 text-slate-500 pointer-events-none" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-slate-900/80 p-5 rounded-[1.5rem] border border-slate-800 focus-within:border-primary/50 transition-colors group">
|
||||
<label className="text-xs text-slate-500 font-bold mb-1 block group-focus-within:text-primary transition-colors">Item Type</label>
|
||||
<div className="flex items-center gap-1.5 mb-1 ml-1 group-focus-within:text-primary transition-colors">
|
||||
<Package size={12} />
|
||||
<label className="text-xs text-slate-500 font-bold">Item Type</label>
|
||||
</div>
|
||||
<input
|
||||
value={extractedData.type || ''}
|
||||
onChange={(e) => setExtractedData({...extractedData, type: e.target.value})}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
'use client';
|
||||
|
||||
import { X, Shield, UserPlus, User, Trash2, Tag, Plus, AlertTriangle, LogOut } from 'lucide-react';
|
||||
import { X, Shield, UserPlus, User, Trash2, Tag, Plus, AlertTriangle, LogOut, Layers } from 'lucide-react';
|
||||
import { inventoryApi } from '@/lib/api';
|
||||
import { toast } from 'react-hot-toast';
|
||||
|
||||
@@ -124,8 +124,8 @@ export default function AdminOverlay({
|
||||
{categories.map(cat => (
|
||||
<div key={cat.id} className="bg-slate-800/40 border border-slate-800 p-4 rounded-2xl flex items-center justify-between">
|
||||
<div className="flex items-center gap-3">
|
||||
<div className="p-2 bg-slate-700 rounded-lg text-slate-400">
|
||||
<Tag size={16} />
|
||||
<div className="p-2 bg-primary/10 rounded-lg text-primary">
|
||||
<Layers size={16} />
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-sm font-bold text-white">{cat.name}</p>
|
||||
|
||||
Reference in New Issue
Block a user