@graphcommerce/magento-product 4.1.6 → 4.1.9

package/CHANGELOG.md

@@ -1,5 +1,37 @@
 # Change Log
 
+## 4.1.9
+
+### Patch Changes
+
+- [#1419](https://github.com/graphcommerce-org/graphcommerce/pull/1419) [`a52a863f9`](https://github.com/graphcommerce-org/graphcommerce/commit/a52a863f9c69c6b3ae657dcce3bc9b14413ce125) Thanks [@NickdeK](https://github.com/NickdeK)! - Make ProductListSort stylable and translate "Sort By" string
+
+## 4.1.8
+
+### Patch Changes
+
+- Updated dependencies [[`d8906cf4a`](https://github.com/graphcommerce-org/graphcommerce/commit/d8906cf4afbfc234aedd91a2c581f82623267357)]:
+  - @graphcommerce/magento-cart@4.2.7
+
+## 4.1.7
+
+### Patch Changes
+
+- [#1399](https://github.com/graphcommerce-org/graphcommerce/pull/1399) [`fb277d8e1`](https://github.com/graphcommerce-org/graphcommerce/commit/fb277d8e1e3612c5e9cf890a30d19cfd1ff70542) Thanks [@paales](https://github.com/paales)! - Now using [@graphql-yoga](https://github.com/dotansimha/graphql-yoga) for GraphQL which has full support for [envelop](https://www.envelop.dev/) plugins.
+
+* [#1399](https://github.com/graphcommerce-org/graphcommerce/pull/1399) [`fb277d8e1`](https://github.com/graphcommerce-org/graphcommerce/commit/fb277d8e1e3612c5e9cf890a30d19cfd1ff70542) Thanks [@paales](https://github.com/paales)! - Added a new @graphcommerce/cli package to generate the mesh so it can be generated _inside_ the @graphcommerce/graphql-mesh package to allow for better future extensibility.
+
+- [#1399](https://github.com/graphcommerce-org/graphcommerce/pull/1399) [`da0ae7d02`](https://github.com/graphcommerce-org/graphcommerce/commit/da0ae7d0236e4908ba0bf0fa16656be516e841d4) Thanks [@paales](https://github.com/paales)! - Updated dependencies
+
+- Updated dependencies [[`fb277d8e1`](https://github.com/graphcommerce-org/graphcommerce/commit/fb277d8e1e3612c5e9cf890a30d19cfd1ff70542), [`fb277d8e1`](https://github.com/graphcommerce-org/graphcommerce/commit/fb277d8e1e3612c5e9cf890a30d19cfd1ff70542), [`da0ae7d02`](https://github.com/graphcommerce-org/graphcommerce/commit/da0ae7d0236e4908ba0bf0fa16656be516e841d4)]:
+  - @graphcommerce/graphql@3.1.0
+  - @graphcommerce/graphql-mesh@4.1.0
+  - @graphcommerce/magento-cart@4.2.6
+  - @graphcommerce/magento-store@4.1.7
+  - @graphcommerce/next-ui@4.6.1
+  - @graphcommerce/framer-scroller@2.1.6
+  - @graphcommerce/image@3.1.5
+
 ## 4.1.6
 
 ### Patch Changes

package/components/JsonLdProduct/jsonLdProduct.tsx

@@ -1,5 +1,5 @@
-import { ProductImage } from '@graphcommerce/graphql'
-import { Product } from 'schema-dts'
+import type { ProductImage } from '@graphcommerce/graphql-mesh'
+import type { Product } from 'schema-dts'
 import { JsonLdProductFragment } from './JsonLdProduct.gql'
 import { JsonLdProductOfferFragment } from './JsonLdProductOffer.gql'
 

package/components/ProductAddToCart/ProductAddToCart.tsx

@@ -1,4 +1,4 @@
-import { ProductInterface } from '@graphcommerce/graphql'
+import type { ProductInterface } from '@graphcommerce/graphql-mesh'
 import { ApolloCartErrorAlert, useFormGqlMutationCart } from '@graphcommerce/magento-cart'
 import { Money, MoneyProps } from '@graphcommerce/magento-store'
 import {

package/components/ProductListFilters/FilterEqualType.tsx

@@ -1,4 +1,5 @@
-import { cloneDeep, FilterEqualTypeInput } from '@graphcommerce/graphql'
+import { cloneDeep } from '@graphcommerce/graphql'
+import type { FilterEqualTypeInput } from '@graphcommerce/graphql-mesh'
 import { ChipMenu, ChipMenuProps, responsiveVal, extendableComponent } from '@graphcommerce/next-ui'
 import {
   Box,
@@ -8,7 +9,7 @@ import {
   ListItemText,
   listItemTextClasses,
 } from '@mui/material'
-import { SetRequired } from 'type-fest'
+import type { SetRequired } from 'type-fest'
 import { useProductListLinkReplace } from '../../hooks/useProductListLinkReplace'
 import { useProductListParamsContext } from '../../hooks/useProductListParamsContext'
 import { ProductListLink } from '../ProductListLink/ProductListLink'

package/components/ProductListFilters/FilterRangeType.tsx

@@ -1,4 +1,5 @@
-import { cloneDeep, FilterRangeTypeInput } from '@graphcommerce/graphql'
+import { cloneDeep } from '@graphcommerce/graphql'
+import type { FilterRangeTypeInput } from '@graphcommerce/graphql-mesh'
 import { Money } from '@graphcommerce/magento-store'
 import { ChipMenu, ChipMenuProps, extendableComponent } from '@graphcommerce/next-ui'
 import { Trans } from '@lingui/macro'

package/components/ProductListItems/filterTypes.tsx

@@ -1,4 +1,4 @@
-import {
+import type {
   Exact,
   Maybe,
   Scalars,
@@ -7,7 +7,7 @@ import {
   FilterEqualTypeInput,
   FilterMatchTypeInput,
   FilterRangeTypeInput,
-} from '@graphcommerce/graphql'
+} from '@graphcommerce/graphql-mesh'
 
 /** This is mainly based on ProductListQueryVariables */
 export type ProductListParams = Exact<{

package/components/ProductListItems/filteredProductList.tsx

@@ -1,9 +1,9 @@
-import {
+import type {
   FilterEqualTypeInput,
   FilterMatchTypeInput,
   FilterRangeTypeInput,
   SortEnum,
-} from '@graphcommerce/graphql'
+} from '@graphcommerce/graphql-mesh'
 import { FilterTypes, ProductListParams } from './filterTypes'
 
 export function parseParams(

package/components/ProductListItems/getFilterTypes.ts

@@ -1,4 +1,5 @@
-import { gql, ApolloClient, NormalizedCacheObject, Exact } from '@graphcommerce/graphql'
+import { gql, ApolloClient, NormalizedCacheObject } from '@graphcommerce/graphql'
+import type { Exact } from '@graphcommerce/graphql-mesh'
 import { AllFilterInputTypes, FilterTypes } from './filterTypes'
 
 const allFilterInputTypes: AllFilterInputTypes[] = [

package/components/ProductListSort/ProductListSort.tsx

@@ -1,7 +1,8 @@
 import { useQuery, cloneDeep } from '@graphcommerce/graphql'
 import { StoreConfigDocument } from '@graphcommerce/magento-store'
-import { ChipMenu, ChipMenuProps } from '@graphcommerce/next-ui'
-import { ListItem, ListItemText } from '@mui/material'
+import { ChipMenu, ChipMenuProps, extendableComponent } from '@graphcommerce/next-ui'
+import { Trans } from '@lingui/macro'
+import { ListItem, ListItemText, SxProps, Theme } from '@mui/material'
 import React from 'react'
 import { useProductListLinkReplace } from '../../hooks/useProductListLinkReplace'
 import { useProductListParamsContext } from '../../hooks/useProductListParamsContext'
@@ -9,10 +10,16 @@ import { ProductListLink } from '../ProductListLink/ProductListLink'
 import { ProductListSortFragment } from './ProductListSort.gql'
 
 export type ProductListSortProps = ProductListSortFragment &
-  Omit<ChipMenuProps, 'selected' | 'selectedLabel' | 'children' | 'label' | 'onDelete'>
+  Omit<ChipMenuProps, 'selected' | 'selectedLabel' | 'children' | 'label' | 'onDelete'> & {
+    sx?: SxProps<Theme>
+  }
+
+const name = 'ProductListSort' as const
+const parts = ['menu', 'item', 'link'] as const
+const { classes } = extendableComponent(name, parts)
 
 export function ProductListSort(props: ProductListSortProps) {
-  const { sort_fields, total_count, ...filterMenuProps } = props
+  const { sort_fields, total_count, sx = [], ...filterMenuProps } = props
   const { params } = useProductListParamsContext()
   const replaceRoute = useProductListLinkReplace()
   const { data: storeConfigQuery } = useQuery(StoreConfigDocument)
@@ -21,7 +28,7 @@ export function ProductListSort(props: ProductListSortProps) {
   const [currentSort = defaultSort] = Object.keys(params.sort)
   const currentOption = sort_fields?.options?.find((option) => option?.value === currentSort)
   const selected = currentSort !== defaultSort
-  const label = 'Sort By'
+  const label = <Trans>Sort By</Trans>
 
   const removeFilter = () => {
     const linkParams = cloneDeep(params)
@@ -33,12 +40,14 @@ export function ProductListSort(props: ProductListSortProps) {
 
   return (
     <ChipMenu
+      className={classes.menu}
       variant='outlined'
       selected={selected}
       label={label}
       {...filterMenuProps}
       selectedLabel={selected ? currentOption?.label ?? '' : label}
       onDelete={selected ? removeFilter : undefined}
+      sx={Array.isArray(sx) ? sx : [sx]}
     >
       {sort_fields?.options?.map((option) => {
         const linkParams = cloneDeep(params)
@@ -48,6 +57,7 @@ export function ProductListSort(props: ProductListSortProps) {
 
         return (
           <ListItem
+            className={classes.item}
             button
             key={option?.value ?? ''}
             dense
@@ -57,6 +67,7 @@ export function ProductListSort(props: ProductListSortProps) {
                 <ProductListLink
                   {...chipProps}
                   {...linkParams}
+                  className={classes.link}
                   ref={ref}
                   color='inherit'
                   underline='none'

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/magento-product",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "4.1.6",
+  "version": "4.1.9",
   "sideEffects": false,
   "prettier": "@graphcommerce/prettier-config-pwa",
   "eslintConfig": {
@@ -12,19 +12,20 @@
     }
   },
   "devDependencies": {
-    "@graphcommerce/eslint-config-pwa": "^4.1.4",
-    "@graphcommerce/prettier-config-pwa": "^4.0.5",
+    "@graphcommerce/eslint-config-pwa": "^4.1.5",
+    "@graphcommerce/prettier-config-pwa": "^4.0.6",
     "@graphcommerce/typescript-config-pwa": "^4.0.2",
-    "@playwright/test": "^1.20.1",
-    "type-fest": "2.12.1"
+    "@playwright/test": "^1.21.1",
+    "type-fest": "^2.12.2"
   },
   "dependencies": {
-    "@graphcommerce/framer-scroller": "2.1.5",
-    "@graphcommerce/graphql": "3.0.7",
-    "@graphcommerce/image": "3.1.4",
-    "@graphcommerce/magento-cart": "4.2.5",
-    "@graphcommerce/magento-store": "4.1.6",
-    "@graphcommerce/next-ui": "4.6.0",
+    "@graphcommerce/framer-scroller": "2.1.6",
+    "@graphcommerce/graphql": "3.1.0",
+    "@graphcommerce/graphql-mesh": "4.1.0",
+    "@graphcommerce/image": "3.1.5",
+    "@graphcommerce/magento-cart": "4.2.7",
+    "@graphcommerce/magento-store": "4.1.7",
+    "@graphcommerce/next-ui": "4.6.1",
     "schema-dts": "^1.1.0"
   },
   "peerDependencies": {