root/tgex-frontend
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: settings page update

Browse Source
This commit is contained in:
ivannoskov
2026-02-02 21:29:06 +03:00
parent 735077e707
commit 233bdf7907
6 changed files with 140 additions and 112 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
components/filters-modal.tsx
View File

@@ -226,10 +226,10 @@ export function FiltersModal({
<DialogHeader>
<DialogTitle className="flex items-center gap-2">
<Filter className="h-5 w-5" />
Фильтры
Фильтры и сортировка
</DialogTitle>
<DialogDescription>
Настройте фильтры для каналов и размещений
Настройте фильтры и сортировку для каналов и размещений
</DialogDescription>
</DialogHeader>
@@ -254,7 +254,6 @@ export function FiltersModal({
: "border-transparent text-muted-foreground hover:text-foreground"
)}
>
<ArrowUpDown className="h-4 w-4" />
Размещения
</button>
</div>
@@ -553,84 +552,87 @@ export function FiltersModal({
</div>
</div>
<div className="space-y-3 pt-2 border-t">
<Label className="text-sm font-medium flex items-center gap-2">
<ArrowUpDown className="h-4 w-4" />
Сортировка внутри каналов
</Label>
<div className="flex gap-2 items-center">
<Select
value={filters.sort?.field || ""}
onValueChange={(field) =>
setFilters({
...filters,
sort: filters.sort
? { ...filters.sort, field }
: { field, direction: "asc" },
})
}
>
<SelectTrigger className="h-8 text-sm w-48">
<SelectValue placeholder="Без сортировки" />
</SelectTrigger>
<SelectContent>
{PLACEMENT_SORT_FIELDS.map((field) => (
<SelectItem key={field.key} value={field.key}>
{field.label}
</SelectItem>
))}
</SelectContent>
</Select>
{filters.sort && (
<div className="flex gap-1 p-0.5 border rounded-md">
<button
onClick={() =>
setFilters({
...filters,
sort: { ...filters.sort!, direction: "asc" },
})
}
className={cn(
"flex items-center justify-center px-3 py-1 rounded-sm transition-colors text-xs",
filters.sort.direction === "asc"
? "bg-primary text-primary-foreground"
: "hover:bg-muted"
)}
title="По возрастанию"
>
<ArrowUp className="h-3 w-3 mr-1" />
А-Я
</button>
<button
onClick={() =>
setFilters({
...filters,
sort: { ...filters.sort!, direction: "desc" },
})
}
className={cn(
"flex items-center justify-center px-3 py-1 rounded-sm transition-colors text-xs",
filters.sort.direction === "desc"
? "bg-primary text-primary-foreground"
: "hover:bg-muted"
)}
title="По убыванию"
>
<ArrowDown className="h-3 w-3 mr-1" />
Я-А
</button>
</div>
)}
{filters.sort && (
<button
onClick={() =>
setFilters({ ...filters, sort: null })
<div className="pt-4 mt-4 border-t">
<div className="flex items-center gap-2 mb-3">
<ArrowUpDown className="h-4 w-4 text-muted-foreground" />
<h3 className="text-sm font-semibold">Сортировка</h3>
</div>
<div className="space-y-3">
<Label className="text-xs text-muted-foreground">Сортировать размещения внутри каналов</Label>
<div className="flex gap-2 items-center">
<Select
value={filters.sort?.field || ""}
onValueChange={(field) =>
setFilters({
...filters,
sort: filters.sort
? { ...filters.sort, field }
: { field, direction: "asc" },
})
}
className="text-xs text-muted-foreground hover:text-foreground underline"
>
Сбросить
</button>
)}
<SelectTrigger className="h-8 text-sm w-48">
<SelectValue placeholder="Без сортировки" />
</SelectTrigger>
<SelectContent>
{PLACEMENT_SORT_FIELDS.map((field) => (
<SelectItem key={field.key} value={field.key}>
{field.label}
</SelectItem>
))}
</SelectContent>
</Select>
{filters.sort && (
<div className="flex gap-1 p-0.5 border rounded-md">
<button
onClick={() =>
setFilters({
...filters,
sort: { ...filters.sort!, direction: "asc" },
})
}
className={cn(
"flex items-center justify-center px-3 py-1 rounded-sm transition-colors text-xs",
filters.sort.direction === "asc"
? "bg-primary text-primary-foreground"
: "hover:bg-muted"
)}
title="По возрастанию"
>
<ArrowUp className="h-3 w-3 mr-1" />
А-Я
</button>
<button
onClick={() =>
setFilters({
...filters,
sort: { ...filters.sort!, direction: "desc" },
})
}
className={cn(
"flex items-center justify-center px-3 py-1 rounded-sm transition-colors text-xs",
filters.sort.direction === "desc"
? "bg-primary text-primary-foreground"
: "hover:bg-muted"
)}
title="По убыванию"
>
<ArrowDown className="h-3 w-3 mr-1" />
Я-А
</button>
</div>
)}
{filters.sort && (
<button
onClick={() =>
setFilters({ ...filters, sort: null })
}
className="text-xs text-muted-foreground hover:text-foreground underline"
>
Сбросить
</button>
)}
</div>
</div>
</div>
</div>