@graphcommerce/magento-store 3.4.10 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +119 -101
- package/Money.tsx +2 -2
- package/PageMeta.tsx +2 -2
- package/components/GlobalHead/GlobalHead.tsx +13 -0
- package/components/StoreSwitcherButton/StoreSwitcherButton.tsx +30 -0
- package/{switcher → components/StoreSwitcherList}/StoreSwitcherList.graphql +0 -0
- package/{switcher → components/StoreSwitcherList}/StoreSwitcherList.tsx +29 -37
- package/hooks/useFindCountry.ts +1 -1
- package/index.ts +9 -17
- package/link/createStoreLink.ts +2 -2
- package/localeToStore.ts +1 -0
- package/package.json +13 -20
- package/switcher/CountryLocale.graphql +0 -5
- package/switcher/StoreLocale.graphql +0 -8
- package/switcher/StoreSwitcherButton.tsx +0 -34
package/CHANGELOG.md
CHANGED
|
@@ -1,170 +1,188 @@
|
|
|
1
1
|
# Change Log
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
3
|
+
## 4.0.0
|
|
5
4
|
|
|
6
|
-
|
|
5
|
+
### Major Changes
|
|
7
6
|
|
|
7
|
+
- [#1258](https://github.com/ho-nl/m2-pwa/pull/1258)
|
|
8
|
+
[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)
|
|
9
|
+
Thanks [@paales](https://github.com/paales)! - Upgraded to Material UI 5
|
|
8
10
|
|
|
9
|
-
###
|
|
11
|
+
### Patch Changes
|
|
10
12
|
|
|
11
|
-
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
[[`ad36382a4`](https://github.com/ho-nl/m2-pwa/commit/ad36382a4d55d83d9e47b7eb6a02671a2a631a05)]:
|
|
15
|
+
- @graphcommerce/graphql@3.0.0
|
|
16
|
+
- @graphcommerce/image@3.0.0
|
|
17
|
+
- @graphcommerce/next-ui@4.0.0
|
|
12
18
|
|
|
19
|
+
All notable changes to this project will be documented in this file. See
|
|
20
|
+
[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
13
21
|
|
|
22
|
+
# [3.4.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.3.31...@graphcommerce/magento-store@3.4.0) (2022-01-03)
|
|
14
23
|
|
|
24
|
+
### Features
|
|
15
25
|
|
|
26
|
+
- **framer-next-pages:** reduce rerenders when navigating to a new page
|
|
27
|
+
([5cf3301](https://github.com/ho-nl/m2-pwa/commit/5cf330130bb3527057da015e3c4a6fa295d7262e))
|
|
16
28
|
|
|
17
29
|
## [3.3.11](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.3.10...@graphcommerce/magento-store@3.3.11) (2021-12-06)
|
|
18
30
|
|
|
19
|
-
|
|
20
31
|
### Bug Fixes
|
|
21
32
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
33
|
+
- use Locale to set storeSwitcher icons
|
|
34
|
+
([65ea397](https://github.com/ho-nl/m2-pwa/commit/65ea397ec53aa27f545b43feda8e35227e119ebe))
|
|
27
35
|
|
|
28
36
|
# [3.3.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.2.20...@graphcommerce/magento-store@3.3.0) (2021-11-12)
|
|
29
37
|
|
|
30
|
-
|
|
31
38
|
### Features
|
|
32
39
|
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
40
|
+
- added tons of translations
|
|
41
|
+
([9bb0ac7](https://github.com/ho-nl/m2-pwa/commit/9bb0ac709b58df6ea6141e92e4923a5ca9ae2963))
|
|
38
42
|
|
|
39
43
|
# [3.2.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.1.8...@graphcommerce/magento-store@3.2.0) (2021-11-02)
|
|
40
44
|
|
|
41
|
-
|
|
42
45
|
### Features
|
|
43
46
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
47
|
+
- darkTheme
|
|
48
|
+
([968f4f1](https://github.com/ho-nl/m2-pwa/commit/968f4f1360417bf7daa36454c19e6bc5cf53ae90))
|
|
49
49
|
|
|
50
50
|
# [3.1.0](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.0.31...@graphcommerce/magento-store@3.1.0) (2021-10-27)
|
|
51
51
|
|
|
52
|
-
|
|
53
52
|
### Features
|
|
54
53
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
54
|
+
- **nextjs:** upgraded to nextjs 12
|
|
55
|
+
([9331bc8](https://github.com/ho-nl/m2-pwa/commit/9331bc801f6419522115cc47d291d49d608d5a90))
|
|
60
56
|
|
|
61
57
|
## [3.0.29](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.0.28...@graphcommerce/magento-store@3.0.29) (2021-10-21)
|
|
62
58
|
|
|
63
|
-
|
|
64
59
|
### Bug Fixes
|
|
65
60
|
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
61
|
+
- compatibility with venia theme
|
|
62
|
+
([c0bcdd5](https://github.com/ho-nl/m2-pwa/commit/c0bcdd511de5679f185f0984816b1f0cafa449e0))
|
|
71
63
|
|
|
72
64
|
## [3.0.7](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.0.6...@graphcommerce/magento-store@3.0.7) (2021-09-30)
|
|
73
65
|
|
|
74
|
-
|
|
75
66
|
### Bug Fixes
|
|
76
67
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
68
|
+
- with the latest version of graphql codegen the preresovled types inlined Maybe, make sure we
|
|
69
|
+
reflect that
|
|
70
|
+
([7cb27b0](https://github.com/ho-nl/m2-pwa/commit/7cb27b04cbe31bee5ef4000d408f08bc9ac505c5))
|
|
82
71
|
|
|
83
72
|
## [3.0.1](https://github.com/ho-nl/m2-pwa/compare/@graphcommerce/magento-store@3.0.0...@graphcommerce/magento-store@3.0.1) (2021-09-27)
|
|
84
73
|
|
|
85
74
|
**Note:** Version bump only for package @graphcommerce/magento-store
|
|
86
75
|
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
76
|
# 3.0.0 (2021-09-27)
|
|
92
77
|
|
|
93
|
-
|
|
94
78
|
### Bug Fixes
|
|
95
79
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
80
|
+
- canonical urls
|
|
81
|
+
([9ff8d3f](https://github.com/ho-nl/m2-pwa/commit/9ff8d3f950098fb28440f31f5dd93a835dce0bda))
|
|
82
|
+
- change href's from faq to service
|
|
83
|
+
([cb9875b](https://github.com/ho-nl/m2-pwa/commit/cb9875bce43db5953f227ee60f8d5dfe339f50b5))
|
|
84
|
+
- code consistency
|
|
85
|
+
([a310f0e](https://github.com/ho-nl/m2-pwa/commit/a310f0e548907c044b016b9473641ecd378b313f))
|
|
86
|
+
- **country-switcher:** navigate back to correct locale
|
|
87
|
+
([579d146](https://github.com/ho-nl/m2-pwa/commit/579d146e1b658a343b1514d8e8a45c01a507c084))
|
|
88
|
+
- duplicated (meta) tags in document head
|
|
89
|
+
([d52e962](https://github.com/ho-nl/m2-pwa/commit/d52e9629036ccab1f266ddd01600a0bd45930149))
|
|
90
|
+
- footer country flag
|
|
91
|
+
([8c6bf20](https://github.com/ho-nl/m2-pwa/commit/8c6bf206f85d44289a8d11d9bcd2178af6cc3445))
|
|
92
|
+
- get more data from store locale
|
|
93
|
+
([455245c](https://github.com/ho-nl/m2-pwa/commit/455245cf88d4a0cfbe197c97739306af8d8ff211))
|
|
94
|
+
- ignore md files from triggering version updates
|
|
95
|
+
([4f98392](https://github.com/ho-nl/m2-pwa/commit/4f9839250b3a32d3070da5290e5efcc5e2243fba))
|
|
96
|
+
- implement next-ui barrel imports
|
|
97
|
+
([75bea70](https://github.com/ho-nl/m2-pwa/commit/75bea703dba898f18a2a1dfa3243ebd0a4e6f0e1))
|
|
98
|
+
- lint error
|
|
99
|
+
([be542af](https://github.com/ho-nl/m2-pwa/commit/be542afc466209c79cb776aac494abb7cab24bf7))
|
|
100
|
+
- **magento-store:** move useCountry/useRegion to magento-store and rename to
|
|
101
|
+
useFindCountry/useFindRegion
|
|
102
|
+
([3fed1c5](https://github.com/ho-nl/m2-pwa/commit/3fed1c53f975977e2681a9b80bb283332d9ad5ec))
|
|
103
|
+
- make storeswitcher a button
|
|
104
|
+
([a7dc452](https://github.com/ho-nl/m2-pwa/commit/a7dc45297e565be9c5d72c03e3d8c4a61c415c8a))
|
|
105
|
+
- prices wouldn’t render if the price wasn’t an integer
|
|
106
|
+
([0866881](https://github.com/ho-nl/m2-pwa/commit/08668813699065b168e3d9b1fe2410c5cd073c89))
|
|
107
|
+
- prop types
|
|
108
|
+
([caccb1a](https://github.com/ho-nl/m2-pwa/commit/caccb1ab4c459642b64498dde22c372fd890f0c7))
|
|
109
|
+
- remove button from store-switcher in footer
|
|
110
|
+
([43f6d52](https://github.com/ho-nl/m2-pwa/commit/43f6d5227edff809effa46b658afc0d3c4268f3f))
|
|
111
|
+
- remove canonical metatag when no canonical is given
|
|
112
|
+
([167b7f0](https://github.com/ho-nl/m2-pwa/commit/167b7f080f98a10ff35cbd760b24b8198aac6518))
|
|
113
|
+
- search not submitting after empying the field
|
|
114
|
+
([a15b5cf](https://github.com/ho-nl/m2-pwa/commit/a15b5cf94f4619e0087c8871a98617ab160f671a))
|
|
115
|
+
- secure base link url in store config
|
|
116
|
+
([ecba5c2](https://github.com/ho-nl/m2-pwa/commit/ecba5c2b2c109b027916872ca860c566b031d8a4))
|
|
117
|
+
- since all links are of next/link we need to add passHref for custom components
|
|
118
|
+
([16fb931](https://github.com/ho-nl/m2-pwa/commit/16fb93100d367203ea79bb4f93357221253f2ecd))
|
|
119
|
+
- yarn workspace packages hot reload
|
|
120
|
+
([d03fc9f](https://github.com/ho-nl/m2-pwa/commit/d03fc9fdda3486476761786f2b56a934cc92befc))
|
|
117
121
|
|
|
118
122
|
### Features
|
|
119
123
|
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
124
|
+
- add getFilterTypes to shared client, faster generation
|
|
125
|
+
([beccfde](https://github.com/ho-nl/m2-pwa/commit/beccfde6ebc8aaf6223f0e8b33fabf4f5039efed))
|
|
126
|
+
- added footer buttons
|
|
127
|
+
([65610cc](https://github.com/ho-nl/m2-pwa/commit/65610cc1db2929b9203a3b7b25375a8324bc8ce9))
|
|
128
|
+
- added store switcher route
|
|
129
|
+
([64b04b3](https://github.com/ho-nl/m2-pwa/commit/64b04b3c1488c93395b228ac04c9d3c3912391a2))
|
|
130
|
+
- better 404 handling and simplified getStaticProps
|
|
131
|
+
([321ace1](https://github.com/ho-nl/m2-pwa/commit/321ace1850642ee3eddfa674c37e6fca8adcdb74))
|
|
132
|
+
- canonical urls using abstract page meta component
|
|
133
|
+
([5f09b6f](https://github.com/ho-nl/m2-pwa/commit/5f09b6f89f4c39f5465869b86468c384de73faba))
|
|
134
|
+
- created stacked-pages package
|
|
135
|
+
([d86008e](https://github.com/ho-nl/m2-pwa/commit/d86008ee659ccb25b194a41d624b394a1ddbd088))
|
|
136
|
+
- **graphql:** introduced new graphql package that holds all generated files
|
|
137
|
+
([a3e7aa0](https://github.com/ho-nl/m2-pwa/commit/a3e7aa05540540533b5ced9a95f1f802ecbe499f))
|
|
138
|
+
- i18n routing added (/ and /fr for demo)
|
|
139
|
+
([bb3b339](https://github.com/ho-nl/m2-pwa/commit/bb3b339fbc9fceddd264a891ad81f00327a241ae))
|
|
140
|
+
- **image:** introduced completely rewritten Image component
|
|
141
|
+
([e3413b3](https://github.com/ho-nl/m2-pwa/commit/e3413b3a57392d6571ea64cb8d9c8dca05ea31df))
|
|
142
|
+
- introduces framer-next-pages and framer-sheet to next-ui and soxbase package
|
|
143
|
+
([e04ad8a](https://github.com/ho-nl/m2-pwa/commit/e04ad8a94cd1fd5a7c5575c9db7916b6e8a88f16))
|
|
144
|
+
- major performance refactor
|
|
145
|
+
([03f8e2f](https://github.com/ho-nl/m2-pwa/commit/03f8e2fa16ef919bd6bd6eadd36922d0245ed960))
|
|
146
|
+
- move to category_uid instead of category_id
|
|
147
|
+
([a2efe8d](https://github.com/ho-nl/m2-pwa/commit/a2efe8daac6ebe949070108fc4bcf8cc0919c1c7))
|
|
148
|
+
- next.js 11
|
|
149
|
+
([7d61407](https://github.com/ho-nl/m2-pwa/commit/7d614075a778f488045034f74be4f75b93f63c43))
|
|
150
|
+
- **playwright:** added new playwright package to enable browser testing
|
|
151
|
+
([6f49ec7](https://github.com/ho-nl/m2-pwa/commit/6f49ec7595563775b96ebf21c27e39da1282e8d9))
|
|
152
|
+
- renamed all packages to use [@graphcommerce](https://github.com/graphcommerce) instead of
|
|
153
|
+
[@reachdigital](https://github.com/reachdigital)
|
|
154
|
+
([491e4ce](https://github.com/ho-nl/m2-pwa/commit/491e4cec9a2686472dac36b79f999257c0811ffe))
|
|
155
|
+
- support reviews store config variables
|
|
156
|
+
([532e849](https://github.com/ho-nl/m2-pwa/commit/532e84926c97affcd21ade56773bc06a02060b3a))
|
|
157
|
+
- upgrade to node 14
|
|
158
|
+
([d079a75](https://github.com/ho-nl/m2-pwa/commit/d079a751e9bfd8dc7f5009d2c9f31c336a0c96ab))
|
|
159
|
+
- upgraded to nextjs 11
|
|
160
|
+
([0053beb](https://github.com/ho-nl/m2-pwa/commit/0053beb7ef597c190add7264256a0eaec35868da))
|
|
161
|
+
- useFormMutationCart and simpler imports
|
|
162
|
+
([012f090](https://github.com/ho-nl/m2-pwa/commit/012f090e8f54d09f35d393c61ad1e2319f5a90ff))
|
|
140
163
|
|
|
141
164
|
### Reverts
|
|
142
165
|
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
166
|
+
- Revert "chore: upgrade @apollo/client"
|
|
167
|
+
([55ff24e](https://github.com/ho-nl/m2-pwa/commit/55ff24ede0e56c85b8095edadadd1ec5e0b1b8d2))
|
|
146
168
|
|
|
147
169
|
## 2.0.8 (2020-10-28)
|
|
148
170
|
|
|
149
|
-
|
|
150
171
|
### Bug Fixes
|
|
151
172
|
|
|
152
|
-
|
|
153
|
-
|
|
173
|
+
- make sure themes extensions are found
|
|
174
|
+
([5aa18db](https://github.com/ho-nl/m2-pwa/commit/5aa18db514fd2e2f50681367e39523f8e742ece0))
|
|
154
175
|
|
|
155
176
|
### Features
|
|
156
177
|
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
178
|
+
- added generated graphql.ts files
|
|
179
|
+
([3e44415](https://github.com/ho-nl/m2-pwa/commit/3e44415b018e74b502e9e98479aa5e84041f337d))
|
|
180
|
+
- split into packages
|
|
181
|
+
([2ee7fd6](https://github.com/ho-nl/m2-pwa/commit/2ee7fd6c0056f467d114f04d92c6c0ddf622d151))
|
|
160
182
|
|
|
161
183
|
### BREAKING CHANGES
|
|
162
184
|
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
185
|
+
- huge folder structure refactor, please read README to reinstall
|
|
168
186
|
|
|
169
187
|
# Change Log
|
|
170
188
|
|
package/Money.tsx
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
import { useQuery } from '@
|
|
1
|
+
import { useQuery } from '@graphcommerce/graphql'
|
|
2
2
|
import React, { useMemo } from 'react'
|
|
3
3
|
import { MoneyFragment } from './Money.gql'
|
|
4
4
|
import { StoreConfigDocument } from './StoreConfig.gql'
|
|
5
5
|
|
|
6
6
|
export type MoneyProps = MoneyFragment & { round?: boolean }
|
|
7
7
|
|
|
8
|
-
export
|
|
8
|
+
export function Money({ currency, value, round = false }: MoneyProps) {
|
|
9
9
|
const { data: config } = useQuery(StoreConfigDocument)
|
|
10
10
|
const locale = config?.storeConfig?.locale
|
|
11
11
|
|
package/PageMeta.tsx
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useQuery } from '@
|
|
1
|
+
import { useQuery } from '@graphcommerce/graphql'
|
|
2
2
|
import {
|
|
3
3
|
PageMeta as NextPageMeta,
|
|
4
4
|
PageMetaProps as NextPageMetaProps,
|
|
@@ -9,7 +9,7 @@ type PageMetaProps = Pick<NextPageMetaProps, 'title' | 'metaDescription' | 'meta
|
|
|
9
9
|
canonical?: string
|
|
10
10
|
}
|
|
11
11
|
|
|
12
|
-
export
|
|
12
|
+
export function PageMeta(props: PageMetaProps) {
|
|
13
13
|
const { title, canonical = '', ...pageMetaProps } = props
|
|
14
14
|
const config = useQuery(StoreConfigDocument)
|
|
15
15
|
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { useQuery } from '@graphcommerce/graphql'
|
|
2
|
+
import {
|
|
3
|
+
GlobalHead as GlobalHeadBase,
|
|
4
|
+
GlobalHeadProps as GlobalHeadPropsBase,
|
|
5
|
+
} from '@graphcommerce/next-ui'
|
|
6
|
+
import { StoreConfigDocument } from '../../StoreConfig.gql'
|
|
7
|
+
|
|
8
|
+
export type GlobalHeadProps = Omit<GlobalHeadPropsBase, 'name'>
|
|
9
|
+
|
|
10
|
+
export function GlobalHead(props: GlobalHeadProps) {
|
|
11
|
+
const name = useQuery(StoreConfigDocument).data?.storeConfig?.website_name ?? ''
|
|
12
|
+
return <GlobalHeadBase name={name} {...props} />
|
|
13
|
+
}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { useQuery } from '@graphcommerce/graphql'
|
|
2
|
+
import { FlagAvatar, extendableComponent } from '@graphcommerce/next-ui'
|
|
3
|
+
import { Button, SxProps, Theme } from '@mui/material'
|
|
4
|
+
import PageLink from 'next/link'
|
|
5
|
+
import { StoreConfigDocument } from '../../StoreConfig.gql'
|
|
6
|
+
|
|
7
|
+
export type StoreSwitcherButtonProps = { sx?: SxProps<Theme> }
|
|
8
|
+
|
|
9
|
+
const name = 'StoreSwitcherButton' as const
|
|
10
|
+
const parts = ['root', 'avatar'] as const
|
|
11
|
+
const { classes } = extendableComponent(name, parts)
|
|
12
|
+
|
|
13
|
+
export function StoreSwitcherButton(props: StoreSwitcherButtonProps) {
|
|
14
|
+
const { sx } = props
|
|
15
|
+
const config = useQuery(StoreConfigDocument)
|
|
16
|
+
const country = config.data?.storeConfig?.locale?.split('_')?.[1]?.toLowerCase() ?? ''
|
|
17
|
+
|
|
18
|
+
return (
|
|
19
|
+
<PageLink href='/switch-stores' passHref>
|
|
20
|
+
<Button variant='text' size='medium' className={classes.root} sx={sx}>
|
|
21
|
+
<FlagAvatar
|
|
22
|
+
country={country}
|
|
23
|
+
className={classes.avatar}
|
|
24
|
+
sx={{ height: 20, width: 20, marginRight: '10px' }}
|
|
25
|
+
/>
|
|
26
|
+
{config.data?.storeConfig?.store_name} - {config.data?.storeConfig?.base_currency_code}
|
|
27
|
+
</Button>
|
|
28
|
+
</PageLink>
|
|
29
|
+
)
|
|
30
|
+
}
|
|
File without changes
|
|
@@ -1,51 +1,31 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { extendableComponent, FlagAvatar } from '@graphcommerce/next-ui'
|
|
2
2
|
import {
|
|
3
3
|
List,
|
|
4
4
|
ListItem,
|
|
5
5
|
ListItemText,
|
|
6
|
-
makeStyles,
|
|
7
|
-
Theme,
|
|
8
6
|
Collapse,
|
|
9
7
|
ListItemAvatar,
|
|
10
|
-
|
|
8
|
+
SxProps,
|
|
9
|
+
Theme,
|
|
10
|
+
} from '@mui/material'
|
|
11
11
|
import PageLink from 'next/link'
|
|
12
12
|
import React from 'react'
|
|
13
|
-
import { localeToStore, storeToLocale } from '
|
|
13
|
+
import { localeToStore, storeToLocale } from '../../localeToStore'
|
|
14
14
|
import { StoreSwitcherListQuery } from './StoreSwitcherList.gql'
|
|
15
15
|
|
|
16
|
-
const useStyles = makeStyles(
|
|
17
|
-
(theme: Theme) => ({
|
|
18
|
-
list: {},
|
|
19
|
-
listItem: {
|
|
20
|
-
borderTop: `1px solid ${theme.palette.divider}`,
|
|
21
|
-
cursor: 'pointer',
|
|
22
|
-
},
|
|
23
|
-
listItemIndented: {
|
|
24
|
-
paddingLeft: 30,
|
|
25
|
-
cursor: 'pointer',
|
|
26
|
-
},
|
|
27
|
-
groupIcon: {
|
|
28
|
-
fontSize: 29,
|
|
29
|
-
lineHeight: 1,
|
|
30
|
-
minWidth: 40,
|
|
31
|
-
color: theme.palette.text.primary,
|
|
32
|
-
},
|
|
33
|
-
avatar: {
|
|
34
|
-
width: 30,
|
|
35
|
-
height: 30,
|
|
36
|
-
},
|
|
37
|
-
}),
|
|
38
|
-
{ name: 'StoreSwitcherList' },
|
|
39
|
-
)
|
|
40
|
-
|
|
41
16
|
type Store = NonNullable<NonNullable<StoreSwitcherListQuery['availableStores']>[0]>
|
|
42
17
|
|
|
43
|
-
export type StoreSwitcherListProps = {
|
|
44
|
-
|
|
18
|
+
export type StoreSwitcherListProps = {
|
|
19
|
+
locale: string | undefined
|
|
20
|
+
sx?: SxProps<Theme>
|
|
21
|
+
} & StoreSwitcherListQuery
|
|
22
|
+
|
|
23
|
+
const name = 'StoreSwitcherList' as const
|
|
24
|
+
const parts = ['list', 'listItem', 'listItemIndented', 'avatar'] as const
|
|
25
|
+
const { classes } = extendableComponent(name, parts)
|
|
45
26
|
|
|
46
|
-
export
|
|
47
|
-
const { availableStores, locale } = props
|
|
48
|
-
const classes = useStyles(props)
|
|
27
|
+
export function StoreSwitcherList(props: StoreSwitcherListProps) {
|
|
28
|
+
const { availableStores, locale, sx } = props
|
|
49
29
|
|
|
50
30
|
const groupedStores = Object.entries(
|
|
51
31
|
(availableStores ?? []).reduce<{
|
|
@@ -62,7 +42,7 @@ export default function StoreSwitcherList(props: StoreSwitcherListProps) {
|
|
|
62
42
|
)
|
|
63
43
|
|
|
64
44
|
return (
|
|
65
|
-
<List className={classes.list}>
|
|
45
|
+
<List className={classes.list} sx={sx}>
|
|
66
46
|
{groupedStores.map(([code, group]) => (
|
|
67
47
|
<React.Fragment key={code}>
|
|
68
48
|
<PageLink
|
|
@@ -81,9 +61,17 @@ export default function StoreSwitcherList(props: StoreSwitcherListProps) {
|
|
|
81
61
|
}
|
|
82
62
|
color='inherit'
|
|
83
63
|
className={classes.listItem}
|
|
64
|
+
sx={(theme) => ({
|
|
65
|
+
borderTop: `1px solid ${theme.palette.divider}`,
|
|
66
|
+
cursor: 'pointer',
|
|
67
|
+
})}
|
|
84
68
|
>
|
|
85
69
|
<ListItemAvatar>
|
|
86
|
-
<FlagAvatar
|
|
70
|
+
<FlagAvatar
|
|
71
|
+
country={code}
|
|
72
|
+
className={classes.avatar}
|
|
73
|
+
sx={{ width: 30, height: 30 }}
|
|
74
|
+
/>
|
|
87
75
|
</ListItemAvatar>
|
|
88
76
|
<ListItemText>
|
|
89
77
|
{group.name}
|
|
@@ -113,6 +101,10 @@ export default function StoreSwitcherList(props: StoreSwitcherListProps) {
|
|
|
113
101
|
selected={localeToStore(locale) === store.locale}
|
|
114
102
|
color='inherit'
|
|
115
103
|
className={classes.listItemIndented}
|
|
104
|
+
sx={{
|
|
105
|
+
paddingLeft: '30px',
|
|
106
|
+
cursor: 'pointer',
|
|
107
|
+
}}
|
|
116
108
|
>
|
|
117
109
|
<ListItemText inset>
|
|
118
110
|
{store.store_name}
|
package/hooks/useFindCountry.ts
CHANGED
package/index.ts
CHANGED
|
@@ -1,21 +1,13 @@
|
|
|
1
|
-
export
|
|
2
|
-
export * from './
|
|
3
|
-
export * from './
|
|
1
|
+
export * from './components/GlobalHead/GlobalHead'
|
|
2
|
+
export * from './hooks/useFindCountry'
|
|
3
|
+
export * from './hooks/useFindRegion'
|
|
4
4
|
export * from './link/createStoreLink'
|
|
5
|
-
|
|
6
|
-
export { default as StoreSwitcherButton } from './switcher/StoreSwitcherButton'
|
|
7
|
-
export * from './switcher/StoreSwitcherButton'
|
|
8
|
-
|
|
9
|
-
export { default as StoreSwitcherList } from './switcher/StoreSwitcherList'
|
|
10
|
-
export * from './switcher/StoreSwitcherList'
|
|
11
|
-
export * from './switcher/StoreSwitcherList.gql'
|
|
12
|
-
|
|
5
|
+
export * from './localeToStore'
|
|
13
6
|
export * from './Money'
|
|
14
|
-
export { default as Money } from './Money'
|
|
15
|
-
|
|
16
7
|
export * from './Money.gql'
|
|
17
|
-
|
|
8
|
+
export * from './PageMeta'
|
|
18
9
|
export * from './queries/CountryRegions.gql'
|
|
19
|
-
|
|
20
|
-
export * from './
|
|
21
|
-
export * from './
|
|
10
|
+
export * from './StoreConfig.gql'
|
|
11
|
+
export * from './components/StoreSwitcherButton/StoreSwitcherButton'
|
|
12
|
+
export * from './components/StoreSwitcherList/StoreSwitcherList'
|
|
13
|
+
export * from './components/StoreSwitcherList/StoreSwitcherList.gql'
|
package/link/createStoreLink.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { setContext } from '@
|
|
1
|
+
import { setContext } from '@graphcommerce/graphql'
|
|
2
2
|
import { localeToStore } from '../localeToStore'
|
|
3
3
|
|
|
4
4
|
/** Apollo link to set the store header in the context */
|
|
5
|
-
export const createStoreLink = (locale
|
|
5
|
+
export const createStoreLink = (locale?: string) =>
|
|
6
6
|
setContext((_, context) => {
|
|
7
7
|
if (!context.headers) context.headers = {}
|
|
8
8
|
context.headers.store = localeToStore(locale)
|
package/localeToStore.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,11 +1,8 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@graphcommerce/magento-store",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "4.0.0",
|
|
4
4
|
"sideEffects": false,
|
|
5
5
|
"prettier": "@graphcommerce/prettier-config-pwa",
|
|
6
|
-
"browserslist": [
|
|
7
|
-
"extends @graphcommerce/browserslist-config-pwa"
|
|
8
|
-
],
|
|
9
6
|
"eslintConfig": {
|
|
10
7
|
"extends": "@graphcommerce/eslint-config-pwa",
|
|
11
8
|
"parserOptions": {
|
|
@@ -13,24 +10,20 @@
|
|
|
13
10
|
}
|
|
14
11
|
},
|
|
15
12
|
"devDependencies": {
|
|
16
|
-
"@graphcommerce/
|
|
17
|
-
"@graphcommerce/
|
|
18
|
-
"@graphcommerce/
|
|
19
|
-
"@
|
|
20
|
-
"@playwright/test": "^1.17.1"
|
|
13
|
+
"@graphcommerce/eslint-config-pwa": "^4.0.0",
|
|
14
|
+
"@graphcommerce/prettier-config-pwa": "^4.0.0",
|
|
15
|
+
"@graphcommerce/typescript-config-pwa": "^4.0.0",
|
|
16
|
+
"@playwright/test": "^1.18.1"
|
|
21
17
|
},
|
|
22
18
|
"dependencies": {
|
|
23
|
-
"@
|
|
24
|
-
"@graphcommerce/
|
|
25
|
-
"@graphcommerce/
|
|
26
|
-
"@
|
|
27
|
-
"@
|
|
28
|
-
"
|
|
29
|
-
"@material-ui/lab": "^4.0.0-alpha.60",
|
|
30
|
-
"next": "^12.0.7",
|
|
19
|
+
"@graphcommerce/graphql": "^3.0.0",
|
|
20
|
+
"@graphcommerce/image": "^3.0.0",
|
|
21
|
+
"@graphcommerce/next-ui": "^4.0.0",
|
|
22
|
+
"@lingui/macro": "^3.13.2",
|
|
23
|
+
"@mui/material": "^5.4.1",
|
|
24
|
+
"next": "^12.0.10",
|
|
31
25
|
"react": "^17.0.2",
|
|
32
26
|
"react-dom": "^17.0.2",
|
|
33
|
-
"type-fest": "^2.
|
|
34
|
-
}
|
|
35
|
-
"gitHead": "4f7fd2440fa20b9ad619b1172bc12deaaf8b2456"
|
|
27
|
+
"type-fest": "^2.11.2"
|
|
28
|
+
}
|
|
36
29
|
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import { useQuery } from '@apollo/client'
|
|
2
|
-
import { FlagAvatar, UseStyles } from '@graphcommerce/next-ui'
|
|
3
|
-
import { Button, makeStyles } from '@material-ui/core'
|
|
4
|
-
import PageLink from 'next/link'
|
|
5
|
-
import React from 'react'
|
|
6
|
-
import { StoreConfigDocument } from '../StoreConfig.gql'
|
|
7
|
-
|
|
8
|
-
const useStyles = makeStyles(
|
|
9
|
-
() => ({
|
|
10
|
-
avatar: {
|
|
11
|
-
height: 20,
|
|
12
|
-
width: 20,
|
|
13
|
-
marginRight: 10,
|
|
14
|
-
},
|
|
15
|
-
}),
|
|
16
|
-
{ name: 'StoreSwitcherButton' },
|
|
17
|
-
)
|
|
18
|
-
|
|
19
|
-
export type StoreSwitcherButtonProps = UseStyles<typeof useStyles>
|
|
20
|
-
|
|
21
|
-
export default function StoreSwitcherButton(props) {
|
|
22
|
-
const config = useQuery(StoreConfigDocument)
|
|
23
|
-
const country = config.data?.storeConfig?.locale?.split('_')?.[1]?.toLowerCase() ?? ''
|
|
24
|
-
|
|
25
|
-
const classes = useStyles(props)
|
|
26
|
-
return (
|
|
27
|
-
<PageLink href='/switch-stores' passHref>
|
|
28
|
-
<Button variant='text' size='medium'>
|
|
29
|
-
<FlagAvatar country={country} classes={{ root: classes.avatar }} />
|
|
30
|
-
{config.data?.storeConfig?.store_name} - {config.data?.storeConfig?.base_currency_code}
|
|
31
|
-
</Button>
|
|
32
|
-
</PageLink>
|
|
33
|
-
)
|
|
34
|
-
}
|