Browse Engines By Engine Sizes
- {engineSizes.values.map((engineSize) => (
-
(
+
-
- {engineSize.label}
-
-
+ />
))}
diff --git a/components/layout/search/filters/make-model-filters.tsx b/components/layout/search/filters/make-model-filters.tsx
deleted file mode 100644
index 2e1636f52..000000000
--- a/components/layout/search/filters/make-model-filters.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import { MODEL_FILTER_ID, YEAR_FILTER_ID } from 'lib/constants';
-import { getProductFilters } from 'lib/shopify';
-import { Filter } from 'lib/shopify/types';
-import { getCollectionUrl } from 'lib/utils';
-import kebabCase from 'lodash.kebabcase';
-import Link from 'next/link';
-
-type MakeModelFiltersProps = {
- collection: string;
-};
-
-const MakeModelFilters = async ({ collection }: MakeModelFiltersProps) => {
- if (!collection) return null;
-
- const [, make, model] = collection.split('_');
- if (!make && !model) return null;
-
- let data = null as Filter | null | undefined;
- let title = '';
-
- if (model) {
- data = await getProductFilters({ collection }, YEAR_FILTER_ID);
- title = 'Years';
- } else if (make) {
- data = await getProductFilters({ collection }, MODEL_FILTER_ID);
- title = 'Models';
- }
-
- if (!data?.values || !data?.values.length) return null;
-
- return (
-
-
{title}
-
- {data.values.map((item) => (
- -
-
- {item.label}
-
-
- ))}
-
-
- );
-};
-
-export default MakeModelFilters;
diff --git a/components/layout/search/filters/sub-menu.tsx b/components/layout/search/filters/sub-menu.tsx
index e88cbca8c..490d5368f 100644
--- a/components/layout/search/filters/sub-menu.tsx
+++ b/components/layout/search/filters/sub-menu.tsx
@@ -1,28 +1,79 @@
-import { getMenu } from 'lib/shopify';
-import { getCollectionUrl } from 'lib/utils';
+import { getCollection, getMetaobjectsByIds } from 'lib/shopify';
+import { Metaobject } from 'lib/shopify/types';
+import get from 'lodash.get';
import Link from 'next/link';
+const MenuItem = async ({ collectionId, title }: { collectionId?: string; title: string }) => {
+ if (!collectionId || !title) return null;
+
+ const collection = await getCollection({ id: collectionId });
+
+ if (!collection) return null;
+
+ return (
+
+
+ {title}
+
+
+ );
+};
const SubMenu = async ({ collection }: { collection: string }) => {
- const menu = await getMenu('main-menu');
- const subMenu = menu.find((item) => item.path === getCollectionUrl(collection))?.items || [];
+ const collectionData = await getCollection({ handle: collection });
+
+ if (!collectionData || !collectionData.plpType) return null;
+ let subMenu = [] as Metaobject[];
+ let displayField = '';
+ let title = '';
+
+ if (collectionData.plpType === 'Product Type' && collectionData.lhnLinks) {
+ displayField = 'make';
+ title = 'Make';
+ subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ }
+
+ if (collectionData.plpType === 'Make' && collectionData.lhnLinks) {
+ displayField = 'model';
+ title = 'Model';
+ subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ }
+
+ if (collectionData.plpType === 'Model' && collectionData.lhnLinks) {
+ displayField = 'year';
+ title = 'Year';
+ subMenu = await getMetaobjectsByIds(collectionData.lhnLinks);
+ }
return subMenu.length ? (
-
Manufacturers
+
{title}
{subMenu.map((subMenuItem) => (
- -
-
- {subMenuItem.title}
-
-
+
))}
) : null;
};
+export const SubMenuPlaceholder = () => {
+ return (
+
+ );
+};
export default SubMenu;
diff --git a/components/models/index.tsx b/components/models/index.tsx
deleted file mode 100644
index 937e2b3f1..000000000
--- a/components/models/index.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import { GlobeAltIcon } from '@heroicons/react/24/outline';
-import { MODEL_FILTER_ID } from 'lib/constants';
-import { getProductFilters } from 'lib/shopify';
-import { getCollectionUrl } from 'lib/utils';
-import Link from 'next/link';
-
-const Models = async ({ collectionHandle }: { collectionHandle: string }) => {
- // eg: collectionHandle = transmission_bmw_x5
- const makeFromCollectionHandle = collectionHandle.split('_')[1];
-
- if (!makeFromCollectionHandle) {
- return null;
- }
- const transmissionModels = await getProductFilters(
- { collection: collectionHandle },
- MODEL_FILTER_ID
- );
-
- if (!transmissionModels || transmissionModels.values.length === 0) {
- return null;
- }
-
- const prefix = collectionHandle.startsWith('transmissions') ? 'Transmissions' : 'Engines';
-
- return (
-
-
-
{`Browse ${prefix} By Model`}
-
-
-
- Models
-
-
- {transmissionModels.values.map((model) => (
-
-
{model.label}
-
- ))}
-
-
-
-
- );
-};
-
-export default Models;
diff --git a/components/transmission-codes/index.tsx b/components/transmission-codes/index.tsx
index 2a5289bb8..62f70b6fe 100644
--- a/components/transmission-codes/index.tsx
+++ b/components/transmission-codes/index.tsx
@@ -1,22 +1,47 @@
import { StarIcon } from '@heroicons/react/24/outline';
import Tag from 'components/tag';
-import { TRANSMISSION_CODE_FILTER_ID } from 'lib/constants';
-import { getProductFilters } from 'lib/shopify';
-import { getCollectionUrl } from 'lib/utils';
+import { getCollection, getMetaobjectsByIds } from 'lib/shopify';
+import { Metaobject } from 'lib/shopify/types';
import Link from 'next/link';
-const TransmissionCode = async ({ collectionHandle }: { collectionHandle: string }) => {
- const transmissionCodes = await getProductFilters(
- { collection: collectionHandle },
- TRANSMISSION_CODE_FILTER_ID
- );
+const { STORE_PREFIX } = process.env;
- if (!transmissionCodes || transmissionCodes.values.length === 0) {
+const validStores = ['car-part-planet', 'reman-transmission', 'transmission-locator'];
+
+const LinkBlock = async ({ collectionId, title }: { collectionId?: string; title?: string }) => {
+ if (!collectionId || !title) return null;
+
+ const collection = await getCollection({ id: collectionId });
+
+ if (!collection) return null;
+
+ return (
+
+
{title}
+
+ );
+};
+const TransmissionCode = async ({ collectionHandle }: { collectionHandle: string }) => {
+ const collection = await getCollection({ handle: collectionHandle });
+ if (!collection || !collection.plpType || !validStores.includes(STORE_PREFIX!)) {
+ return null;
+ }
+
+ let transmissionCodes = [] as Metaobject[];
+
+ if (
+ (collection.plpType === 'Product Type' || collection.plpType === 'Make') &&
+ collection.transmissionCodeLinks
+ ) {
+ transmissionCodes = await getMetaobjectsByIds(collection.transmissionCodeLinks);
+ }
+
+ if (!transmissionCodes.length) {
return null;
}
return (
-
+
{`Browse By Transmission Code`}
@@ -26,15 +51,12 @@ const TransmissionCode = async ({ collectionHandle }: { collectionHandle: string
Popular Transmission Codes
- {transmissionCodes.values.map((transmissionCode) => (
-
(
+
-
- {transmissionCode.label}
-
-
+ />
))}