@tap-payments/auth-jsconnect 2.4.69-test → 2.4.71-test
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/build/@types/app.d.ts +10 -0
- package/build/@types/form.d.ts +6 -4
- package/build/assets/locales/ar.json +3 -3
- package/build/constants/app.d.ts +1 -0
- package/build/constants/app.js +13 -6
- package/build/features/app/brand/brandStore.d.ts +19 -11
- package/build/features/app/brand/brandStore.js +141 -134
- package/build/features/app/connect/connectStore.d.ts +18 -4
- package/build/features/app/connect/connectStore.js +88 -41
- package/build/features/brand/screens/BrandInfo/BrandInfo.js +14 -52
- package/build/features/brand/screens/BrandInfo/BrandLogo.d.ts +1 -2
- package/build/features/brand/screens/BrandInfo/BrandLogo.js +2 -14
- package/build/features/brand/screens/BrandInfo/BrandName.d.ts +1 -2
- package/build/features/brand/screens/BrandInfo/BrandName.js +2 -3
- package/build/features/brand/screens/BrandInfo/validation.d.ts +0 -12
- package/build/features/brand/screens/BrandInfo/validation.js +0 -4
- package/build/features/brand/screens/BrandSegmentInfo/BrandSegmentInfo.d.ts +5 -0
- package/build/features/brand/screens/BrandSegmentInfo/BrandSegmentInfo.js +102 -0
- package/build/features/brand/screens/BrandSegmentInfo/index.d.ts +2 -0
- package/build/features/brand/screens/BrandSegmentInfo/index.js +2 -0
- package/build/features/brand/screens/BrandSegmentInfo/validation.d.ts +17 -0
- package/build/features/brand/screens/BrandSegmentInfo/validation.js +9 -0
- package/build/features/connect/screens/Merchant/BrandList.js +13 -3
- package/build/features/connect/screens/Merchant/Merchant.js +18 -8
- package/build/features/connect/screens/Merchant/SegmentLocations.d.ts +8 -0
- package/build/features/connect/screens/Merchant/SegmentLocations.js +66 -0
- package/build/features/connect/screens/Merchant/SegmentProfits.d.ts +8 -0
- package/build/features/connect/screens/Merchant/{Segments.js → SegmentProfits.js} +16 -16
- package/build/features/connect/screens/Merchant/SegmentTechs.d.ts +8 -0
- package/build/features/connect/screens/Merchant/SegmentTechs.js +66 -0
- package/build/features/connect/screens/Merchant/validation.d.ts +9 -3
- package/build/features/connect/screens/Merchant/validation.js +6 -2
- package/build/features/featuresScreens.js +5 -0
- package/package.json +1 -1
- package/build/features/connect/screens/Merchant/Segments.d.ts +0 -8
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentLocations.d.ts +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentLocations.js +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentProfits.d.ts +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentProfits.js +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentTechs.d.ts +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/SegmentTechs.js +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/TeamSize.d.ts +0 -0
- /package/build/features/brand/screens/{BrandInfo → BrandSegmentInfo}/TeamSize.js +0 -0
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import * as yup from 'yup';
|
|
2
|
+
export declare const BrandValidationSchema: () => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
4
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
5
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
6
|
+
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
7
|
+
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
8
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
9
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
10
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
11
|
+
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
12
|
+
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
13
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
14
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
15
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
16
|
+
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
17
|
+
}>>>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as yup from 'yup';
|
|
2
|
+
export var BrandValidationSchema = function () {
|
|
3
|
+
return yup.object().shape({
|
|
4
|
+
segmentLocation: yup.object().required('alert_choose_segment_location'),
|
|
5
|
+
segmentTech: yup.object().required('alert_choose_segment_tech'),
|
|
6
|
+
segmentProfit: yup.object().required('alert_choose_segment_profit'),
|
|
7
|
+
teamSize: yup.object().required('alert_choose_teamSize')
|
|
8
|
+
});
|
|
9
|
+
};
|
|
@@ -49,7 +49,7 @@ var BrandList = function (_a) {
|
|
|
49
49
|
var t = useTranslation().t;
|
|
50
50
|
var isAr = useLanguage().isAr;
|
|
51
51
|
var data = useAppSelector(connectSelector).data;
|
|
52
|
-
var _c = data.individualData.responseBody || {},
|
|
52
|
+
var _c = data.individualData.responseBody || {}, segment_location_list = _c.segment_location_list, segment_profit_list = _c.segment_profit_list, segment_tech_list = _c.segment_tech_list, team_size_list = _c.team_size_list;
|
|
53
53
|
var _d = useFormContext(), control = _d.control, setValue = _d.setValue;
|
|
54
54
|
var selectedBrandControl = useController({ control: control, name: 'selectedBrandItem' });
|
|
55
55
|
var selectedBrand = selectedBrandControl.field.value;
|
|
@@ -82,10 +82,20 @@ var BrandList = function (_a) {
|
|
|
82
82
|
setValue('salesChannels', [], { shouldValidate: true });
|
|
83
83
|
setValue('brandName', '');
|
|
84
84
|
}
|
|
85
|
-
setValue('
|
|
85
|
+
setValue('segmentLocation', segment_location_list.find(function (_a) {
|
|
86
86
|
var _b, _c;
|
|
87
87
|
var id = _a.id;
|
|
88
|
-
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.
|
|
88
|
+
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.location_type) === null || _c === void 0 ? void 0 : _c.id) === id;
|
|
89
|
+
}), { shouldValidate: true });
|
|
90
|
+
setValue('segmentProfit', segment_profit_list.find(function (_a) {
|
|
91
|
+
var _b, _c;
|
|
92
|
+
var id = _a.id;
|
|
93
|
+
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.profit_type) === null || _c === void 0 ? void 0 : _c.id) === id;
|
|
94
|
+
}), { shouldValidate: true });
|
|
95
|
+
setValue('segmentTech', segment_tech_list.find(function (_a) {
|
|
96
|
+
var _b, _c;
|
|
97
|
+
var id = _a.id;
|
|
98
|
+
return ((_c = (_b = brand === null || brand === void 0 ? void 0 : brand.segment) === null || _b === void 0 ? void 0 : _b.tech_type) === null || _c === void 0 ? void 0 : _c.id) === id;
|
|
89
99
|
}), { shouldValidate: true });
|
|
90
100
|
setValue('teamSize', team_size_list.find(function (_a) {
|
|
91
101
|
var _b, _c;
|
|
@@ -29,10 +29,14 @@ import BrandName from './BrandName';
|
|
|
29
29
|
import TAC from './TAC';
|
|
30
30
|
import BrandList from './BrandList';
|
|
31
31
|
import SalesChannels from './SalesChannels';
|
|
32
|
-
import
|
|
32
|
+
import SegmentLocations from './SegmentLocations';
|
|
33
|
+
import SegmentProfits from './SegmentProfits';
|
|
34
|
+
import SegmentTechs from './SegmentTechs';
|
|
33
35
|
var ListType;
|
|
34
36
|
(function (ListType) {
|
|
35
|
-
ListType["
|
|
37
|
+
ListType["SegmentLocationList"] = "SegmentLocationList";
|
|
38
|
+
ListType["SegmentProfitList"] = "SegmentProfitList";
|
|
39
|
+
ListType["SegmentTechList"] = "SegmentTechList";
|
|
36
40
|
ListType["TeamSizeList"] = "TeamSizeList";
|
|
37
41
|
ListType["BrandList"] = "BrandList";
|
|
38
42
|
ListType["BusinessList"] = "BusinessList";
|
|
@@ -42,7 +46,7 @@ var Merchant = function (_a) {
|
|
|
42
46
|
var _d = React.useState(false), brandNameChecking = _d[0], setBrandNameChecking = _d[1];
|
|
43
47
|
var _e = React.useState(false), isRequiredNewBrand = _e[0], setIsRequiredNewBrand = _e[1];
|
|
44
48
|
var _f = useAppSelector(connectSelector), data = _f.data, loading = _f.loading, error = _f.error;
|
|
45
|
-
var _g = data.brandData, brandName = _g.brandName, selectedBrandItem = _g.selectedBrandItem, termAndConditionChecked = _g.termAndConditionChecked, responseBody = _g.responseBody, salesChannels = _g.salesChannels,
|
|
49
|
+
var _g = data.brandData, brandName = _g.brandName, selectedBrandItem = _g.selectedBrandItem, termAndConditionChecked = _g.termAndConditionChecked, responseBody = _g.responseBody, salesChannels = _g.salesChannels, segmentLocation = _g.segmentLocation, segmentProfit = _g.segmentProfit, segmentTech = _g.segmentTech, teamSize = _g.teamSize;
|
|
46
50
|
var brandList = (responseBody || {}).brand_list;
|
|
47
51
|
var _h = React.useState(), listActive = _h[0], setListActive = _h[1];
|
|
48
52
|
React.useEffect(function () {
|
|
@@ -59,7 +63,9 @@ var Merchant = function (_a) {
|
|
|
59
63
|
selectedBrandItem: selectedBrandItem,
|
|
60
64
|
termAndConditionChecked: termAndConditionChecked,
|
|
61
65
|
salesChannels: salesChannels,
|
|
62
|
-
|
|
66
|
+
segmentLocation: segmentLocation,
|
|
67
|
+
segmentProfit: segmentProfit,
|
|
68
|
+
segmentTech: segmentTech,
|
|
63
69
|
teamSize: teamSize
|
|
64
70
|
},
|
|
65
71
|
mode: 'onChange'
|
|
@@ -75,11 +81,13 @@ var Merchant = function (_a) {
|
|
|
75
81
|
dispatch(handlePrevScreenStep('CONNECT_INDIVIDUAL_STEP'));
|
|
76
82
|
};
|
|
77
83
|
React.useEffect(function () {
|
|
78
|
-
methods.setValue('
|
|
84
|
+
methods.setValue('segmentLocation', segmentLocation);
|
|
85
|
+
methods.setValue('segmentProfit', segmentProfit);
|
|
86
|
+
methods.setValue('segmentTech', segmentTech);
|
|
79
87
|
methods.setValue('teamSize', teamSize);
|
|
80
88
|
if (brandName)
|
|
81
89
|
methods.trigger('brandName');
|
|
82
|
-
}, [
|
|
90
|
+
}, [segmentLocation, segmentProfit, segmentTech, teamSize, brandName]);
|
|
83
91
|
React.useEffect(function () {
|
|
84
92
|
if (error)
|
|
85
93
|
dispatch(clearError());
|
|
@@ -103,9 +111,11 @@ var Merchant = function (_a) {
|
|
|
103
111
|
var handleMenuClick = function (flag) {
|
|
104
112
|
setListActive(flag);
|
|
105
113
|
};
|
|
106
|
-
var
|
|
114
|
+
var isSegmentLocationListActive = listActive === ListType.SegmentLocationList;
|
|
115
|
+
var isSegmentProfitListActive = listActive === ListType.SegmentProfitList;
|
|
116
|
+
var isSegmentTechListActive = listActive === ListType.SegmentTechList;
|
|
107
117
|
var isTeamSizeListActive = listActive === ListType.TeamSizeList;
|
|
108
118
|
var isBrandListActive = listActive === ListType.BrandList;
|
|
109
|
-
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandList, { show: hasBrandList && !isTeamSizeListActive && !
|
|
119
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(Form, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandList, { show: hasBrandList && !isTeamSizeListActive && !isSegmentLocationListActive && !isSegmentProfitListActive && !isSegmentTechListActive, list: brandList, onListOpen: function () { return handleMenuClick(ListType.BrandList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(BrandName, { show: (isNewBrand || isOtherBrand) && !listActive, brandNameChecking: brandNameChecking, fetchingBrandName: setBrandNameChecking }), _jsx(SegmentLocations, { show: !isTeamSizeListActive && !isBrandListActive && !isSegmentProfitListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentLocationList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(SegmentProfits, { show: !isTeamSizeListActive && !isBrandListActive && !isSegmentLocationListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentProfitList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(SegmentTechs, { show: !isTeamSizeListActive && !isBrandListActive && !isSegmentLocationListActive && !isSegmentProfitListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentTechList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(TeamSize, { show: !isSegmentLocationListActive && !isSegmentProfitListActive && !isSegmentTechListActive && !isBrandListActive, onListOpen: function () { return handleMenuClick(ListType.TeamSizeList); }, onListClose: function () { return handleMenuClick(); } }), _jsx(Collapse, __assign({ in: !listActive }, { children: _jsx(SalesChannels, {}) })), _jsx(TAC, { show: (isNewBrand || isOtherBrand) && !listActive }), _jsx(Collapse, __assign({ in: !listActive, timeout: 500 }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('next') })) }))] })) })) }));
|
|
110
120
|
};
|
|
111
121
|
export default React.memo(Merchant);
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface SegmentLocationsProps {
|
|
3
|
+
show: boolean;
|
|
4
|
+
onListOpen?: () => void;
|
|
5
|
+
onListClose?: () => void;
|
|
6
|
+
}
|
|
7
|
+
declare const SegmentLocations: ({ show, onListOpen, onListClose }: SegmentLocationsProps) => JSX.Element;
|
|
8
|
+
export default SegmentLocations;
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
16
|
+
import Box from '@mui/material/Box';
|
|
17
|
+
import { styled } from '@mui/material/styles';
|
|
18
|
+
import { useAppSelector, useLanguage } from '../../../../hooks';
|
|
19
|
+
import SimpleList from '../../../../components/SimpleList';
|
|
20
|
+
import Text from '../../../../components/Text';
|
|
21
|
+
import Collapse from '../../../../components/Collapse';
|
|
22
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
23
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
24
|
+
import InputSelect from '../../../shared/InputSelect';
|
|
25
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
26
|
+
import { connectSelector } from '../../../app/connect/connectStore';
|
|
27
|
+
var IncomeText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
28
|
+
var theme = _a.theme, isSelected = _a.isSelected;
|
|
29
|
+
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25), textAlign: 'start' }));
|
|
30
|
+
});
|
|
31
|
+
var SegmentLocations = function (_a) {
|
|
32
|
+
var _b, _c, _d, _e;
|
|
33
|
+
var show = _a.show, onListOpen = _a.onListOpen, onListClose = _a.onListClose;
|
|
34
|
+
var _f = React.useState([]), segmentList = _f[0], setSegmentList = _f[1];
|
|
35
|
+
var _g = React.useState(null), anchorEl = _g[0], setAnchorEl = _g[1];
|
|
36
|
+
var t = useTranslation().t;
|
|
37
|
+
var isAr = useLanguage().isAr;
|
|
38
|
+
var data = useAppSelector(connectSelector).data;
|
|
39
|
+
var control = useFormContext().control;
|
|
40
|
+
var segmentLocationList = ((_b = data.individualData.responseBody) === null || _b === void 0 ? void 0 : _b.segment_location_list) || [];
|
|
41
|
+
var segmentControl = useController({ control: control, name: 'segmentLocation' });
|
|
42
|
+
var segment = segmentControl.field.value;
|
|
43
|
+
var error = (_c = segmentControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message;
|
|
44
|
+
React.useEffect(function () {
|
|
45
|
+
if ((segmentLocationList === null || segmentLocationList === void 0 ? void 0 : segmentLocationList.length) > 0) {
|
|
46
|
+
setSegmentList(segmentLocationList);
|
|
47
|
+
}
|
|
48
|
+
}, [segmentLocationList]);
|
|
49
|
+
var onOpenList = function (event) {
|
|
50
|
+
setAnchorEl(event.currentTarget);
|
|
51
|
+
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
52
|
+
};
|
|
53
|
+
var onCloseList = function () {
|
|
54
|
+
setAnchorEl(null);
|
|
55
|
+
onListClose === null || onListClose === void 0 ? void 0 : onListClose();
|
|
56
|
+
};
|
|
57
|
+
var onSelectItem = function (segment) {
|
|
58
|
+
onCloseList();
|
|
59
|
+
segmentControl.field.onChange(segment);
|
|
60
|
+
};
|
|
61
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 0 } }, { children: [_jsx(InputSelect, { required: true, label: t('segment_location_title'), onClick: !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl }), placeholder: t('choose_any_segment'), value: (isAr ? (_d = segment === null || segment === void 0 ? void 0 : segment.name) === null || _d === void 0 ? void 0 : _d.ar : (_e = segment === null || segment === void 0 ? void 0 : segment.name) === null || _e === void 0 ? void 0 : _e.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.ar', 'name.en'], list: segmentList, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
62
|
+
var _a, _b;
|
|
63
|
+
return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (segment === null || segment === void 0 ? void 0 : segment.id) }, { children: isAr ? (_a = item === null || item === void 0 ? void 0 : item.name) === null || _a === void 0 ? void 0 : _a.ar : (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.en })) })), item.id === (segment === null || segment === void 0 ? void 0 : segment.id) && _jsx(CheckIcon, {})] }));
|
|
64
|
+
} }) }))] })) })));
|
|
65
|
+
};
|
|
66
|
+
export default SegmentLocations;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface SegmentProfitsProps {
|
|
3
|
+
show: boolean;
|
|
4
|
+
onListOpen?: () => void;
|
|
5
|
+
onListClose?: () => void;
|
|
6
|
+
}
|
|
7
|
+
declare const SegmentProfits: ({ show, onListOpen, onListClose }: SegmentProfitsProps) => JSX.Element;
|
|
8
|
+
export default SegmentProfits;
|
|
@@ -10,25 +10,25 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
12
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { connectSelector } from '../../../app/connect/connectStore';
|
|
14
|
-
import Collapse from '../../../../components/Collapse';
|
|
15
|
-
import { ScreenContainer } from '../../../../features/shared/Containers';
|
|
16
|
-
import InputSelect from '../../../../features/shared/InputSelect';
|
|
17
|
-
import { useAppSelector, useLanguage } from '../../../../hooks';
|
|
18
13
|
import React from 'react';
|
|
19
14
|
import { useTranslation } from 'react-i18next';
|
|
20
15
|
import { useController, useFormContext } from 'react-hook-form';
|
|
21
|
-
import SimpleList from '../../../../components/SimpleList';
|
|
22
|
-
import ExpandIcon from '../../../../components/ExpandIcon';
|
|
23
|
-
import CheckIcon from '../../../shared/CheckIcon';
|
|
24
16
|
import Box from '@mui/material/Box';
|
|
25
17
|
import { styled } from '@mui/material/styles';
|
|
18
|
+
import { useAppSelector, useLanguage } from '../../../../hooks';
|
|
19
|
+
import SimpleList from '../../../../components/SimpleList';
|
|
26
20
|
import Text from '../../../../components/Text';
|
|
21
|
+
import Collapse from '../../../../components/Collapse';
|
|
22
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
23
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
24
|
+
import InputSelect from '../../../shared/InputSelect';
|
|
25
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
26
|
+
import { connectSelector } from '../../../app/connect/connectStore';
|
|
27
27
|
var IncomeText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
28
28
|
var theme = _a.theme, isSelected = _a.isSelected;
|
|
29
29
|
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25), textAlign: 'start' }));
|
|
30
30
|
});
|
|
31
|
-
var
|
|
31
|
+
var SegmentProfits = function (_a) {
|
|
32
32
|
var _b, _c, _d, _e;
|
|
33
33
|
var show = _a.show, onListOpen = _a.onListOpen, onListClose = _a.onListClose;
|
|
34
34
|
var _f = React.useState([]), segmentList = _f[0], setSegmentList = _f[1];
|
|
@@ -37,15 +37,15 @@ var Segments = function (_a) {
|
|
|
37
37
|
var isAr = useLanguage().isAr;
|
|
38
38
|
var data = useAppSelector(connectSelector).data;
|
|
39
39
|
var control = useFormContext().control;
|
|
40
|
-
var
|
|
41
|
-
var segmentControl = useController({ control: control, name: '
|
|
40
|
+
var segmentProfitList = ((_b = data.individualData.responseBody) === null || _b === void 0 ? void 0 : _b.segment_profit_list) || [];
|
|
41
|
+
var segmentControl = useController({ control: control, name: 'segmentProfit' });
|
|
42
42
|
var segment = segmentControl.field.value;
|
|
43
43
|
var error = (_c = segmentControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message;
|
|
44
44
|
React.useEffect(function () {
|
|
45
|
-
if ((
|
|
46
|
-
setSegmentList(
|
|
45
|
+
if ((segmentProfitList === null || segmentProfitList === void 0 ? void 0 : segmentProfitList.length) > 0) {
|
|
46
|
+
setSegmentList(segmentProfitList);
|
|
47
47
|
}
|
|
48
|
-
}, [
|
|
48
|
+
}, [segmentProfitList]);
|
|
49
49
|
var onOpenList = function (event) {
|
|
50
50
|
setAnchorEl(event.currentTarget);
|
|
51
51
|
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
@@ -58,9 +58,9 @@ var Segments = function (_a) {
|
|
|
58
58
|
onCloseList();
|
|
59
59
|
segmentControl.field.onChange(segment);
|
|
60
60
|
};
|
|
61
|
-
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 0 } }, { children: [_jsx(InputSelect, { required: true, label: t('
|
|
61
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 0 } }, { children: [_jsx(InputSelect, { required: true, label: t('segment_profit_title'), onClick: !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl }), placeholder: t('choose_any_segment'), value: (isAr ? (_d = segment === null || segment === void 0 ? void 0 : segment.name) === null || _d === void 0 ? void 0 : _d.ar : (_e = segment === null || segment === void 0 ? void 0 : segment.name) === null || _e === void 0 ? void 0 : _e.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.ar', 'name.en'], list: segmentList, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
62
62
|
var _a, _b;
|
|
63
63
|
return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (segment === null || segment === void 0 ? void 0 : segment.id) }, { children: isAr ? (_a = item === null || item === void 0 ? void 0 : item.name) === null || _a === void 0 ? void 0 : _a.ar : (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.en })) })), item.id === (segment === null || segment === void 0 ? void 0 : segment.id) && _jsx(CheckIcon, {})] }));
|
|
64
64
|
} }) }))] })) })));
|
|
65
65
|
};
|
|
66
|
-
export default
|
|
66
|
+
export default SegmentProfits;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
interface SegmentTechsProps {
|
|
3
|
+
show: boolean;
|
|
4
|
+
onListOpen?: () => void;
|
|
5
|
+
onListClose?: () => void;
|
|
6
|
+
}
|
|
7
|
+
declare const SegmentTechs: ({ show, onListOpen, onListClose }: SegmentTechsProps) => JSX.Element;
|
|
8
|
+
export default SegmentTechs;
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
var __assign = (this && this.__assign) || function () {
|
|
2
|
+
__assign = Object.assign || function(t) {
|
|
3
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
+
s = arguments[i];
|
|
5
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
+
t[p] = s[p];
|
|
7
|
+
}
|
|
8
|
+
return t;
|
|
9
|
+
};
|
|
10
|
+
return __assign.apply(this, arguments);
|
|
11
|
+
};
|
|
12
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
|
+
import { useController, useFormContext } from 'react-hook-form';
|
|
16
|
+
import Box from '@mui/material/Box';
|
|
17
|
+
import { styled } from '@mui/material/styles';
|
|
18
|
+
import { useAppSelector, useLanguage } from '../../../../hooks';
|
|
19
|
+
import SimpleList from '../../../../components/SimpleList';
|
|
20
|
+
import Text from '../../../../components/Text';
|
|
21
|
+
import Collapse from '../../../../components/Collapse';
|
|
22
|
+
import { EndAdornmentExpanded } from '../../../shared/EndAdornment';
|
|
23
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
24
|
+
import InputSelect from '../../../shared/InputSelect';
|
|
25
|
+
import CheckIcon from '../../../shared/CheckIcon';
|
|
26
|
+
import { connectSelector } from '../../../app/connect/connectStore';
|
|
27
|
+
var IncomeText = styled(Text, { shouldForwardProp: function (prop) { return prop !== 'isSelected'; } })(function (_a) {
|
|
28
|
+
var theme = _a.theme, isSelected = _a.isSelected;
|
|
29
|
+
return (__assign(__assign({ color: theme.palette.text.primary }, theme.typography.body2), { fontWeight: isSelected ? theme.typography.fontWeightMedium : theme.typography.fontWeightLight, paddingInlineStart: theme.spacing(1.25), textAlign: 'start' }));
|
|
30
|
+
});
|
|
31
|
+
var SegmentTechs = function (_a) {
|
|
32
|
+
var _b, _c, _d, _e;
|
|
33
|
+
var show = _a.show, onListOpen = _a.onListOpen, onListClose = _a.onListClose;
|
|
34
|
+
var _f = React.useState([]), segmentList = _f[0], setSegmentList = _f[1];
|
|
35
|
+
var _g = React.useState(null), anchorEl = _g[0], setAnchorEl = _g[1];
|
|
36
|
+
var t = useTranslation().t;
|
|
37
|
+
var isAr = useLanguage().isAr;
|
|
38
|
+
var data = useAppSelector(connectSelector).data;
|
|
39
|
+
var control = useFormContext().control;
|
|
40
|
+
var segmentTechList = ((_b = data.individualData.responseBody) === null || _b === void 0 ? void 0 : _b.segment_tech_list) || [];
|
|
41
|
+
var segmentControl = useController({ control: control, name: 'segmentTech' });
|
|
42
|
+
var segment = segmentControl.field.value;
|
|
43
|
+
var error = (_c = segmentControl.fieldState.error) === null || _c === void 0 ? void 0 : _c.message;
|
|
44
|
+
React.useEffect(function () {
|
|
45
|
+
if ((segmentTechList === null || segmentTechList === void 0 ? void 0 : segmentTechList.length) > 0) {
|
|
46
|
+
setSegmentList(segmentTechList);
|
|
47
|
+
}
|
|
48
|
+
}, [segmentTechList]);
|
|
49
|
+
var onOpenList = function (event) {
|
|
50
|
+
setAnchorEl(event.currentTarget);
|
|
51
|
+
onListOpen === null || onListOpen === void 0 ? void 0 : onListOpen();
|
|
52
|
+
};
|
|
53
|
+
var onCloseList = function () {
|
|
54
|
+
setAnchorEl(null);
|
|
55
|
+
onListClose === null || onListClose === void 0 ? void 0 : onListClose();
|
|
56
|
+
};
|
|
57
|
+
var onSelectItem = function (segment) {
|
|
58
|
+
onCloseList();
|
|
59
|
+
segmentControl.field.onChange(segment);
|
|
60
|
+
};
|
|
61
|
+
return (_jsx(Collapse, __assign({ in: show }, { children: _jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 0 } }, { children: [_jsx(InputSelect, { required: true, label: t('segment_tech_title'), onClick: !!anchorEl ? function () { return onCloseList(); } : onOpenList, endAdornment: _jsx(EndAdornmentExpanded, { anchorEl: anchorEl }), placeholder: t('choose_any_segment'), value: (isAr ? (_d = segment === null || segment === void 0 ? void 0 : segment.name) === null || _d === void 0 ? void 0 : _d.ar : (_e = segment === null || segment === void 0 ? void 0 : segment.name) === null || _e === void 0 ? void 0 : _e.en) || '', warningMessage: error && t(error) }), _jsx(Collapse, __assign({ in: !!anchorEl }, { children: _jsx(SimpleList, { searchKeyPath: 'name.en', searchValuePath: ['name.ar', 'name.en'], list: segmentList, onSelectItem: onSelectItem, renderItem: function (item) {
|
|
62
|
+
var _a, _b;
|
|
63
|
+
return (_jsxs(_Fragment, { children: [_jsx(Box, __assign({ display: 'flex' }, { children: _jsx(IncomeText, __assign({ isSelected: item.id === (segment === null || segment === void 0 ? void 0 : segment.id) }, { children: isAr ? (_a = item === null || item === void 0 ? void 0 : item.name) === null || _a === void 0 ? void 0 : _a.ar : (_b = item === null || item === void 0 ? void 0 : item.name) === null || _b === void 0 ? void 0 : _b.en })) })), item.id === (segment === null || segment === void 0 ? void 0 : segment.id) && _jsx(CheckIcon, {})] }));
|
|
64
|
+
} }) }))] })) })));
|
|
65
|
+
};
|
|
66
|
+
export default SegmentTechs;
|
|
@@ -9,7 +9,9 @@ export declare const MerchantValidationSchema: (isNewBrand?: boolean) => yup.Obj
|
|
|
9
9
|
}>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
10
10
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
11
11
|
}>>[] | undefined>;
|
|
12
|
-
|
|
12
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
13
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
14
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
13
15
|
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
14
16
|
brandName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
15
17
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
@@ -22,7 +24,9 @@ export declare const MerchantValidationSchema: (isNewBrand?: boolean) => yup.Obj
|
|
|
22
24
|
}>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
23
25
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
24
26
|
}>>[] | undefined>;
|
|
25
|
-
|
|
27
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
28
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
29
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
26
30
|
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
27
31
|
brandName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
28
32
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
@@ -35,7 +39,9 @@ export declare const MerchantValidationSchema: (isNewBrand?: boolean) => yup.Obj
|
|
|
35
39
|
}>>>, import("yup/lib/types").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
36
40
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
37
41
|
}>>[] | undefined>;
|
|
38
|
-
|
|
42
|
+
segmentLocation: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
43
|
+
segmentProfit: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
44
|
+
segmentTech: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
39
45
|
teamSize: import("yup/lib/object").RequiredObjectSchema<import("yup/lib/object").ObjectShape, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").ObjectShape>>;
|
|
40
46
|
brandName: yup.StringSchema<string | undefined, import("yup/lib/types").AnyObject, string | undefined>;
|
|
41
47
|
}>>>;
|
|
@@ -86,7 +86,9 @@ export var MerchantValidationSchema = function (isNewBrand) {
|
|
|
86
86
|
})
|
|
87
87
|
.required('enter_brand_name_english_chars_numbers_space'),
|
|
88
88
|
termAndConditionChecked: yup.boolean().isTrue('check_terms_cond').required('check_terms_cond'),
|
|
89
|
-
|
|
89
|
+
segmentLocation: yup.object().required('alert_choose_segment_location'),
|
|
90
|
+
segmentProfit: yup.object().required('alert_choose_segment_profit'),
|
|
91
|
+
segmentTech: yup.object().required('alert_choose_segment_tech'),
|
|
90
92
|
teamSize: yup.object().required('alert_choose_teamSize'),
|
|
91
93
|
salesChannels: yup
|
|
92
94
|
.array()
|
|
@@ -128,7 +130,9 @@ export var MerchantValidationSchema = function (isNewBrand) {
|
|
|
128
130
|
}
|
|
129
131
|
})
|
|
130
132
|
.required('choose_atleast_one_channel'),
|
|
131
|
-
|
|
133
|
+
segmentLocation: yup.object().required('alert_choose_segment_location'),
|
|
134
|
+
segmentProfit: yup.object().required('alert_choose_segment_profit'),
|
|
135
|
+
segmentTech: yup.object().required('alert_choose_segment_tech'),
|
|
132
136
|
teamSize: yup.object().required('alert_choose_teamSize'),
|
|
133
137
|
brandName: yup.string().optional()
|
|
134
138
|
});
|
|
@@ -72,6 +72,7 @@ import EntityResetPasswordSuccessPage from './entity/screens/ResetPasswordSucces
|
|
|
72
72
|
import EntityDataLoadingPage from './entity/screens/PrepareDataLoading';
|
|
73
73
|
import BrandVerifyPage from './brand/screens/Verify';
|
|
74
74
|
import BrandInfoPage from './brand/screens/BrandInfo';
|
|
75
|
+
import BrandSegmentPage from './brand/screens/BrandSegmentInfo';
|
|
75
76
|
import BrandActivitiesPage from './brand/screens/BrandActivities';
|
|
76
77
|
import BrandSuccessPage from './brand/screens/Success';
|
|
77
78
|
import BrandSuccessWithFlowPage from './brand/screens/SuccessWithFlowButtons';
|
|
@@ -369,6 +370,10 @@ export var brandFeatureScreens = [
|
|
|
369
370
|
name: 'BRAND_INFO_STEP',
|
|
370
371
|
element: BrandInfoPage
|
|
371
372
|
},
|
|
373
|
+
{
|
|
374
|
+
name: 'BRAND_SEGMENT_INFO_STEP',
|
|
375
|
+
element: BrandSegmentPage
|
|
376
|
+
},
|
|
372
377
|
{
|
|
373
378
|
name: 'BRAND_ACTIVITIES_STEP',
|
|
374
379
|
element: BrandActivitiesPage
|
package/package.json
CHANGED
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|