diff --git a/frontend/components/common/InstantSearchProvider.tsx b/frontend/components/common/InstantSearchProvider.tsx index e1808690..41a937b4 100644 --- a/frontend/components/common/InstantSearchProvider.tsx +++ b/frontend/components/common/InstantSearchProvider.tsx @@ -64,7 +64,7 @@ export function InstantSearchProvider({ const routing: RouterProps = { stateMapping: { stateToRoute(uiState) { - const indexUiState = uiState['main-product-list-index']; + const indexUiState = uiState[indexName]; if (!indexUiState) { return {}; } @@ -117,7 +117,7 @@ export function InstantSearchProvider({ }); } return { - ['main-product-list-index']: stateObject, + [indexName]: stateObject, }; }, }, diff --git a/frontend/lib/strapi-sdk/generated/sdk.ts b/frontend/lib/strapi-sdk/generated/sdk.ts index 8f6bb347..29ab629e 100644 --- a/frontend/lib/strapi-sdk/generated/sdk.ts +++ b/frontend/lib/strapi-sdk/generated/sdk.ts @@ -3471,37 +3471,7 @@ export type GetProductListQuery = { callToActionLabel: string; url: string; } - | { - __typename: 'ComponentProductListFeaturedProductList'; - id: string; - productList?: { - __typename?: 'ProductListEntityResponse'; - data?: { - __typename?: 'ProductListEntity'; - attributes?: { - __typename?: 'ProductList'; - handle: string; - type?: Enum_Productlist_Type | null; - title: string; - deviceTitle?: string | null; - description: string; - filters?: string | null; - image?: { - __typename?: 'UploadFileEntityResponse'; - data?: { - __typename?: 'UploadFileEntity'; - attributes?: { - __typename?: 'UploadFile'; - alternativeText?: string | null; - url: string; - formats?: any | null; - } | null; - } | null; - } | null; - } | null; - } | null; - } | null; - } + | { __typename: 'ComponentProductListFeaturedProductList' } | { __typename: 'ComponentProductListLinkedProductListSet'; id: string; @@ -4349,30 +4319,6 @@ export const GetProductListDocument = ` id tags } - ... on ComponentProductListFeaturedProductList { - id - productList { - data { - attributes { - handle - type - title - deviceTitle - description - filters - image { - data { - attributes { - alternativeText - url - formats - } - } - } - } - } - } - } ... on ComponentProductListLinkedProductListSet { id title diff --git a/frontend/lib/strapi-sdk/operations/getProductList.graphql b/frontend/lib/strapi-sdk/operations/getProductList.graphql index 3bc1a41c..de4d51b4 100644 --- a/frontend/lib/strapi-sdk/operations/getProductList.graphql +++ b/frontend/lib/strapi-sdk/operations/getProductList.graphql @@ -144,30 +144,6 @@ query getProductList($filters: ProductListFiltersInput) { id tags } - ... on ComponentProductListFeaturedProductList { - id - productList { - data { - attributes { - handle - type - title - deviceTitle - description - filters - image { - data { - attributes { - alternativeText - url - formats - } - } - } - } - } - } - } ... on ComponentProductListLinkedProductListSet { id title diff --git a/frontend/models/product-list/index.ts b/frontend/models/product-list/index.ts index 54ae28b6..68cd2b84 100644 --- a/frontend/models/product-list/index.ts +++ b/frontend/models/product-list/index.ts @@ -5,7 +5,6 @@ export { FacetWidgetType, } from './types'; export type { - FeaturedProductList, iFixitPage, ProductList, ProductListPreview, diff --git a/frontend/models/product-list/server.ts b/frontend/models/product-list/server.ts index e4ce7e34..9b2ebc21 100644 --- a/frontend/models/product-list/server.ts +++ b/frontend/models/product-list/server.ts @@ -393,39 +393,6 @@ function createProductListSection( tags: section.tags || null, }; } - case 'ComponentProductListFeaturedProductList': { - const productList = section.productList?.data?.attributes; - if (productList == null) { - return null; - } - const image = productList.image?.data?.attributes; - - const algoliaApiKey = createPublicAlgoliaKey( - ALGOLIA_APP_ID, - ALGOLIA_API_KEY - ); - - return { - type: ProductListSectionType.FeaturedProductList, - id: section.id, - productList: { - handle: productList.handle, - title: productList.title, - type: getProductListType(productList.type), - deviceTitle: productList.deviceTitle ?? null, - description: productList.description, - image: - image == null - ? null - : getImageFromStrapiImage(image, 'thumbnail'), - filters: productList.filters ?? null, - algolia: { - indexName: ALGOLIA_PRODUCT_INDEX_NAME, - apiKey: algoliaApiKey, - }, - }, - }; - } case 'ComponentProductListLinkedProductListSet': { return { type: ProductListSectionType.ProductListSet, diff --git a/frontend/models/product-list/types.ts b/frontend/models/product-list/types.ts index f555e3cd..10c77607 100644 --- a/frontend/models/product-list/types.ts +++ b/frontend/models/product-list/types.ts @@ -132,14 +132,12 @@ export interface ProductListImage { export enum ProductListSectionType { Banner = 'banner', RelatedPosts = 'related-posts', - FeaturedProductList = 'featured-product-list', ProductListSet = 'product-list-set', } export type ProductListSection = | ProductListBannerSection | ProductListRelatedPostsSection - | ProductListFeaturedProductListSection | ProductListProductListSetSection; export interface ProductListBannerSection { @@ -157,26 +155,6 @@ export interface ProductListRelatedPostsSection { tags: string | null; } -export interface ProductListFeaturedProductListSection { - type: ProductListSectionType.FeaturedProductList; - id: string; - productList: FeaturedProductList; -} - -export interface FeaturedProductList { - algolia: { - apiKey: string; - indexName: string; - }; - handle: string; - title: string; - type: ProductListType; - deviceTitle: string | null; - description: string; - image: ProductListImage | null; - filters: string | null; -} - export interface ProductListProductListSetSection { type: ProductListSectionType.ProductListSet; id: string; diff --git a/frontend/templates/product-list/ProductListView.tsx b/frontend/templates/product-list/ProductListView.tsx index abb00358..370356f7 100644 --- a/frontend/templates/product-list/ProductListView.tsx +++ b/frontend/templates/product-list/ProductListView.tsx @@ -2,12 +2,11 @@ import { VStack } from '@chakra-ui/react'; import { computeProductListAlgoliaFilterPreset } from '@helpers/product-list-helpers'; import { Wrapper } from '@ifixit/ui'; import { ProductList, ProductListSectionType } from '@models/product-list'; -import { Configure, Index } from 'react-instantsearch-hooks-web'; +import { Configure } from 'react-instantsearch-hooks-web'; import { MetaTags } from './MetaTags'; import { SecondaryNavigation } from './SecondaryNavigation'; import { BannerSection, - FeaturedProductListSection, FilterableProductsSection, HeroSection, ProductListChildrenSection, @@ -32,19 +31,17 @@ export function ProductListView({ - - - - {productList.heroImage ? ( - - ) : ( - - )} - {productList.children.length > 0 && ( - - )} - - + + + {productList.heroImage ? ( + + ) : ( + + )} + {productList.children.length > 0 && ( + + )} + {productList.sections.map((section, index) => { switch (section.type) { case ProductListSectionType.Banner: { @@ -65,19 +62,6 @@ export function ProductListView({ ); return ; } - case ProductListSectionType.FeaturedProductList: { - const { productList } = section; - if (productList) { - return ( - - ); - } - return null; - } case ProductListSectionType.ProductListSet: { const { title, productLists } = section; if (productLists.length > 0) { diff --git a/frontend/templates/product-list/sections/FeaturedProductListSection.tsx b/frontend/templates/product-list/sections/FeaturedProductListSection.tsx deleted file mode 100644 index 3e2323cc..00000000 --- a/frontend/templates/product-list/sections/FeaturedProductListSection.tsx +++ /dev/null @@ -1,222 +0,0 @@ -import { - Box, - Button, - Flex, - Heading, - HStack, - LinkBox, - LinkOverlay, - SimpleGrid, - Text, - VStack, -} from '@chakra-ui/react'; -import { - ProductCard, - ProductCardBadgeList, - ProductCardBody, - ProductCardDiscountBadge, - ProductCardImage, - ProductCardRating, - ProductCardSoldOutBadge, - ProductCardTitle, -} from '@components/common'; -import { Card } from '@components/ui'; -import { computeProductListAlgoliaFilterPreset } from '@helpers/product-list-helpers'; -import { useAppContext } from '@ifixit/app'; -import { FeaturedProductList, ProductSearchHit } from '@models/product-list'; -import { ResponsiveImage, ProductVariantPrice, useUserPrice } from '@ifixit/ui'; -import NextLink from 'next/link'; -import { Configure, Index, useHits } from 'react-instantsearch-hooks-web'; -import { productListPath } from '@helpers/path-helpers'; -import { useProductSearchHitPricing } from './FilterableProductsSection/useProductSearchHitPricing'; - -export interface FeaturedProductListSectionProps { - productList: FeaturedProductList; - index: number; -} - -export function FeaturedProductListSection({ - productList, - index, -}: FeaturedProductListSectionProps) { - const filters = computeProductListAlgoliaFilterPreset(productList); - return ( - - - - {productList.image && ( - - )} - - - - - {productList.title} - - - {productList.description} - - - - - - - - - - - - - - - - ); -} - -function ProductGrid() { - const { hits } = useHits(); - return ( - - {hits.map((hit) => { - return ; - })} - - ); -} - -interface ProductListItemProps { - product: ProductSearchHit; -} - -function ProductListItem({ product }: ProductListItemProps) { - const appContext = useAppContext(); - const { price, compareAtPrice, isDiscounted, percentage, proPricesByTier } = - useProductSearchHitPricing(product); - const isSoldOut = product.quantity_available <= 0; - - const { isProPrice } = useUserPrice({ - price, - compareAtPrice, - proPricesByTier, - }); - - return ( - - - - - {isSoldOut ? ( - - ) : ( - isDiscounted && ( - - ) - )} - - - - - {product.title} - - - - - - - - - - ); -} diff --git a/frontend/templates/product-list/sections/index.ts b/frontend/templates/product-list/sections/index.ts index 18612cda..e6753be0 100644 --- a/frontend/templates/product-list/sections/index.ts +++ b/frontend/templates/product-list/sections/index.ts @@ -3,5 +3,4 @@ export * from './RelatedPostsSection'; export * from './FilterableProductsSection'; export * from './HeroSection'; export * from './ProductListChildrenSection'; -export * from './FeaturedProductListSection'; export * from './ProductListSetSection';