diff --git a/components/StoreView.vue b/components/StoreView.vue
index ea9bdaa7..ae2702a9 100644
--- a/components/StoreView.vue
+++ b/components/StoreView.vue
@@ -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 }}
+
+ {{ sortOrder === 'asc' ? '↑' : '↓' }}
+
@@ -389,8 +392,13 @@ const sorts: Array = [
name: "Recently Added",
param: "recent",
},
+ {
+ name: "Name",
+ param: "name",
+ },
];
const currentSort = ref(sorts[0].param);
+const sortOrder = ref<"asc" | "desc">("desc");
const options: Array = [
...(tags.length > 0
@@ -466,7 +474,7 @@ async function updateGames(query: string, resetGames: boolean) {
results: Array>;
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';
+ }
+}
+
+
\ No newline at end of file
diff --git a/server/api/v1/store/index.get.ts b/server/api/v1/store/index.get.ts
index 9a61e676..377913d1 100644
--- a/server/api/v1/store/index.get.ts
+++ b/server/api/v1/store/index.get.ts
@@ -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;
}
@@ -119,4 +123,4 @@ export default defineEventHandler(async (h3) => {
]);
return { results, count };
-});
+});
\ No newline at end of file