@akinon/projectzero 1.116.0-rc.0 → 1.116.0-snapshot-ZERO-3913-20251219101059
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 +1 -6
- package/app-template/.env.example +0 -1
- package/app-template/CHANGELOG.md +0 -52
- package/app-template/README.md +1 -25
- package/app-template/package.json +25 -27
- package/app-template/public/locales/en/account.json +1 -3
- package/app-template/public/locales/tr/account.json +1 -3
- package/app-template/src/app/[commerce]/[locale]/[currency]/account/orders/[id]/page.tsx +1 -20
- package/app-template/src/components/modal.tsx +0 -2
- package/app-template/src/components/select.tsx +1 -1
- package/app-template/src/hooks/index.ts +0 -2
- package/app-template/src/plugins.js +0 -1
- package/app-template/src/views/account/orders/order-detail-header.tsx +1 -1
- package/app-template/src/views/checkout/steps/shipping/address-box.tsx +17 -30
- package/app-template/src/views/checkout/steps/shipping/addresses.tsx +1 -1
- package/app-template/src/views/header/search/index.tsx +5 -13
- package/app-template/src/views/product/slider.tsx +37 -84
- package/commands/plugins.ts +0 -4
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,11 +1,6 @@
|
|
|
1
1
|
# @akinon/projectzero
|
|
2
2
|
|
|
3
|
-
## 1.116.0-
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- 143be2b9: ZERO-3457: Crop styles are customizable and logic improved for rendering similar products modal
|
|
8
|
-
- d99a6a7d: ZERO-3457_1: Fixed the settings prop and made sure everything is customizable.
|
|
3
|
+
## 1.116.0-snapshot-ZERO-3913-20251219101059
|
|
9
4
|
|
|
10
5
|
## 1.115.0
|
|
11
6
|
|
|
@@ -7,7 +7,6 @@ NEXT_PUBLIC_URL=http://localhost:3000
|
|
|
7
7
|
SERVICE_BACKEND_URL=https://02fde10fee4440269e695aa10707dfaf.lb.akinoncloud.com
|
|
8
8
|
SITEMAP_S3_BUCKET_NAME=0fb534
|
|
9
9
|
NEXT_PUBLIC_VIRTUAL_TRY_ON_API_URL=https://d2a26507c7094f359aba349b96a96881.lb.akinoncloud.com
|
|
10
|
-
NEXT_PUBLIC_ENABLE_IMAGE_SEARCH=true
|
|
11
10
|
|
|
12
11
|
# LOG_LEVEL_DEV=debug # For more details, please refer to the Logging documentation.
|
|
13
12
|
|
|
@@ -1,57 +1,5 @@
|
|
|
1
1
|
# projectzeronext
|
|
2
2
|
|
|
3
|
-
## 1.116.0-rc.0
|
|
4
|
-
|
|
5
|
-
### Minor Changes
|
|
6
|
-
|
|
7
|
-
- 4449f3a3: ZERO-3681: Add order details localization and improve order handling in AccountOrderDetail
|
|
8
|
-
- 1a8622a9: ZERO-3392: Implemented AI Search functionality and update env
|
|
9
|
-
- b55acb76: ZERO-2577: Fix pagination bug and update usePagination hook and ensure pagination controls rendering correctly
|
|
10
|
-
- 143be2b9: ZERO-3457: Crop styles are customizable and logic improved for rendering similar products modal
|
|
11
|
-
- 9f8cd3bc: ZERO-3449: AI Search Active Filters & Crop Style changes have been implemented
|
|
12
|
-
- d99a6a7d: ZERO-3457_1: Fixed the settings prop and made sure everything is customizable.
|
|
13
|
-
- b87517ff: ZERO-3680: Enhance select component styling to ensure focus state is consistent
|
|
14
|
-
- b05c3543: ZERO-2570: Category filters routes to absolute url
|
|
15
|
-
|
|
16
|
-
### Patch Changes
|
|
17
|
-
|
|
18
|
-
- Updated dependencies [d2c0e759]
|
|
19
|
-
- Updated dependencies [b55acb76]
|
|
20
|
-
- Updated dependencies [143be2b9]
|
|
21
|
-
- Updated dependencies [9f8cd3bc]
|
|
22
|
-
- Updated dependencies [0d33d9ac]
|
|
23
|
-
- Updated dependencies [d99a6a7d]
|
|
24
|
-
- Updated dependencies [ee191e6f]
|
|
25
|
-
- Updated dependencies [4de5303c]
|
|
26
|
-
- Updated dependencies [95b139dc]
|
|
27
|
-
- Updated dependencies [6b73b050]
|
|
28
|
-
- Updated dependencies [5ae86358]
|
|
29
|
-
- @akinon/next@1.116.0-rc.0
|
|
30
|
-
- @akinon/pz-similar-products@1.116.0-rc.0
|
|
31
|
-
- @akinon/pz-masterpass-rest@1.116.0-rc.0
|
|
32
|
-
- @akinon/pz-virtual-try-on@1.116.0-rc.0
|
|
33
|
-
- @akinon/pz-akifast@1.116.0-rc.0
|
|
34
|
-
- @akinon/pz-apple-pay@1.116.0-rc.0
|
|
35
|
-
- @akinon/pz-b2b@1.116.0-rc.0
|
|
36
|
-
- @akinon/pz-basket-gift-pack@1.116.0-rc.0
|
|
37
|
-
- @akinon/pz-bkm@1.116.0-rc.0
|
|
38
|
-
- @akinon/pz-checkout-gift-pack@1.116.0-rc.0
|
|
39
|
-
- @akinon/pz-click-collect@1.116.0-rc.0
|
|
40
|
-
- @akinon/pz-credit-payment@1.116.0-rc.0
|
|
41
|
-
- @akinon/pz-cybersource-uc@1.116.0-rc.0
|
|
42
|
-
- @akinon/pz-flow-payment@1.116.0-rc.0
|
|
43
|
-
- @akinon/pz-gpay@1.116.0-rc.0
|
|
44
|
-
- @akinon/pz-haso@1.116.0-rc.0
|
|
45
|
-
- @akinon/pz-hepsipay@1.116.0-rc.0
|
|
46
|
-
- @akinon/pz-masterpass@1.116.0-rc.0
|
|
47
|
-
- @akinon/pz-multi-basket@1.116.0-rc.0
|
|
48
|
-
- @akinon/pz-one-click-checkout@1.116.0-rc.0
|
|
49
|
-
- @akinon/pz-otp@1.116.0-rc.0
|
|
50
|
-
- @akinon/pz-pay-on-delivery@1.116.0-rc.0
|
|
51
|
-
- @akinon/pz-saved-card@1.116.0-rc.0
|
|
52
|
-
- @akinon/pz-tabby-extension@1.116.0-rc.0
|
|
53
|
-
- @akinon/pz-tamara-extension@1.116.0-rc.0
|
|
54
|
-
|
|
55
3
|
## 1.115.0
|
|
56
4
|
|
|
57
5
|
### Minor Changes
|
package/app-template/README.md
CHANGED
|
@@ -12,30 +12,6 @@ Run `cp .env.example .env && yarn` command at project root and all dependencies
|
|
|
12
12
|
|
|
13
13
|
- `SITEMAP_S3_BUCKET_NAME`: S3 bucket name for XML sitemaps (e.g., "0fb534"). This is required for the sitemap route to function correctly.
|
|
14
14
|
|
|
15
|
-
### Optional Environment Variables
|
|
16
|
-
|
|
17
|
-
- `NEXT_PUBLIC_ENABLE_IMAGE_SEARCH`: Set to `true` to enable image search feature for all users. If not set or `false`, the feature will only be visible to users who have enabled it via localStorage.
|
|
18
|
-
|
|
19
|
-
## Image Search Feature
|
|
20
|
-
|
|
21
|
-
The image search functionality allows users to search for similar products by uploading images or cropping existing product images.
|
|
22
|
-
|
|
23
|
-
### Feature Visibility Control
|
|
24
|
-
|
|
25
|
-
The image search feature can be controlled in two ways:
|
|
26
|
-
|
|
27
|
-
1. **Environment Variable (Global)**: Set `NEXT_PUBLIC_ENABLE_IMAGE_SEARCH=true` to enable for all users
|
|
28
|
-
2. **localStorage (Individual Users)**: Users can enable it locally using browser developer tools
|
|
29
|
-
|
|
30
|
-
````
|
|
31
|
-
|
|
32
|
-
### Feature Locations
|
|
33
|
-
|
|
34
|
-
When enabled, the image search feature appears in:
|
|
35
|
-
|
|
36
|
-
- **Header Search**: Camera icon next to the search input
|
|
37
|
-
- **Product Detail Page**: "View Similar Styles" button on product images
|
|
38
|
-
|
|
39
15
|
### Build
|
|
40
16
|
|
|
41
17
|
To build the app, run the following command:
|
|
@@ -43,7 +19,7 @@ To build the app, run the following command:
|
|
|
43
19
|
```bash
|
|
44
20
|
cd projectzeronext # Project root
|
|
45
21
|
yarn build
|
|
46
|
-
|
|
22
|
+
```
|
|
47
23
|
|
|
48
24
|
### Develop
|
|
49
25
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "projectzeronext",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.115.0",
|
|
4
4
|
"private": true,
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"scripts": {
|
|
@@ -24,31 +24,29 @@
|
|
|
24
24
|
"test:middleware": "jest middleware-matcher.test.ts --bail"
|
|
25
25
|
},
|
|
26
26
|
"dependencies": {
|
|
27
|
-
"@akinon/next": "1.
|
|
28
|
-
"@akinon/pz-akifast": "1.
|
|
29
|
-
"@akinon/pz-apple-pay": "1.
|
|
30
|
-
"@akinon/pz-b2b": "1.
|
|
31
|
-
"@akinon/pz-basket-gift-pack": "1.
|
|
32
|
-
"@akinon/pz-bkm": "1.
|
|
33
|
-
"@akinon/pz-checkout-gift-pack": "1.
|
|
34
|
-
"@akinon/pz-click-collect": "1.
|
|
35
|
-
"@akinon/pz-credit-payment": "1.
|
|
36
|
-
"@akinon/pz-cybersource-uc": "1.
|
|
37
|
-
"@akinon/pz-flow-payment": "1.
|
|
38
|
-
"@akinon/pz-gpay": "1.
|
|
39
|
-
"@akinon/pz-
|
|
40
|
-
"@akinon/pz-
|
|
41
|
-
"@akinon/pz-masterpass": "1.
|
|
42
|
-
"@akinon/pz-
|
|
43
|
-
"@akinon/pz-
|
|
44
|
-
"@akinon/pz-
|
|
45
|
-
"@akinon/pz-
|
|
46
|
-
"@akinon/pz-
|
|
47
|
-
"@akinon/pz-
|
|
48
|
-
"@akinon/pz-
|
|
49
|
-
"@akinon/pz-
|
|
50
|
-
"@akinon/pz-tamara-extension": "1.116.0-rc.0",
|
|
51
|
-
"@akinon/pz-virtual-try-on": "1.116.0-rc.0",
|
|
27
|
+
"@akinon/next": "1.115.0",
|
|
28
|
+
"@akinon/pz-akifast": "1.115.0",
|
|
29
|
+
"@akinon/pz-apple-pay": "1.115.0",
|
|
30
|
+
"@akinon/pz-b2b": "1.115.0",
|
|
31
|
+
"@akinon/pz-basket-gift-pack": "1.115.0",
|
|
32
|
+
"@akinon/pz-bkm": "1.115.0",
|
|
33
|
+
"@akinon/pz-checkout-gift-pack": "1.115.0",
|
|
34
|
+
"@akinon/pz-click-collect": "1.115.0",
|
|
35
|
+
"@akinon/pz-credit-payment": "1.115.0",
|
|
36
|
+
"@akinon/pz-cybersource-uc": "1.115.0",
|
|
37
|
+
"@akinon/pz-flow-payment": "1.115.0",
|
|
38
|
+
"@akinon/pz-gpay": "1.115.0",
|
|
39
|
+
"@akinon/pz-hepsipay": "1.115.0",
|
|
40
|
+
"@akinon/pz-masterpass": "1.115.0",
|
|
41
|
+
"@akinon/pz-masterpass-rest": "1.115.0",
|
|
42
|
+
"@akinon/pz-multi-basket": "1.115.0",
|
|
43
|
+
"@akinon/pz-one-click-checkout": "1.115.0",
|
|
44
|
+
"@akinon/pz-otp": "1.115.0",
|
|
45
|
+
"@akinon/pz-pay-on-delivery": "1.115.0",
|
|
46
|
+
"@akinon/pz-saved-card": "1.115.0",
|
|
47
|
+
"@akinon/pz-tabby-extension": "1.115.0",
|
|
48
|
+
"@akinon/pz-tamara-extension": "1.115.0",
|
|
49
|
+
"@akinon/pz-virtual-try-on": "1.115.0",
|
|
52
50
|
"@hookform/resolvers": "2.9.0",
|
|
53
51
|
"@next/third-parties": "14.1.0",
|
|
54
52
|
"@react-google-maps/api": "2.17.1",
|
|
@@ -71,7 +69,7 @@
|
|
|
71
69
|
"yup": "0.32.11"
|
|
72
70
|
},
|
|
73
71
|
"devDependencies": {
|
|
74
|
-
"@akinon/eslint-plugin-projectzero": "1.
|
|
72
|
+
"@akinon/eslint-plugin-projectzero": "1.115.0",
|
|
75
73
|
"@semantic-release/changelog": "6.0.2",
|
|
76
74
|
"@semantic-release/exec": "6.0.3",
|
|
77
75
|
"@semantic-release/git": "10.0.1",
|
|
@@ -242,9 +242,7 @@
|
|
|
242
242
|
"total": "Total",
|
|
243
243
|
"items": "items",
|
|
244
244
|
"packages": "Packages",
|
|
245
|
-
"package_no": "Package no"
|
|
246
|
-
"back_to_orders": "Back to Orders",
|
|
247
|
-
"no_orders_found": "No orders found"
|
|
245
|
+
"package_no": "Package no"
|
|
248
246
|
},
|
|
249
247
|
"return": {
|
|
250
248
|
"title": "Return Items",
|
|
@@ -242,9 +242,7 @@
|
|
|
242
242
|
"total": "Toplam",
|
|
243
243
|
"items": "adet",
|
|
244
244
|
"packages": "paket",
|
|
245
|
-
"package_no": "Paket no"
|
|
246
|
-
"back_to_orders": "Siparişlere geri dön",
|
|
247
|
-
"no_orders_found": "Sipariş bulunamadı"
|
|
245
|
+
"package_no": "Paket no"
|
|
248
246
|
},
|
|
249
247
|
"return": {
|
|
250
248
|
"title": "İade Ürünleri",
|
|
@@ -61,26 +61,7 @@ const AccountOrderDetail = ({ params: { id } }) => {
|
|
|
61
61
|
}, [order, isSuccess, localeValue]);
|
|
62
62
|
|
|
63
63
|
if (isLoading && isFetching) {
|
|
64
|
-
return
|
|
65
|
-
<div className="flex flex-col items-center justify-center h-96">
|
|
66
|
-
<LoaderSpinner />
|
|
67
|
-
</div>
|
|
68
|
-
);
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
if (!order) {
|
|
72
|
-
return (
|
|
73
|
-
<div className="flex flex-col items-center justify-center h-96">
|
|
74
|
-
<p className="mt-5 text-start text-lg mb-4">
|
|
75
|
-
{t('account.my_orders.detail.no_orders_found')}
|
|
76
|
-
</p>
|
|
77
|
-
<Link href={`/account/orders/`}>
|
|
78
|
-
<Button className="px-4" appearance="filled">
|
|
79
|
-
{t('account.my_orders.detail.back_to_orders')}
|
|
80
|
-
</Button>
|
|
81
|
-
</Link>
|
|
82
|
-
</div>
|
|
83
|
-
);
|
|
64
|
+
return <LoaderSpinner />;
|
|
84
65
|
}
|
|
85
66
|
|
|
86
67
|
return (
|
|
@@ -41,14 +41,12 @@ export const Modal = (props: ModalProps) => {
|
|
|
41
41
|
'fixed top-0 left-0 w-screen h-screen bg-primary bg-opacity-60 z-50',
|
|
42
42
|
overlayClassName
|
|
43
43
|
)}
|
|
44
|
-
onClick={(e) => e.stopPropagation()}
|
|
45
44
|
/>
|
|
46
45
|
<section
|
|
47
46
|
className={twMerge(
|
|
48
47
|
'fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-50 bg-white',
|
|
49
48
|
className
|
|
50
49
|
)}
|
|
51
|
-
onClick={(e) => e.stopPropagation()}
|
|
52
50
|
>
|
|
53
51
|
{(showCloseButton || title) && (
|
|
54
52
|
<div
|
|
@@ -48,7 +48,7 @@ const Select = forwardRef<HTMLSelectElement, SelectProps>((props, ref) => {
|
|
|
48
48
|
clsx(
|
|
49
49
|
'cursor-pointer truncate h-10 w-40 px-2.5 shrink-0 outline-none',
|
|
50
50
|
!borderless &&
|
|
51
|
-
'border border-gray-200 transition-all duration-150 hover:border-primary
|
|
51
|
+
'border border-gray-200 transition-all duration-150 hover:border-primary',
|
|
52
52
|
'appearance-none bg-transparent'
|
|
53
53
|
),
|
|
54
54
|
className
|
|
@@ -21,7 +21,7 @@ export const OrderDetailHeader = ({ title, order, children }: Props) => {
|
|
|
21
21
|
<div>
|
|
22
22
|
<span>{t('account.my_orders.detail.order_number')}</span>:{' '}
|
|
23
23
|
<span data-testid="account-orders-return-order-id">
|
|
24
|
-
{order
|
|
24
|
+
{order.number}
|
|
25
25
|
</span>
|
|
26
26
|
</div>
|
|
27
27
|
|
|
@@ -85,7 +85,7 @@ const AddressBox = ({
|
|
|
85
85
|
};
|
|
86
86
|
|
|
87
87
|
const onSubmit = (data) => {
|
|
88
|
-
editAddress({ ...data, invalidateTag: '
|
|
88
|
+
editAddress({ ...data, invalidateTag: 'Addresses' })
|
|
89
89
|
.unwrap()
|
|
90
90
|
.then((editAddressResponse) => {
|
|
91
91
|
handleAddressClick(addressType, editAddressResponse);
|
|
@@ -96,7 +96,7 @@ const AddressBox = ({
|
|
|
96
96
|
};
|
|
97
97
|
|
|
98
98
|
const handleRemoveAddress = async (addressPk: number) => {
|
|
99
|
-
await removeAddress({ id: addressPk, invalidateTag: '
|
|
99
|
+
await removeAddress({ id: addressPk, invalidateTag: 'Addresses' });
|
|
100
100
|
setRemoveAddressModalOpen(false);
|
|
101
101
|
dispatch(resetCheckoutState());
|
|
102
102
|
|
|
@@ -168,10 +168,7 @@ const AddressBox = ({
|
|
|
168
168
|
<Button
|
|
169
169
|
appearance="ghost"
|
|
170
170
|
className="italic underline hover:text-secondary-500 hover:!bg-white hover:!border-white p-0 h-auto"
|
|
171
|
-
onClick={(
|
|
172
|
-
e.stopPropagation();
|
|
173
|
-
setIsEditAddressModalOpen(true);
|
|
174
|
-
}}
|
|
171
|
+
onClick={() => setIsEditAddressModalOpen(true)}
|
|
175
172
|
data-testid="checkout-address-edit"
|
|
176
173
|
>
|
|
177
174
|
{t('checkout.address.box.edit')}
|
|
@@ -183,26 +180,21 @@ const AddressBox = ({
|
|
|
183
180
|
setOpen={setIsEditAddressModalOpen}
|
|
184
181
|
className="w-full sm:w-[28rem] max-h-[90vh] overflow-y-auto"
|
|
185
182
|
>
|
|
186
|
-
<
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
/>
|
|
197
|
-
</div>
|
|
183
|
+
<AddressForm
|
|
184
|
+
data={{
|
|
185
|
+
...address,
|
|
186
|
+
country: address.country?.pk,
|
|
187
|
+
city: address.city?.pk,
|
|
188
|
+
township: address.township?.pk,
|
|
189
|
+
district: address.district?.pk
|
|
190
|
+
}}
|
|
191
|
+
onSubmit={onSubmit}
|
|
192
|
+
/>
|
|
198
193
|
</Modal>
|
|
199
194
|
<Button
|
|
200
195
|
appearance="ghost"
|
|
201
196
|
className="italic underline hover:text-secondary-500 hover:!bg-white hover:!border-white p-0 h-auto"
|
|
202
|
-
onClick={(
|
|
203
|
-
e.stopPropagation();
|
|
204
|
-
setRemoveAddressModalOpen(true);
|
|
205
|
-
}}
|
|
197
|
+
onClick={() => setRemoveAddressModalOpen(true)}
|
|
206
198
|
data-testid="checkout-address-remove"
|
|
207
199
|
>
|
|
208
200
|
{t('checkout.address.box.remove')}
|
|
@@ -215,18 +207,14 @@ const AddressBox = ({
|
|
|
215
207
|
setOpen={setRemoveAddressModalOpen}
|
|
216
208
|
showCloseButton={false}
|
|
217
209
|
>
|
|
218
|
-
<div
|
|
219
|
-
className="text-center px-6 py-10"
|
|
220
|
-
onClick={(e) => e.stopPropagation()}
|
|
221
|
-
>
|
|
210
|
+
<div className="text-center px-6 py-10">
|
|
222
211
|
<p className="mb-4">
|
|
223
212
|
{t('account.address_book.modal.delete_description')}
|
|
224
213
|
</p>
|
|
225
214
|
<div className="space-x-3 flex justify-center">
|
|
226
215
|
<Button
|
|
227
216
|
appearance="outlined"
|
|
228
|
-
onClick={(
|
|
229
|
-
e.stopPropagation();
|
|
217
|
+
onClick={() => {
|
|
230
218
|
setRemoveAddressModalOpen(false);
|
|
231
219
|
}}
|
|
232
220
|
data-testid="remove-address-modal-cancel"
|
|
@@ -236,8 +224,7 @@ const AddressBox = ({
|
|
|
236
224
|
<Button
|
|
237
225
|
appearance="filled"
|
|
238
226
|
disabled={removeAddressLoading}
|
|
239
|
-
onClick={(
|
|
240
|
-
e.stopPropagation();
|
|
227
|
+
onClick={() => {
|
|
241
228
|
handleRemoveAddress(address.pk);
|
|
242
229
|
}}
|
|
243
230
|
className={
|
|
@@ -77,7 +77,7 @@ const Addresses = () => {
|
|
|
77
77
|
}, [billing_and_shipping_same]);
|
|
78
78
|
|
|
79
79
|
const onSubmit = (data) => {
|
|
80
|
-
addAddress({ ...data, invalidateTag: '
|
|
80
|
+
addAddress({ ...data, invalidateTag: 'Addresses' })
|
|
81
81
|
.unwrap()
|
|
82
82
|
.then((addAddressResponse) => {
|
|
83
83
|
if (addressList.length === 0) {
|
|
@@ -4,7 +4,8 @@ import { useEffect, useRef, useState } from 'react';
|
|
|
4
4
|
import { useAppDispatch, useAppSelector } from '@akinon/next/redux/hooks';
|
|
5
5
|
import { closeSearch } from '@akinon/next/redux/reducers/header';
|
|
6
6
|
import clsx from 'clsx';
|
|
7
|
-
|
|
7
|
+
|
|
8
|
+
import { Icon } from '@theme/components';
|
|
8
9
|
import Results from './results';
|
|
9
10
|
import { ROUTES } from '@theme/routes';
|
|
10
11
|
import { useLocalization, useRouter } from '@akinon/next/hooks';
|
|
@@ -41,14 +42,6 @@ export default function Search() {
|
|
|
41
42
|
};
|
|
42
43
|
}, [isSearchOpen, dispatch]);
|
|
43
44
|
|
|
44
|
-
const handleSearchTextChange = (e: React.ChangeEvent<HTMLInputElement>) => {
|
|
45
|
-
setSearchText(e.target.value);
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
const handleCloseSearch = () => {
|
|
49
|
-
dispatch(closeSearch());
|
|
50
|
-
};
|
|
51
|
-
|
|
52
45
|
return (
|
|
53
46
|
<>
|
|
54
47
|
<div
|
|
@@ -74,9 +67,9 @@ export default function Search() {
|
|
|
74
67
|
{t('common.search.results_for')}
|
|
75
68
|
</span>
|
|
76
69
|
<div className="flex items-center">
|
|
77
|
-
<
|
|
70
|
+
<input
|
|
78
71
|
value={searchText}
|
|
79
|
-
onChange={
|
|
72
|
+
onChange={(e) => setSearchText(e.target.value)}
|
|
80
73
|
onKeyDown={(e) => {
|
|
81
74
|
if (e.key === 'Enter' && searchText.trim() !== '') {
|
|
82
75
|
router.push(`${ROUTES.LIST}/?search_text=${searchText}`);
|
|
@@ -98,12 +91,11 @@ export default function Search() {
|
|
|
98
91
|
<Icon
|
|
99
92
|
name="close"
|
|
100
93
|
size={14}
|
|
101
|
-
onClick={
|
|
94
|
+
onClick={() => dispatch(closeSearch())}
|
|
102
95
|
className="cursor-pointer"
|
|
103
96
|
/>
|
|
104
97
|
</div>
|
|
105
98
|
</div>
|
|
106
|
-
|
|
107
99
|
<Results searchText={searchText} />
|
|
108
100
|
</div>
|
|
109
101
|
</div>
|
|
@@ -36,100 +36,53 @@ export default function ProductInfoSlider({ product }: ProductSliderItem) {
|
|
|
36
36
|
carouselRef.current?.next();
|
|
37
37
|
};
|
|
38
38
|
|
|
39
|
-
const handleThumbnailClick = (index
|
|
39
|
+
const handleThumbnailClick = (index) => {
|
|
40
40
|
setActiveIndex(index);
|
|
41
41
|
carouselRef.current?.goToSlide(index);
|
|
42
42
|
};
|
|
43
43
|
|
|
44
44
|
return (
|
|
45
|
-
|
|
46
|
-
<div className="lg:
|
|
47
|
-
<div className="
|
|
48
|
-
<
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
disabled={activeIndex === 0}
|
|
56
|
-
>
|
|
57
|
-
<Icon name="chevron-up" size={15} className="fill-[#000000]" />
|
|
58
|
-
</button>
|
|
59
|
-
<div className="hidden flex-col items-center overflow-scroll w-[80px] max-h-[620px] lg:block">
|
|
60
|
-
{product?.productimage_set?.map((item, index) => (
|
|
61
|
-
<Image
|
|
62
|
-
key={index}
|
|
63
|
-
src={item.image}
|
|
64
|
-
alt={`Thumbnail ${index}`}
|
|
65
|
-
width={80}
|
|
66
|
-
height={128}
|
|
67
|
-
aspectRatio={80 / 128}
|
|
68
|
-
className={twMerge('cursor-pointer', [
|
|
69
|
-
activeIndex === index && 'border-2 border-primary'
|
|
70
|
-
])}
|
|
71
|
-
onClick={() => handleThumbnailClick(index)}
|
|
72
|
-
/>
|
|
73
|
-
))}
|
|
74
|
-
</div>
|
|
75
|
-
<button
|
|
76
|
-
onClick={goToNext}
|
|
77
|
-
className={twMerge(
|
|
78
|
-
'hidden justify-center p-2 mt-3 border border-gray-100 rounded-full cursor-pointer lg:block',
|
|
79
|
-
[
|
|
80
|
-
activeIndex === product.productimage_set.length - 1 &&
|
|
81
|
-
'cursor-not-allowed opacity-45'
|
|
82
|
-
]
|
|
83
|
-
)}
|
|
84
|
-
disabled={activeIndex === product.productimage_set.length - 1}
|
|
85
|
-
>
|
|
86
|
-
<Icon name="chevron-down" size={15} className="fill-[#000000]" />
|
|
87
|
-
</button>
|
|
88
|
-
</div>
|
|
89
|
-
</div>
|
|
90
|
-
|
|
91
|
-
<div className="relative lg:col-span-5">
|
|
92
|
-
<FavButton className="absolute right-8 top-6 z-[20] sm:hidden" />
|
|
93
|
-
|
|
94
|
-
<PluginModule
|
|
95
|
-
component={Component.ProductImageSearchFeature}
|
|
96
|
-
props={{
|
|
97
|
-
product,
|
|
98
|
-
activeIndex,
|
|
99
|
-
showResetButton: true
|
|
100
|
-
}}
|
|
101
|
-
/>
|
|
102
|
-
|
|
103
|
-
<CarouselCore
|
|
104
|
-
responsive={{
|
|
105
|
-
all: {
|
|
106
|
-
breakpoint: { max: 5000, min: 0 },
|
|
107
|
-
items: 1
|
|
108
|
-
}
|
|
109
|
-
}}
|
|
110
|
-
arrows={false}
|
|
111
|
-
swipeable={true}
|
|
112
|
-
ref={carouselRef}
|
|
113
|
-
afterChange={(previousSlide, { currentSlide }) => {
|
|
114
|
-
setActiveIndex(currentSlide);
|
|
115
|
-
}}
|
|
116
|
-
containerAspectRatio={{ mobile: 520 / 798, desktop: 484 / 726 }}
|
|
45
|
+
<div className="lg:grid lg:grid-cols-6">
|
|
46
|
+
<div className="lg:col-span-1">
|
|
47
|
+
<div className="flex flex-col items-center justify-center md:mr-[6px]">
|
|
48
|
+
<button
|
|
49
|
+
onClick={goToPrev}
|
|
50
|
+
className={twMerge(
|
|
51
|
+
'hidden justify-center p-2 mb-3 border border-gray-100 rounded-full cursor-pointer lg:block',
|
|
52
|
+
[activeIndex === 0 && 'cursor-not-allowed opacity-45']
|
|
53
|
+
)}
|
|
54
|
+
disabled={activeIndex === 0}
|
|
117
55
|
>
|
|
118
|
-
{
|
|
56
|
+
<Icon name="chevron-up" size={15} className="fill-[#000000]" />
|
|
57
|
+
</button>
|
|
58
|
+
<div className="hidden flex-col items-center overflow-scroll w-[80px] max-h-[620px] lg:block">
|
|
59
|
+
{product?.productimage_set?.map((item, index) => (
|
|
119
60
|
<Image
|
|
120
|
-
key={
|
|
61
|
+
key={index}
|
|
121
62
|
src={item.image}
|
|
122
|
-
alt={
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
fill
|
|
63
|
+
alt={`Thumbnail ${index}`}
|
|
64
|
+
width={80}
|
|
65
|
+
height={128}
|
|
66
|
+
className={twMerge('cursor-pointer', [
|
|
67
|
+
activeIndex === index && 'border-2 border-primary'
|
|
68
|
+
])}
|
|
69
|
+
onClick={() => handleThumbnailClick(index)}
|
|
130
70
|
/>
|
|
131
71
|
))}
|
|
132
|
-
</
|
|
72
|
+
</div>
|
|
73
|
+
<button
|
|
74
|
+
onClick={goToNext}
|
|
75
|
+
className={twMerge(
|
|
76
|
+
'hidden justify-center p-2 mt-3 border border-gray-100 rounded-full cursor-pointer lg:block',
|
|
77
|
+
[
|
|
78
|
+
activeIndex === product.productimage_set.length - 1 &&
|
|
79
|
+
'cursor-not-allowed opacity-45'
|
|
80
|
+
]
|
|
81
|
+
)}
|
|
82
|
+
disabled={activeIndex === product.productimage_set.length - 1}
|
|
83
|
+
>
|
|
84
|
+
<Icon name="chevron-down" size={15} className="fill-[#000000]" />
|
|
85
|
+
</button>
|
|
133
86
|
</div>
|
|
134
87
|
</div>
|
|
135
88
|
|
package/commands/plugins.ts
CHANGED