@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
|
@@ -363,17 +363,17 @@ export var verifyPACI = createAsyncThunk('connect/verifyPACI', function (params,
|
|
|
363
363
|
});
|
|
364
364
|
}); });
|
|
365
365
|
export var updateLeadIndividual = createAsyncThunk('updateLeadIndividual', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
366
|
-
var _a, settings, connect, lead_id, phoneCountry, payload, leadResponse,
|
|
367
|
-
var
|
|
368
|
-
return __generator(this, function (
|
|
369
|
-
switch (
|
|
366
|
+
var _a, settings, connect, lead_id, phoneCountry, payload, leadResponse, _b, segmentLocation, segmentProfit, segmentTech, err_3, teamSize, err_4, brand;
|
|
367
|
+
var _c, _d, _e, _f, _g;
|
|
368
|
+
return __generator(this, function (_h) {
|
|
369
|
+
switch (_h.label) {
|
|
370
370
|
case 0:
|
|
371
371
|
_a = thunkApi.getState(), settings = _a.settings, connect = _a.connect;
|
|
372
372
|
lead_id = (connect.data.otpData.responseBody || {}).lead_id;
|
|
373
|
-
phoneCountry = (
|
|
373
|
+
phoneCountry = (_d = (_c = params.countryCode) === null || _c === void 0 ? void 0 : _c.idd_prefix) === null || _d === void 0 ? void 0 : _d.toString();
|
|
374
374
|
payload = {
|
|
375
375
|
id: lead_id || '',
|
|
376
|
-
country_code: (
|
|
376
|
+
country_code: (_e = settings.data.businessCountry) === null || _e === void 0 ? void 0 : _e.iso2,
|
|
377
377
|
name: getIndividualName(params.name),
|
|
378
378
|
contact: __assign({ email: params.email }, (params.mobile && { phone: { country_code: phoneCountry, number: params.mobile } })),
|
|
379
379
|
step_name: CONNECT_STEP_NAMES.UPDATE_LEAD_INDIVIDUAL,
|
|
@@ -381,52 +381,78 @@ export var updateLeadIndividual = createAsyncThunk('updateLeadIndividual', funct
|
|
|
381
381
|
};
|
|
382
382
|
return [4, API.leadService.updateLead(payload)];
|
|
383
383
|
case 1:
|
|
384
|
-
leadResponse =
|
|
385
|
-
|
|
384
|
+
leadResponse = _h.sent();
|
|
385
|
+
_h.label = 2;
|
|
386
386
|
case 2:
|
|
387
|
-
|
|
388
|
-
return [4,
|
|
387
|
+
_h.trys.push([2, 4, , 5]);
|
|
388
|
+
return [4, thunkApi.dispatch(retrieveSegmentDataList()).unwrap()];
|
|
389
389
|
case 3:
|
|
390
|
-
|
|
391
|
-
leadResponse.
|
|
390
|
+
_b = _h.sent(), segmentLocation = _b.segmentLocation, segmentProfit = _b.segmentProfit, segmentTech = _b.segmentTech;
|
|
391
|
+
leadResponse.segment_location_list = segmentLocation;
|
|
392
|
+
leadResponse.segment_profit_list = segmentProfit;
|
|
393
|
+
leadResponse.segment_tech_list = segmentTech;
|
|
392
394
|
return [3, 5];
|
|
393
395
|
case 4:
|
|
394
|
-
err_3 =
|
|
396
|
+
err_3 = _h.sent();
|
|
395
397
|
return [3, 5];
|
|
396
398
|
case 5:
|
|
397
|
-
|
|
399
|
+
_h.trys.push([5, 7, , 8]);
|
|
398
400
|
return [4, API.dataService.getTeamSize({ page: 0 })];
|
|
399
401
|
case 6:
|
|
400
|
-
teamSize =
|
|
402
|
+
teamSize = _h.sent();
|
|
401
403
|
leadResponse.team_size_list = teamSize.list;
|
|
402
404
|
return [3, 8];
|
|
403
405
|
case 7:
|
|
404
|
-
err_4 =
|
|
406
|
+
err_4 = _h.sent();
|
|
405
407
|
return [3, 8];
|
|
406
408
|
case 8:
|
|
407
409
|
if (!leadResponse.brand) return [3, 10];
|
|
408
410
|
return [4, API.brandService.retrieveBrand(leadResponse.brand.id)];
|
|
409
411
|
case 9:
|
|
410
|
-
brand = (
|
|
412
|
+
brand = (_h.sent()).brand;
|
|
411
413
|
leadResponse.brand = __assign(__assign({}, leadResponse.brand), brand);
|
|
412
|
-
|
|
414
|
+
_h.label = 10;
|
|
413
415
|
case 10:
|
|
414
|
-
(
|
|
416
|
+
(_g = (_f = settings.data.appConfig).onStepCompleted) === null || _g === void 0 ? void 0 : _g.call(_f, settings.data.activeScreen.name, params);
|
|
415
417
|
thunkApi.dispatch(handleNextScreenStep());
|
|
416
418
|
return [2, { leadResponse: leadResponse, formData: params }];
|
|
417
419
|
}
|
|
418
420
|
});
|
|
419
421
|
}); });
|
|
422
|
+
export var retrieveSegmentDataList = createAsyncThunk('connectRetrieveSegmentDataList', function () { return __awaiter(void 0, void 0, void 0, function () {
|
|
423
|
+
var dataBody, _a, segmentLocation, segmentProfit, segmentTech;
|
|
424
|
+
return __generator(this, function (_b) {
|
|
425
|
+
switch (_b.label) {
|
|
426
|
+
case 0:
|
|
427
|
+
dataBody = {
|
|
428
|
+
page: 0,
|
|
429
|
+
limit: 50
|
|
430
|
+
};
|
|
431
|
+
return [4, Promise.all([
|
|
432
|
+
API.dataService.getSegmentLocation(dataBody),
|
|
433
|
+
API.dataService.getSegmentProfit(dataBody),
|
|
434
|
+
API.dataService.getSegmentTech(dataBody)
|
|
435
|
+
])];
|
|
436
|
+
case 1:
|
|
437
|
+
_a = _b.sent(), segmentLocation = _a[0].list, segmentProfit = _a[1].list, segmentTech = _a[2].list;
|
|
438
|
+
return [2, {
|
|
439
|
+
segmentLocation: segmentLocation,
|
|
440
|
+
segmentProfit: segmentProfit,
|
|
441
|
+
segmentTech: segmentTech
|
|
442
|
+
}];
|
|
443
|
+
}
|
|
444
|
+
});
|
|
445
|
+
}); });
|
|
420
446
|
export var updateLeadBrand = createAsyncThunk('updateLeadBrand', function (params, thunkApi) { return __awaiter(void 0, void 0, void 0, function () {
|
|
421
|
-
var _a, settings, connect, responseBody, leadBrandId, isNewBrand, brandName, salesChannels, selectedBrandItem, getAddress, channel_services, payload_1, brandReqBody_1, brand_1, brandNameBody, payload, lead, brandReqBody, brand;
|
|
422
|
-
var _b, _c, _d, _e, _f
|
|
423
|
-
return __generator(this, function (
|
|
424
|
-
switch (
|
|
447
|
+
var _a, settings, connect, responseBody, leadBrandId, isNewBrand, brandName, salesChannels, selectedBrandItem, brandLogoId, segmentLocation, segmentProfit, segmentTech, teamSize, termAndConditionChecked, getAddress, channel_services, payload_1, brandReqBody_1, brand_1, brandNameBody, payload, lead, brandReqBody, brand;
|
|
448
|
+
var _b, _c, _d, _e, _f;
|
|
449
|
+
return __generator(this, function (_g) {
|
|
450
|
+
switch (_g.label) {
|
|
425
451
|
case 0:
|
|
426
452
|
_a = thunkApi.getState(), settings = _a.settings, connect = _a.connect;
|
|
427
453
|
responseBody = connect.data.otpData.responseBody;
|
|
428
454
|
leadBrandId = responseBody === null || responseBody === void 0 ? void 0 : responseBody.brand_id;
|
|
429
|
-
isNewBrand = params.isNewBrand, brandName = params.brandName, salesChannels = params.salesChannels, selectedBrandItem = params.selectedBrandItem;
|
|
455
|
+
isNewBrand = params.isNewBrand, brandName = params.brandName, salesChannels = params.salesChannels, selectedBrandItem = params.selectedBrandItem, brandLogoId = params.brandLogoId, segmentLocation = params.segmentLocation, segmentProfit = params.segmentProfit, segmentTech = params.segmentTech, teamSize = params.teamSize, termAndConditionChecked = params.termAndConditionChecked;
|
|
430
456
|
getAddress = function (value, isTwitter, isWeb) {
|
|
431
457
|
if (isTwitter)
|
|
432
458
|
return '@' + value;
|
|
@@ -455,22 +481,22 @@ export var updateLeadBrand = createAsyncThunk('updateLeadBrand', function (param
|
|
|
455
481
|
};
|
|
456
482
|
return [4, API.leadService.updateLead(payload_1)];
|
|
457
483
|
case 1:
|
|
458
|
-
|
|
459
|
-
|
|
484
|
+
_g.sent();
|
|
485
|
+
_g.label = 2;
|
|
460
486
|
case 2:
|
|
461
487
|
brandReqBody_1 = {
|
|
462
488
|
id: (selectedBrandItem === null || selectedBrandItem === void 0 ? void 0 : selectedBrandItem.id) || '',
|
|
463
489
|
channel_services: channel_services,
|
|
464
490
|
term: ['general'],
|
|
465
|
-
segment: {
|
|
491
|
+
segment: __assign(__assign(__assign(__assign({}, ((segmentLocation === null || segmentLocation === void 0 ? void 0 : segmentLocation.id) && { location_type: { id: segmentLocation.id } })), ((segmentProfit === null || segmentProfit === void 0 ? void 0 : segmentProfit.id) && { profit_type: { id: segmentProfit.id } })), ((segmentTech === null || segmentTech === void 0 ? void 0 : segmentTech.id) && { tech_type: { id: segmentTech.id } })), { team: { id: (teamSize === null || teamSize === void 0 ? void 0 : teamSize.id) || '' } }),
|
|
466
492
|
step_name: CONNECT_STEP_NAMES.UPDATE_BRAND_INFO
|
|
467
493
|
};
|
|
468
494
|
return [4, API.brandService.updateBrandInfo(brandReqBody_1)];
|
|
469
495
|
case 3:
|
|
470
|
-
brand_1 =
|
|
496
|
+
brand_1 = _g.sent();
|
|
471
497
|
thunkApi.dispatch(updateLeadSuccess());
|
|
472
498
|
thunkApi.dispatch(handleNextScreenStep());
|
|
473
|
-
(
|
|
499
|
+
(_c = (_b = settings.data.appConfig).onStepCompleted) === null || _c === void 0 ? void 0 : _c.call(_b, settings.data.activeScreen.name, params);
|
|
474
500
|
return [2, { response: brand_1, formData: params }];
|
|
475
501
|
case 4:
|
|
476
502
|
brandNameBody = {
|
|
@@ -489,24 +515,24 @@ export var updateLeadBrand = createAsyncThunk('updateLeadBrand', function (param
|
|
|
489
515
|
};
|
|
490
516
|
return [4, API.leadService.updateLead(payload)];
|
|
491
517
|
case 5:
|
|
492
|
-
lead =
|
|
518
|
+
lead = _g.sent();
|
|
493
519
|
if (!lead.brand) {
|
|
494
520
|
console.error('Internal server error: brand is not created');
|
|
495
521
|
throw new Error('Internal server error');
|
|
496
522
|
}
|
|
497
523
|
brandReqBody = {
|
|
498
|
-
id: ((
|
|
524
|
+
id: ((_d = lead.brand) === null || _d === void 0 ? void 0 : _d.id) || '',
|
|
499
525
|
channel_services: channel_services,
|
|
500
526
|
term: ['general'],
|
|
501
527
|
step_name: CONNECT_STEP_NAMES.UPDATE_BRAND_INFO,
|
|
502
|
-
segment: {
|
|
528
|
+
segment: __assign(__assign(__assign(__assign({}, ((segmentLocation === null || segmentLocation === void 0 ? void 0 : segmentLocation.id) && { location_type: { id: segmentLocation.id } })), ((segmentProfit === null || segmentProfit === void 0 ? void 0 : segmentProfit.id) && { profit_type: { id: segmentProfit.id } })), ((segmentTech === null || segmentTech === void 0 ? void 0 : segmentTech.id) && { tech_type: { id: segmentTech.id } })), { team: { id: (teamSize === null || teamSize === void 0 ? void 0 : teamSize.id) || '' } })
|
|
503
529
|
};
|
|
504
530
|
return [4, API.brandService.updateBrandInfo(brandReqBody)];
|
|
505
531
|
case 6:
|
|
506
|
-
brand =
|
|
532
|
+
brand = _g.sent();
|
|
507
533
|
thunkApi.dispatch(updateLeadSuccess());
|
|
508
534
|
thunkApi.dispatch(handleNextScreenStep());
|
|
509
|
-
(
|
|
535
|
+
(_f = (_e = settings.data.appConfig).onStepCompleted) === null || _f === void 0 ? void 0 : _f.call(_e, settings.data.activeScreen.name, params);
|
|
510
536
|
return [2, { response: brand, formData: params }];
|
|
511
537
|
}
|
|
512
538
|
});
|
|
@@ -616,7 +642,9 @@ var initialState = {
|
|
|
616
642
|
brandData: {
|
|
617
643
|
brandName: '',
|
|
618
644
|
salesChannels: [],
|
|
619
|
-
|
|
645
|
+
segmentLocation: undefined,
|
|
646
|
+
segmentProfit: undefined,
|
|
647
|
+
segmentTech: undefined,
|
|
620
648
|
teamSize: undefined,
|
|
621
649
|
termAndConditionChecked: false,
|
|
622
650
|
selectedBrandItem: {},
|
|
@@ -825,10 +853,10 @@ export var connectSlice = createSlice({
|
|
|
825
853
|
state.error = action.error.message;
|
|
826
854
|
})
|
|
827
855
|
.addCase(updateLeadIndividual.fulfilled, function (state, action) {
|
|
828
|
-
var _a, _b, _c;
|
|
856
|
+
var _a, _b, _c, _d, _e, _f;
|
|
829
857
|
state.loading = false;
|
|
830
858
|
state.error = null;
|
|
831
|
-
var
|
|
859
|
+
var _g = action.payload, formData = _g.formData, leadResponse = _g.leadResponse;
|
|
832
860
|
var brand = leadResponse.brand, rest = __rest(leadResponse, ["brand"]);
|
|
833
861
|
if (brand) {
|
|
834
862
|
var channel_services = brand.channel_services, terms = brand.terms;
|
|
@@ -841,10 +869,17 @@ export var connectSlice = createSlice({
|
|
|
841
869
|
}
|
|
842
870
|
var selectedBrand = ((_b = (_a = state.data.brandData) === null || _a === void 0 ? void 0 : _a.responseBody) === null || _b === void 0 ? void 0 : _b.brand_list[0]) || leadResponse.brand;
|
|
843
871
|
state.data.brandData.brandName = (_c = selectedBrand === null || selectedBrand === void 0 ? void 0 : selectedBrand.name) === null || _c === void 0 ? void 0 : _c.en;
|
|
844
|
-
state.data.brandData.
|
|
845
|
-
var
|
|
846
|
-
|
|
847
|
-
|
|
872
|
+
state.data.brandData.segmentLocation = (_d = rest.segment_location_list) === null || _d === void 0 ? void 0 : _d.find(function (location) {
|
|
873
|
+
var _a, _b;
|
|
874
|
+
return location.id === ((_b = (_a = selectedBrand === null || selectedBrand === void 0 ? void 0 : selectedBrand.segment) === null || _a === void 0 ? void 0 : _a.location_type) === null || _b === void 0 ? void 0 : _b.id);
|
|
875
|
+
});
|
|
876
|
+
state.data.brandData.segmentProfit = (_e = rest.segment_profit_list) === null || _e === void 0 ? void 0 : _e.find(function (profit) {
|
|
877
|
+
var _a, _b;
|
|
878
|
+
return profit.id === ((_b = (_a = selectedBrand === null || selectedBrand === void 0 ? void 0 : selectedBrand.segment) === null || _a === void 0 ? void 0 : _a.profit_type) === null || _b === void 0 ? void 0 : _b.id);
|
|
879
|
+
});
|
|
880
|
+
state.data.brandData.segmentTech = (_f = rest.segment_tech_list) === null || _f === void 0 ? void 0 : _f.find(function (tech) {
|
|
881
|
+
var _a, _b;
|
|
882
|
+
return tech.id === ((_b = (_a = selectedBrand === null || selectedBrand === void 0 ? void 0 : selectedBrand.segment) === null || _a === void 0 ? void 0 : _a.tech_type) === null || _b === void 0 ? void 0 : _b.id);
|
|
848
883
|
});
|
|
849
884
|
state.data.brandData.teamSize = rest.team_size_list.find(function (_a) {
|
|
850
885
|
var _b, _c;
|
|
@@ -861,6 +896,18 @@ export var connectSlice = createSlice({
|
|
|
861
896
|
.addCase(updateLeadIndividual.rejected, function (state, action) {
|
|
862
897
|
state.loading = false;
|
|
863
898
|
state.error = action.error.message;
|
|
899
|
+
})
|
|
900
|
+
.addCase(retrieveSegmentDataList.pending, function (state) {
|
|
901
|
+
state.loading = true;
|
|
902
|
+
state.error = null;
|
|
903
|
+
})
|
|
904
|
+
.addCase(retrieveSegmentDataList.fulfilled, function (state) {
|
|
905
|
+
state.loading = false;
|
|
906
|
+
state.error = null;
|
|
907
|
+
})
|
|
908
|
+
.addCase(retrieveSegmentDataList.rejected, function (state, action) {
|
|
909
|
+
state.loading = false;
|
|
910
|
+
state.error = action.error.message;
|
|
864
911
|
})
|
|
865
912
|
.addCase(updateLeadBrand.fulfilled, function (state, action) {
|
|
866
913
|
state.loading = false;
|
|
@@ -10,58 +10,39 @@ var __assign = (this && this.__assign) || function () {
|
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
12
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
-
import { ScreenContainer } from '../../../shared/Containers';
|
|
14
13
|
import React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
15
|
import { FormProvider, useForm } from 'react-hook-form';
|
|
16
|
-
import Form from '../../../../components/Form';
|
|
17
16
|
import { styled } from '@mui/material/styles';
|
|
18
17
|
import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
|
|
18
|
+
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
19
19
|
import { yupResolver } from '@hookform/resolvers/yup';
|
|
20
|
-
import
|
|
20
|
+
import Form from '../../../../components/Form';
|
|
21
|
+
import { mapSalesChannel } from '../../../../utils';
|
|
21
22
|
import Button from '../../../shared/Button';
|
|
22
|
-
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
23
23
|
import { clearError, brandSelector, updateBrand, retrieveBoardStatus } from '../../../app/brand/brandStore';
|
|
24
|
-
import {
|
|
25
|
-
import TeamSize from '../../../brand/screens/BrandInfo/TeamSize';
|
|
26
|
-
import Collapse from '../../../../components/Collapse';
|
|
27
|
-
import { mapSalesChannel } from '../../../../utils';
|
|
24
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
28
25
|
import BrandName from './BrandName';
|
|
29
26
|
import SalesChannels from './SalesChannels';
|
|
30
27
|
import BrandLogo from './BrandLogo';
|
|
31
|
-
import
|
|
32
|
-
import SegmentProfits from './SegmentProfits';
|
|
33
|
-
import SegmentTechs from './SegmentTechs';
|
|
28
|
+
import { BrandValidationSchema } from './validation';
|
|
34
29
|
var FormStyled = styled(Form)(function () { return ({
|
|
35
30
|
display: 'flex',
|
|
36
31
|
flexDirection: 'column'
|
|
37
32
|
}); });
|
|
38
|
-
var ListType;
|
|
39
|
-
(function (ListType) {
|
|
40
|
-
ListType["SegmentsList"] = "SegmentsList";
|
|
41
|
-
ListType["TeamSizeList"] = "TeamSizeList";
|
|
42
|
-
ListType["SegmentLocationList"] = "SegmentLocationList";
|
|
43
|
-
ListType["SegmentProfitList"] = "SegmentProfitList";
|
|
44
|
-
ListType["SegmentTechList"] = "SegmentTechList";
|
|
45
|
-
})(ListType || (ListType = {}));
|
|
46
33
|
var BrandInfo = function (_a) {
|
|
47
|
-
var _b
|
|
48
|
-
var _k = React.useState(), listActive = _k[0], setListActive = _k[1];
|
|
49
|
-
var _l = React.useState(false), brandNameChecking = _l[0], setBrandNameChecking = _l[1];
|
|
34
|
+
var _b = React.useState(false), brandNameChecking = _b[0], setBrandNameChecking = _b[1];
|
|
50
35
|
var dispatch = useAppDispatch();
|
|
51
36
|
var t = useTranslation().t;
|
|
52
37
|
var isAr = useLanguage().isAr;
|
|
53
|
-
var
|
|
54
|
-
var
|
|
55
|
-
var
|
|
56
|
-
var
|
|
38
|
+
var _c = useAppSelector(brandSelector), data = _c.data, loading = _c.loading, error = _c.error, uploadingBrandLogo = _c.uploadingBrandLogo;
|
|
39
|
+
var _d = data.brandData, brandName = _d.brandName, salesChannels = _d.salesChannels, brandLogoId = _d.brandLogoId, responseBody = _d.responseBody;
|
|
40
|
+
var _e = data.verify.responseBody || {}, brand = _e.brand, flows = _e.flows;
|
|
41
|
+
var _f = brand || {}, logo_details = _f.logo_details, data_status = _f.data_status, data_verification = _f.data_verification, name = _f.name;
|
|
57
42
|
var methods = useForm({
|
|
58
43
|
resolver: yupResolver(BrandValidationSchema()),
|
|
59
44
|
defaultValues: {
|
|
60
45
|
brandName: brandName,
|
|
61
|
-
segmentLocation: segmentLocation,
|
|
62
|
-
segmentProfit: segmentProfit,
|
|
63
|
-
segmentTech: segmentTech,
|
|
64
|
-
teamSize: teamSize,
|
|
65
46
|
salesChannels: salesChannels,
|
|
66
47
|
brandLogoId: brandLogoId
|
|
67
48
|
},
|
|
@@ -71,23 +52,11 @@ var BrandInfo = function (_a) {
|
|
|
71
52
|
useSetFromDefaultValues(methods, data.brandData, true);
|
|
72
53
|
var defaultBrandLogoFile = React.useMemo(function () { return logo_details && __assign(__assign({}, logo_details), { docId: '' }); }, [logo_details]);
|
|
73
54
|
var originalReadOnly = useFormReadOnly(methods, { brandLogoId: defaultBrandLogoFile });
|
|
74
|
-
var noneEditable = useDataNoneEditable(data_status, [
|
|
75
|
-
'name.en',
|
|
76
|
-
'name.ar',
|
|
77
|
-
'segment.location_type',
|
|
78
|
-
'segment.profit_type',
|
|
79
|
-
'segment.tech_type',
|
|
80
|
-
'segment.teams',
|
|
81
|
-
'channel_services'
|
|
82
|
-
]);
|
|
55
|
+
var noneEditable = useDataNoneEditable(data_status, ['name.en', 'name.ar', 'channel_services', 'logo']);
|
|
83
56
|
var readOnly = useFormErrorAndUpdateReadOnly(methods, originalReadOnly, noneEditable);
|
|
84
|
-
var dataVerified = useDataVerified(data_verification, ['logo', 'name.en', 'name.ar'
|
|
57
|
+
var dataVerified = useDataVerified(data_verification, ['logo', 'name.en', 'name.ar']);
|
|
85
58
|
var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
|
|
86
59
|
var isBrandNameVerified = dataVerified['name.en'] && dataVerified['name.ar'] && ((name === null || name === void 0 ? void 0 : name.en) === watch('brandName') || (name === null || name === void 0 ? void 0 : name.ar) === watch('brandName'));
|
|
87
|
-
var isSegmentLocationVerified = dataVerified['segment.location_type'] && ((_b = resSegment === null || resSegment === void 0 ? void 0 : resSegment.location_type) === null || _b === void 0 ? void 0 : _b.id) === ((_c = watch('segmentLocation')) === null || _c === void 0 ? void 0 : _c.id);
|
|
88
|
-
var isSegmentProfitVerified = dataVerified['segment.profit_type'] && ((_d = resSegment === null || resSegment === void 0 ? void 0 : resSegment.profit_type) === null || _d === void 0 ? void 0 : _d.id) === ((_e = watch('segmentProfit')) === null || _e === void 0 ? void 0 : _e.id);
|
|
89
|
-
var isSegmentTechVerified = dataVerified['segment.tech_type'] && ((_f = resSegment === null || resSegment === void 0 ? void 0 : resSegment.tech_type) === null || _f === void 0 ? void 0 : _f.id) === ((_g = watch('segmentTech')) === null || _g === void 0 ? void 0 : _g.id);
|
|
90
|
-
var isTeamSizeVerified = dataVerified['segment.teams'] && ((_h = resSegment === null || resSegment === void 0 ? void 0 : resSegment.team) === null || _h === void 0 ? void 0 : _h.id) === ((_j = watch('teamSize')) === null || _j === void 0 ? void 0 : _j.id);
|
|
91
60
|
var onSubmit = function (data) {
|
|
92
61
|
dispatch(updateBrand(getFelids(data)));
|
|
93
62
|
};
|
|
@@ -112,13 +81,6 @@ var BrandInfo = function (_a) {
|
|
|
112
81
|
}, [responseBody]);
|
|
113
82
|
var brandErrChecks = !methods.formState.isValid || !!methods.formState.errors.brandName || !!error;
|
|
114
83
|
var disabled = brandErrChecks || brandNameChecking || uploadingBrandLogo;
|
|
115
|
-
|
|
116
|
-
setListActive(flag);
|
|
117
|
-
};
|
|
118
|
-
var isSegmentLocationListActive = listActive === ListType.SegmentLocationList;
|
|
119
|
-
var isSegmentProfitListActive = listActive === ListType.SegmentProfitList;
|
|
120
|
-
var isSegmentTechListActive = listActive === ListType.SegmentTechList;
|
|
121
|
-
var isTeamSizeListActive = listActive === ListType.TeamSizeList;
|
|
122
|
-
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandName, { readOnly: readOnly['brandName'] || (noneEditable['name.en'] && noneEditable['name.ar']), show: !listActive, brandNameChecking: brandNameChecking, fetchingBrandName: setBrandNameChecking, isVerified: isBrandNameVerified }), _jsx(BrandLogo, { defaultFile: defaultBrandLogoFile, readOnly: readOnly['brandLogoId'], show: !listActive, isVerified: dataVerified['logo'] }), _jsx(SegmentLocations, { readOnly: readOnly['segmentLocation'], show: !isTeamSizeListActive && !isSegmentProfitListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentLocationList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentLocationVerified }), _jsx(SegmentProfits, { readOnly: readOnly['segmentProfit'], show: !isTeamSizeListActive && !isSegmentLocationListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentProfitList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentProfitVerified }), _jsx(SegmentTechs, { readOnly: readOnly['segmentTech'], show: !isTeamSizeListActive && !isSegmentLocationListActive && !isSegmentProfitListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentTechList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentTechVerified }), _jsx(TeamSize, { readOnly: readOnly['teamSize'] || noneEditable['segment.teams'], show: !isSegmentLocationListActive && !isSegmentProfitListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.TeamSizeList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isTeamSizeVerified }), _jsxs(Collapse, __assign({ in: !listActive }, { children: [_jsx(SalesChannels, { readOnly: readOnly['salesChannels'] || noneEditable['channel_services'] }), _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('next') }))] }))] })) })) }));
|
|
84
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(BrandName, { readOnly: readOnly['brandName'] || (noneEditable['name.en'] && noneEditable['name.ar']), brandNameChecking: brandNameChecking, fetchingBrandName: setBrandNameChecking, isVerified: isBrandNameVerified }), _jsx(BrandLogo, { defaultFile: defaultBrandLogoFile, readOnly: readOnly['brandLogoId'], isVerified: dataVerified['logo'] }), _jsx(SalesChannels, { readOnly: readOnly['salesChannels'] || noneEditable['channel_services'] }), _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('next') }))] })) })) }));
|
|
123
85
|
};
|
|
124
86
|
export default BrandInfo;
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { FileDetails } from '../../../../@types';
|
|
3
3
|
type BrandLogoProps = {
|
|
4
|
-
show: boolean;
|
|
5
4
|
readOnly?: boolean;
|
|
6
5
|
defaultFile?: FileDetails;
|
|
7
6
|
isVerified?: boolean;
|
|
8
7
|
};
|
|
9
|
-
declare const BrandLogo: ({
|
|
8
|
+
declare const BrandLogo: ({ readOnly, defaultFile, isVerified }: BrandLogoProps) => JSX.Element;
|
|
10
9
|
export default BrandLogo;
|
|
@@ -1,14 +1,3 @@
|
|
|
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
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
2
|
import { useTranslation } from 'react-i18next';
|
|
14
3
|
import { useController, useFormContext } from 'react-hook-form';
|
|
@@ -16,7 +5,6 @@ import { styled } from '@mui/material/styles';
|
|
|
16
5
|
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
17
6
|
import { DocumentPurpose } from '../../../../@types';
|
|
18
7
|
import { FileRemoveType, VALID_FILE_FORMATS_FOR_IMAGE } from '../../../../constants';
|
|
19
|
-
import Collapse from '../../../../components/Collapse';
|
|
20
8
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
21
9
|
import { UploadWrapper } from '../../../shared/UploadFile';
|
|
22
10
|
import { brandSelector, uploadingBrandLogoStatus, clearBrandLogo, clearError } from '../../../app/brand/brandStore';
|
|
@@ -28,7 +16,7 @@ var FeatureStyled = styled(ScreenContainer)(function (_a) {
|
|
|
28
16
|
});
|
|
29
17
|
var BrandLogo = function (_a) {
|
|
30
18
|
var _b;
|
|
31
|
-
var
|
|
19
|
+
var readOnly = _a.readOnly, defaultFile = _a.defaultFile, isVerified = _a.isVerified;
|
|
32
20
|
var t = useTranslation().t;
|
|
33
21
|
var control = useFormContext().control;
|
|
34
22
|
var brandLogoIdControl = useController({ name: 'brandLogoId', control: control });
|
|
@@ -48,6 +36,6 @@ var BrandLogo = function (_a) {
|
|
|
48
36
|
dispatch(clearBrandLogo());
|
|
49
37
|
brandLogoIdControl.field.onChange(undefined);
|
|
50
38
|
};
|
|
51
|
-
return (_jsx(
|
|
39
|
+
return (_jsx(FeatureStyled, { children: _jsx(UploadWrapper, { id: 'brandLogoId', readOnly: readOnly, fileRemoveType: FileRemoveType.BRAND_LOGO_FILE_ID, control: control, label: t('title_brand_logo'), title: t('drag_and_drop'), subTitle: t('subtitle_drop'), dragDescription: t('description_brand_logo'), uploadingTitle: t('file_uploading_title'), successTitle: t('success_upload_bank_statement'), onFileUploaded: handleBrandLogoChange, isSubmitting: loading, onDeleteFile: handleReset, defaultFile: defaultFile, purpose: DocumentPurpose.BRAND_LOGO, validFileFormats: VALID_FILE_FORMATS_FOR_IMAGE, fileUploadingStatus: function (uploading) { return dispatch(uploadingBrandLogoStatus(uploading)); }, isVerified: isVerified && !id }) }));
|
|
52
40
|
};
|
|
53
41
|
export default BrandLogo;
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
interface BrandNameProps {
|
|
3
|
-
show: boolean;
|
|
4
3
|
fetchingBrandName: (flag: boolean) => void;
|
|
5
4
|
brandNameChecking: boolean;
|
|
6
5
|
readOnly?: boolean;
|
|
7
6
|
isVerified?: boolean;
|
|
8
7
|
}
|
|
9
|
-
declare const _default: React.MemoExoticComponent<({
|
|
8
|
+
declare const _default: React.MemoExoticComponent<({ brandNameChecking, fetchingBrandName, readOnly, isVerified }: BrandNameProps) => JSX.Element>;
|
|
10
9
|
export default _default;
|
|
@@ -58,7 +58,6 @@ import InfoOutlinedIcon from '@mui/icons-material/InfoOutlined';
|
|
|
58
58
|
import { FieldType } from '../../../../@types';
|
|
59
59
|
import { useAppDispatch, useAppSelector } from '../../../../hooks';
|
|
60
60
|
import Tooltip from '../../../../components/Tooltip';
|
|
61
|
-
import Collapse from '../../../../components/Collapse';
|
|
62
61
|
import Text from '../../../../components/Text';
|
|
63
62
|
import Input from '../../../shared/Input';
|
|
64
63
|
import { ScreenContainer } from '../../../shared/Containers';
|
|
@@ -97,7 +96,7 @@ var InfoIconStyled = styled(InfoIcon)(function (_a) {
|
|
|
97
96
|
var cancelToken = null;
|
|
98
97
|
var BrandName = function (_a) {
|
|
99
98
|
var _b, _c;
|
|
100
|
-
var
|
|
99
|
+
var brandNameChecking = _a.brandNameChecking, fetchingBrandName = _a.fetchingBrandName, readOnly = _a.readOnly, isVerified = _a.isVerified;
|
|
101
100
|
var dispatch = useAppDispatch();
|
|
102
101
|
var _d = React.useState(false), isHovered = _d[0], setIsHovered = _d[1];
|
|
103
102
|
var t = useTranslation().t;
|
|
@@ -136,6 +135,6 @@ var BrandName = function (_a) {
|
|
|
136
135
|
var clearBrandName = function () {
|
|
137
136
|
brandControl.field.onChange('');
|
|
138
137
|
};
|
|
139
|
-
return (
|
|
138
|
+
return (_jsxs(ScreenContainer, __assign({ sx: { mt: 2.5, mb: 0 } }, { children: [_jsxs(LabelContainerStyled, { children: [_jsx(InputLabelStyled, { children: t('signup_brand_name_label') }), _jsx(Tooltip, __assign({ title: t('brand_name_hint'), onMouseOver: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, onTouchStartCapture: function () { return setIsHovered(true); } }, { children: isHovered ? _jsx(InfoIconStyled, {}) : _jsx(InfoOutlinedIconStyled, {}) }))] }), _jsx(Input, { readOnly: readOnly, onChange: handleBrandNameChange, value: brandNameValue || '', disabled: isNonEditable, placeholder: t('signup_brand_name_placeholder'), warningType: 'alert', warningMessage: error && t(error), endAdornment: _jsx(EndAdornment, { value: brandNameValue, loading: brandNameChecking, isVerified: isVerified, error: error, onClear: clearBrandName }) })] })));
|
|
140
139
|
};
|
|
141
140
|
export default React.memo(BrandName);
|
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
import * as yup from 'yup';
|
|
2
2
|
export declare const BrandValidationSchema: () => yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
3
3
|
brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
4
|
-
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>>;
|
|
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
|
-
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>>;
|
|
7
|
-
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>>;
|
|
8
4
|
salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
9
5
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
10
6
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
@@ -16,10 +12,6 @@ export declare const BrandValidationSchema: () => yup.ObjectSchema<import("yup/l
|
|
|
16
12
|
}>>[] | undefined>;
|
|
17
13
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
18
14
|
brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
19
|
-
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>>;
|
|
20
|
-
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>>;
|
|
21
|
-
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>>;
|
|
22
|
-
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>>;
|
|
23
15
|
salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
24
16
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
25
17
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
@@ -31,10 +23,6 @@ export declare const BrandValidationSchema: () => yup.ObjectSchema<import("yup/l
|
|
|
31
23
|
}>>[] | undefined>;
|
|
32
24
|
}>>, import("yup/lib/object").AssertsShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
33
25
|
brandName: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
34
|
-
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>>;
|
|
35
|
-
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>>;
|
|
36
|
-
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>>;
|
|
37
|
-
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>>;
|
|
38
26
|
salesChannels: import("yup/lib/array").RequiredArraySchema<yup.ObjectSchema<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
39
27
|
id: import("yup/lib/string").RequiredStringSchema<string | undefined, import("yup/lib/types").AnyObject>;
|
|
40
28
|
}>, import("yup/lib/object").AnyObject, import("yup/lib/object").TypeOfShape<import("yup/lib/object").Assign<import("yup/lib/object").ObjectShape, {
|
|
@@ -83,10 +83,6 @@ export var BrandValidationSchema = function () {
|
|
|
83
83
|
}
|
|
84
84
|
})
|
|
85
85
|
.required('enter_brand_name_english_chars_numbers_space'),
|
|
86
|
-
segmentLocation: yup.object().required('alert_choose_segment_location'),
|
|
87
|
-
segmentProfit: yup.object().required('alert_choose_segment_profit'),
|
|
88
|
-
segmentTech: yup.object().required('alert_choose_segment_tech'),
|
|
89
|
-
teamSize: yup.object().required('alert_choose_teamSize'),
|
|
90
86
|
salesChannels: yup
|
|
91
87
|
.array()
|
|
92
88
|
.min(1, 'choose_atleast_one_channel')
|
|
@@ -0,0 +1,102 @@
|
|
|
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, jsxs as _jsxs } from "react/jsx-runtime";
|
|
13
|
+
import React from 'react';
|
|
14
|
+
import { useTranslation } from 'react-i18next';
|
|
15
|
+
import { FormProvider, useForm } from 'react-hook-form';
|
|
16
|
+
import { styled } from '@mui/material/styles';
|
|
17
|
+
import { useAppDispatch, useAppSelector, useDataNoneEditable, useFormReadOnly, useLanguage, useSetFromDefaultValues, useFormErrorAndUpdateReadOnly, useExcludeReadOnlyFelids, useDataVerified } from '../../../../hooks';
|
|
18
|
+
import { handlePrevScreenStep } from '../../../../app/settings';
|
|
19
|
+
import { yupResolver } from '@hookform/resolvers/yup';
|
|
20
|
+
import Collapse from '../../../../components/Collapse';
|
|
21
|
+
import Form from '../../../../components/Form';
|
|
22
|
+
import { ScreenContainer } from '../../../shared/Containers';
|
|
23
|
+
import { clearError, brandSelector, updateSegmentBrand } from '../../../app/brand/brandStore';
|
|
24
|
+
import Button from '../../../shared/Button';
|
|
25
|
+
import SegmentLocations from './SegmentLocations';
|
|
26
|
+
import SegmentProfits from './SegmentProfits';
|
|
27
|
+
import SegmentTechs from './SegmentTechs';
|
|
28
|
+
import { BrandValidationSchema } from './validation';
|
|
29
|
+
import TeamSize from './TeamSize';
|
|
30
|
+
var FormStyled = styled(Form)(function () { return ({
|
|
31
|
+
display: 'flex',
|
|
32
|
+
flexDirection: 'column'
|
|
33
|
+
}); });
|
|
34
|
+
var ListType;
|
|
35
|
+
(function (ListType) {
|
|
36
|
+
ListType["TeamSizeList"] = "TeamSizeList";
|
|
37
|
+
ListType["SegmentLocationList"] = "SegmentLocationList";
|
|
38
|
+
ListType["SegmentProfitList"] = "SegmentProfitList";
|
|
39
|
+
ListType["SegmentTechList"] = "SegmentTechList";
|
|
40
|
+
})(ListType || (ListType = {}));
|
|
41
|
+
var BrandInfo = function (_a) {
|
|
42
|
+
var _b, _c, _d, _e, _f, _g, _h, _j;
|
|
43
|
+
var _k = React.useState(), listActive = _k[0], setListActive = _k[1];
|
|
44
|
+
var dispatch = useAppDispatch();
|
|
45
|
+
var t = useTranslation().t;
|
|
46
|
+
var isAr = useLanguage().isAr;
|
|
47
|
+
var _l = useAppSelector(brandSelector), data = _l.data, loading = _l.loading, error = _l.error;
|
|
48
|
+
var _m = data.brandSegmentData, segmentLocation = _m.segmentLocation, segmentProfit = _m.segmentProfit, segmentTech = _m.segmentTech, teamSize = _m.teamSize;
|
|
49
|
+
var brand = (data.verify.responseBody || {}).brand;
|
|
50
|
+
var _o = brand || {}, data_status = _o.data_status, data_verification = _o.data_verification, resSegment = _o.segment;
|
|
51
|
+
var methods = useForm({
|
|
52
|
+
resolver: yupResolver(BrandValidationSchema()),
|
|
53
|
+
defaultValues: {
|
|
54
|
+
segmentLocation: segmentLocation,
|
|
55
|
+
segmentProfit: segmentProfit,
|
|
56
|
+
segmentTech: segmentTech,
|
|
57
|
+
teamSize: teamSize
|
|
58
|
+
},
|
|
59
|
+
mode: 'onChange'
|
|
60
|
+
});
|
|
61
|
+
var watch = methods.watch;
|
|
62
|
+
useSetFromDefaultValues(methods, data.brandSegmentData, true);
|
|
63
|
+
var originalReadOnly = useFormReadOnly(methods);
|
|
64
|
+
var noneEditable = useDataNoneEditable(data_status, [
|
|
65
|
+
'segment.location_type',
|
|
66
|
+
'segment.profit_type',
|
|
67
|
+
'segment.tech_type',
|
|
68
|
+
'segment.teams'
|
|
69
|
+
]);
|
|
70
|
+
var readOnly = useFormErrorAndUpdateReadOnly(methods, originalReadOnly, noneEditable);
|
|
71
|
+
var dataVerified = useDataVerified(data_verification, [
|
|
72
|
+
'segment.location_type',
|
|
73
|
+
'segment.profit_type',
|
|
74
|
+
'segment.tech_type',
|
|
75
|
+
'segment.teams'
|
|
76
|
+
]);
|
|
77
|
+
var getFelids = useExcludeReadOnlyFelids(methods, readOnly).getFelids;
|
|
78
|
+
var isSegmentLocationVerified = dataVerified['segment.location_type'] && ((_b = resSegment === null || resSegment === void 0 ? void 0 : resSegment.location_type) === null || _b === void 0 ? void 0 : _b.id) === ((_c = watch('segmentLocation')) === null || _c === void 0 ? void 0 : _c.id);
|
|
79
|
+
var isSegmentProfitVerified = dataVerified['segment.profit_type'] && ((_d = resSegment === null || resSegment === void 0 ? void 0 : resSegment.profit_type) === null || _d === void 0 ? void 0 : _d.id) === ((_e = watch('segmentProfit')) === null || _e === void 0 ? void 0 : _e.id);
|
|
80
|
+
var isSegmentTechVerified = dataVerified['segment.tech_type'] && ((_f = resSegment === null || resSegment === void 0 ? void 0 : resSegment.tech_type) === null || _f === void 0 ? void 0 : _f.id) === ((_g = watch('segmentTech')) === null || _g === void 0 ? void 0 : _g.id);
|
|
81
|
+
var isTeamSizeVerified = dataVerified['segment.teams'] && ((_h = resSegment === null || resSegment === void 0 ? void 0 : resSegment.team) === null || _h === void 0 ? void 0 : _h.id) === ((_j = watch('teamSize')) === null || _j === void 0 ? void 0 : _j.id);
|
|
82
|
+
var onSubmit = function (data) {
|
|
83
|
+
dispatch(updateSegmentBrand(getFelids(data)));
|
|
84
|
+
};
|
|
85
|
+
var onBack = function () {
|
|
86
|
+
dispatch(handlePrevScreenStep());
|
|
87
|
+
};
|
|
88
|
+
React.useEffect(function () {
|
|
89
|
+
if (error)
|
|
90
|
+
dispatch(clearError());
|
|
91
|
+
}, [methods.formState.isValid]);
|
|
92
|
+
var disabled = !methods.formState.isValid || !!error;
|
|
93
|
+
var handleMenuClick = function (flag) {
|
|
94
|
+
setListActive(flag);
|
|
95
|
+
};
|
|
96
|
+
var isSegmentLocationListActive = listActive === ListType.SegmentLocationList;
|
|
97
|
+
var isSegmentProfitListActive = listActive === ListType.SegmentProfitList;
|
|
98
|
+
var isSegmentTechListActive = listActive === ListType.SegmentTechList;
|
|
99
|
+
var isTeamSizeListActive = listActive === ListType.TeamSizeList;
|
|
100
|
+
return (_jsx(ScreenContainer, { children: _jsx(FormProvider, __assign({}, methods, { children: _jsxs(FormStyled, __assign({ onSubmit: methods.handleSubmit(onSubmit) }, { children: [_jsx(SegmentLocations, { readOnly: readOnly['segmentLocation'], show: !isTeamSizeListActive && !isSegmentProfitListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentLocationList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentLocationVerified }), _jsx(SegmentProfits, { readOnly: readOnly['segmentProfit'], show: !isTeamSizeListActive && !isSegmentLocationListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentProfitList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentProfitVerified }), _jsx(SegmentTechs, { readOnly: readOnly['segmentTech'], show: !isTeamSizeListActive && !isSegmentLocationListActive && !isSegmentProfitListActive, onListOpen: function () { return handleMenuClick(ListType.SegmentTechList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isSegmentTechVerified }), _jsx(TeamSize, { readOnly: readOnly['teamSize'] || noneEditable['segment.teams'], show: !isSegmentLocationListActive && !isSegmentProfitListActive && !isSegmentTechListActive, onListOpen: function () { return handleMenuClick(ListType.TeamSizeList); }, onListClose: function () { return handleMenuClick(); }, isVerified: isTeamSizeVerified }), _jsx(Collapse, __assign({ in: !listActive }, { children: _jsx(Button, __assign({ onBackClicked: function () { return onBack(); }, disabled: disabled, isAr: isAr, error: t(error || ''), loading: loading }, { children: t('next') })) }))] })) })) }));
|
|
101
|
+
};
|
|
102
|
+
export default BrandInfo;
|