@weareconceptstudio/account 0.2.4 → 0.2.6
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/dist/components/WarningMessage/index.d.ts +2 -1
- package/dist/components/WarningMessage/index.js +2 -2
- package/dist/modules/account/AccountTemplate/style.js +1 -1
- package/dist/modules/auth/ForgotPasswordTemplate/index.js +4 -4
- package/dist/modules/cart/SimpleItems/style.js +15 -0
- package/dist/modules/order/OrderIndividualTemplate/index.js +2 -10
- package/dist/modules/order/OrderedItems/index.d.ts +2 -1
- package/dist/modules/order/OrderedItems/index.js +11 -5
- package/dist/modules/order/OrderedItems/style.js +23 -0
- package/dist/translations/en.d.ts +1 -0
- package/dist/translations/en.js +1 -0
- package/dist/translations/hy.d.ts +1 -0
- package/dist/translations/hy.js +1 -0
- package/dist/translations/index.d.ts +3 -0
- package/dist/translations/ru.d.ts +1 -0
- package/dist/translations/ru.js +1 -0
- package/package.json +1 -1
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export default WarningMessage;
|
|
2
|
-
declare function WarningMessage({ error, isSent, successTitle, successSubtitle }: {
|
|
2
|
+
declare function WarningMessage({ error, errorSubtitle, isSent, successTitle, successSubtitle }: {
|
|
3
3
|
error: any;
|
|
4
|
+
errorSubtitle: any;
|
|
4
5
|
isSent: any;
|
|
5
6
|
successTitle: any;
|
|
6
7
|
successSubtitle: any;
|
|
@@ -2,9 +2,9 @@ import React from 'react';
|
|
|
2
2
|
import { Text } from '@weareconceptstudio/core';
|
|
3
3
|
//* Style
|
|
4
4
|
import WarningMessageStyle from './style';
|
|
5
|
-
const WarningMessage = ({ error, isSent, successTitle, successSubtitle }) => {
|
|
5
|
+
const WarningMessage = ({ error, errorSubtitle, isSent, successTitle, successSubtitle }) => {
|
|
6
6
|
return ((isSent || error) && (React.createElement(WarningMessageStyle, { className: `message-container account-${error ? 'error' : 'success'}-color-bg` },
|
|
7
7
|
React.createElement(Text, { className: `account-p account-p4 message-title account-font-bold account-${error ? 'error' : 'success'}-color`, text: error || successTitle }),
|
|
8
|
-
|
|
8
|
+
React.createElement(Text, { className: `account-p account-p4 message-subtitle account-font-regular account-${error ? 'error' : 'success'}-color`, text: error ? errorSubtitle : successSubtitle }))));
|
|
9
9
|
};
|
|
10
10
|
export default WarningMessage;
|
|
@@ -75,13 +75,13 @@ const ForgotPasswordTemplate = ({ signInUrl = '/sign-in' }) => {
|
|
|
75
75
|
React.createElement(AccountButton, { text: `submit`, type: `submit`, btnType: `full-width` })))) : (React.createElement(React.Fragment, null,
|
|
76
76
|
React.createElement(Text, { tag: 'h2', className: 'account-h2 account-font-bold account-primary-color1 title', text: 'thankYou' }),
|
|
77
77
|
React.createElement("div", { className: 'recovery-wrap' },
|
|
78
|
-
React.createElement(Text, { className: 'account-p account-p2 account-font-medium account-primary-color1', text: 'recoveryText' }),
|
|
78
|
+
React.createElement(Text, { className: 'account-p account-p2 account-font-medium account-primary-color1 recovery-text', text: 'recoveryText' }),
|
|
79
79
|
"\u00A0",
|
|
80
|
-
React.createElement(Text, { className: 'account-p account-p2 account-font-bold account-primary-color1', text: forgotState.email })),
|
|
80
|
+
React.createElement(Text, { className: 'account-p account-p2 account-font-bold account-primary-color1 recovery-email', text: forgotState.email })),
|
|
81
81
|
React.createElement("div", { className: 'try-again-wrap' },
|
|
82
|
-
React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1`, text: `tryAgainText` }),
|
|
82
|
+
React.createElement(Text, { className: `account-p account-p2 account-font-medium account-primary-color1 try-text`, text: `tryAgainText` }),
|
|
83
83
|
"\u00A0",
|
|
84
84
|
React.createElement(Text, { text: `tryAgain`, onClick: handleTryAgain, className: `account-p account-p2 account-font-bold account-primary-color1 underline try-again-text ${forgotState.isBtnDisabled ? 'disabled' : ''}` })),
|
|
85
|
-
React.createElement(WarningMessage, { error: forgotState.error, isSent: forgotState.isSent, successTitle: 'recoverPassword', successSubtitle: 'recoverPasswordDesc' })))))));
|
|
85
|
+
React.createElement(WarningMessage, { error: forgotState.error, errorSubtitle: 'forgotErrorDescription', isSent: forgotState.isSent, successTitle: 'recoverPassword', successSubtitle: 'recoverPasswordDesc' })))))));
|
|
86
86
|
};
|
|
87
87
|
export default ForgotPasswordTemplate;
|
|
@@ -42,6 +42,13 @@ const CartItemsStyle = styled.section `
|
|
|
42
42
|
|
|
43
43
|
--account_cartItemSelectFixedWidth: calc(var(--sp9x) + var(--sp0-5x));
|
|
44
44
|
|
|
45
|
+
.mobile-info-wrap-title {
|
|
46
|
+
a,
|
|
47
|
+
button {
|
|
48
|
+
text-align: left;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
45
52
|
.line {
|
|
46
53
|
width: calc(100% - var(--account_col1Distance));
|
|
47
54
|
height: 2px;
|
|
@@ -107,6 +114,10 @@ const CartItemsStyle = styled.section `
|
|
|
107
114
|
width: var(--account_col1Width);
|
|
108
115
|
padding-left: calc(var(--account_col1Distance) / 2);
|
|
109
116
|
padding-right: calc(var(--account_col1Distance) / 2);
|
|
117
|
+
|
|
118
|
+
img {
|
|
119
|
+
object-fit: contain;
|
|
120
|
+
}
|
|
110
121
|
}
|
|
111
122
|
|
|
112
123
|
.tl-col-2 {
|
|
@@ -560,6 +571,10 @@ const CartItemsStyle = styled.section `
|
|
|
560
571
|
|
|
561
572
|
.image-cont {
|
|
562
573
|
padding-top: 125% !important;
|
|
574
|
+
|
|
575
|
+
img {
|
|
576
|
+
object-fit: contain;
|
|
577
|
+
}
|
|
563
578
|
}
|
|
564
579
|
}
|
|
565
580
|
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import React, { useState, useEffect } from 'react';
|
|
2
2
|
import { api } from '@weareconceptstudio/core';
|
|
3
|
-
import { useAccountContext } from '../../../AccountProvider';
|
|
4
3
|
//* Components
|
|
5
4
|
import { AccountButton } from '../../../components';
|
|
6
5
|
import OrderDetails from '../OrderDetails';
|
|
@@ -10,8 +9,6 @@ import { ShippingBillingInfo } from '../../address';
|
|
|
10
9
|
import OrderIndividualTemplateStyle from './style';
|
|
11
10
|
// TODO: status change
|
|
12
11
|
const OrderIndividualTemplate = ({ uniqueKey }) => {
|
|
13
|
-
const { useCart } = useAccountContext();
|
|
14
|
-
const cartContext = useCart();
|
|
15
12
|
const [data, setData] = useState();
|
|
16
13
|
const [loading, setLoading] = useState(true);
|
|
17
14
|
useEffect(() => {
|
|
@@ -20,17 +17,12 @@ const OrderIndividualTemplate = ({ uniqueKey }) => {
|
|
|
20
17
|
setLoading(false);
|
|
21
18
|
});
|
|
22
19
|
}, [uniqueKey]);
|
|
23
|
-
const handleReorder = () => {
|
|
24
|
-
cartContext.reorder(data.id);
|
|
25
|
-
};
|
|
26
20
|
return !loading ? (React.createElement(OrderIndividualTemplateStyle, null,
|
|
27
21
|
React.createElement("div", { className: `order-info-wrap` },
|
|
28
|
-
React.createElement(AccountButton, { text: `backToList`, btnType: `green-large-text`, url: '/account/order-history/' }),
|
|
29
|
-
React.createElement("div", null,
|
|
30
|
-
React.createElement(AccountButton, { btnType: `purple-text`, text: 'reorder', onClick: handleReorder })),
|
|
22
|
+
React.createElement(AccountButton, { text: `backToList`, btnType: `green-large-text`, url: '/account/order-history/', className: `back-to-list-btn-block` }),
|
|
31
23
|
React.createElement("div", { className: `details-shipping-billing-wrap` },
|
|
32
24
|
React.createElement(OrderDetails, { className: `col-50`, ...data }),
|
|
33
25
|
React.createElement(ShippingBillingInfo, { className: `col-50`, billing_address: data?.billingAddress, shipping_address: data?.shippingAddress })),
|
|
34
|
-
|
|
26
|
+
React.createElement(OrderedItems, { data: data.items, dataId: data.id, status: data.status })))) : null;
|
|
35
27
|
};
|
|
36
28
|
export default OrderIndividualTemplate;
|
|
@@ -4,9 +4,10 @@ import { handlePriceCheckFunc } from '../../../utils/_functions';
|
|
|
4
4
|
import { useAccountContext } from '../../../AccountProvider';
|
|
5
5
|
import { AccountButton } from '../../../components';
|
|
6
6
|
import OrderedItemsStyle from './style';
|
|
7
|
-
const OrderedItems = ({ data: items, status }) => {
|
|
7
|
+
const OrderedItems = ({ data: items, status, dataId }) => {
|
|
8
8
|
const { winWidth } = useUi();
|
|
9
|
-
const { currency, handleProductClick } = useAccountContext();
|
|
9
|
+
const { currency, handleProductClick, useCart } = useAccountContext();
|
|
10
|
+
const cartContext = useCart();
|
|
10
11
|
//! Store order items
|
|
11
12
|
const storeOrderedItems = useMemo(() => {
|
|
12
13
|
return items?.length > 0
|
|
@@ -62,8 +63,13 @@ const OrderedItems = ({ data: items, status }) => {
|
|
|
62
63
|
React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1`, text: handlePriceCheckFunc(item.total, currency) })))))))
|
|
63
64
|
: null;
|
|
64
65
|
}, [items, currency, winWidth, status, handleProductClick]);
|
|
65
|
-
|
|
66
|
-
|
|
66
|
+
const handleReorder = () => {
|
|
67
|
+
cartContext.reorder(dataId);
|
|
68
|
+
};
|
|
69
|
+
return items?.length > 0 ? (React.createElement(OrderedItemsStyle, { className: `ordered-items-wrapper` },
|
|
70
|
+
React.createElement("div", { className: 'order-flex-block' },
|
|
71
|
+
React.createElement(Text, { className: 'account-p account-p1 account-font-bold account-primary-color1 ', text: 'orderItems' }),
|
|
72
|
+
React.createElement(AccountButton, { text: 'reorder', onClick: handleReorder, className: 'reorder-btn' })),
|
|
67
73
|
React.createElement("div", { className: 'line' }),
|
|
68
74
|
React.createElement("div", { className: `order-items-table-wrap` },
|
|
69
75
|
React.createElement("div", { className: `titles-wrap` },
|
|
@@ -75,6 +81,6 @@ const OrderedItems = ({ data: items, status }) => {
|
|
|
75
81
|
React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 nowrap align-right`, text: `price` })),
|
|
76
82
|
React.createElement("div", { className: `title-wrap tl-col-4 title-item` },
|
|
77
83
|
React.createElement(Text, { className: `account-p account-p3 account-font-bold account-primary-color1 nowrap align-right`, text: `total` }))),
|
|
78
|
-
React.createElement("div", { className: 'items-wrap' }, storeOrderedItems))));
|
|
84
|
+
React.createElement("div", { className: 'items-wrap' }, storeOrderedItems)))) : null;
|
|
79
85
|
};
|
|
80
86
|
export default OrderedItems;
|
|
@@ -43,6 +43,21 @@ const OrderedItemsStyle = styled.div `
|
|
|
43
43
|
|
|
44
44
|
margin-top: var(--account_orderItemsMarginTop);
|
|
45
45
|
|
|
46
|
+
.order-flex-block {
|
|
47
|
+
display: flex;
|
|
48
|
+
flex-wrap: wrap;
|
|
49
|
+
align-items: center;
|
|
50
|
+
justify-content: space-between;
|
|
51
|
+
gap: var(--sp1x);
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
.ordered-item-mobile-title {
|
|
55
|
+
a,
|
|
56
|
+
button {
|
|
57
|
+
text-align: left;
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
|
|
46
61
|
.line {
|
|
47
62
|
width: 100%;
|
|
48
63
|
border-bottom: 2px solid var(--account_primaryColor1);
|
|
@@ -74,6 +89,10 @@ const OrderedItemsStyle = styled.div `
|
|
|
74
89
|
width: var(--account_col1Width);
|
|
75
90
|
padding-left: calc(var(--account_col1Distance) / 2);
|
|
76
91
|
padding-right: calc(var(--account_col1Distance) / 2);
|
|
92
|
+
|
|
93
|
+
img {
|
|
94
|
+
object-fit: contain;
|
|
95
|
+
}
|
|
77
96
|
}
|
|
78
97
|
|
|
79
98
|
.tl-col-2 {
|
|
@@ -604,6 +623,10 @@ const OrderedItemsStyle = styled.div `
|
|
|
604
623
|
|
|
605
624
|
.image-cont {
|
|
606
625
|
padding-top: 125% !important;
|
|
626
|
+
|
|
627
|
+
img {
|
|
628
|
+
object-fit: contain;
|
|
629
|
+
}
|
|
607
630
|
}
|
|
608
631
|
}
|
|
609
632
|
|
package/dist/translations/en.js
CHANGED
package/dist/translations/hy.js
CHANGED
|
@@ -169,6 +169,7 @@ declare const _default: {
|
|
|
169
169
|
review: string;
|
|
170
170
|
reorder: string;
|
|
171
171
|
backToShop: string;
|
|
172
|
+
forgotErrorDescription: string;
|
|
172
173
|
};
|
|
173
174
|
hy: {
|
|
174
175
|
editCart: string;
|
|
@@ -340,6 +341,7 @@ declare const _default: {
|
|
|
340
341
|
review: string;
|
|
341
342
|
reorder: string;
|
|
342
343
|
backToShop: string;
|
|
344
|
+
forgotErrorDescription: string;
|
|
343
345
|
};
|
|
344
346
|
ru: {
|
|
345
347
|
editCart: string;
|
|
@@ -511,6 +513,7 @@ declare const _default: {
|
|
|
511
513
|
review: string;
|
|
512
514
|
reorder: string;
|
|
513
515
|
backToShop: string;
|
|
516
|
+
forgotErrorDescription: string;
|
|
514
517
|
};
|
|
515
518
|
};
|
|
516
519
|
export default _default;
|
package/dist/translations/ru.js
CHANGED