cosmetics

lib/routing.ts

@@ -74,11 +74,11 @@ export const resolveUrlPath = (context: ResolutionContext) => {
     }
     case contentTypes.product.codename: {
       if ("terms" in context) {
-        const query = createQueryStringUrl({
+        const query = createQueryString({
           category: context.terms as string[],
           page: context.page?.toString() || undefined
         })
-        return `/${reservedListingSlugs.products}${query}`
+        return `/${reservedListingSlugs.products}?${query}`
       }
 
       return `/${reservedListingSlugs.products}/${context.slug}`;
@@ -120,7 +120,7 @@ export const resolveReference = (reference: Reference) => {
   return collectionDomain + urlPath;
 }
 
-export const createQueryStringUrl = (params: Record<string, string | string[] | undefined>) => {
+export const createQueryString = (params: Record<string, string | string[] | undefined>) => {
   const queryString = Object.entries(params).map(
     ([paramKey, paramValue]) => {
       if (!paramValue) {
@@ -133,5 +133,5 @@ export const createQueryStringUrl = (params: Record<string, string | string[] |
     },
   ).filter(p => p !== undefined).join('&');
 
-  return Object.keys(params).length > 0 ? `?${queryString}` : '';
+  return Object.keys(params).length > 0 ? `${queryString}` : '';
 }

pages/products/index.tsx

@@ -9,7 +9,7 @@ import { AppPage } from "../../components/shared/ui/appPage";
 import { mainColorBgClass } from "../../lib/constants/colors";
 import { ProductsPageSize } from "../../lib/constants/paging";
 import { getDefaultMetadata, getItemBySlug, getProductsForListing, getSiteMenu } from "../../lib/kontentClient";
-import { createQueryStringUrl, reservedListingSlugs, resolveUrlPath } from "../../lib/routing";
+import { createQueryString, reservedListingSlugs, resolveUrlPath } from "../../lib/routing";
 import { ValidCollectionCodename } from "../../lib/types/perCollection";
 import { changeUrlQueryString } from "../../lib/utils/changeUrlQueryString";
 import { siteCodename } from "../../lib/utils/env";
@@ -80,9 +80,9 @@ export const Products: FC<Props> = props => {
 
 
   const getProducts = useCallback(async () => {
-    const queryStringUrl = createQueryStringUrl({ preview: props.isPreview.toString(), page, category })
+    const queryString = createQueryString({ preview: props.isPreview.toString(), page, category })
 
-    const response = await fetch(`/api/products${queryStringUrl}`);
+    const response = await fetch(`/api/products?${queryString}`);
     const newData = await response.json();
 
     setProducts(newData.products);