From 3e2b3037e3c0d7b69908177417a4c12af246fe68 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yusuf=20Akg=C3=BCl?= <s86116@bht-berlin.de>
Date: Tue, 30 May 2023 01:15:14 +0200
Subject: [PATCH] small optimization
---
app/(content)/(gaming)/games/page.tsx | 2 +-
app/api/games/route.ts | 6 +++---
components/filter-sort-games.tsx | 7 ++++---
components/infinity-scroll.tsx | 6 ++++--
lib/igdb.ts | 4 ++--
5 files changed, 14 insertions(+), 11 deletions(-)
diff --git a/app/(content)/(gaming)/games/page.tsx b/app/(content)/(gaming)/games/page.tsx
index d0f8a42..4ff601b 100644
--- a/app/(content)/(gaming)/games/page.tsx
+++ b/app/(content)/(gaming)/games/page.tsx
@@ -3,7 +3,7 @@ import { InfiniteScrollGames } from "@/components/infinity-scroll";
import ScrollToTop from "@/components/scroll-to-top";
import SearchInput from "@/components/search-input";
-// renders a list of games infinitely (presumably)
+// renders a list of games infinitely
export default async function GamesPage() {
return (
<>
diff --git a/app/api/games/route.ts b/app/api/games/route.ts
index f411fce..7ad46c1 100644
--- a/app/api/games/route.ts
+++ b/app/api/games/route.ts
@@ -30,12 +30,12 @@ export async function GET(req: NextRequest) {
}
const games = await getGames(page,
- search ? search : '',
+ search ? search : undefined,
category ? EGameCategory[category as keyof typeof EGameCategory] : undefined,
genre ? EGameGenres[genre as keyof typeof EGameGenres] : undefined,
filteredPlatforms,
- sortby ? sortby : '',
- order ? order : ''
+ sortby ? sortby : undefined,
+ order ? order : undefined
);
return NextResponse.json(games);
} catch (error) {
diff --git a/components/filter-sort-games.tsx b/components/filter-sort-games.tsx
index bf38172..b1c5746 100644
--- a/components/filter-sort-games.tsx
+++ b/components/filter-sort-games.tsx
@@ -2,7 +2,7 @@
import { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectTrigger, SelectValue } from "@/components/ui/select";
import { usePathname, useRouter, useSearchParams } from "next/navigation";
-import { useEffect, useState } from "react";
+import { useState } from "react";
import { Icons } from "./icons";
import { Button } from "./ui/button";
import { Card } from "./ui/card";
@@ -25,8 +25,8 @@ export default function Sort() {
category: selectedCategory ? `category=${selectedCategory}` : '',
genre: selectedGenre ? `genre=${selectedGenre}` : '',
platform: selectedPlatform ? `platform=${selectedPlatform}` : '',
- sortMethod: selectedSortMethod ? `sortby=${selectedSortMethod}` : '',
- sortOrder: selectedSortOrder ? `order=${selectedSortOrder}` : '',
+ sortMethod: selectedSortMethod == 'total_rating_count' ? '' : `sortby=${selectedSortMethod}`,
+ sortOrder: selectedSortOrder == 'desc' ? '' : `order=${selectedSortOrder}`,
};
const queryParamString = Object.values(urlParams)
@@ -49,6 +49,7 @@ export default function Sort() {
setSelectedGenre('');
setSelectedPlatform('');
setSelectedSortMethod('total_rating_count');
+ setSelectedSortOrder('desc');
}
return (
diff --git a/components/infinity-scroll.tsx b/components/infinity-scroll.tsx
index 179db1d..b165121 100644
--- a/components/infinity-scroll.tsx
+++ b/components/infinity-scroll.tsx
@@ -34,7 +34,7 @@ export function InfiniteScrollGames() {
fetchNextPage,
hasNextPage,
} = useInfiniteQuery(
- ['infiniteGames', params],
+ [params],
async ({ pageParam = 1 }) =>
await fetch(`/api/games/?page=${pageParam}${params}`,
).then((result) => result.json() as Promise<IGame[]>),
@@ -49,7 +49,9 @@ export function InfiniteScrollGames() {
<Card className="p-6">
{status === 'error'
?
- (<span>Uh oh... something went wrong: {(error as Error).message}</span>)
+ (<span className="text-center">
+ Uh oh... something went wrong
+ </span>)
:
(status === 'success' && (
<InfiniteScroll
diff --git a/lib/igdb.ts b/lib/igdb.ts
index c339598..d48e98e 100644
--- a/lib/igdb.ts
+++ b/lib/igdb.ts
@@ -28,7 +28,7 @@ async function getToken(): Promise<IAuth> {
}
// fetches the top 200 games with a rating of 96 or higher
-export async function getGames(page = 1, search?: string, category?: number, genre?: number, platform?: number[], sortby?: string, order?: string): Promise<IGame[]> {
+export async function getGames(page = 1, search?: string, category?: number, genre?: number, platform?: number[], sortby = "total_rating_count", order = "desc"): Promise<IGame[]> {
const auth = await getToken();
const url = new URL(`${IGDB_BASE_URL}/games`);
@@ -42,7 +42,7 @@ export async function getGames(page = 1, search?: string, category?: number, gen
},
body:
`fields name, cover.image_id; limit ${limit}; offset ${offset};
- sort ${sortby ? sortby : "total_rating_count"} ${order ? order : "desc"};
+ sort ${sortby} ${order};
where total_rating_count > 3
& cover != null & total_rating != null & rating != null & age_ratings != null
& name ~ *"${search ? search : ""}"*
--
GitLab