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

test: add data-testid attributes to admin sub-components and modals

Browse Source
This commit is contained in:
Daniel Bedeleanu
2026-04-19 09:28:27 +03:00
parent cbfe6a22be
commit 1846bb3cb3
6 changed files with 26 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
frontend/components/admin/CategoryManager.tsx
View File

@@ -31,17 +31,18 @@ export default function CategoryManager({
</div>
<h2 className="text-xl font-black text-white tracking-tight">Category Groups</h2>
</div>
<button
<button
onClick={onAddCategory}
data-testid="add-category-button"
className="flex items-center gap-2 bg-primary hover:bg-primary text-white px-6 py-3 rounded-xl text-sm font-black transition-all shadow-xl shadow-primary/10 active:scale-95 border border-primary/30 tracking-tight"
>
<Plus size={14} /> New Group
</button>
</div>
<div className="grid sm:grid-cols-2 lg:grid-cols-4 gap-3">
<div data-testid="category-list" className="grid sm:grid-cols-2 lg:grid-cols-4 gap-3">
{categories.map(cat => (
<div key={cat.id} className="p-4 bg-background/40 border border-slate-800/50 rounded-2xl flex items-center justify-between group hover:border-primary/40 transition-all">
<div key={cat.id} data-testid="category-item" className="p-4 bg-background/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="card-title group-hover:text-primary transition-colors">{cat.name}</p>
<p className="card-subtitle">{cat.description || 'General storage'}</p>
@@ -56,8 +57,9 @@ export default function CategoryManager({
>
<Edit2 size={14} />
</button>
<button
<button
onClick={() => onDeleteCategory(cat.id, cat.name)}
data-testid="delete-category-button"
className="p-2 text-secondary hover:text-rose-500 hover:bg-rose-500/5 rounded-lg transition-all"
>
<Trash2 size={14} />
@@ -82,11 +84,12 @@ export default function CategoryManager({
<X size={20} />
</button>
</div>
<div className="space-y-6">
<div data-testid="category-form" className="space-y-6">
<div className="space-y-1.5">
<label className="text-sm font-bold text-secondary tracking-tight ml-1">Group Identifier</label>
<input
type="text"
<input
data-testid="category-name-input"
type="text"
value={editCatForm.name}
onChange={(e) => setEditCatForm({...editCatForm, name: e.target.value})}
className="w-full bg-background border border-slate-800 rounded-2xl py-3.5 px-5 text-sm text-white focus:border-primary outline-none transition-all"
@@ -100,7 +103,7 @@ export default function CategoryManager({
className="w-full bg-background 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-primary hover:bg-primary text-white font-black py-4 rounded-2xl shadow-xl shadow-primary/20 active:scale-95 transition-all text-sm mb-4 tracking-tight">
<button data-testid="add-category-submit" onClick={onUpdateCategorySubmit} className="w-full bg-primary hover:bg-primary text-white font-black py-4 rounded-2xl shadow-xl shadow-primary/20 active:scale-95 transition-all text-sm mb-4 tracking-tight">
Update Asset Group
</button>
</div>