diff --git a/components/product/Swatch/Swatch.tsx b/components/product/Swatch/Swatch.tsx index 94bcd8575..bb8abf3d1 100644 --- a/components/product/Swatch/Swatch.tsx +++ b/components/product/Swatch/Swatch.tsx @@ -44,16 +44,17 @@ const Swatch: FC & SwatchProps> = ({ className={swatchClassName} style={color ? { backgroundColor: color } : {}} aria-label="Variant Swatch" + {...(label && color && { title: label })} {...props} > - {variant === 'color' && active && ( + {color && active && ( )} - {variant !== 'color' ? label : null} + {!color ? label : null} ) } -export default Swatch \ No newline at end of file +export default Swatch diff --git a/framework/shopify/utils/normalize.ts b/framework/shopify/utils/normalize.ts index 56764b95d..e86872ef9 100644 --- a/framework/shopify/utils/normalize.ts +++ b/framework/shopify/utils/normalize.ts @@ -14,6 +14,7 @@ import { ProductOption, Page as ShopifyPage, PageEdge, + Collection, } from '../schema' import { colorMap } from '@lib/colors' @@ -38,7 +39,7 @@ const normalizeProductOption = ({ label: value, } if (displayName.match(/colou?r/gi)) { - const mapedColor = colorMap[value] + const mapedColor = colorMap[value.toLowerCase().replace(/ /g, '')] if (mapedColor) { output = { ...output, @@ -183,10 +184,13 @@ export const normalizePage = ( export const normalizePages = (edges: PageEdge[], locale: string): Page[] => edges?.map((edge) => normalizePage(edge.node, locale)) -export const normalizeCategory = (category: any): Category => ({ - id: category.id, - name: category.name, - slug: category.handle, - path: `/${category.handle}`, +export const normalizeCategory = ({ + title: name, + handle, + id, +}: Collection): Category => ({ + id, + name, + slug: handle, + path: `/${handle}`, }) - diff --git a/tsconfig.json b/tsconfig.json index 589512621..96e4359e5 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -22,8 +22,8 @@ "@components/*": ["components/*"], "@commerce": ["framework/commerce"], "@commerce/*": ["framework/commerce/*"], - "@framework": ["framework/bigcommerce"], - "@framework/*": ["framework/bigcommerce/*"] + "@framework": ["framework/shopify"], + "@framework/*": ["framework/shopify/*"] } }, "include": ["next-env.d.ts", "**/*.d.ts", "**/*.ts", "**/*.tsx", "**/*.js"],