feat: add dropdown configuration for podcast filtering and sorting; remove global loading context

Author: mitchdowney

src/app/podcasts/PodcastsDropdownConfig.ts

@@ -0,0 +1,49 @@
+import { QueryParamsChannelsType, QueryParamsChannelsSort, QueryParamsStatsRange } from "podverse-helpers";
+
+export const typeDropdownMenuItems = [
+  { label: "All", param: "type", value: "all" },
+  { label: "Subscribed", param: "type", value: "subscribed" },
+  { label: "Category", param: "type", value: "category" }
+];
+
+export const sortDropdownMenuItems = [
+  { label: "Recent", param: "sort", value: "recent" },
+  { label: "Oldest", param: "sort", value: "oldest" },
+  { label: "A - Z", param: "sort", value: "alphabetical" },
+  { label: "Top", param: "sort", value: "top" },
+];
+
+export const rangeDropdownMenuItems = [
+  { label: "Day", param: "range", value: "day" },
+  { label: "Week", param: "range", value: "week" },
+  { label: "Month", param: "range", value: "month" },
+  { label: "All Time", param: "range", value: "all-time" },
+];
+
+export function getDropdownConfig(type?: QueryParamsChannelsType, sort?: QueryParamsChannelsSort, range?: QueryParamsStatsRange) {
+  let currentSort = sort;
+  let currentRange = range;
+  let showRangeDropdown = false;
+
+  let typeMenuItems = typeDropdownMenuItems;
+  let sortMenuItems = sortDropdownMenuItems;
+  let rangeMenuItems = rangeDropdownMenuItems;
+
+  if (type === "all" || type === "category") {
+    sortMenuItems = [{ label: "Top", param: "sort", value: "top" }];
+    currentSort = "top";
+    currentRange = currentRange || "day";
+  } else if (type === "subscribed") {
+    sortMenuItems = sortDropdownMenuItems;
+    currentSort = currentSort || "alphabetical";
+  }
+
+  if (currentSort !== "top") {
+    showRangeDropdown = false;
+    rangeMenuItems = [];
+  } else {
+    showRangeDropdown = true;
+  }
+
+  return { typeMenuItems, sortMenuItems, rangeMenuItems, currentSort, currentRange, showRangeDropdown };
+}

src/app/podcasts/page.tsx

@@ -1,9 +1,8 @@
 import { CATEGORY_MAPPING_KEYS, QUERY_PARAMS_STATS_RANGE_VALUES, QUERY_PARAMS_CHANNELS_SORT_VALUES,
-  QUERY_PARAMS_CHANNELS_TYPE_VALUES, getTotalPages, 
-  QueryParamsChannelsType,
-  QueryParamsChannelsSort,
-  QueryParamsStatsRange} from "podverse-helpers";
+  QUERY_PARAMS_CHANNELS_TYPE_VALUES, getTotalPages, QueryParamsChannelsType,
+  QueryParamsChannelsSort, QueryParamsStatsRange } from "podverse-helpers";
 import { z } from "zod";
+import { getDropdownConfig } from "./PodcastsDropdownConfig";
 import PodcastsClient from "./PodcastsClient";
 import { getSSRAuthService } from "../../utils/auth/ssrAuth";
 
@@ -53,7 +52,6 @@ export default async function Podcasts({ searchParams }: { searchParams?: Promis
 async function parseSearchParams(params: PodcastPageProps, isAuthenticated: boolean) {
   const parsed = searchParamsSchema.safeParse(params);
   if (!parsed.success) {
-    console.warn("Invalid search parameters:", parsed.error);
     return {};
   }
   const data = parsed.data;
@@ -62,51 +60,3 @@ async function parseSearchParams(params: PodcastPageProps, isAuthenticated: bool
   }
   return data;
 }
-
-const typeDropdownMenuItems = [
-  { label: "All", param: "type", value: "all" },
-  { label: "Subscribed", param: "type", value: "subscribed" },
-  { label: "Category", param: "type", value: "category" }
-];
-
-const sortDropdownMenuItems = [
-  { label: "Recent", param: "sort", value: "recent" },
-  { label: "Oldest", param: "sort", value: "oldest" },
-  { label: "A - Z", param: "sort", value: "alphabetical" },
-  { label: "Top", param: "sort", value: "top" },
-];
-
-const rangeDropdownMenuItems = [
-  { label: "Day", param: "range", value: "day" },
-  { label: "Week", param: "range", value: "week" },
-  { label: "Month", param: "range", value: "month" },
-  { label: "All Time", param: "range", value: "all-time" },
-];
-
-function getDropdownConfig(type?: QueryParamsChannelsType, sort?: QueryParamsChannelsSort, range?: QueryParamsStatsRange) {
-  let currentSort = sort;
-  let currentRange = range;
-  let showRangeDropdown = false;
-
-  let typeMenuItems = typeDropdownMenuItems;
-  let sortMenuItems = sortDropdownMenuItems;
-  let rangeMenuItems = rangeDropdownMenuItems;
-
-  if (type === "all" || type === "category") {
-    sortMenuItems = [{ label: "Top", param: "sort", value: "top" }];
-    currentSort = "top";
-    currentRange = currentRange || "day";
-  } else if (type === "subscribed") {
-    sortMenuItems = sortDropdownMenuItems;
-    currentSort = currentSort || "alphabetical";
-  }
-
-  if (currentSort !== "top") {
-    showRangeDropdown = false;
-    rangeMenuItems = [];
-  } else {
-    showRangeDropdown = true;
-  }
-
-  return { typeMenuItems, sortMenuItems, rangeMenuItems, currentSort, currentRange, showRangeDropdown };
-}

src/contexts/LoadingGlobal.tsx

@@ -5,7 +5,6 @@ import { DTOAccount } from 'podverse-helpers';
 import { AccountProvider } from '../contexts/Account';
 import { ThemeProvider } from '../contexts/Theme';
 import { ModalsProvider } from '../contexts/Modals';
-import { LoadingSpinnerGlobalProvider } from '../contexts/LoadingGlobal';
 import { UITheme } from '../utils/theme';
 
 export default function Providers({
@@ -26,9 +25,7 @@ export default function Providers({
       <ThemeProvider initialTheme={theme}>
         <AccountProvider ssrLoggedInAccount={ssrLoggedInAccount}>
           <ModalsProvider>
-            <LoadingSpinnerGlobalProvider>
-              {children}
-            </LoadingSpinnerGlobalProvider>
+            {children}
           </ModalsProvider>
         </AccountProvider>
       </ThemeProvider>