diff --git a/components/home-page/manufacturers.tsx b/components/home-page/manufacturers.tsx
index b0f83870a..23b93f4ab 100644
--- a/components/home-page/manufacturers.tsx
+++ b/components/home-page/manufacturers.tsx
@@ -1,5 +1,4 @@
import ManufacturersGrid from 'components/manufacturers-grid';
-import Tag from 'components/tag';
import { getMetaobjects } from 'lib/shopify';
const Manufacturers = async ({
@@ -17,12 +16,9 @@ const Manufacturers = async ({
};
return (
-
-
-
-
{`Browse ${title[variant]} By Manufacturer`}
-
-
+
+
{`Browse ${title[variant]} By Manufacturer`}
+
);
};
diff --git a/components/layout/search/bottom-content.tsx b/components/layout/search/bottom-content.tsx
new file mode 100644
index 000000000..45cbee47a
--- /dev/null
+++ b/components/layout/search/bottom-content.tsx
@@ -0,0 +1,56 @@
+import EngineSizes from 'components/engine-sizes';
+import Manufacturers from 'components/home-page/manufacturers';
+import Content from 'components/plp/content';
+import Tag from 'components/tag';
+import TransmissionCode from 'components/transmission-codes';
+import { getCollection } from 'lib/shopify';
+import { Suspense } from 'react';
+
+const manufactureVariantMap: Record<
+ string,
+ 'engines' | 'transmissions' | 'remanufactured-engines' | 'transfer-cases'
+> = {
+ transmissions: 'transmissions',
+ engines: 'engines',
+ 'remanufactured-engines': 'remanufactured-engines',
+ 'transfer-cases': 'transfer-cases'
+};
+
+const BottomContent = async ({ collectionHandle }: { collectionHandle: string }) => {
+ const collection = await getCollection({ handle: collectionHandle });
+
+ if (
+ !collection ||
+ (!collection.dynamicContent && !collection.transmissionCodeLinks && !collection.engineSizeLinks)
+ ) {
+ return null;
+ }
+
+ const [partType] = collectionHandle.split('_');
+
+ return (
+
+
+
+
+
+
+
+
+
+
+ {!collection.plpType || collection.plpType === 'Product Type' ? (
+
+
+
+ ) : null}
+
+
+
+
+
+
+ );
+};
+
+export default BottomContent;
diff --git a/components/layout/search/filters/sub-menu.tsx b/components/layout/search/filters/sub-menu.tsx
index 490d5368f..8f86b4b28 100644
--- a/components/layout/search/filters/sub-menu.tsx
+++ b/components/layout/search/filters/sub-menu.tsx
@@ -18,6 +18,17 @@ const MenuItem = async ({ collectionId, title }: { collectionId?: string; title:
);
};
+
+const sortOptions = (options: Metaobject[], displayField: string) => {
+ return options.toSorted((a, b) =>
+ get(a, displayField).toLowerCase().localeCompare(get(b, displayField).toLowerCase())
+ );
+};
+
+const sortYearOptions = (options: Metaobject[]) => {
+ return options.toSorted((a, b) => parseInt(get(b, 'year'), 10) - parseInt(get(a, 'year'), 10));
+};
+
const SubMenu = async ({ collection }: { collection: string }) => {
const collectionData = await getCollection({ handle: collection });
@@ -29,19 +40,22 @@ const SubMenu = async ({ collection }: { collection: string }) => {
if (collectionData.plpType === 'Product Type' && collectionData.lhnLinks) {
displayField = 'make';
title = 'Make';
- subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ const response = await getMetaobjectsByIds(collectionData.lhnLinks);
+ subMenu = sortOptions(response, displayField);
}
if (collectionData.plpType === 'Make' && collectionData.lhnLinks) {
displayField = 'model';
title = 'Model';
- subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ const response = await getMetaobjectsByIds(collectionData.lhnLinks);
+ subMenu = sortOptions(response, displayField);
}
if (collectionData.plpType === 'Model' && collectionData.lhnLinks) {
displayField = 'year';
title = 'Year';
- subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ const response = await getMetaobjectsByIds(collectionData.lhnLinks);
+ subMenu = sortYearOptions(response);
}
return subMenu.length ? (
diff --git a/components/manufacturers-grid/button-group.tsx b/components/manufacturers-grid/button-group.tsx
index 6532f6685..29e2a8fec 100644
--- a/components/manufacturers-grid/button-group.tsx
+++ b/components/manufacturers-grid/button-group.tsx
@@ -17,7 +17,7 @@ const ButtonGroup = ({ manufacturer }: { manufacturer: Metaobject }) => {
};
return (
-
+