feat: Add sorting options for links in dashboard

This commit is contained in:
MinerAle 2025-03-02 21:45:43 +01:00
parent c478373970
commit e0b6ffd62b

View file

@ -7,6 +7,7 @@ const limit = 24
let cursor = ''
let listComplete = false
let listError = false
const sortBy = ref('created_desc') // created_desc, created_asc, alpha_asc, alpha_desc
async function getLinks() {
try {
@ -14,6 +15,7 @@ async function getLinks() {
query: {
limit,
cursor,
sort: sortBy.value,
},
})
links.value = links.value.concat(data.links).filter(Boolean) // Sometimes cloudflare will return null, filter out
@ -62,6 +64,40 @@ function updateLinkList(link, type) {
</DashboardNav>
<LazyDashboardLinksSearch />
</div>
<div class="flex gap-2 items-center">
<Button
variant="outline"
size="sm"
:class="{ 'bg-primary text-primary-foreground': sortBy === 'created_desc' }"
@click="sortBy = 'created_desc'; links = []; cursor = ''; getLinks()"
>
Newest First
</Button>
<Button
variant="outline"
size="sm"
:class="{ 'bg-primary text-primary-foreground': sortBy === 'created_asc' }"
@click="sortBy = 'created_asc'; links = []; cursor = ''; getLinks()"
>
Oldest First
</Button>
<Button
variant="outline"
size="sm"
:class="{ 'bg-primary text-primary-foreground': sortBy === 'alpha_asc' }"
@click="sortBy = 'alpha_asc'; links = []; cursor = ''; getLinks()"
>
A to Z
</Button>
<Button
variant="outline"
size="sm"
:class="{ 'bg-primary text-primary-foreground': sortBy === 'alpha_desc' }"
@click="sortBy = 'alpha_desc'; links = []; cursor = ''; getLinks()"
>
Z to A
</Button>
</div>
<section class="grid grid-cols-1 gap-4 md:grid-cols-2 lg:grid-cols-3">
<DashboardLinksLink
v-for="link in links"