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

Build [v1.14.24]

Browse Source
This commit is contained in:
Daniel Bedeleanu
2026-04-25 12:04:02 +03:00
parent 33c1555d8c
commit 3257a2cf48
50 changed files with 837 additions and 845 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
frontend/components/ConfirmationModal.tsx
View File

@@ -55,19 +55,19 @@ export default function ConfirmationModal({
return (
<div data-testid="confirmation-modal" className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
<div className="bg-surface border border-slate-800 rounded-lg shadow-xl max-w-sm w-full mx-4">
<div className="bg-surface border border-outline/30 shadow-xl max-w-sm w-full mx-4">
{/* Header */}
<div className="flex items-center justify-between p-6 border-b border-slate-800">
<div className="flex items-center justify-between p-6 border-b border-outline/30">
<div className="flex items-center gap-3">
<div className="p-2 bg-rose-500/10 rounded-lg text-rose-500">
<div className="p-2 bg-error/10 text-error">
<AlertTriangle size={20} />
</div>
<h2 className="text-lg font-normal text-white">{title}</h2>
<h2 className="text-lg font-normal text-foreground">{title}</h2>
</div>
<button
onClick={onCancel}
disabled={loading}
className="p-1 text-muted hover:text-secondary rounded cursor-pointer focus:ring-2 focus:ring-primary focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
className="p-1 text-secondary hover:text-secondary cursor-pointer focus:ring-2 focus:ring-primary focus:outline-none disabled:opacity-50 disabled:cursor-not-allowed"
aria-label="Close modal"
>
<X size={20} />
@@ -81,16 +81,16 @@ export default function ConfirmationModal({
{/* Item Name (if provided) */}
{itemName && (
<div className="bg-slate-800/40 border border-slate-800 rounded p-3">
<p className="text-xs text-muted font-normal">Item</p>
<p className="text-sm font-mono text-white mt-1">{itemName}</p>
<div className="bg-surface-container/40 border border-outline/30 p-3">
<p className="text-xs text-secondary font-normal">Item</p>
<p className="text-sm font-mono text-foreground mt-1">{itemName}</p>
</div>
)}
{/* Consequence Warning */}
{consequence && (
<div className="flex gap-2 p-3 bg-rose-500/5 border border-rose-500/20 rounded">
<span className="text-rose-500 flex-shrink-0">⚠</span>
<div className="flex gap-2 p-3 bg-error/5 border border-error/20">
<span className="text-error flex-shrink-0">⚠</span>
<p className="text-sm text-rose-400">{consequence}</p>
</div>
)}
@@ -106,7 +106,7 @@ export default function ConfirmationModal({
{/* High-Risk Warning & Confirmation Input */}
{requiresTextConfirm && (
<div className="space-y-3 pt-2 border-t border-slate-800">
<div className="space-y-3 pt-2 border-t border-outline/30">
<p className="text-sm font-normal text-rose-400">
Type "Delete" to confirm this high-risk action
</p>
@@ -118,7 +118,7 @@ export default function ConfirmationModal({
setError(null);
}}
placeholder="Type Delete"
className="w-full px-3 py-2.5 bg-slate-800 border border-slate-700 rounded text-white placeholder:text-muted focus:outline-none focus:ring-2 focus:ring-primary disabled:opacity-50"
className="w-full px-3 py-2.5 bg-surface-container border border-outline-variant text-foreground placeholder:text-secondary focus:outline-none focus:ring-2 focus:ring-primary disabled:opacity-50"
disabled={loading}
onKeyDown={(e) => {
if (e.key === 'Enter' && canConfirm && !loading) {
@@ -127,18 +127,18 @@ export default function ConfirmationModal({
}}
/>
{error && (
<p className="text-xs text-rose-500">{error}</p>
<p className="text-xs text-error">{error}</p>
)}
</div>
)}
</div>
{/* Actions */}
<div className="flex gap-2 p-6 border-t border-slate-800">
<div className="flex gap-2 p-6 border-t border-outline/30">
<button
onClick={onCancel}
disabled={loading}
className="flex-1 px-4 py-2.5 text-secondary bg-slate-800 border border-slate-700 rounded font-normal hover:bg-slate-700 cursor-pointer transition-colors disabled:opacity-50 disabled:cursor-not-allowed focus:ring-2 focus:ring-primary focus:outline-none"
className="flex-1 px-4 py-2.5 text-secondary bg-surface-container border border-outline-variant font-normal hover:bg-surface-bright cursor-pointer transition-colors disabled:opacity-50 disabled:cursor-not-allowed focus:ring-2 focus:ring-primary focus:outline-none"
>
Keep Item
</button>
@@ -146,7 +146,7 @@ export default function ConfirmationModal({
onClick={handleConfirm}
data-testid="confirm-action"
disabled={loading || !canConfirm}
className="flex-1 px-4 py-2.5 bg-rose-600 text-white rounded font-normal hover:bg-rose-700 cursor-pointer transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2 focus:ring-2 focus:ring-offset-2 focus:ring-offset-slate-900 focus:ring-rose-600 focus:outline-none"
className="flex-1 px-4 py-2.5 bg-rose-600 text-foreground font-normal hover:bg-rose-700 cursor-pointer transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2 focus:ring-2 focus:ring-offset-2 focus:ring-offset-surface-container focus:ring-rose-600 focus:outline-none"
>
{loading ? (
<>