feat: add clear X button to all search inputs

This commit is contained in:
Christian Vidal Wolf
2026-04-10 12:39:31 +02:00
parent dbcd6d622f
commit be584600fc
8 changed files with 84 additions and 19 deletions
+10 -2
View File
@@ -1,5 +1,5 @@
import React, { useState, useEffect } from 'react';
import { History, RotateCcw, ChevronDown, ChevronRight, User, Calendar, Tag } from 'lucide-react';
import { History, RotateCcw, ChevronDown, ChevronRight, User, Calendar, Tag, Search, X } from 'lucide-react';
import { getHistory, deleteHistoryEntry, HistoryEntry } from '../lib/supabase';
import { ExcelRow, COLUMNS } from '../types';
import { cn } from '../lib/utils';
@@ -102,8 +102,16 @@ export function HistoryView({ headers, data, onRevert, sessionToken }: HistoryVi
placeholder="Search history..."
value={search}
onChange={(e) => setSearch(e.target.value)}
className="pl-10 pr-4 py-2 bg-slate-800 border border-slate-700 rounded-md text-sm text-slate-200 focus:outline-none focus:border-blue-500 transition-colors w-64"
className="pl-10 pr-10 py-2 bg-slate-800 border border-slate-700 rounded-md text-sm text-slate-200 focus:outline-none focus:border-blue-500 transition-colors w-64"
/>
{search && (
<button
onClick={() => setSearch('')}
className="absolute right-3 top-1/2 -translate-y-1/2 text-slate-400 hover:text-white"
>
<X className="w-4 h-4" />
</button>
)}
</div>
<button
onClick={loadHistory}