wisecolt/q-buffer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): select bileşenini geliştir

Browse Source 
Scroll butonları, metin kısaltma ve genişlik ayarlamaları ekleyerek
Select bileşenini daha kullanıcı dostu hale getirildi. TimerPage
düzenlemesi yeni özelliklere uyum sağlamak için güncellendi.
This commit is contained in:
wisecolt
2026-01-09 16:52:09 +03:00
parent f6d54ca623
commit 8089a816ad
2 changed files with 104 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
apps/web/src/pages/TimerPage.tsx
View File

@@ -337,44 +337,42 @@ export const TimerPage = () => {
<div className="min-w-0 space-y-6">
<Card>
<CardHeader>
<div className="flex flex-wrap items-center justify-between gap-3">
<CardTitle className="flex items-center gap-2">
<FontAwesomeIcon icon={faHourglassHalf} className="text-slate-400" />
Zamanlayıcı Torrentleri
</CardTitle>
<div className="flex items-center gap-2 text-xs font-semibold text-slate-500">
<span>Sıralama</span>
<Select
value={sortKey}
onValueChange={(value) => {
if (value !== sortKey) {
setSortKey(value as typeof sortKey);
setSortDirection("asc");
}
}}
>
<SelectTrigger className="h-9 min-w-[180px] text-xs">
<SelectValue />
</SelectTrigger>
<SelectContent>
{sortOptions.map((option) => (
<SelectItem
key={option.value}
value={option.value}
onClick={() => {
if (option.value === sortKey) {
setSortDirection((current) =>
current === "asc" ? "desc" : "asc"
);
}
}}
>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<CardTitle className="flex items-center gap-2">
<FontAwesomeIcon icon={faHourglassHalf} className="text-slate-400" />
Zamanlayıcı Torrentleri
</CardTitle>
<div className="flex items-center gap-2 text-xs font-semibold text-slate-500">
<span>Sıralama</span>
<Select
value={sortKey}
onValueChange={(value) => {
if (value !== sortKey) {
setSortKey(value as typeof sortKey);
setSortDirection("asc");
}
}}
>
<SelectTrigger className="h-9 w-[180px] text-xs">
<SelectValue />
</SelectTrigger>
<SelectContent align="end">
{sortOptions.map((option) => (
<SelectItem
key={option.value}
value={option.value}
onClick={() => {
if (option.value === sortKey) {
setSortDirection((current) =>
current === "asc" ? "desc" : "asc"
);
}
}}
>
{option.label}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</CardHeader>
<CardContent className="space-y-4">