Replace filter dropdowns with toggle buttons on Requests page
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
+24
-23
@@ -41,33 +41,34 @@ export default function Requests() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style={{ display: 'flex', gap: 10, marginBottom: 20, flexWrap: 'wrap' }}>
|
||||
<select
|
||||
value={filterCompany}
|
||||
onChange={e => setFilterCompany(e.target.value)}
|
||||
style={{ minWidth: 160 }}
|
||||
>
|
||||
<option value="">All Companies</option>
|
||||
{companies.length > 0 && (
|
||||
<div style={{ display: 'flex', gap: 6, flexWrap: 'wrap', marginBottom: 10 }}>
|
||||
<button className={`btn btn-sm ${!filterCompany ? 'btn-primary' : 'btn-outline'}`} onClick={() => setFilterCompany('')}>All</button>
|
||||
{companies.map(co => (
|
||||
<option key={co.id} value={co.id}>{co.name}</option>
|
||||
<button
|
||||
key={co.id}
|
||||
className={`btn btn-sm ${filterCompany === co.id ? 'btn-primary' : 'btn-outline'}`}
|
||||
onClick={() => setFilterCompany(f => f === co.id ? '' : co.id)}
|
||||
>
|
||||
{co.name}
|
||||
</button>
|
||||
))}
|
||||
</select>
|
||||
<select
|
||||
value={filterUser}
|
||||
onChange={e => setFilterUser(e.target.value)}
|
||||
style={{ minWidth: 160 }}
|
||||
>
|
||||
<option value="">All Users</option>
|
||||
</div>
|
||||
)}
|
||||
{[...new Set(submissions.map(s => s.submitted_by_name).filter(Boolean))].sort().length > 0 && (
|
||||
<div style={{ display: 'flex', gap: 6, flexWrap: 'wrap', marginBottom: 20 }}>
|
||||
<button className={`btn btn-sm ${!filterUser ? 'btn-primary' : 'btn-outline'}`} onClick={() => setFilterUser('')}>All Users</button>
|
||||
{[...new Set(submissions.map(s => s.submitted_by_name).filter(Boolean))].sort().map(name => (
|
||||
<option key={name} value={name}>{name}</option>
|
||||
<button
|
||||
key={name}
|
||||
className={`btn btn-sm ${filterUser === name ? 'btn-primary' : 'btn-outline'}`}
|
||||
onClick={() => setFilterUser(f => f === name ? '' : name)}
|
||||
>
|
||||
{name}
|
||||
</button>
|
||||
))}
|
||||
</select>
|
||||
{(filterCompany || filterUser) && (
|
||||
<button className="btn btn-outline btn-sm" onClick={() => { setFilterCompany(''); setFilterUser(''); }}>
|
||||
Clear Filters
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{submissions.length === 0 ? (
|
||||
<div className="empty-state">
|
||||
|
||||
Reference in New Issue
Block a user