@weareconceptstudio/account 0.6.2 → 0.6.3

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.
@@ -6,6 +6,5 @@ export declare const balanceFields: {
6
6
  };
7
7
  fieldProps: {
8
8
  placeholder: string;
9
- type: string;
10
9
  };
11
10
  }[];
@@ -1,13 +1,12 @@
1
1
  export const balanceFields = [
2
2
  {
3
- fieldType: 'input',
3
+ fieldType: 'number',
4
4
  labelProps: {
5
5
  name: 'balance',
6
6
  errorKey: 'account.balance_promotions.balance',
7
7
  },
8
8
  fieldProps: {
9
9
  placeholder: 'account.balance_promotions.balancePlaceholder',
10
- type: 'number',
11
10
  },
12
11
  },
13
12
  ];
@@ -1,5 +1,7 @@
1
1
  export default AppliedPromotion;
2
- declare function AppliedPromotion({ name }: {
2
+ declare function AppliedPromotion({ name, onClick, isExcluded }: {
3
3
  name: any;
4
+ onClick: any;
5
+ isExcluded?: boolean;
4
6
  }): React.JSX.Element;
5
7
  import React from 'react';
@@ -1,11 +1,8 @@
1
1
  import React from 'react';
2
2
  import { Text } from '@weareconceptstudio/core';
3
- const AppliedPromotion = ({ name }) => {
3
+ const AppliedPromotion = ({ name, onClick, isExcluded = false }) => {
4
4
  return (React.createElement("div", { className: `promo-code-success-block` },
5
5
  React.createElement(Text, { className: 'account-p account-p4 account-primary-color2 account-font-medium promo-code-success-text' }, name),
6
- React.createElement(Text, { text: 'account.general_actions.remove', className: 'account-p account-p4 account-primary-color2 account-font-medium promo-code-remove-text', onClick: () => {
7
- // promotionHandler(null);
8
- // setDisable(false);
9
- } })));
6
+ React.createElement(Text, { text: isExcluded ? 'account.general_actions.restore' : 'account.general_actions.remove', className: 'account-p account-p4 account-primary-color2 account-font-medium promo-code-remove-text', onClick: onClick })));
10
7
  };
11
8
  export default AppliedPromotion;
@@ -8,16 +8,13 @@ import { promoCodeFields } from './utils';
8
8
  //* Style
9
9
  import PromoCodeCompStyle from './style';
10
10
  const PromoCodeComp = () => {
11
- const { itemsCount, usePromotion, appliedPromotions, fillCart } = useCart();
12
- const handlePromotion = (promotion) => {
13
- fillCart('usePromotion', promotion);
14
- };
11
+ const { itemsCount, appliedPromotions, fillCart, togglePromotion, checkoutData } = useCart();
15
12
  const onFinish = (values) => {
16
- handlePromotion(values.promo_code);
13
+ fillCart('promotion_code', values?.promo_code || null);
17
14
  };
18
15
  const promotions = useMemo(() => {
19
- return appliedPromotions?.map((promotion, index) => (React.createElement(AppliedPromotion, { key: index, ...promotion })));
20
- }, [appliedPromotions]);
16
+ return appliedPromotions?.map((promotion) => (React.createElement(AppliedPromotion, { key: promotion.id, ...promotion, isExcluded: checkoutData?.excludedPromotions?.includes(promotion.id), onClick: () => (promotion.is_manual ? onFinish(null) : togglePromotion({ promotionId: promotion.id })) })));
17
+ }, [appliedPromotions, checkoutData.excludedPromotions]);
21
18
  return (React.createElement(PromoCodeCompStyle, { className: `collapse-distance ${itemsCount ? '' : 'disable'}` },
22
19
  React.createElement(CollapseItem, { status: appliedPromotions?.length ? 'open' : 'close', title: React.createElement(React.Fragment, null,
23
20
  React.createElement("div", { className: 'inner-wrapper-icon' },
@@ -26,9 +23,9 @@ const PromoCodeComp = () => {
26
23
  React.createElement("path", { d: 'M6 12L6 0', stroke: 'black', strokeWidth: '2' }))),
27
24
  React.createElement(Text, { className: 'account-p account-p4 account-primary-color1 account-font-medium promo-code-text', text: 'account.balance_promotions.gotPromotionCode' })), description: React.createElement(React.Fragment, null,
28
25
  promotions,
29
- usePromotion ? (React.createElement(AppliedPromotion, { name: usePromotion, onClick: () => handlePromotion(null) })) : (React.createElement(FormBuilder, { onSubmit: onFinish, fields: promoCodeFields, className: `promo-code-block`, formOptions: {
26
+ !checkoutData.promotion_code ? (React.createElement(FormBuilder, { onSubmit: onFinish, fields: promoCodeFields, className: `promo-code-block`, formOptions: {
30
27
  className: 'promo-code-container',
31
28
  } },
32
- React.createElement(AccountButton, { type: 'submit', btnType: `promo-code-version`, text: `account.general_actions.add` })))) })));
29
+ React.createElement(AccountButton, { type: 'submit', btnType: `promo-code-version`, text: `account.general_actions.add` }))) : null) })));
33
30
  };
34
31
  export default PromoCodeComp;
@@ -8,7 +8,7 @@ export const useAddressContext = () => {
8
8
  };
9
9
  export const AddressProvider = ({ addressType, addressFormFields = [], useUser, children }) => {
10
10
  const { isLoggedIn } = useUser();
11
- const { fillCheckoutData, fillCart, isCheckoutPage } = useCart();
11
+ const { fillCheckoutData, fillCart, isCheckoutPage, checkoutData } = useCart();
12
12
  const [addressLoading, setAddressLoading] = useState(false);
13
13
  const [addresses, setAddresses] = useState(addressType ? { billing: [], shipping: [] } : []);
14
14
  const [selectedAddresses, setSelectedAddresses] = useState(addressType ? { billing: {}, shipping: {} } : {});
@@ -35,6 +35,14 @@ export const AddressProvider = ({ addressType, addressFormFields = [], useUser,
35
35
  });
36
36
  }
37
37
  }, [isLoggedIn]);
38
+ useEffect(() => {
39
+ if (checkoutData?.addressId) {
40
+ let storageSelectedAddress = addresses.find((item) => item.id == checkoutData.addressId);
41
+ if (storageSelectedAddress) {
42
+ setSelectedAddresses(storageSelectedAddress);
43
+ }
44
+ }
45
+ }, [checkoutData?.addressId, addresses]);
38
46
  const createAddress = async ({ data, type }) => {
39
47
  return await api.post('addresses', data).then((res) => {
40
48
  if (addressType) {
@@ -48,11 +48,6 @@ const Item = memo(({ data, remove, select, isLast, actions, isCheckout }) => {
48
48
  React.createElement("div", { className: `flex-end-wrap` }, (data.sale_total || data.product.discount) && !data.is_gift ? (React.createElement("div", null,
49
49
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 align-right cart-sale-total`, text: handlePriceCheckFunc(data.sale_total, currency) }),
50
50
  React.createElement("div", { className: 'wrapper-discount' },
51
- data.product.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
52
- data.product.discount.value,
53
- data.product.discount.type === 'percentage' ? '%' : ` ${currency}`,
54
- "\u00A0",
55
- React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
56
51
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right cart-total1`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right cart-total2` }, data.is_gift ? (React.createElement(React.Fragment, null,
57
52
  handlePriceCheckFunc(0, currency),
58
53
  React.createElement("span", { className: 'gift-name-text' }, data.appliedPromotion.name))) : (handlePriceCheckFunc(data.total, currency))))),
@@ -14,6 +14,8 @@ interface CheckoutData {
14
14
  qty: number;
15
15
  }[];
16
16
  card_id: number | null;
17
+ excludedPromotions: any[];
18
+ promotion_code: string | null;
17
19
  }
18
20
  interface CartState {
19
21
  itemsCount: number;
@@ -29,8 +31,8 @@ interface CartState {
29
31
  giftThresholdRemaining: number | null;
30
32
  useBalance: number | string | null;
31
33
  discount: number | null;
32
- usePromotion?: string | null;
33
34
  appliedPromotions: any[];
35
+ promotion_code: string | null;
34
36
  }
35
37
  interface CartContextType extends CartState {
36
38
  getCart: (params?: Record<string, any>) => Promise<void>;
@@ -52,6 +54,9 @@ interface CartContextType extends CartState {
52
54
  qty: number;
53
55
  productId: number;
54
56
  }) => void;
57
+ togglePromotion: ({ promotionId }: {
58
+ promotionId: any;
59
+ }) => void;
55
60
  checkoutBtnDisabled: boolean;
56
61
  isCheckoutPage: boolean;
57
62
  }
@@ -21,6 +21,7 @@ export const CartProvider = ({ useUser, children }) => {
21
21
  hasFreeGift: null,
22
22
  giftThresholdRemaining: null,
23
23
  useBalance: null,
24
+ promotion_code: null,
24
25
  discount: null,
25
26
  appliedPromotions: [],
26
27
  });
@@ -31,6 +32,8 @@ export const CartProvider = ({ useUser, children }) => {
31
32
  paymentType: user?.payment_method || 'cash_on_delivery',
32
33
  gifts: [],
33
34
  card_id: null,
35
+ excludedPromotions: [],
36
+ promotion_code: null
34
37
  };
35
38
  const [checkoutData, setCheckoutData] = useState(initialCheckoutData);
36
39
  const checkoutDataRef = useRef(checkoutData);
@@ -45,8 +48,16 @@ export const CartProvider = ({ useUser, children }) => {
45
48
  return cookieCart ? JSON.parse(cookieCart) : [];
46
49
  };
47
50
  const setResourceDecorator = (data) => {
48
- setCartState((prev) => ({ ...prev, ...data, loading: false }));
49
- setCheckoutData((prev) => ({ ...prev, useBalance: data.useBalance }));
51
+ setCartState((prev) => ({
52
+ ...prev,
53
+ ...data,
54
+ loading: false
55
+ }));
56
+ setCheckoutData((prev) => ({
57
+ ...prev,
58
+ useBalance: data.useBalance,
59
+ promotion_code: data.promotion_code
60
+ }));
50
61
  };
51
62
  const isCheckoutPage = useMemo(() => {
52
63
  return window.location.href.includes('checkout');
@@ -58,7 +69,7 @@ export const CartProvider = ({ useUser, children }) => {
58
69
  return isCheckoutPage || isCartPage ? 'cart' : 'cart-summary';
59
70
  }, [isCheckoutPage, isCartPage]);
60
71
  const getCart = async (params = {}) => {
61
- let newParams = { ...cleanObject(params), ...cleanObject(checkoutDataRef.current), cartResourceType };
72
+ let newParams = { ...cleanObject(checkoutDataRef.current), ...params, cartResourceType };
62
73
  if (isLoggedIn) {
63
74
  const { data } = await api.get({ url: 'cart', lang: selectedLang, params: newParams });
64
75
  setResourceDecorator(data);
@@ -156,6 +167,21 @@ export const CartProvider = ({ useUser, children }) => {
156
167
  ],
157
168
  }));
158
169
  }, []);
170
+ const togglePromotion = ({ promotionId }) => {
171
+ setCheckoutData((prev) => {
172
+ const excludedPromotions = prev.excludedPromotions;
173
+ const index = excludedPromotions.indexOf(promotionId);
174
+ if (index > -1) {
175
+ excludedPromotions.splice(index, 1);
176
+ }
177
+ else {
178
+ excludedPromotions.push(promotionId);
179
+ }
180
+ const updatedData = { ...prev, excludedPromotions };
181
+ getCart(updatedData);
182
+ return updatedData;
183
+ });
184
+ };
159
185
  const checkoutBtnDisabled = useMemo(() => {
160
186
  let isDisabled = false;
161
187
  if (isCheckoutPage && isNumeric(checkoutData.paymentType)) {
@@ -232,6 +258,7 @@ export const CartProvider = ({ useUser, children }) => {
232
258
  handleCheckout,
233
259
  fillCart,
234
260
  setGifts,
261
+ togglePromotion,
235
262
  checkoutBtnDisabled,
236
263
  isCheckoutPage,
237
264
  } },
@@ -26,29 +26,22 @@ const Item = memo(({ data }) => {
26
26
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: data.product.short_info_2 }))) : null)),
27
27
  React.createElement("div", { className: `col-item tl-col-2` },
28
28
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: data?.qty })),
29
- React.createElement("div", { className: `col-item tl-col-3 col-item-3 nowrap` }, (data.sale_price || data.product?.discount) && !data.is_gift ? (React.createElement("div", null,
29
+ React.createElement("div", { className: `col-item tl-col-3 col-item-3 nowrap` }, data.sale_price && !data.is_gift ? (React.createElement("div", null,
30
30
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 align-right order-sale-price`, text: handlePriceCheckFunc(data.sale_price, currency) }),
31
31
  React.createElement("div", { className: 'wrapper-discount' },
32
- data.product?.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
33
- data.product.discount,
34
- data.product?.discount_type === 'percentage' ? '%' : ` ${currency}`,
32
+ data.appliedPromotion ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
33
+ data.appliedPromotion.value,
34
+ data.appliedPromotion.type === 'percentage' ? '%' : ` ${currency}`,
35
35
  "\u00A0",
36
36
  React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
37
37
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right order-price1`, text: handlePriceCheckFunc(data.price, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right order-sale-price` }, data.is_gift ? (React.createElement(React.Fragment, null,
38
38
  handlePriceCheckFunc(0, currency),
39
- React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name || 'Karlen'))) : (handlePriceCheckFunc(data.price, currency))))),
39
+ React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name))) : (handlePriceCheckFunc(data.price, currency))))),
40
40
  React.createElement("div", { className: `col-item tl-col-4 col-item-4 nowrap price-block` },
41
41
  React.createElement("div", { className: `col-item-inner-wrap` },
42
- React.createElement("div", { className: `flex-end-wrap` }, (data.sale_total || data.product?.discount) && !data.is_gift ? (React.createElement("div", null,
42
+ React.createElement("div", { className: `flex-end-wrap` }, data.sale_total && !data.is_gift ? (React.createElement("div", null,
43
43
  React.createElement(Text, { className: `account-p account-p3 account-font-bold account-secondary-color2 align-right order-sale-price`, text: handlePriceCheckFunc(data.sale_total, currency) }),
44
44
  React.createElement("div", { className: 'wrapper-discount' },
45
- data.product?.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text` },
46
- data.product.discount,
47
- data.product?.discount_type === 'percentage' ? '%' : ` ${currency}`,
48
- "\u00A0",
49
- React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
50
- React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right order-price1`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right order-sale-price` }, data.is_gift ? (React.createElement(React.Fragment, null,
51
- handlePriceCheckFunc(0, currency),
52
- React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name || 'Karlen'))) : (handlePriceCheckFunc(data.total, currency))))))))));
45
+ React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through value align-right order-price1`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 align-right order-sale-price` }, handlePriceCheckFunc(data.total, currency)))))))));
53
46
  });
54
47
  export default Item;
@@ -31,27 +31,22 @@ const ItemMobile = memo(({ data }) => {
31
31
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: data?.qty })),
32
32
  React.createElement("div", { className: `mobile-price-wrap nowrap` },
33
33
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: `account.order_balance.price` }),
34
- (data.sale_price || data.product?.discount) && !data.is_gift ? (React.createElement(React.Fragment, null,
34
+ data.sale_price && !data.is_gift ? (React.createElement(React.Fragment, null,
35
35
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-secondary-color2 sale-price`, text: handlePriceCheckFunc(data.sale_price, currency) }),
36
36
  React.createElement("div", { className: 'wrapper-discount' },
37
- data.product?.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text-mobile` },
38
- data.product.discount,
39
- data.product?.discount_type === 'percentage' ? '%' : ` ${currency}`,
37
+ data.appliedPromotion ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text-mobile` },
38
+ data.appliedPromotion.value,
39
+ data.appliedPromotion.type === 'percentage' ? '%' : ` ${currency}`,
40
40
  "\u00A0",
41
41
  React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
42
42
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through price1`, text: handlePriceCheckFunc(data.price, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 price2` }, data.is_gift ? (React.createElement(React.Fragment, null,
43
43
  handlePriceCheckFunc(0, currency),
44
- React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name || 'Karlen'))) : (handlePriceCheckFunc(data.price, currency))))),
44
+ React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name))) : (handlePriceCheckFunc(data.price, currency))))),
45
45
  React.createElement("div", { className: `mobile-total-price-wrap nowrap` },
46
46
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1`, text: `account.order_balance.total` }),
47
- (data.sale_total || data.product?.discount) && !data.is_gift ? (React.createElement(React.Fragment, null,
47
+ data.sale_total && !data.is_gift ? (React.createElement(React.Fragment, null,
48
48
  React.createElement(Text, { className: `account-p account-p3 account-font-medium account-secondary-color2 sale-total`, text: handlePriceCheckFunc(data.sale_total, currency) }),
49
49
  React.createElement("div", { className: 'wrapper-discount' },
50
- data.product?.discount ? (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color2 discount-text-mobile` },
51
- data.product.discount,
52
- data.product?.discount_type === 'percentage' ? '%' : ` ${currency}`,
53
- "\u00A0",
54
- React.createElement("span", { className: 'lowercase' }, translate('account.order_balance.discount')))) : null,
55
50
  React.createElement(Text, { className: `account-p account-p3 account-font-regular account-primary-color2 line-through total1`, text: handlePriceCheckFunc(data.total, currency) })))) : (React.createElement(Text, { className: `account-p account-p3 account-font-medium account-primary-color1 total2`, text: handlePriceCheckFunc(data.is_gift ? 0 : data.total, currency) }, data.is_gift ? (React.createElement(React.Fragment, null,
56
51
  handlePriceCheckFunc(0, currency),
57
52
  React.createElement("span", { className: 'gift-name-text' }, data?.appliedPromotion?.name || 'Karlen'))) : (handlePriceCheckFunc(data.total, currency)))))))));
package/package.json CHANGED
@@ -1,10 +1,11 @@
1
1
  {
2
2
  "name": "@weareconceptstudio/account",
3
- "version": "0.6.2",
3
+ "version": "0.6.3",
4
4
  "description": "Concept Studio Account",
5
5
  "author": "Concept Studio",
6
6
  "license": "ISC",
7
7
  "main": "dist/index.js",
8
+ "sideEffects": false,
8
9
  "files": [
9
10
  "dist"
10
11
  ],