fix make urls

Signed-off-by: Chloe <pinkcloudvnn@gmail.com>

app/page.tsx

@@ -20,10 +20,13 @@ export async function generateMetadata(): Promise<Metadata> {
   };
 }
 
-const manufactureVariant: Record<string, 'home' | 'engines' | 'transmissions'> = {
+const manufactureVariant: Record<
+  string,
+  'home' | 'engines' | 'transmissions' | 'remanufactured-engines'
+> = {
   'reman-transmission': 'transmissions',
   'car-part-planet': 'home',
-  'reman-engine': 'engines',
+  'reman-engine': 'remanufactured-engines',
   'transmission-locator': 'transmissions',
   'engine-locator': 'engines'
 };

app/search/[collection]/page.tsx

@@ -79,11 +79,25 @@ async function CategoryPage({
   );
 }
 
+const manufactureVariantMap: Record<
+  string,
+  'engines' | 'transmissions' | 'remanufactured-engines' | 'transfer-cases'
+> = {
+  transmissions: 'transmissions',
+  engines: 'engines',
+  'remanufactured-engines': 'remanufactured-engines',
+  'transfer-cases': 'transfer-cases'
+};
+
 export default async function CategorySearchPage(props: {
   params: { collection: string };
   searchParams?: { [key: string]: string | string[] | undefined };
 }) {
   const collectionHandle = props.params.collection;
+
+  const manufacturerVariant =
+    Object.keys(manufactureVariantMap).find((key) => collectionHandle.startsWith(key)) || 'engines';
+
   return (
     <>
       <div className="mx-auto mt-6 max-w-screen-2xl px-8 pb-10">
@@ -142,9 +156,7 @@ export default async function CategorySearchPage(props: {
       )}
 
       <Suspense>
-        <Manufacturers
-          variant={(collectionHandle as string).includes('engines') ? 'engines' : 'transmissions'}
-        />
+        <Manufacturers variant={manufactureVariantMap[manufacturerVariant]} />
       </Suspense>
     </>
   );

components/home-page/manufacturers.tsx

@@ -5,13 +5,15 @@ import { getMetaobjects } from 'lib/shopify';
 const Manufacturers = async ({
   variant = 'home'
 }: {
-  variant?: 'engines' | 'transmissions' | 'home';
+  variant?: 'engines' | 'transmissions' | 'home' | 'remanufactured-engines' | 'transfer-cases';
 }) => {
   const manufacturers = await getMetaobjects('make');
   const title: Record<typeof variant, string> = {
     engines: 'Engines',
     home: 'Parts',
-    transmissions: 'Transmissions'
+    transmissions: 'Transmissions',
+    'remanufactured-engines': 'Remanufactured Engines',
+    'transfer-cases': 'Transfer Cases'
   };
 
   return (

components/manufacturers-grid/index.tsx

@@ -1,12 +1,12 @@
 import { GlobeAltIcon, StarIcon } from '@heroicons/react/24/outline';
-import { MAKE_FILTER_ID } from 'lib/constants';
 import { Metaobject } from 'lib/shopify/types';
+import kebabCase from 'lodash.kebabcase';
 import ButtonGroup from './button-group';
 import ManufacturerItem from './item';
 
 type ManufacturersGridProps = {
   manufacturers: Metaobject[];
-  variant?: 'engines' | 'transmissions' | 'home';
+  variant?: 'engines' | 'transmissions' | 'home' | 'remanufactured-engines' | 'transfer-cases';
 };
 
 const ManufacturersGrid = ({ manufacturers, variant = 'home' }: ManufacturersGridProps) => {
@@ -31,7 +31,7 @@ const ManufacturersGrid = ({ manufacturers, variant = 'home' }: ManufacturersGri
                   <ManufacturerItem
                     manufacturer={manufacturer}
                     className="rounded border border-primary px-2 py-1"
-                    href={`/${variant}?${MAKE_FILTER_ID}=${manufacturer.id}`}
+                    href={`/${variant}/${kebabCase(manufacturer.name)}`}
                   />
                 )}
                 {variant === 'home' && <ButtonGroup manufacturer={manufacturer} />}
@@ -57,7 +57,7 @@ const ManufacturersGrid = ({ manufacturers, variant = 'home' }: ManufacturersGri
                 <ManufacturerItem
                   manufacturer={manufacturer}
                   className="rounded border border-primary px-2 py-1"
-                  href={`/${variant}?${MAKE_FILTER_ID}=${manufacturer.id}`}
+                  href={`/${variant}/${kebabCase(manufacturer.name)}`}
                 />
               )}
               {variant === 'home' && <ButtonGroup manufacturer={manufacturer} />}