@paro.io/expert-shared-components 1.7.9 → 1.8.2
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/lib/components/DocumentCenter/DocumentCenter.js +1 -1
- package/lib/components/DocumentCenter/DocumentUploadRow.d.ts +1 -4
- package/lib/components/DocumentCenter/DocumentUploadRow.js +34 -63
- package/lib/components/DocumentCenter/ParoDocumentsTable.d.ts +0 -1
- package/lib/components/DocumentCenter/ParoDocumentsTable.js +44 -1
- package/lib/components/ExpertProfileHeader/NetworkSection.js +1 -1
- package/lib/components/HeaderNavBar/index.d.ts +1 -1
- package/lib/components/HeaderNavBar/index.js +2 -2
- package/lib/components/ServiceLinesTemplate/index.d.ts +2 -3
- package/lib/components/ServiceLinesTemplate/index.js +154 -124
- package/package.json +1 -1
|
@@ -177,7 +177,7 @@ const DocumentCenter = ({ legacyFreelancerId, openModal, setOpenModal, expertCli
|
|
|
177
177
|
react_1.default.createElement(lab_1.TabPanel, { value: '0', style: { paddingTop: '0px' } },
|
|
178
178
|
react_1.default.createElement(ClientDocumentsTable_1.ClientDocumentsTable, { legacyFreelancerId: legacyFreelancerId, expertFiles: expertClientFiles, setExpertClientFiles: setExpertClientFiles, clientAndProjectsList: clientAndProjects, uploadExpertClientFiles: uploadExpertClientFiles, updateFileLastViewed: updateFileLastViewed, deleteExpertClientFile: deleteExpertClientFile, paroDocuments: false, freelancerName: freelancerName !== null && freelancerName !== void 0 ? freelancerName : '', freelancerEmail: freelancerEmail !== null && freelancerEmail !== void 0 ? freelancerEmail : '', getFileLazyQuery: getFileLazyQuery, expertClientFilesLazyQuery: expertClientFilesLazyQuery, isClientPortal: isClientPortal, documentUploadUrl: documentUploadUrl, downloadDocumentUrl: downloadDocumentUrl })),
|
|
179
179
|
react_1.default.createElement(lab_1.TabPanel, { value: '1' },
|
|
180
|
-
react_1.default.createElement(ParoDocumentsTable_1.ParoDocumentsTable, { legacyFreelancerId: legacyFreelancerId, expiryDate: insuranceExpiryDate !== null && insuranceExpiryDate !== void 0 ? insuranceExpiryDate : '', setExpiryDate: setInsuranceExpiryDate, expertFiles: expertFiles, setExpertFiles: setExpertFiles,
|
|
180
|
+
react_1.default.createElement(ParoDocumentsTable_1.ParoDocumentsTable, { legacyFreelancerId: legacyFreelancerId, expiryDate: insuranceExpiryDate !== null && insuranceExpiryDate !== void 0 ? insuranceExpiryDate : '', setExpiryDate: setInsuranceExpiryDate, expertFiles: expertFiles, setExpertFiles: setExpertFiles, uploadFileData: uploadFileData, deleteFileMutation: deleteFileMutation, updateFreelancerExpiryMutation: updateFreelancerExpiryMutation, foldername: foldername !== null && foldername !== void 0 ? foldername : '', paroDocuments: true, getFileLazyQuery: getFileLazyQuery, getFilesLazyQuery: getFilesLazyQuery }))))),
|
|
181
181
|
react_1.default.createElement(react_hot_toast_1.Toaster, { position: "top-center", toastOptions: {
|
|
182
182
|
style: {
|
|
183
183
|
zIndex: 9999,
|
|
@@ -16,9 +16,6 @@ interface DocumentUploadProps {
|
|
|
16
16
|
error?: string | null;
|
|
17
17
|
clientAndProjectsList?: any[];
|
|
18
18
|
uploadExpertClientFiles?: any;
|
|
19
|
-
uploadInternalFile?: any;
|
|
20
|
-
foldername?: string;
|
|
21
|
-
insuranceExpiryDate?: any;
|
|
22
19
|
refetchFiles?: any;
|
|
23
20
|
legacyFreelancerId?: any;
|
|
24
21
|
freelancerName?: string;
|
|
@@ -26,5 +23,5 @@ interface DocumentUploadProps {
|
|
|
26
23
|
isClientPortal?: boolean;
|
|
27
24
|
documentUploadUrl?: string;
|
|
28
25
|
}
|
|
29
|
-
export declare const DocumentUploadRow: ({ clientAndProject, setClientAndProject, docType, setDocType, paroDocuments, expiryDate, handleDateChange, error, clientAndProjectsList, uploadExpertClientFiles,
|
|
26
|
+
export declare const DocumentUploadRow: ({ clientAndProject, setClientAndProject, docType, setDocType, paroDocuments, expiryDate, handleDateChange, error, clientAndProjectsList, uploadExpertClientFiles, refetchFiles, legacyFreelancerId, freelancerName, freelancerEmail, isClientPortal, documentUploadUrl, }: DocumentUploadProps) => JSX.Element;
|
|
30
27
|
export {};
|
|
@@ -78,7 +78,7 @@ const generateOptions = (array, clientOptions, isClientPortal) => {
|
|
|
78
78
|
}
|
|
79
79
|
});
|
|
80
80
|
};
|
|
81
|
-
const DocumentUploadRow = ({ clientAndProject, setClientAndProject, docType, setDocType, paroDocuments, expiryDate, handleDateChange, error, clientAndProjectsList, uploadExpertClientFiles,
|
|
81
|
+
const DocumentUploadRow = ({ clientAndProject, setClientAndProject, docType, setDocType, paroDocuments, expiryDate, handleDateChange, error, clientAndProjectsList, uploadExpertClientFiles, refetchFiles, legacyFreelancerId, freelancerName, freelancerEmail, isClientPortal = false, documentUploadUrl, }) => {
|
|
82
82
|
const [isUploading, setIsUploading] = (0, react_1.useState)(false);
|
|
83
83
|
const [documentName, setDocumentName] = (0, react_1.useState)('');
|
|
84
84
|
const fileInputRef = (0, react_1.useRef)(null);
|
|
@@ -93,69 +93,40 @@ const DocumentUploadRow = ({ clientAndProject, setClientAndProject, docType, set
|
|
|
93
93
|
const disableButton = !(documentName && checkField) && !isUploading;
|
|
94
94
|
const uploadFile = (fileForUpload, fileExtension, isLargeFile, selectedFile) => {
|
|
95
95
|
var _a, _b, _c, _d, _e;
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
}).finally(() => {
|
|
122
|
-
setIsUploading(false);
|
|
123
|
-
setDocumentName('');
|
|
124
|
-
})
|
|
125
|
-
: uploadExpertClientFiles({
|
|
126
|
-
variables: {
|
|
127
|
-
input: {
|
|
128
|
-
clientId: (_a = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.client) === null || _a === void 0 ? void 0 : _a.id,
|
|
129
|
-
clientName: (_b = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.client) === null || _b === void 0 ? void 0 : _b.name,
|
|
130
|
-
email: isClientPortal ? (_c = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _c === void 0 ? void 0 : _c.name : freelancerEmail,
|
|
131
|
-
fileName: `${documentName}.${fileExtension}`,
|
|
132
|
-
fileSize: selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.size,
|
|
133
|
-
fileType: utils_1.DOCUMENT_TYPE_CONSTANTS[docType],
|
|
134
|
-
freelancerId: isClientPortal ? (_d = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _d === void 0 ? void 0 : _d.id : legacyFreelancerId,
|
|
135
|
-
freelancerName: isClientPortal ? (_e = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _e === void 0 ? void 0 : _e.name : freelancerName,
|
|
136
|
-
projectId: clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.id,
|
|
137
|
-
projectName: clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.name,
|
|
138
|
-
uploadedBy: isClientPortal ? 'CLIENT' : 'FREELANCER',
|
|
139
|
-
data: isLargeFile ? "" : fileForUpload,
|
|
140
|
-
},
|
|
141
|
-
}
|
|
142
|
-
})
|
|
143
|
-
.then((res) => {
|
|
144
|
-
var _a;
|
|
145
|
-
if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.uploadExpertClientFilesData) {
|
|
146
|
-
refetchFiles();
|
|
147
|
-
(0, utils_1.showToast)('success', 'File Uploaded successfully!');
|
|
148
|
-
}
|
|
149
|
-
else {
|
|
150
|
-
(0, utils_1.showToast)('warning', 'Upload failed! Please try again.');
|
|
151
|
-
}
|
|
152
|
-
})
|
|
153
|
-
.catch((err) => {
|
|
96
|
+
uploadExpertClientFiles({
|
|
97
|
+
variables: {
|
|
98
|
+
input: {
|
|
99
|
+
clientId: (_a = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.client) === null || _a === void 0 ? void 0 : _a.id,
|
|
100
|
+
clientName: (_b = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.client) === null || _b === void 0 ? void 0 : _b.name,
|
|
101
|
+
email: isClientPortal ? (_c = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _c === void 0 ? void 0 : _c.name : freelancerEmail,
|
|
102
|
+
fileName: `${documentName}.${fileExtension}`,
|
|
103
|
+
fileSize: selectedFile === null || selectedFile === void 0 ? void 0 : selectedFile.size,
|
|
104
|
+
fileType: utils_1.DOCUMENT_TYPE_CONSTANTS[docType],
|
|
105
|
+
freelancerId: isClientPortal ? (_d = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _d === void 0 ? void 0 : _d.id : legacyFreelancerId,
|
|
106
|
+
freelancerName: isClientPortal ? (_e = clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.freelancer) === null || _e === void 0 ? void 0 : _e.name : freelancerName,
|
|
107
|
+
projectId: clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.id,
|
|
108
|
+
projectName: clientAndProject === null || clientAndProject === void 0 ? void 0 : clientAndProject.name,
|
|
109
|
+
uploadedBy: isClientPortal ? 'CLIENT' : 'FREELANCER',
|
|
110
|
+
data: isLargeFile ? "" : fileForUpload,
|
|
111
|
+
},
|
|
112
|
+
}
|
|
113
|
+
})
|
|
114
|
+
.then((res) => {
|
|
115
|
+
var _a;
|
|
116
|
+
if ((_a = res === null || res === void 0 ? void 0 : res.data) === null || _a === void 0 ? void 0 : _a.uploadExpertClientFilesData) {
|
|
117
|
+
refetchFiles();
|
|
118
|
+
(0, utils_1.showToast)('success', 'File Uploaded successfully!');
|
|
119
|
+
}
|
|
120
|
+
else {
|
|
154
121
|
(0, utils_1.showToast)('warning', 'Upload failed! Please try again.');
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
122
|
+
}
|
|
123
|
+
})
|
|
124
|
+
.catch((err) => {
|
|
125
|
+
(0, utils_1.showToast)('warning', 'Upload failed! Please try again.');
|
|
126
|
+
}).finally(() => {
|
|
127
|
+
setIsUploading(false);
|
|
128
|
+
setDocumentName('');
|
|
129
|
+
});
|
|
159
130
|
};
|
|
160
131
|
const uploadFileRouter = (fileForUpload, fileExtension, selectedFile) => {
|
|
161
132
|
setIsUploading(true);
|
|
@@ -263,6 +263,49 @@ const ParoDocumentsTable = ({ legacyFreelancerId, expiryDate, setExpiryDate, exp
|
|
|
263
263
|
setApiFoldername((_c = segments === null || segments === void 0 ? void 0 : segments.slice(0, segments.length - 1)) === null || _c === void 0 ? void 0 : _c.join('/'));
|
|
264
264
|
}
|
|
265
265
|
};
|
|
266
|
+
const uploadFile = (fileForUpload, fileExtension) => {
|
|
267
|
+
setIsUploading(true);
|
|
268
|
+
uploadFileData({
|
|
269
|
+
variables: {
|
|
270
|
+
input: {
|
|
271
|
+
foldername,
|
|
272
|
+
subfolder: docType,
|
|
273
|
+
filename: `${documentName}.${fileExtension}`,
|
|
274
|
+
data: fileForUpload,
|
|
275
|
+
expirationDate: ((docType === 'EO Insurance') && insuranceExpiryDate) ? insuranceExpiryDate : '',
|
|
276
|
+
valid: true,
|
|
277
|
+
sourceOfEOInsurance: 'Dashboard',
|
|
278
|
+
},
|
|
279
|
+
},
|
|
280
|
+
onCompleted: () => __awaiter(void 0, void 0, void 0, function* () {
|
|
281
|
+
refetchFiles(true);
|
|
282
|
+
})
|
|
283
|
+
})
|
|
284
|
+
.then(() => {
|
|
285
|
+
(0, utils_1.showToast)('success', 'File Uploaded successfully!');
|
|
286
|
+
})
|
|
287
|
+
.catch((err) => {
|
|
288
|
+
(0, utils_1.showToast)('warning', 'Upload failed! Please try again.');
|
|
289
|
+
});
|
|
290
|
+
setIsUploading(false);
|
|
291
|
+
setApiFoldername('');
|
|
292
|
+
setDocumentName('');
|
|
293
|
+
};
|
|
294
|
+
const handleUpload = (event) => {
|
|
295
|
+
const selectedFile = event.target.files && event.target.files[0];
|
|
296
|
+
if (!(0, utils_1.validateFileUpload)(selectedFile, false)) {
|
|
297
|
+
return;
|
|
298
|
+
}
|
|
299
|
+
if (selectedFile) {
|
|
300
|
+
const fileExtension = selectedFile.name.substring(selectedFile.name.lastIndexOf('.') + 1);
|
|
301
|
+
const reader = new FileReader();
|
|
302
|
+
reader.onloadend = () => {
|
|
303
|
+
const fileForUpload = String(reader.result).split(';base64,')[1];
|
|
304
|
+
uploadFile(fileForUpload, fileExtension);
|
|
305
|
+
};
|
|
306
|
+
reader.readAsDataURL(selectedFile);
|
|
307
|
+
}
|
|
308
|
+
};
|
|
266
309
|
const handleDateChange = (date) => {
|
|
267
310
|
if (date) {
|
|
268
311
|
const currentDate = (0, date_fns_1.startOfDay)(new Date);
|
|
@@ -276,7 +319,7 @@ const ParoDocumentsTable = ({ legacyFreelancerId, expiryDate, setExpiryDate, exp
|
|
|
276
319
|
}
|
|
277
320
|
};
|
|
278
321
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
279
|
-
react_1.default.createElement(DocumentUploadRow_1.DocumentUploadRow, { documentName: documentName, setDocumentName: setDocumentName, clientAndProject: clientAndProject, setClientAndProject: setClientAndProject,
|
|
322
|
+
react_1.default.createElement(DocumentUploadRow_1.DocumentUploadRow, { documentName: documentName, setDocumentName: setDocumentName, clientAndProject: clientAndProject, setClientAndProject: setClientAndProject, docType: docType, setDocType: setDocType, searchText: searchText, setSearchText: setSearchText, paroDocuments: paroDocuments, handleUpload: handleUpload, expiryDate: insuranceExpiryDate, handleDateChange: handleDateChange, error: error, isUploading: isUploading }),
|
|
280
323
|
react_1.default.createElement(utils_1.CustomPaper, null,
|
|
281
324
|
react_1.default.createElement("div", { className: 'w-1/4' },
|
|
282
325
|
react_1.default.createElement(base_ui_1.Input, { placeholder: "Search Documents", type: "text", value: searchText, onChange: (e) => setSearchText(e.target.value) })),
|
|
@@ -123,7 +123,7 @@ const NetworkSection = ({ handleScrollToBottom, preferenceTasks, isWhiteLabel, d
|
|
|
123
123
|
react_1.default.createElement(core_1.Divider, null)),
|
|
124
124
|
vanityTitle && react_1.default.createElement(react_1.default.Fragment, null,
|
|
125
125
|
react_1.default.createElement(core_1.Box, { ml: 1, display: "flex", justifyContent: "space-between", alignItems: "center", "data-testid": "Matching-Id", style: { marginRight: '10px' } },
|
|
126
|
-
react_1.default.createElement(core_1.Typography, { variant: "body2" }, "Expertise as a "),
|
|
126
|
+
react_1.default.createElement(core_1.Typography, { variant: "body2", style: { marginRight: '20px' } }, "Expertise as a "),
|
|
127
127
|
react_1.default.createElement("b", null, vanityTitle),
|
|
128
128
|
!isInternal && react_1.default.createElement(core_1.IconButton, { onClick: () => { setOpenModal(true); } },
|
|
129
129
|
react_1.default.createElement(icons_1.Cached, null))),
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
export declare const HeaderNavBar: ({ setOpenDocumentModal, setOpenServiceLinesTemplate }: any) => React.JSX.Element;
|
|
2
|
+
export declare const HeaderNavBar: ({ setOpenDocumentModal, setOpenServiceLinesTemplate, isClientPortal }: any) => React.JSX.Element;
|
|
@@ -7,10 +7,10 @@ exports.HeaderNavBar = void 0;
|
|
|
7
7
|
const react_1 = __importDefault(require("react"));
|
|
8
8
|
const core_1 = require("@material-ui/core");
|
|
9
9
|
const base_icons_1 = require("@paro.io/base-icons");
|
|
10
|
-
const HeaderNavBar = ({ setOpenDocumentModal, setOpenServiceLinesTemplate }) => {
|
|
10
|
+
const HeaderNavBar = ({ setOpenDocumentModal, setOpenServiceLinesTemplate, isClientPortal = false }) => {
|
|
11
11
|
return (react_1.default.createElement("div", { className: "flex w-full bg-white p-1 shadow-sm justify-end" },
|
|
12
12
|
react_1.default.createElement("div", { style: { display: 'flex', justifyContent: 'flex-end' } },
|
|
13
|
-
react_1.default.createElement(core_1.Tooltip, { arrow: true, placement: "top", interactive: true, className: "whitespace-nowrap", title: "Service Lines" },
|
|
13
|
+
!isClientPortal && react_1.default.createElement(core_1.Tooltip, { arrow: true, placement: "top", interactive: true, className: "whitespace-nowrap", title: "Service Lines" },
|
|
14
14
|
react_1.default.createElement(core_1.IconButton, { onClick: () => setOpenServiceLinesTemplate(true) },
|
|
15
15
|
" ",
|
|
16
16
|
react_1.default.createElement(base_icons_1.IconBriefcase, { size: "md" }),
|
|
@@ -3,9 +3,7 @@ type ServiceLinesTemplateProps = {
|
|
|
3
3
|
getFreelancerDataResult?: any;
|
|
4
4
|
createOrUpdateRates?: any;
|
|
5
5
|
updateExpert?: any;
|
|
6
|
-
currentFeatureStatus?: any;
|
|
7
6
|
openServiceLinesTemplate?: boolean;
|
|
8
|
-
setOpenServiceLinesTemplate?: any;
|
|
9
7
|
getRatesByExpertId?: any;
|
|
10
8
|
setView?: any;
|
|
11
9
|
getServiceLines?: any;
|
|
@@ -18,6 +16,7 @@ type ServiceLinesTemplateProps = {
|
|
|
18
16
|
isInternalProfile?: boolean;
|
|
19
17
|
updateFreelancerPreferences?: any;
|
|
20
18
|
getExpertVanityTitles?: any;
|
|
19
|
+
reactAppUrl: string;
|
|
21
20
|
};
|
|
22
|
-
export declare const ServiceLinesTemplate: ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert,
|
|
21
|
+
export declare const ServiceLinesTemplate: ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, openServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList, isInternalProfile, updateFreelancerPreferences, getExpertVanityTitles, reactAppUrl, }: ServiceLinesTemplateProps) => false | React.JSX.Element | undefined;
|
|
23
22
|
export {};
|
|
@@ -39,39 +39,52 @@ const icons_1 = require("@material-ui/icons");
|
|
|
39
39
|
const ReviewsTab_1 = require("../ReviewsTab/ReviewsTab");
|
|
40
40
|
const base_ui_1 = require("@paro.io/base-ui");
|
|
41
41
|
const utils_1 = require("../shared/utils");
|
|
42
|
-
const lab_1 = require("@material-ui/lab");
|
|
43
42
|
const react_hot_toast_1 = require("react-hot-toast");
|
|
44
|
-
const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert,
|
|
43
|
+
const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, openServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList = [], isInternalProfile = false, updateFreelancerPreferences, getExpertVanityTitles, reactAppUrl, }) => {
|
|
45
44
|
const [selectedServices, dispatch] = (0, react_1.useReducer)(utils_1.selectedServicesReducer, selectedServicesList);
|
|
46
45
|
const [updateClicked, setUpdateClicked] = (0, react_1.useState)(false);
|
|
47
|
-
const [loading, setLoading] = (0, react_1.useState)(
|
|
46
|
+
const [loading, setLoading] = (0, react_1.useState)(true);
|
|
48
47
|
const [serviceLines, setServiceLines] = (0, react_1.useState)(serviceLineData);
|
|
49
48
|
const [currentServiveRate, setCurrentServiceRate] = (0, react_1.useState)(null);
|
|
50
49
|
const [value, setValue] = (0, react_1.useState)(0);
|
|
51
50
|
const [titleOptions, setTitleOptions] = (0, react_1.useState)([]);
|
|
52
51
|
const [selectedTitle, setSelectedTitle] = (0, react_1.useState)(null);
|
|
53
52
|
const [customTitle, setCustomTitle] = (0, react_1.useState)(null);
|
|
54
|
-
const [
|
|
53
|
+
const [expandedServices, setExpandedServices] = (0, react_1.useState)(new Map());
|
|
54
|
+
const [currentFeatureStatus, setCurrentFeatureStatus] = (0, react_1.useState)({});
|
|
55
|
+
const [disablePublicProfile, setDisablePublicProfile] = (0, react_1.useState)(true);
|
|
56
|
+
const handleExpandToggle = (serviceTitle) => {
|
|
57
|
+
setExpandedServices(prev => {
|
|
58
|
+
const updatedState = new Map(prev);
|
|
59
|
+
const currentExpandedState = updatedState.get(serviceTitle) || false;
|
|
60
|
+
updatedState.set(serviceTitle, !currentExpandedState);
|
|
61
|
+
return updatedState;
|
|
62
|
+
});
|
|
63
|
+
};
|
|
55
64
|
const fetchServiceLineData = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
56
65
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
57
66
|
try {
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
67
|
+
if (!isInternalProfile) {
|
|
68
|
+
const [expertVanityTitles] = yield Promise.all([
|
|
69
|
+
getExpertVanityTitles({ fetchPolicy: 'network-only' }),
|
|
70
|
+
]);
|
|
71
|
+
const expertTitles = (_a = expertVanityTitles === null || expertVanityTitles === void 0 ? void 0 : expertVanityTitles.data) === null || _a === void 0 ? void 0 : _a.getExpertVanityTitles;
|
|
72
|
+
setTitleOptions(expertTitles);
|
|
73
|
+
}
|
|
74
|
+
const [freelancerResponse, serviceLinesResponse, ratesResponse] = yield Promise.all([
|
|
61
75
|
getFreelancerDataResult({ variables: { legacyFreelancerId: legacyFreelancerId }, skip: !legacyFreelancerId, fetchPolicy: 'network-only' }),
|
|
62
76
|
getServiceLines({ fetchPolicy: 'network-only', }),
|
|
63
77
|
getRatesByExpertId({ variables: { expertId }, skip: !expertId, fetchPolicy: 'network-only' }),
|
|
64
78
|
]);
|
|
65
|
-
setServiceLines(((
|
|
66
|
-
const currentService = (
|
|
67
|
-
const currentRate = (
|
|
68
|
-
const expertRates = (
|
|
69
|
-
setCurrentFeatureStatus((_k = (_j = freelancerResponse === null || freelancerResponse === void 0 ? void 0 : freelancerResponse.data) === null || _j === void 0 ? void 0 : _j.getExpertByLegacyFreelancerId) === null || _k === void 0 ? void 0 : _k.featureStatus);
|
|
79
|
+
setServiceLines(((_b = serviceLinesResponse === null || serviceLinesResponse === void 0 ? void 0 : serviceLinesResponse.data) === null || _b === void 0 ? void 0 : _b.getServiceLines) || serviceLineData);
|
|
80
|
+
const currentService = (_e = (_d = (_c = freelancerResponse === null || freelancerResponse === void 0 ? void 0 : freelancerResponse.data) === null || _c === void 0 ? void 0 : _c.getExpertByLegacyFreelancerId) === null || _d === void 0 ? void 0 : _d.legacyMetadata) === null || _e === void 0 ? void 0 : _e.primaryServiceLine;
|
|
81
|
+
const currentRate = (_h = (_g = (_f = freelancerResponse === null || freelancerResponse === void 0 ? void 0 : freelancerResponse.data) === null || _f === void 0 ? void 0 : _f.getExpertByLegacyFreelancerId) === null || _g === void 0 ? void 0 : _g.legacyMetadata) === null || _h === void 0 ? void 0 : _h.defaultHourlyRate;
|
|
82
|
+
const expertRates = (_j = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.data) === null || _j === void 0 ? void 0 : _j.getRatesByExpertId;
|
|
70
83
|
setCurrentServiceRate(currentRate);
|
|
71
|
-
const
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
isTitleExists
|
|
84
|
+
const isTitleExists = (_l = (_k = freelancerResponse === null || freelancerResponse === void 0 ? void 0 : freelancerResponse.data) === null || _k === void 0 ? void 0 : _k.getExpertByLegacyFreelancerId) === null || _l === void 0 ? void 0 : _l.vanityTitle;
|
|
85
|
+
const featureStatus = (_o = (_m = freelancerResponse === null || freelancerResponse === void 0 ? void 0 : freelancerResponse.data) === null || _m === void 0 ? void 0 : _m.getExpertByLegacyFreelancerId) === null || _o === void 0 ? void 0 : _o.featureStatus;
|
|
86
|
+
setCurrentFeatureStatus(featureStatus);
|
|
87
|
+
isTitleExists && setSelectedTitle(isTitleExists);
|
|
75
88
|
dispatch({
|
|
76
89
|
currentService,
|
|
77
90
|
currentRate,
|
|
@@ -122,8 +135,7 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
|
|
|
122
135
|
variables: {
|
|
123
136
|
expertId: expertId,
|
|
124
137
|
input: {
|
|
125
|
-
vanityTitle: selectedTitle === 'Other' ? customTitle : selectedTitle
|
|
126
|
-
featureStatus: Object.assign({}, featureStatus)
|
|
138
|
+
vanityTitle: selectedTitle === 'Other' ? customTitle : selectedTitle
|
|
127
139
|
}
|
|
128
140
|
},
|
|
129
141
|
}).then(() => {
|
|
@@ -142,6 +154,7 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
|
|
|
142
154
|
});
|
|
143
155
|
}).finally(() => {
|
|
144
156
|
setUpdateClicked(false);
|
|
157
|
+
setDisablePublicProfile(false);
|
|
145
158
|
});
|
|
146
159
|
});
|
|
147
160
|
const handleUpdateProfile = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
@@ -171,17 +184,18 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
|
|
|
171
184
|
console.log('DB Updation failed: ', error.message);
|
|
172
185
|
}
|
|
173
186
|
finally {
|
|
174
|
-
setOpenServiceLinesTemplate && setOpenServiceLinesTemplate(false);
|
|
175
187
|
setUpdateClicked(false);
|
|
188
|
+
setValue(1);
|
|
176
189
|
}
|
|
177
190
|
;
|
|
178
191
|
});
|
|
179
192
|
const updateFeatureStatus = () => {
|
|
193
|
+
const updateFeatureStatus = Object.assign(Object.assign({}, currentFeatureStatus), { serviceLines: true });
|
|
180
194
|
updateExpert({
|
|
181
195
|
variables: {
|
|
182
196
|
expertId: expertId,
|
|
183
197
|
input: {
|
|
184
|
-
featureStatus:
|
|
198
|
+
featureStatus: updateFeatureStatus
|
|
185
199
|
}
|
|
186
200
|
},
|
|
187
201
|
}).then(() => {
|
|
@@ -198,14 +212,11 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
|
|
|
198
212
|
message: 'Update failed!',
|
|
199
213
|
icon: 'warning'
|
|
200
214
|
});
|
|
201
|
-
console.log('DB Updation failed : ', error.message);
|
|
202
215
|
}).finally(() => {
|
|
203
|
-
|
|
216
|
+
setUpdateClicked(false);
|
|
217
|
+
setValue(1);
|
|
204
218
|
});
|
|
205
219
|
};
|
|
206
|
-
const handleNotInterestedClick = () => __awaiter(void 0, void 0, void 0, function* () {
|
|
207
|
-
yield updateFeatureStatus();
|
|
208
|
-
});
|
|
209
220
|
const isUpdateButtonDisabled = () => {
|
|
210
221
|
if ((selectedServices === null || selectedServices === void 0 ? void 0 : selectedServices.length) === 0)
|
|
211
222
|
return true;
|
|
@@ -229,110 +240,129 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
|
|
|
229
240
|
type: 'update'
|
|
230
241
|
});
|
|
231
242
|
};
|
|
232
|
-
const handleChange = (event, newValue) => {
|
|
233
|
-
if (newValue >= 0) {
|
|
234
|
-
setValue(newValue);
|
|
235
|
-
}
|
|
236
|
-
};
|
|
237
243
|
const handleChangeTitle = (event) => {
|
|
238
244
|
setSelectedTitle(event.target.value);
|
|
239
245
|
};
|
|
240
|
-
const ActionButtons = () => {
|
|
241
|
-
return react_1.default.createElement(core_1.Grid, { container: true, direction: "row", justifyContent: "space-evenly", style: {
|
|
242
|
-
react_1.default.createElement(base_ui_1.Button, { label: "
|
|
243
|
-
react_1.default.createElement(base_ui_1.Button, { label: "
|
|
244
|
-
};
|
|
245
|
-
const ServiceLinesTab = () => {
|
|
246
|
-
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
247
|
-
react_1.default.createElement(core_1.Grid, { style: { backgroundColor: '#132f4a', padding: 12 }, className: "service-lines-header" },
|
|
248
|
-
react_1.default.createElement(core_1.Typography, { className: "headerTop", variant: "h5", style: { color: '#ffffff', fontWeight: 500, padding: 12, justifyContent: 'space-between', display: 'flex', alignItems: 'center' } },
|
|
249
|
-
"Expand Your Expertise: Add More Services to Your Profile",
|
|
250
|
-
react_1.default.createElement("img", { src: 'https://expert-files-dev.s3.us-east-1.amazonaws.com/ParoGroupLogo.png', alt: "Paro Group Logo", style: { width: 24, height: 24, marginLeft: 8 } })),
|
|
251
|
-
react_1.default.createElement(core_1.Typography, { className: "headerMiddle", style: { color: '#ffffff', fontWeight: 200, fontStyle: 'italic', paddingLeft: 12 } }, "Why Add More Services?"),
|
|
252
|
-
react_1.default.createElement(core_1.Grid, { container: true, spacing: 3, style: { padding: 12, color: '#ffffff' }, direction: "row", justifyContent: "flex-start", alignItems: "center" }, utils_1.features.map((feature, index) => (react_1.default.createElement(core_1.Box, { key: index, display: "flex", alignItems: "center", m: 2 },
|
|
253
|
-
react_1.default.createElement(icons_1.AdjustRounded, { style: {
|
|
254
|
-
marginRight: 8,
|
|
255
|
-
color: '#2A9D8F',
|
|
256
|
-
fontSize: 20
|
|
257
|
-
}, className: "headerCircle" }),
|
|
258
|
-
react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { color: '#ffffff' } }, feature)))))),
|
|
259
|
-
react_1.default.createElement(core_1.Grid, { container: true, style: { padding: 4 } },
|
|
260
|
-
react_1.default.createElement(core_1.Typography, { variant: "h6", style: { marginLeft: 20, fontWeight: 500 } }, "Select from the following service lines:"),
|
|
261
|
-
react_1.default.createElement(core_1.Grid, { container: true, direction: "row", justifyContent: "space-evenly", alignItems: "center" }, services === null || services === void 0 ? void 0 :
|
|
262
|
-
services.map((service, index) => {
|
|
263
|
-
const serviceExistsInArray = selectedServices.find((svc) => svc.service === service.title);
|
|
264
|
-
return (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, md: 5, key: index, style: { margin: 12 } },
|
|
265
|
-
react_1.default.createElement(core_1.Box, { sx: { display: "flex" } },
|
|
266
|
-
react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center' },
|
|
267
|
-
react_1.default.createElement(CustomCheckbox, { checked: serviceExistsInArray, disabled: serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService, onChange: () => handleServiceToggle(service.title) })),
|
|
268
|
-
react_1.default.createElement(core_1.Box, { sx: { flex: 1 } },
|
|
269
|
-
react_1.default.createElement(core_1.Box, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center", mb: 2 } },
|
|
270
|
-
react_1.default.createElement(core_1.Box, null,
|
|
271
|
-
react_1.default.createElement(core_1.Typography, { component: "div", style: { fontWeight: 300, fontSize: 16 } },
|
|
272
|
-
service.title,
|
|
273
|
-
(serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService) && (react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: 16 } }, "\u00A0(current service line)"))),
|
|
274
|
-
react_1.default.createElement(core_1.Typography, { variant: "body2", style: { fontWeight: 50, fontSize: 14 } }, service.description)),
|
|
275
|
-
react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center', ml: 4 },
|
|
276
|
-
react_1.default.createElement(core_1.TextField, { size: "small", variant: "outlined", value: (serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.rate) || '', onChange: (e) => handlePriceChange(service.title, e.target.value ? parseInt(e.target.value) : 0, serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService), InputProps: {
|
|
277
|
-
startAdornment: react_1.default.createElement(core_1.Typography, null, "$\u00A0"),
|
|
278
|
-
endAdornment: react_1.default.createElement(core_1.Typography, null, "\u00A0/hr"),
|
|
279
|
-
}, style: { width: 100 }, required: serviceExistsInArray, error: serviceExistsInArray && !serviceExistsInArray.rate, label: "Rate", className: "serviceLineRateInput" })))))));
|
|
280
|
-
}),
|
|
281
|
-
react_1.default.createElement(core_1.Grid, { item: true, xs: 12, md: 5, style: { margin: 5 } }, ActionButtons())))));
|
|
246
|
+
const ActionButtons = (disabled) => {
|
|
247
|
+
return react_1.default.createElement(core_1.Grid, { container: true, direction: "row", justifyContent: "space-evenly", style: { margin: 'auto' }, spacing: 2 },
|
|
248
|
+
react_1.default.createElement(base_ui_1.Button, { label: "PREVIEW PUBLIC PROFILE", onClick: () => window.open(`${reactAppUrl}/public/${legacyFreelancerId}`, '_blank'), type: "button", disabled: disabled, isLoading: updateClicked }),
|
|
249
|
+
react_1.default.createElement(base_ui_1.Button, { label: "UPDATE PROFILE", onClick: handleUpdateExpertTitle, type: "button", isLoading: updateClicked, disabled: isUpdateButtonDisabled(), color: "primary" }));
|
|
282
250
|
};
|
|
283
|
-
const
|
|
251
|
+
const newServiceLine = () => {
|
|
284
252
|
var _a;
|
|
285
|
-
return react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "
|
|
286
|
-
|
|
287
|
-
react_1.default.createElement(core_1.
|
|
288
|
-
"
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
react_1.default.createElement(core_1.
|
|
300
|
-
react_1.default.createElement(
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
253
|
+
return (react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "column", justifyContent: "center" },
|
|
254
|
+
(value === 0 || isInternalProfile) ?
|
|
255
|
+
react_1.default.createElement(core_1.Grid, { container: true, className: "service-lines-header", direction: "column", justifyContent: "center" },
|
|
256
|
+
react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "flex-start" },
|
|
257
|
+
react_1.default.createElement(core_1.Grid, { item: true, direction: "column", justifyContent: "flex-start" },
|
|
258
|
+
react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '24px', fontWeight: 600 } }, "Expand Your Expertise"),
|
|
259
|
+
react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '16px', fontWeight: 600 } }, "Step 1: Add more services to your profile to stand out")),
|
|
260
|
+
react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '6px 20px' } },
|
|
261
|
+
"Step ",
|
|
262
|
+
value + 1,
|
|
263
|
+
" of 2")),
|
|
264
|
+
react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "column", justifyContent: "center", alignItems: "center" },
|
|
265
|
+
react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '18px', fontWeight: 400, marginTop: '8px', marginBottom: '8px' } }, "Why Add More Services?")),
|
|
266
|
+
react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "center", xs: 10, style: { margin: 'auto' } },
|
|
267
|
+
react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
|
|
268
|
+
react_1.default.createElement(icons_1.AdjustRounded, { style: {
|
|
269
|
+
marginRight: 8,
|
|
270
|
+
color: '#248384',
|
|
271
|
+
fontSize: '20px'
|
|
272
|
+
}, className: "headerCircle" }),
|
|
273
|
+
react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } }, "Increase your visibility to clients searching for diverse expertise")),
|
|
274
|
+
react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
|
|
275
|
+
react_1.default.createElement(icons_1.AdjustRounded, { style: {
|
|
276
|
+
marginRight: 8,
|
|
277
|
+
color: '#248384',
|
|
278
|
+
fontSize: '20px'
|
|
279
|
+
}, className: "headerCircle" }),
|
|
280
|
+
react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } }, "Position yourself as a versatile professional"))),
|
|
281
|
+
react_1.default.createElement(core_1.Grid, { item: true, container: true, style: { marginTop: '16px' } },
|
|
282
|
+
react_1.default.createElement(core_1.Typography, { variant: "h6", style: { fontSize: '16px', fontWeight: 600 } }, "Add Service Lines to your profile:"),
|
|
283
|
+
react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-evenly", alignItems: "center" }, services === null || services === void 0 ? void 0 : services.map((service, index) => {
|
|
284
|
+
const serviceExistsInArray = selectedServices.find((svc) => svc.service === service.title);
|
|
285
|
+
const isExpanded = expandedServices.get(service.title) || false;
|
|
286
|
+
return (react_1.default.createElement(core_1.Grid, { item: true, xs: 12, key: index, style: { margin: 4 } },
|
|
287
|
+
react_1.default.createElement(core_1.Box, { sx: { display: "flex" } },
|
|
288
|
+
react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center' },
|
|
289
|
+
react_1.default.createElement(CustomCheckbox, { checked: serviceExistsInArray, disabled: serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService, onChange: () => handleServiceToggle(service.title) })),
|
|
290
|
+
react_1.default.createElement(core_1.Box, { sx: { flex: 1 } },
|
|
291
|
+
react_1.default.createElement(core_1.Box, { sx: { display: "flex", justifyContent: "space-between", alignItems: "center" } },
|
|
292
|
+
react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center' },
|
|
293
|
+
react_1.default.createElement(core_1.Typography, { component: "div", style: { fontWeight: 600, fontSize: '16px', color: '#1C1F2B' } },
|
|
294
|
+
service.title,
|
|
295
|
+
(serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService) && (react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '16px', fontStyle: 'italic' } }, "\u00A0(current service line)")))),
|
|
296
|
+
react_1.default.createElement(core_1.Box, { display: 'flex', alignItems: 'center', ml: 4 },
|
|
297
|
+
react_1.default.createElement(core_1.TextField, { size: "small", variant: "outlined", value: (serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.rate) || '', onChange: (e) => handlePriceChange(service.title, e.target.value ? parseInt(e.target.value) : 0, serviceExistsInArray === null || serviceExistsInArray === void 0 ? void 0 : serviceExistsInArray.currentService), InputProps: {
|
|
298
|
+
startAdornment: react_1.default.createElement(core_1.Typography, null, "$\u00A0"),
|
|
299
|
+
endAdornment: react_1.default.createElement(core_1.Typography, null, "\u00A0/hr"),
|
|
300
|
+
}, style: { width: 100 }, required: serviceExistsInArray, error: serviceExistsInArray && !serviceExistsInArray.rate, label: "Rate", className: "serviceLineRateInput" }),
|
|
301
|
+
react_1.default.createElement(core_1.IconButton, { onClick: () => handleExpandToggle(service.title) }, isExpanded ? react_1.default.createElement(icons_1.ExpandLess, null) : react_1.default.createElement(icons_1.ExpandMore, null)))))),
|
|
302
|
+
isExpanded && react_1.default.createElement(core_1.Box, { ml: 2 },
|
|
303
|
+
react_1.default.createElement(core_1.Typography, { variant: "caption", style: { fontWeight: 400, fontSize: '16px' } }, service.description))));
|
|
304
|
+
}))))
|
|
305
|
+
:
|
|
306
|
+
react_1.default.createElement(core_1.Grid, { container: true, className: "service-lines-header", direction: "column", justifyContent: "center" },
|
|
307
|
+
react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: "row", justifyContent: "space-between", alignItems: "flex-start" },
|
|
308
|
+
react_1.default.createElement(core_1.Grid, { item: true, direction: "column", justifyContent: "flex-start" },
|
|
309
|
+
react_1.default.createElement(core_1.Typography, { variant: "h6", style: { color: '#12756F', fontSize: '24px', fontWeight: 600 } }, "Give your Expertise a Title"),
|
|
310
|
+
react_1.default.createElement(core_1.Typography, { variant: "body2", style: { color: '#1C1F2B', fontSize: '16px', fontWeight: 600 } }, "Step 2: Showcase your profile with a title")),
|
|
311
|
+
react_1.default.createElement(core_1.Grid, { item: true, style: { backgroundColor: '#0E3435', color: '#ffffff', borderRadius: '20px', padding: '6px 20px' } },
|
|
312
|
+
"Step ",
|
|
313
|
+
value + 1,
|
|
314
|
+
" of 2")),
|
|
315
|
+
react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "column", justifyContent: "center", alignItems: "center" },
|
|
316
|
+
react_1.default.createElement(core_1.Typography, { variant: "subtitle1", style: { textDecoration: 'underline', fontStyle: 'italic', fontSize: '16px', fontWeight: 400, marginTop: '16px', marginBottom: '16px' } }, "Why Add a Job Title to Your Profile?")),
|
|
317
|
+
react_1.default.createElement(core_1.Grid, { container: true, item: true, direction: "row", justifyContent: "space-between", alignItems: "center", xs: 10, spacing: 1, style: { margin: 'auto' } },
|
|
318
|
+
react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
|
|
319
|
+
react_1.default.createElement(icons_1.AdjustRounded, { style: {
|
|
320
|
+
marginRight: 8,
|
|
321
|
+
color: '#248384',
|
|
322
|
+
fontSize: '20px'
|
|
323
|
+
}, className: "headerCircle" }),
|
|
324
|
+
react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } },
|
|
325
|
+
react_1.default.createElement("b", { style: { display: 'inline', whiteSpace: 'nowrap' } }, "Showcase Your Brand:"),
|
|
326
|
+
" Your job title is the first impression Clients get of your professional identity")),
|
|
327
|
+
react_1.default.createElement(core_1.Box, { display: "flex", flexDirection: "row", alignItems: "center", width: '50%' },
|
|
328
|
+
react_1.default.createElement(icons_1.AdjustRounded, { style: {
|
|
329
|
+
marginRight: 8,
|
|
330
|
+
color: '#248384',
|
|
331
|
+
fontSize: '20px'
|
|
332
|
+
}, className: "headerCircle" }),
|
|
333
|
+
react_1.default.createElement(core_1.Typography, { className: "headerFeature", variant: "body2", style: { fontSize: '16px', fontWeight: 400 } },
|
|
334
|
+
react_1.default.createElement("b", { style: { display: 'inline', whiteSpace: 'nowrap' } }, "Control Your Narrative:"),
|
|
335
|
+
" Your job title gives you the opportunity to shape how Clients perceive you, positioning yourself as a trusted expert in your field."))),
|
|
336
|
+
react_1.default.createElement(core_1.Grid, { xs: 12, style: { marginTop: 16 }, container: true, direction: "column", justifyContent: "center", alignItems: "center" },
|
|
337
|
+
react_1.default.createElement(core_1.Box, null,
|
|
338
|
+
react_1.default.createElement(core_1.Typography, { variant: "h5", style: { fontWeight: 500 } }, "Select from the following Expertise titles:")),
|
|
339
|
+
react_1.default.createElement(core_1.Grid, { item: true, style: { marginBottom: 12, width: '50%' } },
|
|
340
|
+
react_1.default.createElement(core_1.Select, { required: true, autoWidth: false, variant: "outlined", fullWidth: true, defaultValue: titleOptions, onChange: (event) => handleChangeTitle(event), value: selectedTitle !== null && selectedTitle !== void 0 ? selectedTitle : (_a = titleOptions[0]) === null || _a === void 0 ? void 0 : _a.title },
|
|
341
|
+
titleOptions.length > 1 && (react_1.default.createElement(core_1.MenuItem, { disabled: true, value: "" },
|
|
342
|
+
react_1.default.createElement("em", null, "Select title"))),
|
|
343
|
+
titleOptions.map((option) => (react_1.default.createElement(core_1.MenuItem, { key: option.id, value: option.title }, option.title))),
|
|
344
|
+
react_1.default.createElement(core_1.MenuItem, { value: "Other" },
|
|
345
|
+
react_1.default.createElement("em", null, "Other")))),
|
|
346
|
+
selectedTitle === 'Other' && react_1.default.createElement(core_1.Grid, { item: true, style: { width: '70%' } },
|
|
347
|
+
react_1.default.createElement(core_1.TextField, { size: "small", variant: "outlined", value: customTitle, fullWidth: true, onChange: (e) => { setCustomTitle(e.target.value); }, placeholder: "Enter custom title" })))),
|
|
348
|
+
(value === 1 || isInternalProfile) ?
|
|
349
|
+
react_1.default.createElement(react_1.default.Fragment, null, ActionButtons(disablePublicProfile))
|
|
350
|
+
:
|
|
351
|
+
react_1.default.createElement(core_1.Grid, { item: true, direction: "row", justifyContent: "flex-end", style: { marginLeft: 'auto' } },
|
|
352
|
+
react_1.default.createElement(base_ui_1.Button, { label: "NEXT", onClick: () => handleUpdateProfile(), type: "button", isLoading: updateClicked, disabled: isUpdateButtonDisabled(), color: "primary" }))));
|
|
318
353
|
};
|
|
319
|
-
|
|
320
|
-
react_1.default.createElement(core_1.
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
style: {
|
|
333
|
-
zIndex: 9999,
|
|
334
|
-
backgroundColor: 'transparent'
|
|
335
|
-
},
|
|
336
|
-
} }))))));
|
|
354
|
+
if (loading) {
|
|
355
|
+
return (react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "center", alignItems: "center", width: '100%', style: { margin: 'auto' } },
|
|
356
|
+
react_1.default.createElement(core_1.CircularProgress, null)));
|
|
357
|
+
}
|
|
358
|
+
return (openServiceLinesTemplate && (react_1.default.createElement(core_1.Grid, { style: { backgroundColor: '#fff', minWidth: '100%' } },
|
|
359
|
+
react_1.default.createElement(react_1.default.Fragment, null,
|
|
360
|
+
newServiceLine(),
|
|
361
|
+
react_1.default.createElement(react_hot_toast_1.Toaster, { position: "top-center", toastOptions: {
|
|
362
|
+
style: {
|
|
363
|
+
zIndex: 9999,
|
|
364
|
+
backgroundColor: 'transparent'
|
|
365
|
+
},
|
|
366
|
+
} })))));
|
|
337
367
|
};
|
|
338
368
|
exports.ServiceLinesTemplate = ServiceLinesTemplate;
|