Ryan/drop
1
0
Fork 0
mirror of https://github.com/Drop-OSS/drop.git synced 2025-11-10 04:22:09 +10:00
Code Issues Packages Projects Releases Wiki Activity

Add store sort options (#238) (#261)

Browse Source 
This commit adds the option
to sort store items by name,
and to choose the sort order.

Co-authored-by: udifogiel <udifogiel@proton.me>
This commit is contained in:
laylafogiel-hash
2025-10-13 03:20:48 +03:00
committed by GitHub
parent f5cb856d3d
commit 97c6f3490c
2 changed files with 33 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
components/StoreView.vue
View File

@ -176,9 +176,12 @@
active ? 'bg-zinc-900 outline-hidden' : '',
'w-full text-left block px-4 py-2 text-sm',
]"
@click="() => (currentSort = option.param)"
@click.prevent="handleSortClick(option, $event)"
>
{{ option.name }}
<span v-if="currentSort === option.param">
{{ sortOrder === 'asc' ? '↑' : '↓' }}
</span>
</button>
</MenuItem>
</div>
@ -389,8 +392,13 @@ const sorts: Array<StoreSortOption> = [
name: "Recently Added",
param: "recent",
},
{
name: "Name",
param: "name",
},
];
const currentSort = ref(sorts[0].param);
const sortOrder = ref<"asc" | "desc">("desc");
const options: Array<StoreFilterOption> = [
...(tags.length > 0
@ -466,7 +474,7 @@ async function updateGames(query: string, resetGames: boolean) {
results: Array<SerializeObject<GameModel>>;
count: number;
}>(
`/api/v1/store?take=50&skip=${resetGames ? 0 : games.value?.length || 0}&sort=${currentSort.value}${query ? "&" + query : ""}`,
`/api/v1/store?take=50&skip=${resetGames ? 0 : games.value?.length || 0}&sort=${currentSort.value}&order=${sortOrder.value}${query ? "&" + query : ""}`,
);
if (resetGames) {
games.value = newValues.results;
@ -483,6 +491,20 @@ watch(filterQuery, (newUrl) => {
watch(currentSort, (_) => {
updateGames(filterQuery.value, true);
});
watch(sortOrder, (_) => {
updateGames(filterQuery.value, true);
});
await updateGames(filterQuery.value, true);
function handleSortClick(option: StoreSortOption, event: MouseEvent) {
event.stopPropagation();
if (currentSort.value === option.param) {
sortOrder.value = sortOrder.value === 'asc' ? 'desc' : 'asc';
} else {
currentSort.value = option.param;
sortOrder.value = option.param === 'name' ? 'asc' : 'desc';
}
}
</script>

10
server/api/v1/store/index.get.ts
View File

@ -18,7 +18,8 @@ const StoreRead = type({
company: "string?",
companyActions: "string = 'published,developed'",
sort: "'default' | 'newest' | 'recent' = 'default'",
sort: "'default' | 'newest' | 'recent' | 'name' = 'default'",
order: "'asc' | 'desc' = 'desc'",
});
export default defineEventHandler(async (h3) => {
@ -101,10 +102,13 @@ export default defineEventHandler(async (h3) => {
switch (options.sort) {
case "default":
case "newest":
sort.mReleased = "desc";
sort.mReleased = options.order;
break;
case "recent":
sort.created = "desc";
sort.created = options.order;
break;
case "name":
sort.mName = options.order;
break;
}