starred/linsa-linsa-io
1
0
Fork 0
mirror of https://github.com/linsa-io/linsa.git synced 2026-04-17 14:09:50 +02:00
Code Issues 2 Packages Projects Releases Wiki Activity

link filter title/manual closing

Browse Source
This commit is contained in:
marshennikovaolga
2024-08-19 15:46:53 +03:00
parent 9aad4a3603
commit 7cbfcc705b
1 changed files with 8 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
web/components/routes/link/header.tsx
View File

@@ -91,15 +91,21 @@ const TabItem = ({ url, label, isActive, onClick }: TabItemProps) => {
const FilterAndSort = () => { const FilterAndSort = () => {
const [sort, setSort] = useAtom(linkSortAtom) const [sort, setSort] = useAtom(linkSortAtom)
const [sortOpen, setSortOpen] = React.useState(false)
const getFilterText = () => { const getFilterText = () => {
return sort.charAt(0).toUpperCase() + sort.slice(1) return sort.charAt(0).toUpperCase() + sort.slice(1)
} }
const handleSortChange = (value: string) => {
setSort(value)
setSortOpen(false)
}
return ( return (
<div className="flex w-auto items-center justify-end"> <div className="flex w-auto items-center justify-end">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Popover> <Popover open={sortOpen} onOpenChange={setSortOpen}>
<PopoverTrigger asChild> <PopoverTrigger asChild>
<Button size="sm" type="button" variant="secondary" className="gap-x-2 text-sm"> <Button size="sm" type="button" variant="secondary" className="gap-x-2 text-sm">
<ListFilterIcon size={16} className="text-primary/60" /> <ListFilterIcon size={16} className="text-primary/60" />
@@ -111,7 +117,7 @@ const FilterAndSort = () => {
<div className="flex min-w-8 flex-row items-center"> <div className="flex min-w-8 flex-row items-center">
<Label>Sort by</Label> <Label>Sort by</Label>
<div className="flex flex-auto flex-row items-center justify-end"> <div className="flex flex-auto flex-row items-center justify-end">
<Select value={sort} onValueChange={setSort}> <Select value={sort} onValueChange={handleSortChange}>
<SelectTrigger className="h-6 w-auto"> <SelectTrigger className="h-6 w-auto">
<SelectValue placeholder="Select"></SelectValue> <SelectValue placeholder="Select"></SelectValue>
</SelectTrigger> </SelectTrigger>