@paro.io/expert-shared-components 1.7.5 → 1.7.7

package/lib/components/ExpertProfileHeader/ProfileSection.js

@@ -53,15 +53,15 @@ const formatPhoneNumber = (phone) => {
     return `(${numericPhone.slice(0, 3)}) ${numericPhone.slice(3, 6)} - ${numericPhone.slice(6)}`;
 };
 exports.formatPhoneNumber = formatPhoneNumber;
-exports.ProfilePhotoPreview = styled_components_1.default.img `
-  height: 86px;
-  width: 86px;
-  border: 1px solid ${colors_1.default.lightGray};
-  border-radius: 50%;
-  object-fit: cover;
-  object-position: top;
+exports.ProfilePhotoPreview = styled_components_1.default.img `
+  height: 86px;
+  width: 86px;
+  border: 1px solid ${colors_1.default.lightGray};
+  border-radius: 50%;
+  object-fit: cover;
+  object-position: top;
 `;
-const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile, firstName, lastName, primaryServiceLine, editServiceLine, city, stateAbbreviation, email, phone, paroTenure, hourlyRate, setOpen, paroProjectsData, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, isInternal, getUserByEmail, updateUserEmail, updateUserMutation, getUserByEmailLazyQuery, updateUserPassword, verifyUserPassword, }) => {
+const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile, firstName, lastName, primaryServiceLine, editServiceLine, city, stateAbbreviation, email, phone, setOpen, paroProjectsData, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, isInternal, getUserByEmail, updateUserEmail, updateUserMutation, getUserByEmailLazyQuery, updateUserPassword, verifyUserPassword, getExpertRates, }) => {
     var _a;
     const [openReviews, setOpenReviews] = (0, react_1.useState)(false);
     const [resetPasswordOpen, setResetPasswordOpen] = (0, react_1.useState)(false);
@@ -79,6 +79,7 @@ const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile,
             return 0;
         }
     };
+    const rates = [...getExpertRates];
     return (react_1.default.createElement(core_1.Grid, { item: true, style: { background: 'linear-gradient(to bottom, #D9EFEF 100px, #FFFFFF 100px)', padding: '6px', width: '100%' } },
         react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: 'column', justify: 'center', alignItems: 'center' },
             react_1.default.createElement(core_1.Box, { mt: 4, mb: 1 },
@@ -120,16 +121,21 @@ const ProfileSection = ({ legacyFreelancerId, imageUrl, shouldAllowEditProfile,
                             " Reviews")))),
             react_1.default.createElement(core_1.Box, { mt: 1, mb: 1 },
                 react_1.default.createElement(core_1.Divider, null))),
-        react_1.default.createElement(core_1.Box, { ml: 1, display: "flex", justifyContent: "space-between", alignItems: "center", "data-testid": "Matching-Id", style: { marginRight: '10px' } },
-            react_1.default.createElement(core_1.Typography, { variant: "body2" }, "Paro Tenure"),
-            react_1.default.createElement("b", null, paroTenure.length > 0 ? paroTenure : "N/A")),
-        react_1.default.createElement(core_1.Box, { ml: 1, mt: 1, display: "flex", justifyContent: "space-between", alignItems: "center", "data-testid": "Matching-Id", style: { marginRight: '10px' } },
-            react_1.default.createElement(core_1.Typography, { variant: "body2" }, isInternal ? 'Hourly Expert Rate' : 'Hourly Rate'),
-            react_1.default.createElement("b", null, hourlyRate > 0 ? `$ ${hourlyRate.toLocaleString()}` : "N/A")),
-        isInternal && react_1.default.createElement(core_1.Box, { ml: 1, mt: 1, display: "flex", justifyContent: "space-between", alignItems: "center", "data-testid": "Matching-Id", style: { marginRight: '10px' } },
-            react_1.default.createElement(core_1.Typography, { variant: "body2" }, "Hourly Client Rate"),
-            react_1.default.createElement("b", null, hourlyRate > 0 ? `$ ${(hourlyRate * 2).toLocaleString()}` : "N/A")),
-        react_1.default.createElement(core_1.Box, { mt: 2, mb: 1 },
+        react_1.default.createElement(core_1.Grid, { item: true, container: true, direction: 'row', justifyContent: 'space-evenly' },
+            react_1.default.createElement("b", null, "SL's Offered:"),
+            react_1.default.createElement("b", null, "Hourly Exp. Rate:")),
+        react_1.default.createElement(core_1.Box, { mt: 1, mb: 1 },
+            react_1.default.createElement(core_1.Divider, null)),
+        (rates === null || rates === void 0 ? void 0 : rates.length) > 0 && (rates === null || rates === void 0 ? void 0 : rates.map((data) => (react_1.default.createElement(core_1.Box, { mt: 1, mr: 2, display: "flex", justifyContent: "space-between", alignItems: "center", key: data.serviceLine },
+            react_1.default.createElement("p", { className: `${primaryServiceLine === data.serviceLine && "text-[#248384]"}` },
+                data.serviceLine,
+                primaryServiceLine === data.serviceLine && react_1.default.createElement(react_1.default.Fragment, null,
+                    react_1.default.createElement("br", null),
+                    " (Primary SL)")),
+            react_1.default.createElement("b", null,
+                "$",
+                data.rate))))),
+        react_1.default.createElement(core_1.Box, { mt: 1, mb: 1 },
             react_1.default.createElement(core_1.Divider, null)),
         email && react_1.default.createElement(core_1.Box, { display: "flex", justifyContent: "center", alignItems: "center", "data-testid": "Matching-Id", style: { marginRight: '10px' } },
             react_1.default.createElement(Mail_1.default, { style: { marginRight: '10px' } }),

package/lib/components/ExpertProfileHeader/TeamsSection.d.ts

@@ -1,6 +1,6 @@
 interface TeamSectionProps {
-    estimatedAvailability: any;
-    nextMonthTrueAvailability: any;
+    estimatedAvailability: number;
+    nextMonthTrueAvailability: number;
     expertFirms: any;
     firstName: string;
     lastName: string;

package/lib/components/ExpertProfileHeader/TeamsSection.js

@@ -29,7 +29,9 @@ const icons_1 = require("@material-ui/icons");
 const OrganizationChart_1 = require("../OrganizationChart");
 const AvailabilityInfo = ({ label, value }) => (react_1.default.createElement(core_1.Box, { mt: 2, mr: 2, display: "flex", justifyContent: "space-between", alignItems: "center" },
     react_1.default.createElement(core_1.Typography, { variant: "body1" }, label),
-    react_1.default.createElement("b", null, value)));
+    react_1.default.createElement("b", { className: `${value < 0 && 'text-red-500'}` },
+        value,
+        " hrs")));
 const TeamDetail = ({ label, value }) => (react_1.default.createElement(core_1.Box, { mt: 2, mr: 2, display: "flex", justifyContent: "space-between", alignItems: "center" },
     react_1.default.createElement(core_1.Typography, { variant: "body2" }, label),
     react_1.default.createElement("b", null, value)));
@@ -52,7 +54,7 @@ const TeamsSection = ({ estimatedAvailability, nextMonthTrueAvailability, expert
     const services = (_a = expertFirms === null || expertFirms === void 0 ? void 0 : expertFirms.expertFirmClientReferences) === null || _a === void 0 ? void 0 : _a.flatMap((obj) => { var _a; return (_a = obj === null || obj === void 0 ? void 0 : obj.services) !== null && _a !== void 0 ? _a : []; });
     const uniqueServices = parseServices(services);
     return (react_1.default.createElement(core_1.Grid, { item: true, style: { width: '100%', paddingTop: '6px' } },
-        (estimatedAvailability !== '-' || nextMonthTrueAvailability !== '-') && react_1.default.createElement(core_1.Grid, null,
+        (estimatedAvailability !== 0 || nextMonthTrueAvailability !== 0) && react_1.default.createElement(core_1.Grid, null,
             react_1.default.createElement(core_1.Box, { mb: 1 },
                 react_1.default.createElement("b", null, "Work Availability :")),
             react_1.default.createElement(AvailabilityInfo, { label: "Monthly avail. left", value: estimatedAvailability }),
@@ -73,10 +75,7 @@ const TeamsSection = ({ estimatedAvailability, nextMonthTrueAvailability, expert
             react_1.default.createElement(TeamDetail, { label: "Team size", value: (_d = (_c = expertFirms === null || expertFirms === void 0 ? void 0 : expertFirms.expertFirmEmployees) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0 }),
             react_1.default.createElement(core_1.Box, { mb: 1 },
                 react_1.default.createElement(core_1.Divider, null)),
-            react_1.default.createElement(TeamDetail, { label: "# of Services", value: (_e = uniqueServices === null || uniqueServices === void 0 ? void 0 : uniqueServices.length) !== null && _e !== void 0 ? _e : 0 }),
-            react_1.default.createElement(core_1.Box, { mb: 1 },
-                react_1.default.createElement(core_1.Divider, null)),
-            (uniqueServices === null || uniqueServices === void 0 ? void 0 : uniqueServices.length) > 0 && react_1.default.createElement(RatesList, { services: uniqueServices, rate: expertFirms === null || expertFirms === void 0 ? void 0 : expertFirms.fixedRateFees }))),
+            react_1.default.createElement(TeamDetail, { label: "# of Services", value: (_e = uniqueServices === null || uniqueServices === void 0 ? void 0 : uniqueServices.length) !== null && _e !== void 0 ? _e : 0 }))),
         openModal && expertFirms &&
             react_1.default.createElement(OrganizationChart_1.OrganizationChart, { openModal: openModal, setOpenModal: setOpenModal, expertFirms: expertFirms, firstName: firstName, lastName: lastName, primaryServiceLine: primaryServiceLine, city: city, stateAbbreviation: stateAbbreviation, paroTenure: paroTenure, imageUrl: imageUrl, isPublicProfile: false })));
 };

package/lib/components/OrganizationChart/OrganizationChart.js

@@ -34,13 +34,13 @@ const Close_1 = __importDefault(require("@material-ui/icons/Close"));
 const cdn_1 = require("../shared/constants/cdn");
 const styled_components_1 = __importDefault(require("styled-components"));
 const defaultAvatar = cdn_1.CDN_URL + 'defaultAvatar.png';
-const ProfilePhotoPreview = styled_components_1.default.img `
-  height: 86px;
-  width: 86px;
-  border: 1px solid #e4e5e4;
-  border-radius: 50%;
-  object-fit: cover;
-  object-position: top;
+const ProfilePhotoPreview = styled_components_1.default.img `
+  height: 86px;
+  width: 86px;
+  border: 1px solid #e4e5e4;
+  border-radius: 50%;
+  object-fit: cover;
+  object-position: top;
 `;
 const CustomDialog = (0, core_1.styled)(Dialog_1.default)(({ theme }) => ({
     '& .MuiDialog-paper': {

package/lib/components/Reviews/Pagination.js

@@ -51,12 +51,12 @@ const Pagination = ({ total, currentPage = 1, setCurrentPage, perPageItems = 10,
     };
     const numberOfPages = Math.ceil(total / perPageItems);
     return (react_1.default.createElement("div", { className: "bg-white px-4 py-3 border-t border-gray-200 sm:px-6 flex flex-col md:flex-row md:items-center md:justify-between" },
-        react_1.default.createElement("div", { className: "pb-2 md:pb-0" }, `Showing 
-          ${perPageItems * (currentPage - 1) + 1} 
-          to 
-          ${Math.min(total, perPageItems * currentPage)} 
-          of 
-          ${total}
+        react_1.default.createElement("div", { className: "pb-2 md:pb-0" }, `Showing 
+          ${perPageItems * (currentPage - 1) + 1} 
+          to 
+          ${Math.min(total, perPageItems * currentPage)} 
+          of 
+          ${total}
           ${displayText}`),
         react_1.default.createElement("div", { className: "flex items-center justify-between" },
             react_1.default.createElement("div", { className: "flex-1 flex justify-between sm:hidden" },

package/lib/components/ReviewsTab/RatingHeader.js

@@ -51,12 +51,12 @@ const isRatingExists = (rating) => {
     return false;
 };
 exports.isRatingExists = isRatingExists;
-const StyledButton = (0, styled_components_1.default)(core_2.Button) `
-    margin: 0px !important;
-    padding: 26px 0 18px 0 !important;
-    span {
-        color: #248384 !important
-     }
+const StyledButton = (0, styled_components_1.default)(core_2.Button) `
+    margin: 0px !important;
+    padding: 26px 0 18px 0 !important;
+    span {
+        color: #248384 !important
+     }
 `;
 const RatingHeader = ({ ratings, project, index, highlightedRatings, requestStatus, handleRatingRequest, loadingSubmitId, handleAddToProfile, ratingReviewButtonlabel, setOpenClientReviewModal, setShowReviewModelWithRecentlyRatedProjects, enableReviewModal, disableReviewModal, isClientPortal, isInternal, createOrUpdateRating, getParoProjectsDocument, projectIdToShow, }) => {
     var _a, _b, _c, _d;

package/lib/components/ReviewsTab/expert-shared-components.code-workspace

@@ -1,20 +1,20 @@
-{
-  "folders": [
-	{
-		"path": "../../.."
-	},
-	{
-		"path": "../../../../internal-profile-app"
-	},
-	{
-		"path": "../../../../availability-gantt-chart"
-	},
-	{
-		"path": "../../../../client-portal"
-	},
-	{
-		"path": "../../../../expert-portal"
-	}
-],
-  "settings": {}
-}
+{
+  "folders": [
+	{
+		"path": "../../.."
+	},
+	{
+		"path": "../../../../internal-profile-app"
+	},
+	{
+		"path": "../../../../availability-gantt-chart"
+	},
+	{
+		"path": "../../../../client-portal"
+	},
+	{
+		"path": "../../../../expert-portal"
+	}
+],
+  "settings": {}
+}

package/lib/components/ReviewsTab/reviewRequestModal.js

@@ -34,11 +34,11 @@ const react_hot_toast_1 = __importDefault(require("react-hot-toast"));
 const ReviewRequestModal = ({ project, requestModal, setRequestModal, expertName, freelancerId, setRequestStatus, selectedProject, setSelectedProject, clientId, refetchParoProjects, setHighlightedRatings, createOrUpdateRatingRequestMutation, getParoProjectsDocument, }) => {
     var _a;
     const [showError, setShowError] = (0, react_1.useState)(false);
-    const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name}, 
-I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated! 
-  
-Thank you in advance for your time and feedback.
-Best regards,
+    const [textareaValue, setTextareaValue] = (0, react_1.useState)(`Hi ${(_a = project === null || project === void 0 ? void 0 : project.client) === null || _a === void 0 ? void 0 : _a.name}, 
+I hope you are satisfied with the work I provided on ${project === null || project === void 0 ? void 0 : project.name}. Your feedback is very important to me and helps me improve my services and build my reputation on Paro. Could you please take a moment to leave a review of you experience? Your input is greatly appreciated! 
+  
+Thank you in advance for your time and feedback.
+Best regards,
 ${expertName}`);
     const handleTextArea = (e) => {
         setTextareaValue(e.target.value);

package/lib/components/ServiceLinesTemplate/index.d.ts

@@ -3,7 +3,6 @@ type ServiceLinesTemplateProps = {
     getFreelancerDataResult?: any;
     createOrUpdateRates?: any;
     updateExpert?: any;
-    currentFeatureStatus?: any;
     openServiceLinesTemplate?: boolean;
     setOpenServiceLinesTemplate?: any;
     getRatesByExpertId?: any;
@@ -19,5 +18,5 @@ type ServiceLinesTemplateProps = {
     updateFreelancerPreferences?: any;
     getExpertVanityTitles?: any;
 };
-export declare const ServiceLinesTemplate: ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, currentFeatureStatus, openServiceLinesTemplate, setOpenServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList, isInternalProfile, updateFreelancerPreferences, getExpertVanityTitles, }: ServiceLinesTemplateProps) => false | React.JSX.Element | undefined;
+export declare const ServiceLinesTemplate: ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, openServiceLinesTemplate, setOpenServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList, isInternalProfile, updateFreelancerPreferences, getExpertVanityTitles, }: ServiceLinesTemplateProps) => false | React.JSX.Element | undefined;
 export {};

package/lib/components/ServiceLinesTemplate/index.js

@@ -41,7 +41,7 @@ const base_ui_1 = require("@paro.io/base-ui");
 const utils_1 = require("../shared/utils");
 const lab_1 = require("@material-ui/lab");
 const react_hot_toast_1 = require("react-hot-toast");
-const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, currentFeatureStatus, openServiceLinesTemplate, setOpenServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList = [], isInternalProfile = false, updateFreelancerPreferences, getExpertVanityTitles, }) => {
+const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, getRatesByExpertId, updateExpert, openServiceLinesTemplate, setOpenServiceLinesTemplate, getServiceLines, legacyFreelancerId, expertId, isFirmProfile, serviceLineData, selectedServicesList = [], isInternalProfile = false, updateFreelancerPreferences, getExpertVanityTitles, }) => {
     const [selectedServices, dispatch] = (0, react_1.useReducer)(utils_1.selectedServicesReducer, selectedServicesList);
     const [updateClicked, setUpdateClicked] = (0, react_1.useState)(false);
     const [loading, setLoading] = (0, react_1.useState)(false);
@@ -51,9 +51,8 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
     const [titleOptions, setTitleOptions] = (0, react_1.useState)([]);
     const [selectedTitle, setSelectedTitle] = (0, react_1.useState)(null);
     const [customTitle, setCustomTitle] = (0, react_1.useState)(null);
-    const [featureStatus, setCurrentFeatureStatus] = (0, react_1.useState)(currentFeatureStatus);
     const fetchServiceLineData = () => __awaiter(void 0, void 0, void 0, function* () {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
         try {
             setLoading(true);
             if (!isInternalProfile) {
@@ -72,9 +71,8 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
             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;
             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;
             const expertRates = (_j = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.data) === null || _j === void 0 ? void 0 : _j.getRatesByExpertId;
-            setCurrentFeatureStatus((_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.featureStatus);
             setCurrentServiceRate(currentRate);
-            const isTitleExists = (_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.vanityTitle;
+            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;
             isTitleExists ? setSelectedTitle(isTitleExists) : setValue(1);
             dispatch({
                 currentService,
@@ -126,8 +124,7 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
             variables: {
                 expertId: expertId,
                 input: {
-                    vanityTitle: selectedTitle === 'Other' ? customTitle : selectedTitle,
-                    featureStatus: Object.assign({}, featureStatus)
+                    vanityTitle: selectedTitle === 'Other' ? customTitle : selectedTitle
                 }
             },
         }).then(() => {
@@ -176,7 +173,6 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
         }
         finally {
             setOpenServiceLinesTemplate && setOpenServiceLinesTemplate(false);
-            setUpdateClicked(false);
         }
         ;
     });
@@ -185,7 +181,7 @@ const ServiceLinesTemplate = ({ getFreelancerDataResult, createOrUpdateRates, ge
             variables: {
                 expertId: expertId,
                 input: {
-                    featureStatus: Object.assign({ "serviceLines": true }, featureStatus)
+                    featureStatus: { "serviceLines": true }
                 }
             },
         }).then(() => {

package/lib/components/shared/Error.d.ts

@@ -1,6 +1,6 @@
-type SectionContents = {
-    handleClose?: (...args: any) => void;
-    formError?: boolean;
-};
-declare const Error: ({ handleClose }: SectionContents) => JSX.Element;
-export default Error;
+type SectionContents = {
+    handleClose?: (...args: any) => void;
+    formError?: boolean;
+};
+declare const Error: ({ handleClose }: SectionContents) => JSX.Element;
+export default Error;

package/lib/components/shared/Error.js

@@ -1,40 +1,40 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const core_1 = require("@material-ui/core");
-const styled_components_1 = __importDefault(require("styled-components"));
-const colors_1 = __importDefault(require("../shared/constants/colors"));
-const CopyToClipboardAlert_1 = __importDefault(require("./CopyToClipboardAlert"));
-const ErrorBox = (0, styled_components_1.default)(core_1.Box) `
-  width: 100%;
-  padding-bottom: 100;
-`;
-const ParoTitle = (0, styled_components_1.default)(core_1.Box) `
-  color: ${colors_1.default.paroBlack};
-  padding: 0px 0px 18px 0px;
-`;
-const ParoSubtitle = styled_components_1.default.div `
-  color: ${colors_1.default.paroBlack};
-  margin-bottom: 24px;
-  font-size: 1rem;
-`;
-const reloadWindow = () => {
-    window.location.reload();
-};
-const Error = ({ handleClose }) => {
-    const handleCancel = handleClose ? handleClose : reloadWindow;
-    const handleCancelLanguage = handleClose ? 'Close' : 'Retry';
-    return (react_1.default.createElement(ErrorBox, null,
-        react_1.default.createElement(core_1.Box, { display: 'flex', alignContent: 'center', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', padding: '100px 0px 36px 5px;' },
-            react_1.default.createElement(core_1.Typography, { variant: 'h6', gutterBottom: true },
-                react_1.default.createElement(ParoTitle, null, "Oops! We had a misstep.")),
-            react_1.default.createElement(core_1.Typography, { component: 'span', gutterBottom: true },
-                react_1.default.createElement(ParoSubtitle, null, "Contact support if the issue persists")),
-            react_1.default.createElement(core_1.DialogActions, null,
-                react_1.default.createElement(core_1.Button, { variant: 'outlined', onClick: handleCancel, color: 'primary' }, handleCancelLanguage),
-                react_1.default.createElement(CopyToClipboardAlert_1.default, { alertMessage: 'Email address copied to clipboard', button: core_1.Button, buttonContent: 'Copy support email', copyContent: 'people@paro.io', variant: 'contained' })))));
-};
-exports.default = Error;
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const core_1 = require("@material-ui/core");
+const styled_components_1 = __importDefault(require("styled-components"));
+const colors_1 = __importDefault(require("../shared/constants/colors"));
+const CopyToClipboardAlert_1 = __importDefault(require("./CopyToClipboardAlert"));
+const ErrorBox = (0, styled_components_1.default)(core_1.Box) `
+  width: 100%;
+  padding-bottom: 100;
+`;
+const ParoTitle = (0, styled_components_1.default)(core_1.Box) `
+  color: ${colors_1.default.paroBlack};
+  padding: 0px 0px 18px 0px;
+`;
+const ParoSubtitle = styled_components_1.default.div `
+  color: ${colors_1.default.paroBlack};
+  margin-bottom: 24px;
+  font-size: 1rem;
+`;
+const reloadWindow = () => {
+    window.location.reload();
+};
+const Error = ({ handleClose }) => {
+    const handleCancel = handleClose ? handleClose : reloadWindow;
+    const handleCancelLanguage = handleClose ? 'Close' : 'Retry';
+    return (react_1.default.createElement(ErrorBox, null,
+        react_1.default.createElement(core_1.Box, { display: 'flex', alignContent: 'center', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', padding: '100px 0px 36px 5px;' },
+            react_1.default.createElement(core_1.Typography, { variant: 'h6', gutterBottom: true },
+                react_1.default.createElement(ParoTitle, null, "Oops! We had a misstep.")),
+            react_1.default.createElement(core_1.Typography, { component: 'span', gutterBottom: true },
+                react_1.default.createElement(ParoSubtitle, null, "Contact support if the issue persists")),
+            react_1.default.createElement(core_1.DialogActions, null,
+                react_1.default.createElement(core_1.Button, { variant: 'outlined', onClick: handleCancel, color: 'primary' }, handleCancelLanguage),
+                react_1.default.createElement(CopyToClipboardAlert_1.default, { alertMessage: 'Email address copied to clipboard', button: core_1.Button, buttonContent: 'Copy support email', copyContent: 'people@paro.io', variant: 'contained' })))));
+};
+exports.default = Error;

package/lib/components/shared/Image.js

@@ -31,20 +31,20 @@ const react_1 = __importStar(require("react"));
 const core_1 = require("@material-ui/core");
 const styled_components_1 = __importDefault(require("styled-components"));
 const cdn_1 = require("./constants/cdn");
-const ProfilePhotoPreview = styled_components_1.default.img `
-  height: 86px;
-  width: 86px;
-  border: 4px solid #F8FAFC;
-  border-radius: 10px;
-  object-fit: cover;
-  object-position: top;
+const ProfilePhotoPreview = styled_components_1.default.img `
+  height: 86px;
+  width: 86px;
+  border: 4px solid #F8FAFC;
+  border-radius: 10px;
+  object-fit: cover;
+  object-position: top;
 `;
-const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
-  text-decoration: underline;
-  cursor: pointer;
-  :active {
-    text-decoration: none !important;
-  }
+const PhotoChangeButton = (0, styled_components_1.default)(core_1.Typography) `
+  text-decoration: underline;
+  cursor: pointer;
+  :active {
+    text-decoration: none !important;
+  }
 `;
 exports.defaultAvatar = cdn_1.CDN_URL + 'defaultAvatar.png';
 const Image = ({ imageUrl, getUserDocument, uploadUserPhotoMutation, loadingNewImage, imageUpdateError, legacyFreelancerId, }) => {

package/lib/components/shared/ProfileTextField.d.ts

@@ -1,18 +1,18 @@
-import { FieldError } from 'react-hook-form/dist/types/form';
-type SectionContents = {
-    defaultValue?: string | number;
-    error?: boolean;
-    helperText: string | undefined | (FieldError | undefined)[];
-    inputRef?: ((instance: any) => void) | null | undefined;
-    label?: string;
-    multiline?: boolean;
-    name?: string;
-    placeholder?: string;
-    props?: unknown;
-    size?: 'small' | 'medium' | undefined;
-    onChange?: ((value: any) => void) | undefined;
-    width?: boolean;
-    InputProps?: any;
-};
-declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
-export default ProfileTextField;
+import { FieldError } from 'react-hook-form/dist/types/form';
+type SectionContents = {
+    defaultValue?: string | number;
+    error?: boolean;
+    helperText: string | undefined | (FieldError | undefined)[];
+    inputRef?: ((instance: any) => void) | null | undefined;
+    label?: string;
+    multiline?: boolean;
+    name?: string;
+    placeholder?: string;
+    props?: unknown;
+    size?: 'small' | 'medium' | undefined;
+    onChange?: ((value: any) => void) | undefined;
+    width?: boolean;
+    InputProps?: any;
+};
+declare const ProfileTextField: ({ defaultValue, error, helperText, inputRef, label, multiline, name, placeholder, props, size, width, onChange, InputProps }: SectionContents) => JSX.Element;
+export default ProfileTextField;

package/lib/components/shared/ProfileTextField.js

@@ -1,16 +1,16 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
-const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
-    return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
-            shrink: true
-        }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
-        react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
-                shrink: true
-            }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
-};
-exports.default = ProfileTextField;
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const TextField_1 = __importDefault(require("@material-ui/core/TextField"));
+const ProfileTextField = ({ defaultValue, error, helperText, inputRef, label, multiline = false, name, placeholder, props, size, width = false, onChange, InputProps }) => {
+    return (onChange ? react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
+            shrink: true
+        }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined', onChange: onChange, classes: { root: 'inputCurrency' } })) :
+        react_1.default.createElement(TextField_1.default, Object.assign({ InputProps: InputProps, "x-id": 'TextField' }, props, { defaultValue: defaultValue, error: error, fullWidth: true, helperText: helperText, InputLabelProps: {
+                shrink: true
+            }, inputRef: inputRef, label: label, margin: 'normal', multiline: multiline, name: name, placeholder: placeholder, size: size, style: Object.assign({ marginTop: '8px' }, (width && { width: '100%' })), variant: 'outlined' })));
+};
+exports.default = ProfileTextField;

package/lib/components/shared/StyledActionButtons.d.ts

@@ -1,7 +1,7 @@
-declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
-    closeOnClick: () => void;
-    isDisabled: boolean;
-    isLoading: boolean;
-    handleSubmit?: () => void;
-}) => JSX.Element;
-export default StyledActionButtons;
+declare const StyledActionButtons: ({ closeOnClick, isDisabled, isLoading, handleSubmit }: {
+    closeOnClick: () => void;
+    isDisabled: boolean;
+    isLoading: boolean;
+    handleSubmit?: () => void;
+}) => JSX.Element;
+export default StyledActionButtons;

package/lib/components/shared/StyledActionButtons.js

@@ -1,15 +1,15 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const core_1 = require("@material-ui/core");
-const Button_1 = __importDefault(require("@material-ui/core/Button"));
-const Loader_1 = __importDefault(require("./Loader"));
-const StyledActionButtons = ({ closeOnClick, isDisabled, isLoading, handleSubmit }) => {
-    return (react_1.default.createElement(core_1.DialogActions, null,
-        react_1.default.createElement(Button_1.default, { variant: 'outlined', onClick: closeOnClick, color: 'primary' }, "Close"),
-        react_1.default.createElement(Button_1.default, { color: 'default', disabled: isDisabled, key: String(isDisabled), onClick: handleSubmit, variant: 'contained' }, isLoading ? react_1.default.createElement(Loader_1.default, { key: String(isLoading) }) : 'Save')));
-};
-exports.default = StyledActionButtons;
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const core_1 = require("@material-ui/core");
+const Button_1 = __importDefault(require("@material-ui/core/Button"));
+const Loader_1 = __importDefault(require("./Loader"));
+const StyledActionButtons = ({ closeOnClick, isDisabled, isLoading, handleSubmit }) => {
+    return (react_1.default.createElement(core_1.DialogActions, null,
+        react_1.default.createElement(Button_1.default, { variant: 'outlined', onClick: closeOnClick, color: 'primary' }, "Close"),
+        react_1.default.createElement(Button_1.default, { color: 'default', disabled: isDisabled, key: String(isDisabled), onClick: handleSubmit, variant: 'contained' }, isLoading ? react_1.default.createElement(Loader_1.default, { key: String(isLoading) }) : 'Save')));
+};
+exports.default = StyledActionButtons;

package/lib/components/shared/ToastNotification.d.ts

@@ -1,10 +1,10 @@
-import React from 'react';
-interface ToastModalProps {
-    color: 'success' | 'info' | 'warning' | 'danger';
-    icon: string;
-    message: string;
-    duration?: number;
-    position?: 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';
-}
-declare const ToastModal: React.FC<ToastModalProps>;
-export default ToastModal;
+import React from 'react';
+interface ToastModalProps {
+    color: 'success' | 'info' | 'warning' | 'danger';
+    icon: string;
+    message: string;
+    duration?: number;
+    position?: 'top-right' | 'bottom-right' | 'top-left' | 'bottom-left';
+}
+declare const ToastModal: React.FC<ToastModalProps>;
+export default ToastModal;