blyzer/graphs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Allow searching sellers in client filters
All checks were successful
Build and Deploy / build-and-deploy (push) Successful in 2m5s
Details

Browse Source
This commit is contained in:
Cauê Faleiros
2026-06-24 11:18:27 -03:00
parent b7a2059070
commit aeb801c0ba
3 changed files with 41 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/Clients.tsx
View File

@@ -104,6 +104,7 @@ const dateFilterPresets = [
];
const filterSelectClassName = "w-full h-9 bg-dark-input border border-dark-border text-dark-text text-sm rounded-lg px-3 focus:outline-none focus:border-brand-primary transition-colors cursor-pointer";
const filterInputClassName = "w-full h-9 bg-dark-input border border-dark-border text-dark-text text-sm rounded-lg px-3 focus:outline-none focus:border-brand-primary transition-colors";
const Clients = () => {
const { dateRange, setDateRange } = useOutletContext<{
@@ -350,6 +351,19 @@ const Clients = () => {
return [fallbackSeller, ...filterOptions.sellers];
}, [filterOptions.sellers, metadataFilters.seller]);
const sellerSuggestions = useMemo(() => {
const suggestions = new Set<string>();
sellerOptions.forEach(seller => {
const label = getSellerOptionLabel(seller);
if (seller.name) suggestions.add(seller.name);
if (seller.id) suggestions.add(seller.id);
if (label) suggestions.add(label);
});
return [...suggestions].filter(Boolean);
}, [sellerOptions]);
const activeMetadataFilters = useMemo(() => {
const filters = [];
const selectedSeller = sellerOptions.find(seller => seller.value === metadataFilters.seller);
@@ -515,16 +529,19 @@ const Clients = () => {
<label className="block text-xs font-bold uppercase tracking-wider text-dark-muted">
Vendedor
<select
<input
type="text"
list="client-seller-filter-options"
value={metadataFilters.seller}
onChange={(event) => updateMetadataFilter('seller', event.target.value)}
className={`${filterSelectClassName} mt-1`}
>
<option value="">Todos</option>
{sellerOptions.map(seller => (
<option key={seller.value} value={seller.value}>{getSellerOptionLabel(seller)}</option>
placeholder="Todos"
className={`${filterInputClassName} mt-1`}
/>
<datalist id="client-seller-filter-options">
{sellerSuggestions.map(seller => (
<option key={seller} value={seller} />
))}
</select>
</datalist>
</label>
<label className="block text-xs font-bold uppercase tracking-wider text-dark-muted">