Fix remaining usage of query params

dcramer · Oct 1, 2024 · 7340e69 · 7340e69
1 parent 2f7748f
commit 7340e69
Show file tree

Hide file tree

Showing 10 changed files with 82 additions and 52 deletions.
diff --git a/apps/web/src/app/(admin)/admin/(default)/badges/page.tsx b/apps/web/src/app/(admin)/admin/(default)/badges/page.tsx
@@ -4,16 +4,19 @@ import BadgeTable from "@peated/web/components/admin/badgeTable";
 import { Breadcrumbs } from "@peated/web/components/breadcrumbs";
 import Button from "@peated/web/components/button";
 import EmptyActivity from "@peated/web/components/emptyActivity";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
-  const searchParams = useSearchParams();
-  const [badgeList] = trpc.badgeList.useSuspenseQuery({
-    sort: "name",
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    defaults: {
+      sort: "name",
+    },
+    numericFields: ["cursor", "limit"],
   });
 
+  const [badgeList] = trpc.badgeList.useSuspenseQuery(queryParams);
+
   return (
     <div>
       <Breadcrumbs

diff --git a/apps/web/src/app/(admin)/admin/(default)/events/page.tsx b/apps/web/src/app/(admin)/admin/(default)/events/page.tsx
@@ -5,17 +5,20 @@ import Button from "@peated/web/components/button";
 import DateRange from "@peated/web/components/dateRange";
 import EmptyActivity from "@peated/web/components/emptyActivity";
 import Table from "@peated/web/components/table";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
-  const searchParams = useSearchParams();
-  const [eventList] = trpc.eventList.useSuspenseQuery({
-    sort: "name",
-    onlyUpcoming: false,
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    defaults: {
+      sort: "date",
+      onlyUpcoming: false,
+    },
+    numericFields: ["cursor", "limit"],
   });
 
+  const [eventList] = trpc.eventList.useSuspenseQuery(queryParams);
+
   return (
     <div>
       <Breadcrumbs

diff --git a/apps/web/src/app/(admin)/admin/(default)/locations/[countrySlug]/(tabs)/page.tsx b/apps/web/src/app/(admin)/admin/(default)/locations/[countrySlug]/(tabs)/page.tsx
@@ -1,19 +1,25 @@
 "use client";
 
 import Table from "@peated/web/components/table";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page({
   params: { countrySlug },
 }: {
   params: { countrySlug: string };
 }) {
-  const searchParams = useSearchParams();
-  const [regionList] = trpc.regionList.useSuspenseQuery({
-    country: countrySlug,
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    defaults: {
+      sort: "-created",
+    },
+    numericFields: ["cursor", "limit"],
+    overrides: {
+      country: countrySlug,
+    },
   });
+
+  const [regionList] = trpc.regionList.useSuspenseQuery(queryParams);
   return (
     <div>
       <Table

diff --git a/apps/web/src/app/(admin)/admin/(default)/locations/page.tsx b/apps/web/src/app/(admin)/admin/(default)/locations/page.tsx
@@ -2,14 +2,17 @@
 
 import { Breadcrumbs } from "@peated/web/components/breadcrumbs";
 import Table from "@peated/web/components/table";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
-  const searchParams = useSearchParams();
-  const [countryList] = trpc.countryList.useSuspenseQuery({
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    defaults: {
+      sort: "-created",
+    },
+    numericFields: ["cursor", "limit"],
   });
+  const [countryList] = trpc.countryList.useSuspenseQuery(queryParams);
 
   return (
     <div>

diff --git a/apps/web/src/app/(admin)/admin/(default)/tags/page.tsx b/apps/web/src/app/(admin)/admin/(default)/tags/page.tsx
@@ -4,14 +4,14 @@ import TagTable from "@peated/web/components/admin/tagTable";
 import { Breadcrumbs } from "@peated/web/components/breadcrumbs";
 import Button from "@peated/web/components/button";
 import EmptyActivity from "@peated/web/components/emptyActivity";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
-  const searchParams = useSearchParams();
-  const [tagList] = trpc.tagList.useSuspenseQuery({
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
   });
+  const [tagList] = trpc.tagList.useSuspenseQuery(queryParams);
 
   return (
     <div>

diff --git a/apps/web/src/app/(default)/locations/[countrySlug]/(tabs)/page.tsx b/apps/web/src/app/(default)/locations/[countrySlug]/(tabs)/page.tsx
@@ -3,23 +3,26 @@
 import EmptyActivity from "@peated/web/components/emptyActivity";
 import EntityTable from "@peated/web/components/entityTable";
 import PaginationButtons from "@peated/web/components/paginationButtons";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page({
   params: { countrySlug },
 }: {
   params: { countrySlug: string };
 }) {
-  const searchParams = useSearchParams();
-  const [[topEntityList]] = trpc.useSuspenseQueries((t) => [
-    t.entityList({
-      ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
+    overrides: {
       country: countrySlug,
       type: "distiller",
       sort: "-bottles",
       limit: 20,
-    }),
+    },
+  });
+
+  const [[topEntityList]] = trpc.useSuspenseQueries((t) => [
+    t.entityList(queryParams),
   ]);
 
   return (

diff --git a/apps/web/src/app/(default)/locations/[countrySlug]/(tabs)/regions/page.tsx b/apps/web/src/app/(default)/locations/[countrySlug]/(tabs)/regions/page.tsx
@@ -1,22 +1,25 @@
 "use client";
 
 import Table from "@peated/web/components/table";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page({
   params: { countrySlug },
 }: {
   params: { countrySlug: string };
 }) {
-  const searchParams = useSearchParams();
-  const [[regionList]] = trpc.useSuspenseQueries((t) => [
-    t.regionList({
-      ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
+    overrides: {
       country: countrySlug,
       sort: "-bottles",
       limit: 100,
-    }),
+    },
+  });
+
+  const [[regionList]] = trpc.useSuspenseQueries((t) => [
+    t.regionList(queryParams),
   ]);
 
   return (

diff --git a/apps/web/src/app/(default)/locations/[countrySlug]/regions/[regionSlug]/(tabs)/page.tsx b/apps/web/src/app/(default)/locations/[countrySlug]/regions/[regionSlug]/(tabs)/page.tsx
@@ -3,24 +3,27 @@
 import EmptyActivity from "@peated/web/components/emptyActivity";
 import EntityTable from "@peated/web/components/entityTable";
 import PaginationButtons from "@peated/web/components/paginationButtons";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page({
   params: { countrySlug, regionSlug },
 }: {
   params: { countrySlug: string; regionSlug: string };
 }) {
-  const searchParams = useSearchParams();
-  const [[topEntityList]] = trpc.useSuspenseQueries((t) => [
-    t.entityList({
-      ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
+    overrides: {
       country: countrySlug,
       region: regionSlug,
       type: "distiller",
       sort: "-bottles",
       limit: 20,
-    }),
+    },
+  });
+
+  const [[topEntityList]] = trpc.useSuspenseQueries((t) => [
+    t.entityList(queryParams),
   ]);
 
   return (

diff --git a/apps/web/src/app/(default)/notifications/(tabs)/all/page.tsx b/apps/web/src/app/(default)/notifications/(tabs)/all/page.tsx
@@ -2,18 +2,21 @@
 
 import EmptyActivity from "@peated/web/components/emptyActivity";
 import NotificationList from "@peated/web/components/notifications/list";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import useAuthRequired from "@peated/web/hooks/useAuthRequired";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
   useAuthRequired();
 
-  const searchParams = useSearchParams();
-  const [notificationList] = trpc.notificationList.useSuspenseQuery({
-    filter: "all",
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
+    overrides: {
+      filter: "all",
+    },
   });
+  const [notificationList] =
+    trpc.notificationList.useSuspenseQuery(queryParams);
 
   return notificationList.results.length ? (
     <NotificationList values={notificationList.results} />

diff --git a/apps/web/src/app/(default)/notifications/(tabs)/page.tsx b/apps/web/src/app/(default)/notifications/(tabs)/page.tsx
@@ -2,18 +2,21 @@
 
 import EmptyActivity from "@peated/web/components/emptyActivity";
 import NotificationList from "@peated/web/components/notifications/list";
+import useApiQueryParams from "@peated/web/hooks/useApiQueryParams";
 import useAuthRequired from "@peated/web/hooks/useAuthRequired";
 import { trpc } from "@peated/web/lib/trpc/client";
-import { useSearchParams } from "next/navigation";
 
 export default function Page() {
   useAuthRequired();
 
-  const searchParams = useSearchParams();
-  const [notificationList] = trpc.notificationList.useSuspenseQuery({
-    filter: "unread",
-    ...Object.fromEntries(searchParams.entries()),
+  const queryParams = useApiQueryParams({
+    numericFields: ["cursor", "limit"],
+    overrides: {
+      filter: "unread",
+    },
   });
+  const [notificationList] =
+    trpc.notificationList.useSuspenseQuery(queryParams);
 
   return notificationList.results.length ? (
     <NotificationList values={notificationList.results} />