From 93122c0ce8c185873423ca322721464e541a53ef Mon Sep 17 00:00:00 2001 From: Brooke Date: Mon, 27 Jun 2022 10:28:44 -0700 Subject: [PATCH] PROD-2195 #comment add legacy src; delete test files from /src-ts #time 30m --- babel.config.js | 70 + config/dev.js | 38 + config/index.js | 14 + config/local.js | 3 + config/prod.js | 39 + package.json | 71 +- src-ts/App.test.tsx | 4 - src-ts/header/Header.test.tsx | 6 - src-ts/header/logo/Logo.test.tsx | 11 - .../tool-selectors/ToolSelectors.test.tsx | 6 - .../ToolSelectorsNarrow.test.tsx | 11 - .../ToolSelectorNarrow.test.tsx | 6 - .../ToolSelectorsWide.test.tsx | 6 - .../ToolSelectorWide.test.tsx | 16 - .../ProfileSelector/ProfileSelector.test.tsx | 29 - .../ProfileLoggedIn.test.tsx | 6 - .../profile-panel/ProfilePanel.test.tsx | 14 - .../ProfileNotLoggedIn.test.tsx | 6 - .../UtilitySelectors.test.tsx | 6 - src-ts/lib/avatar/Avatar.test.tsx | 19 - src-ts/lib/button/Button.test.tsx | 6 - src-ts/lib/card/Card.test.tsx | 6 - .../lib/content-layout/ContentLayout.test.tsx | 6 - src-ts/lib/form/Form.test.tsx | 6 - .../lib/form/form-inputs/FormInputs.test.tsx | 6 - .../form-input-row/FormInputRow.test.tsx | 6 - .../form-input/input-text/InputText.test.tsx | 6 - .../input-textarea/InputTextarea.test.tsx | 6 - .../input-wrapper/InputWrapper.test.tsx | 6 - .../analytics.functions.test.ts | 6 - .../component-visible.functions.test.tsx | 6 - .../profile.functions.test.ts | 8 - src-ts/tools/design-lib/DesignLib.test.tsx | 6 - .../tools/design-lib/buttons/Buttons.test.tsx | 6 - src-ts/tools/design-lib/fonts/Fonts.test.tsx | 6 - src-ts/tools/design-lib/home/Home.test.tsx | 6 - src-ts/tools/work/Work.test.tsx | 6 - .../tools/work/dashboard/Dashboard.test.tsx | 6 - .../work/work-intake/WorkIntake.test.tsx | 6 - src-ts/utils/home/Home.test.tsx | 6 - src-ts/utils/settings/Settings.test.tsx | 6 - .../password-reset/PasswordReset.test.tsx | 6 - .../profile-update/ProfileUpdate.test.tsx | 6 - src/App.jsx | 81 + src/IntakeForm.jsx | 223 + src/ScrollToTop.jsx | 6 + src/actions/autoSave.js | 38 + src/actions/challenge.js | 20 + src/actions/form.js | 59 + src/actions/index.js | 15 + src/actions/myWork.js | 34 + src/actions/profile.js | 46 + src/actions/progress.js | 6 + src/actions/work.js | 67 + .../data/spec-templates/data-exploration.json | 4 + .../spec-templates/website-design-legacy.json | 4 + .../data/spec-templates/website-design.json | 4 + src/assets/data/website-design-styles.json | 42 + src/assets/images/add-website-icon.svg | 3 + src/assets/images/arrow-left-turquoise.svg | 3 + src/assets/images/arrow-right.svg | 3 + src/assets/images/check.svg | 3 + src/assets/images/data-advisory-icon.svg | 10 + src/assets/images/data-exploration-icon.svg | 10 + src/assets/images/data-exploration-mobile.png | Bin 0 -> 323951 bytes src/assets/images/data-exploration.png | Bin 0 -> 413662 bytes src/assets/images/design-example-image1.png | Bin 0 -> 13408 bytes src/assets/images/design-example-image2.png | Bin 0 -> 15934 bytes src/assets/images/design-tools.svg | 12 + src/assets/images/eye.svg | 3 + src/assets/images/find-me-data-icon.svg | 10 + src/assets/images/find-me-data-mobile.png | Bin 0 -> 322638 bytes src/assets/images/find-me-data.png | Bin 0 -> 385601 bytes src/assets/images/icon-active-indicator.svg | 3 + src/assets/images/icon-any-font.png | Bin 0 -> 2311 bytes src/assets/images/icon-arrow.svg | 1 + src/assets/images/icon-back-arrow.svg | 3 + src/assets/images/icon-check-thin.svg | 3 + src/assets/images/icon-check.svg | 1 + src/assets/images/icon-close.svg | 3 + src/assets/images/icon-copy-file.svg | 3 + src/assets/images/icon-cross.svg | 16 + .../images/icon-device-computer-active.svg | 4 + src/assets/images/icon-device-computer.svg | 4 + .../images/icon-device-phone-active.svg | 4 + src/assets/images/icon-device-phone.svg | 4 + .../images/icon-device-tablet-active.svg | 7 + src/assets/images/icon-device-tablet.svg | 7 + src/assets/images/icon-hint-green.svg | 3 + src/assets/images/icon-hint.svg | 3 + src/assets/images/icon-my-work-active.svg | 3 + src/assets/images/icon-my-work.svg | 3 + src/assets/images/icon-sans-serif-font.png | Bin 0 -> 3377 bytes src/assets/images/icon-serif-font.png | Bin 0 -> 3557 bytes src/assets/images/icon-star-empty.svg | 10 + src/assets/images/icon-star-filled.svg | 10 + src/assets/images/icon-star.svg | 3 + .../images/icon-three-dots-vertical.svg | 1 + src/assets/images/icon-three-dots.svg | 18 + src/assets/images/icon-warning.svg | 3 + .../images/problem-statement-mobile.png | Bin 0 -> 153308 bytes src/assets/images/problem-statement.png | Bin 0 -> 55775 bytes .../product-main-photos/data-exploration.jpeg | Bin 0 -> 128895 bytes .../product-main-photos/find-me-data.jpeg | Bin 0 -> 100846 bytes .../problem-statements-and-data.jpeg | Bin 0 -> 52168 bytes .../reb-blue-gradient-background.jpeg | Bin 0 -> 81235 bytes .../product-main-photos/web-design.jpeg | Bin 0 -> 96976 bytes .../products/website-design/bold-ragged.png | Bin 0 -> 261275 bytes .../website-design/dark-saturated.png | Bin 0 -> 236756 bytes .../products/website-design/fun-playful.png | Bin 0 -> 120065 bytes .../products/website-design/light-airy.png | Bin 0 -> 105983 bytes .../website-design/mature-serious.png | Bin 0 -> 211867 bytes .../website-design/simple-minimalist.png | Bin 0 -> 54772 bytes .../products/website-design/soft-organic.png | Bin 0 -> 261387 bytes .../website-design/vibrant-colorful.png | Bin 0 -> 208541 bytes src/assets/images/review-and-submit-icon.svg | 4 + src/assets/images/save-for-later-icon.svg | 3 + src/assets/images/save-for-later-icon2.png | Bin 0 -> 3159 bytes src/assets/images/thumbsdown.svg | 4 + src/assets/images/thumbsup.svg | 4 + .../images/website-design-banner-mobile.png | Bin 0 -> 225246 bytes src/assets/images/website-design-v2.png | Bin 0 -> 59273 bytes src/assets/images/website-design.png | Bin 0 -> 580805 bytes src/assets/images/website-design.svg | 18 + src/assets/images/welcome.png | Bin 0 -> 493108 bytes src/assets/pdf/WebDesign-1.pdf | Bin 0 -> 5814738 bytes src/assets/pdf/WebDesign-2.pdf | Bin 0 -> 4807929 bytes src/autoSaveBeforeLogin.js | 176 + .../Banners/FeaturedWorkTypeBanner/index.jsx | 39 + .../FeaturedWorkTypeBanner/styles.module.scss | 270 + .../WebsiteDesignBannerLegacy/index.js | 34 + .../styles.module.scss | 201 + src/components/Button/index.jsx | 76 + src/components/Button/styles.module.scss | 118 + src/components/DateInput/index.jsx | 81 + src/components/DateInput/styles.module.scss | 64 + .../FormElements/FormField/index.jsx | 72 + .../FormElements/FormField/styles.module.scss | 64 + .../FormElements/FormInputCheckbox/index.jsx | 54 + .../FormInputCheckbox/styles.module.scss | 60 + .../FormElements/FormInputNumber/index.jsx | 22 + .../FormInputNumber/styles.module.scss | 25 + .../FormElements/FormInputText/index.jsx | 22 + .../FormInputText/styles.module.scss | 5 + .../FormElements/FormInputTextArea/index.jsx | 22 + .../FormInputTextArea/styles.module.scss | 23 + .../FormElements/FormPasswordField/index.jsx | 38 + .../FormPasswordField/styles.module.scss | 36 + src/components/HelpBanner/index.jsx | 47 + src/components/HelpBanner/styles.module.scss | 75 + src/components/HelpIcon/index.jsx | 36 + src/components/HelpIcon/styles.module.scss | 23 + src/components/Layout/index.jsx | 22 + src/components/LoadingIndicator/index.jsx | 25 + .../LoadingIndicator/styles.module.scss | 3 + src/components/LoadingSpinner/index.jsx | 26 + .../LoadingSpinner/styles.module.scss | 24 + src/components/Modal/PolicyContent/index.jsx | 348 + .../Modal/PolicyContent/styles.module.scss | 40 + src/components/Modal/index.jsx | 64 + src/components/Modal/styles.module.scss | 91 + src/components/Page/index.jsx | 24 + src/components/Page/styles.module.scss | 7 + src/components/PageContent/index.jsx | 23 + src/components/PageContent/styles.module.scss | 11 + src/components/PageDivider/index.jsx | 14 + src/components/PageDivider/styles.module.scss | 7 + .../PageElements/PageCard/index.jsx | 38 + .../PageElements/PageCard/styles.module.scss | 52 + .../PageElements/PageFoot/index.jsx | 26 + .../PageElements/PageFoot/styles.module.scss | 26 + src/components/PageElements/PageH1/index.jsx | 23 + .../PageElements/PageH1/styles.module.scss | 10 + src/components/PageElements/PageH2/index.jsx | 23 + .../PageElements/PageH2/styles.module.scss | 17 + src/components/PageElements/PageH3/index.jsx | 23 + .../PageElements/PageH3/styles.module.scss | 11 + src/components/PageElements/PageP/index.jsx | 23 + .../PageElements/PageP/styles.module.scss | 16 + src/components/PageElements/PageRow/index.jsx | 31 + .../PageElements/PageRow/styles.module.scss | 33 + src/components/PageElements/PageUl/index.jsx | 23 + .../PageElements/PageUl/styles.module.scss | 12 + src/components/PageListInput/index.jsx | 52 + .../PageListInput/styles.module.scss | 27 + src/components/Progress/index.jsx | 72 + src/components/Progress/styles.module.scss | 33 + src/components/ProgressDonutChart/index.jsx | 61 + .../ProgressDonutChart/styles.module.scss | 4 + src/components/ProgressPopup/index.jsx | 96 + .../ProgressPopup/styles.module.scss | 58 + src/components/RadioButton/index.jsx | 98 + src/components/RadioButton/styles.module.scss | 168 + src/components/Rating/index.jsx | 30 + src/components/Rating/styles.module.scss | 15 + src/components/ReactSelect/index.jsx | 123 + src/components/ReactSelect/styles.module.scss | 19 + src/components/ServicePrice/index.jsx | 57 + .../ServicePrice/styles.module.scss | 95 + src/components/Slider/index.jsx | 104 + src/components/Slider/styles.module.scss | 64 + src/components/Slider/styles.scss | 60 + src/components/TabSelector/Tab/index.jsx | 38 + .../TabSelector/Tab/styles.module.scss | 49 + src/components/TabSelector/index.jsx | 37 + src/components/TabSelector/styles.module.scss | 9 + src/constants/countries.json | 245 + src/constants/index.js | 948 +++ src/constants/products/DataAdvisory/index.js | 48 + .../products/DataExploration/index.js | 48 + src/constants/products/FindMeData/index.js | 52 + src/constants/products/WebsiteDesign/index.js | 48 + .../products/WebsiteDesignLegacy/index.js | 166 + src/constants/styles.module.scss | 33 + src/hoc/withAuthentication/actions/index.js | 22 + src/hoc/withAuthentication/index.js | 69 + src/hoc/withAuthentication/reducers/index.js | 48 + src/hoc/withAuthentication/selectors/index.js | 7 + src/hoc/withAuthentication/thunks/index.js | 29 + src/hooks/useCheckMobileScreen.js | 21 + src/hooks/useMatchSomeRoute.js | 26 + src/reducers/autoSave.js | 37 + src/reducers/challenge.js | 23 + src/reducers/form.js | 105 + src/reducers/index.js | 28 + src/reducers/myWork.js | 37 + src/reducers/profile.js | 45 + src/reducers/progress.js | 32 + src/reducers/work.js | 133 + src/root.component.jsx | 61 + .../components/BasicInfoFormLegacy/index.jsx | 136 + .../BasicInfoFormLegacy/styles.module.scss | 38 + .../components/DeviceTypes/index.jsx | 119 + .../components/DeviceTypes/styles.module.scss | 60 + src/routes/BasicInfoLegacy/index.jsx | 241 + src/routes/BasicInfoLegacy/styles.module.scss | 22 + .../components/BrandingForm/index.jsx | 506 ++ .../BrandingForm/styles.module.scss | 82 + .../components/ColorOptions/index.jsx | 73 + .../ColorOptions/styles.module.scss | 90 + .../components/FontOptions/index.jsx | 56 + .../components/FontOptions/styles.module.scss | 36 + src/routes/BrandingLegacy/index.jsx | 186 + src/routes/BrandingLegacy/styles.module.scss | 17 + src/routes/Forum/index.jsx | 36 + src/routes/Forum/styles.module.scss | 6 + src/routes/Home/index.jsx | 87 + src/routes/Home/styles.module.scss | 95 + src/routes/LoginPrompt/index.jsx | 106 + src/routes/LoginPrompt/styles.module.scss | 40 + .../components/PageDetailsForm/index.jsx | 239 + .../PageDetailsForm/styles.module.scss | 68 + src/routes/PageDetailsLegacy/index.jsx | 159 + .../PageDetailsLegacy/styles.module.scss | 17 + src/routes/Products/DataAdvisory/index.jsx | 64 + src/routes/Products/DataExploration/index.jsx | 64 + src/routes/Products/FindMeData/index.jsx | 64 + src/routes/Products/WebsiteDesign/index.jsx | 64 + .../Products/WebsiteDesignLegacy/index.jsx | 34 + .../Products/components/BasicInfo/index.jsx | 331 + .../components/BasicInfo/styles.module.scss | 108 + .../components/BasicInfoForm/index.jsx | 926 +++ .../BasicInfoForm/styles.module.scss | 123 + .../components/StyleOptions/index.jsx | 93 + .../StyleOptions/styles.module.scss | 126 + .../components/StyleOptionsModal/index.jsx | 84 + .../StyleOptionsModal/styles.module.scss | 132 + .../components/AboutYourProject/index.jsx | 43 + .../Review/components/PaymentForm/index.jsx | 201 + .../components/PaymentForm/styles.module.scss | 78 + .../Review/components/ReviewTable/index.jsx | 18 + src/routes/Review/index.jsx | 334 + src/routes/Review/styles.module.scss | 161 + .../components/ReviewTableLegacy/index.jsx | 161 + .../ReviewTableLegacy/styles.module.scss | 76 + src/routes/ReviewLegacy/index.jsx | 328 + src/routes/ReviewLegacy/styles.module.scss | 142 + src/routes/SelectWorkType/index.jsx | 223 + src/routes/SelectWorkType/styles.module.scss | 452 ++ src/routes/ThankYou/index.jsx | 75 + src/routes/ThankYou/styles.module.scss | 26 + src/routes/UnderMaintenance/index.jsx | 31 + .../UnderMaintenance/styles.module.scss | 20 + .../components/WebsitePurposeForm/index.jsx | 183 + .../WebsitePurposeForm/styles.module.scss | 31 + src/routes/WebsitePurposeLegacy/index.jsx | 158 + .../WebsitePurposeLegacy/styles.module.scss | 17 + src/routes/WorkItems/index.jsx | 347 + src/routes/WorkItems/styles.module.scss | 66 + src/selectors/profile.js | 6 + src/services/challenge.js | 145 + src/services/form.js | 27 + src/services/index.js | 15 + src/services/payment.js | 65 + src/services/profile.js | 47 + src/services/requestInterceptor.js | 41 + src/services/work.js | 203 + src/set-public-path.js | 8 + src/store.js | 32 + src/styles/_include.scss | 4 + src/styles/_mixins.scss | 68 + src/styles/_reset.scss | 3 + src/styles/_variables.scss | 46 + src/styles/main.module.scss | 31 + src/styles/main.vendor.scss | 1 + src/thunks/profile.js | 21 + src/topcoder-mfe-customer-work.js | 17 + src/utils/formatters.js | 13 + src/utils/hooks/useTargetSize.js | 34 + src/utils/index.js | 249 + src/utils/products/WebDesignLegacy/index.js | 308 + src/utils/products/index.js | 170 + src/utils/work.js | 61 + start-ssl-bsouza.sh | 15 +- webpack.config.js | 135 + yarn.lock | 6168 ++++++++++++++++- 316 files changed, 23249 insertions(+), 442 deletions(-) create mode 100644 babel.config.js create mode 100644 config/dev.js create mode 100644 config/index.js create mode 100644 config/local.js create mode 100644 config/prod.js delete mode 100644 src-ts/App.test.tsx delete mode 100644 src-ts/header/Header.test.tsx delete mode 100644 src-ts/header/logo/Logo.test.tsx delete mode 100644 src-ts/header/tool-selectors/ToolSelectors.test.tsx delete mode 100644 src-ts/header/tool-selectors/tool-selectors-narrow/ToolSelectorsNarrow.test.tsx delete mode 100644 src-ts/header/tool-selectors/tool-selectors-narrow/tool-selector-narrow/ToolSelectorNarrow.test.tsx delete mode 100644 src-ts/header/tool-selectors/tool-selectors-wide/ToolSelectorsWide.test.tsx delete mode 100644 src-ts/header/tool-selectors/tool-selectors-wide/tool-selector-wide/ToolSelectorWide.test.tsx delete mode 100644 src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/ProfileSelector.test.tsx delete mode 100644 src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/ProfileLoggedIn.test.tsx delete mode 100644 src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/profile-panel/ProfilePanel.test.tsx delete mode 100644 src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-not-logged-in/ProfileNotLoggedIn.test.tsx delete mode 100644 src-ts/header/utility-selectors/UtilitySelectors.test.tsx delete mode 100644 src-ts/lib/avatar/Avatar.test.tsx delete mode 100644 src-ts/lib/button/Button.test.tsx delete mode 100644 src-ts/lib/card/Card.test.tsx delete mode 100644 src-ts/lib/content-layout/ContentLayout.test.tsx delete mode 100644 src-ts/lib/form/Form.test.tsx delete mode 100644 src-ts/lib/form/form-inputs/FormInputs.test.tsx delete mode 100644 src-ts/lib/form/form-inputs/form-input-row/FormInputRow.test.tsx delete mode 100644 src-ts/lib/form/form-inputs/form-input/input-text/InputText.test.tsx delete mode 100644 src-ts/lib/form/form-inputs/form-input/input-textarea/InputTextarea.test.tsx delete mode 100644 src-ts/lib/form/form-inputs/form-input/input-wrapper/InputWrapper.test.tsx delete mode 100644 src-ts/lib/functions/analytics-functions/analytics.functions.test.ts delete mode 100644 src-ts/lib/functions/component-visible-functions/component-visible.functions.test.tsx delete mode 100644 src-ts/lib/profile-provider/profile-functions/profile.functions.test.ts delete mode 100644 src-ts/tools/design-lib/DesignLib.test.tsx delete mode 100644 src-ts/tools/design-lib/buttons/Buttons.test.tsx delete mode 100644 src-ts/tools/design-lib/fonts/Fonts.test.tsx delete mode 100644 src-ts/tools/design-lib/home/Home.test.tsx delete mode 100644 src-ts/tools/work/Work.test.tsx delete mode 100644 src-ts/tools/work/dashboard/Dashboard.test.tsx delete mode 100644 src-ts/tools/work/work-intake/WorkIntake.test.tsx delete mode 100644 src-ts/utils/home/Home.test.tsx delete mode 100644 src-ts/utils/settings/Settings.test.tsx delete mode 100644 src-ts/utils/settings/password-reset/PasswordReset.test.tsx delete mode 100644 src-ts/utils/settings/profile-update/ProfileUpdate.test.tsx create mode 100644 src/App.jsx create mode 100644 src/IntakeForm.jsx create mode 100644 src/ScrollToTop.jsx create mode 100644 src/actions/autoSave.js create mode 100644 src/actions/challenge.js create mode 100644 src/actions/form.js create mode 100644 src/actions/index.js create mode 100644 src/actions/myWork.js create mode 100644 src/actions/profile.js create mode 100644 src/actions/progress.js create mode 100644 src/actions/work.js create mode 100644 src/assets/data/spec-templates/data-exploration.json create mode 100644 src/assets/data/spec-templates/website-design-legacy.json create mode 100644 src/assets/data/spec-templates/website-design.json create mode 100644 src/assets/data/website-design-styles.json create mode 100644 src/assets/images/add-website-icon.svg create mode 100644 src/assets/images/arrow-left-turquoise.svg create mode 100644 src/assets/images/arrow-right.svg create mode 100644 src/assets/images/check.svg create mode 100644 src/assets/images/data-advisory-icon.svg create mode 100644 src/assets/images/data-exploration-icon.svg create mode 100644 src/assets/images/data-exploration-mobile.png create mode 100644 src/assets/images/data-exploration.png create mode 100644 src/assets/images/design-example-image1.png create mode 100644 src/assets/images/design-example-image2.png create mode 100644 src/assets/images/design-tools.svg create mode 100644 src/assets/images/eye.svg create mode 100644 src/assets/images/find-me-data-icon.svg create mode 100644 src/assets/images/find-me-data-mobile.png create mode 100644 src/assets/images/find-me-data.png create mode 100644 src/assets/images/icon-active-indicator.svg create mode 100644 src/assets/images/icon-any-font.png create mode 100644 src/assets/images/icon-arrow.svg create mode 100644 src/assets/images/icon-back-arrow.svg create mode 100644 src/assets/images/icon-check-thin.svg create mode 100644 src/assets/images/icon-check.svg create mode 100644 src/assets/images/icon-close.svg create mode 100644 src/assets/images/icon-copy-file.svg create mode 100644 src/assets/images/icon-cross.svg create mode 100644 src/assets/images/icon-device-computer-active.svg create mode 100644 src/assets/images/icon-device-computer.svg create mode 100644 src/assets/images/icon-device-phone-active.svg create mode 100644 src/assets/images/icon-device-phone.svg create mode 100644 src/assets/images/icon-device-tablet-active.svg create mode 100644 src/assets/images/icon-device-tablet.svg create mode 100644 src/assets/images/icon-hint-green.svg create mode 100644 src/assets/images/icon-hint.svg create mode 100644 src/assets/images/icon-my-work-active.svg create mode 100644 src/assets/images/icon-my-work.svg create mode 100644 src/assets/images/icon-sans-serif-font.png create mode 100644 src/assets/images/icon-serif-font.png create mode 100644 src/assets/images/icon-star-empty.svg create mode 100644 src/assets/images/icon-star-filled.svg create mode 100644 src/assets/images/icon-star.svg create mode 100644 src/assets/images/icon-three-dots-vertical.svg create mode 100644 src/assets/images/icon-three-dots.svg create mode 100644 src/assets/images/icon-warning.svg create mode 100644 src/assets/images/problem-statement-mobile.png create mode 100644 src/assets/images/problem-statement.png create mode 100644 src/assets/images/products/product-main-photos/data-exploration.jpeg create mode 100644 src/assets/images/products/product-main-photos/find-me-data.jpeg create mode 100644 src/assets/images/products/product-main-photos/problem-statements-and-data.jpeg create mode 100644 src/assets/images/products/product-main-photos/reb-blue-gradient-background.jpeg create mode 100644 src/assets/images/products/product-main-photos/web-design.jpeg create mode 100644 src/assets/images/products/website-design/bold-ragged.png create mode 100644 src/assets/images/products/website-design/dark-saturated.png create mode 100644 src/assets/images/products/website-design/fun-playful.png create mode 100644 src/assets/images/products/website-design/light-airy.png create mode 100644 src/assets/images/products/website-design/mature-serious.png create mode 100644 src/assets/images/products/website-design/simple-minimalist.png create mode 100644 src/assets/images/products/website-design/soft-organic.png create mode 100644 src/assets/images/products/website-design/vibrant-colorful.png create mode 100644 src/assets/images/review-and-submit-icon.svg create mode 100644 src/assets/images/save-for-later-icon.svg create mode 100644 src/assets/images/save-for-later-icon2.png create mode 100644 src/assets/images/thumbsdown.svg create mode 100644 src/assets/images/thumbsup.svg create mode 100644 src/assets/images/website-design-banner-mobile.png create mode 100644 src/assets/images/website-design-v2.png create mode 100644 src/assets/images/website-design.png create mode 100644 src/assets/images/website-design.svg create mode 100644 src/assets/images/welcome.png create mode 100644 src/assets/pdf/WebDesign-1.pdf create mode 100644 src/assets/pdf/WebDesign-2.pdf create mode 100644 src/autoSaveBeforeLogin.js create mode 100644 src/components/Banners/FeaturedWorkTypeBanner/index.jsx create mode 100644 src/components/Banners/FeaturedWorkTypeBanner/styles.module.scss create mode 100644 src/components/Banners/WebsiteDesignBannerLegacy/index.js create mode 100644 src/components/Banners/WebsiteDesignBannerLegacy/styles.module.scss create mode 100644 src/components/Button/index.jsx create mode 100644 src/components/Button/styles.module.scss create mode 100644 src/components/DateInput/index.jsx create mode 100644 src/components/DateInput/styles.module.scss create mode 100644 src/components/FormElements/FormField/index.jsx create mode 100644 src/components/FormElements/FormField/styles.module.scss create mode 100644 src/components/FormElements/FormInputCheckbox/index.jsx create mode 100644 src/components/FormElements/FormInputCheckbox/styles.module.scss create mode 100644 src/components/FormElements/FormInputNumber/index.jsx create mode 100644 src/components/FormElements/FormInputNumber/styles.module.scss create mode 100644 src/components/FormElements/FormInputText/index.jsx create mode 100644 src/components/FormElements/FormInputText/styles.module.scss create mode 100644 src/components/FormElements/FormInputTextArea/index.jsx create mode 100644 src/components/FormElements/FormInputTextArea/styles.module.scss create mode 100644 src/components/FormElements/FormPasswordField/index.jsx create mode 100644 src/components/FormElements/FormPasswordField/styles.module.scss create mode 100644 src/components/HelpBanner/index.jsx create mode 100644 src/components/HelpBanner/styles.module.scss create mode 100644 src/components/HelpIcon/index.jsx create mode 100644 src/components/HelpIcon/styles.module.scss create mode 100644 src/components/Layout/index.jsx create mode 100644 src/components/LoadingIndicator/index.jsx create mode 100644 src/components/LoadingIndicator/styles.module.scss create mode 100644 src/components/LoadingSpinner/index.jsx create mode 100644 src/components/LoadingSpinner/styles.module.scss create mode 100644 src/components/Modal/PolicyContent/index.jsx create mode 100644 src/components/Modal/PolicyContent/styles.module.scss create mode 100644 src/components/Modal/index.jsx create mode 100644 src/components/Modal/styles.module.scss create mode 100644 src/components/Page/index.jsx create mode 100644 src/components/Page/styles.module.scss create mode 100644 src/components/PageContent/index.jsx create mode 100644 src/components/PageContent/styles.module.scss create mode 100644 src/components/PageDivider/index.jsx create mode 100644 src/components/PageDivider/styles.module.scss create mode 100644 src/components/PageElements/PageCard/index.jsx create mode 100644 src/components/PageElements/PageCard/styles.module.scss create mode 100644 src/components/PageElements/PageFoot/index.jsx create mode 100644 src/components/PageElements/PageFoot/styles.module.scss create mode 100644 src/components/PageElements/PageH1/index.jsx create mode 100644 src/components/PageElements/PageH1/styles.module.scss create mode 100644 src/components/PageElements/PageH2/index.jsx create mode 100644 src/components/PageElements/PageH2/styles.module.scss create mode 100644 src/components/PageElements/PageH3/index.jsx create mode 100644 src/components/PageElements/PageH3/styles.module.scss create mode 100644 src/components/PageElements/PageP/index.jsx create mode 100644 src/components/PageElements/PageP/styles.module.scss create mode 100644 src/components/PageElements/PageRow/index.jsx create mode 100644 src/components/PageElements/PageRow/styles.module.scss create mode 100644 src/components/PageElements/PageUl/index.jsx create mode 100644 src/components/PageElements/PageUl/styles.module.scss create mode 100644 src/components/PageListInput/index.jsx create mode 100644 src/components/PageListInput/styles.module.scss create mode 100644 src/components/Progress/index.jsx create mode 100644 src/components/Progress/styles.module.scss create mode 100644 src/components/ProgressDonutChart/index.jsx create mode 100644 src/components/ProgressDonutChart/styles.module.scss create mode 100644 src/components/ProgressPopup/index.jsx create mode 100644 src/components/ProgressPopup/styles.module.scss create mode 100644 src/components/RadioButton/index.jsx create mode 100644 src/components/RadioButton/styles.module.scss create mode 100644 src/components/Rating/index.jsx create mode 100644 src/components/Rating/styles.module.scss create mode 100644 src/components/ReactSelect/index.jsx create mode 100644 src/components/ReactSelect/styles.module.scss create mode 100644 src/components/ServicePrice/index.jsx create mode 100644 src/components/ServicePrice/styles.module.scss create mode 100644 src/components/Slider/index.jsx create mode 100644 src/components/Slider/styles.module.scss create mode 100644 src/components/Slider/styles.scss create mode 100644 src/components/TabSelector/Tab/index.jsx create mode 100644 src/components/TabSelector/Tab/styles.module.scss create mode 100644 src/components/TabSelector/index.jsx create mode 100644 src/components/TabSelector/styles.module.scss create mode 100644 src/constants/countries.json create mode 100644 src/constants/index.js create mode 100644 src/constants/products/DataAdvisory/index.js create mode 100644 src/constants/products/DataExploration/index.js create mode 100644 src/constants/products/FindMeData/index.js create mode 100644 src/constants/products/WebsiteDesign/index.js create mode 100644 src/constants/products/WebsiteDesignLegacy/index.js create mode 100644 src/constants/styles.module.scss create mode 100644 src/hoc/withAuthentication/actions/index.js create mode 100644 src/hoc/withAuthentication/index.js create mode 100644 src/hoc/withAuthentication/reducers/index.js create mode 100644 src/hoc/withAuthentication/selectors/index.js create mode 100644 src/hoc/withAuthentication/thunks/index.js create mode 100644 src/hooks/useCheckMobileScreen.js create mode 100644 src/hooks/useMatchSomeRoute.js create mode 100644 src/reducers/autoSave.js create mode 100644 src/reducers/challenge.js create mode 100644 src/reducers/form.js create mode 100644 src/reducers/index.js create mode 100644 src/reducers/myWork.js create mode 100644 src/reducers/profile.js create mode 100644 src/reducers/progress.js create mode 100644 src/reducers/work.js create mode 100644 src/root.component.jsx create mode 100644 src/routes/BasicInfoLegacy/components/BasicInfoFormLegacy/index.jsx create mode 100644 src/routes/BasicInfoLegacy/components/BasicInfoFormLegacy/styles.module.scss create mode 100644 src/routes/BasicInfoLegacy/components/DeviceTypes/index.jsx create mode 100644 src/routes/BasicInfoLegacy/components/DeviceTypes/styles.module.scss create mode 100644 src/routes/BasicInfoLegacy/index.jsx create mode 100644 src/routes/BasicInfoLegacy/styles.module.scss create mode 100644 src/routes/BrandingLegacy/components/BrandingForm/index.jsx create mode 100644 src/routes/BrandingLegacy/components/BrandingForm/styles.module.scss create mode 100644 src/routes/BrandingLegacy/components/ColorOptions/index.jsx create mode 100644 src/routes/BrandingLegacy/components/ColorOptions/styles.module.scss create mode 100644 src/routes/BrandingLegacy/components/FontOptions/index.jsx create mode 100644 src/routes/BrandingLegacy/components/FontOptions/styles.module.scss create mode 100644 src/routes/BrandingLegacy/index.jsx create mode 100644 src/routes/BrandingLegacy/styles.module.scss create mode 100644 src/routes/Forum/index.jsx create mode 100644 src/routes/Forum/styles.module.scss create mode 100644 src/routes/Home/index.jsx create mode 100644 src/routes/Home/styles.module.scss create mode 100644 src/routes/LoginPrompt/index.jsx create mode 100644 src/routes/LoginPrompt/styles.module.scss create mode 100644 src/routes/PageDetailsLegacy/components/PageDetailsForm/index.jsx create mode 100644 src/routes/PageDetailsLegacy/components/PageDetailsForm/styles.module.scss create mode 100644 src/routes/PageDetailsLegacy/index.jsx create mode 100644 src/routes/PageDetailsLegacy/styles.module.scss create mode 100644 src/routes/Products/DataAdvisory/index.jsx create mode 100644 src/routes/Products/DataExploration/index.jsx create mode 100644 src/routes/Products/FindMeData/index.jsx create mode 100644 src/routes/Products/WebsiteDesign/index.jsx create mode 100644 src/routes/Products/WebsiteDesignLegacy/index.jsx create mode 100644 src/routes/Products/components/BasicInfo/index.jsx create mode 100644 src/routes/Products/components/BasicInfo/styles.module.scss create mode 100644 src/routes/Products/components/BasicInfoForm/index.jsx create mode 100644 src/routes/Products/components/BasicInfoForm/styles.module.scss create mode 100644 src/routes/Products/components/StyleOptions/index.jsx create mode 100644 src/routes/Products/components/StyleOptions/styles.module.scss create mode 100644 src/routes/Products/components/StyleOptionsModal/index.jsx create mode 100644 src/routes/Products/components/StyleOptionsModal/styles.module.scss create mode 100644 src/routes/Review/components/AboutYourProject/index.jsx create mode 100644 src/routes/Review/components/PaymentForm/index.jsx create mode 100644 src/routes/Review/components/PaymentForm/styles.module.scss create mode 100644 src/routes/Review/components/ReviewTable/index.jsx create mode 100644 src/routes/Review/index.jsx create mode 100644 src/routes/Review/styles.module.scss create mode 100644 src/routes/ReviewLegacy/components/ReviewTableLegacy/index.jsx create mode 100644 src/routes/ReviewLegacy/components/ReviewTableLegacy/styles.module.scss create mode 100644 src/routes/ReviewLegacy/index.jsx create mode 100644 src/routes/ReviewLegacy/styles.module.scss create mode 100644 src/routes/SelectWorkType/index.jsx create mode 100644 src/routes/SelectWorkType/styles.module.scss create mode 100644 src/routes/ThankYou/index.jsx create mode 100644 src/routes/ThankYou/styles.module.scss create mode 100644 src/routes/UnderMaintenance/index.jsx create mode 100644 src/routes/UnderMaintenance/styles.module.scss create mode 100644 src/routes/WebsitePurposeLegacy/components/WebsitePurposeForm/index.jsx create mode 100644 src/routes/WebsitePurposeLegacy/components/WebsitePurposeForm/styles.module.scss create mode 100644 src/routes/WebsitePurposeLegacy/index.jsx create mode 100644 src/routes/WebsitePurposeLegacy/styles.module.scss create mode 100644 src/routes/WorkItems/index.jsx create mode 100644 src/routes/WorkItems/styles.module.scss create mode 100644 src/selectors/profile.js create mode 100644 src/services/challenge.js create mode 100644 src/services/form.js create mode 100644 src/services/index.js create mode 100644 src/services/payment.js create mode 100644 src/services/profile.js create mode 100644 src/services/requestInterceptor.js create mode 100644 src/services/work.js create mode 100644 src/set-public-path.js create mode 100644 src/store.js create mode 100644 src/styles/_include.scss create mode 100644 src/styles/_mixins.scss create mode 100644 src/styles/_reset.scss create mode 100644 src/styles/_variables.scss create mode 100644 src/styles/main.module.scss create mode 100644 src/styles/main.vendor.scss create mode 100644 src/thunks/profile.js create mode 100644 src/topcoder-mfe-customer-work.js create mode 100644 src/utils/formatters.js create mode 100644 src/utils/hooks/useTargetSize.js create mode 100644 src/utils/index.js create mode 100644 src/utils/products/WebDesignLegacy/index.js create mode 100644 src/utils/products/index.js create mode 100644 src/utils/work.js create mode 100644 webpack.config.js diff --git a/babel.config.js b/babel.config.js new file mode 100644 index 000000000..cd5b145c6 --- /dev/null +++ b/babel.config.js @@ -0,0 +1,70 @@ +module.exports = function (api) { + const isProd = process.env.APPMODE === "production"; + api.cache(!isProd); + + const generateScopedName = isProd + ? "[hash:base64:6]" + : "self_service_[path][name]___[local]___[hash:base64:6]"; + return { + presets: ["@babel/preset-env", "@babel/preset-react"], + plugins: [ + [ + "@babel/plugin-transform-runtime", + { + useESModules: true, + regenerator: false, + }, + ], + [ + "react-css-modules", + { + filetypes: { + ".scss": { + syntax: "postcss-scss", + }, + }, + generateScopedName, + }, + ], + [ + "inline-react-svg", + { + "svgo": { + "plugins": [ + { + "cleanupIDs": false + } + ] + } + } + ], + ], + env: { + test: { + presets: [ + [ + "@babel/preset-env", + { + targets: "current node", + }, + ], + ], + plugins: [ + [ + "module-resolver", + { + alias: { + styles: "./src/styles", + components: "./src/components", + hooks: "./src/hooks", + utils: "./src/utils", + constants: "./src/constants", + services: "./src/services", + }, + }, + ], + ], + }, + }, + }; +}; diff --git a/config/dev.js b/config/dev.js new file mode 100644 index 000000000..99a848249 --- /dev/null +++ b/config/dev.js @@ -0,0 +1,38 @@ +module.exports = { + /** + * URL of Topcoder Community Website + */ + TOPCODER_COMMUNITY_WEBSITE_URL: "https://topcoder-dev.com", + TERMS_URL: + "https://www.topcoder-dev.com/challenges/terms/detail/317cd8f9-d66c-4f2a-8774-63c612d99cd4", + PRIVACY_POLICY_URL: "https://www.topcoder-dev.com/policy", + SIGN_IN_URL: `https://accounts-auth0.topcoder-dev.com/?retUrl=https%3A%2F%2Fplatform.topcoder-dev.com%2Fself-service%2Fwizard®Source=selfService`, + SIGN_UP_URL: `https://accounts-auth0.topcoder-dev.com/?retUrl=https%3A%2F%2Fplatform.topcoder-dev.com%2Fself-service%2Fwizard®Source=selfService&mode=signUp`, + /** + * URL of Topcoder Connect Website + */ + CONNECT_WEBSITE_URL: "https://connect.topcoder-dev.com", + VANILLA_EMBED_JS: "https://vanilla.topcoder-dev.com/js/embed.js", + VANILLA_EMBED_TYPE: "mfe", + VANILLA_FORUM_API: "https://vanilla.topcoder-dev.com/api/v2", + VANILLA_ACCESS_TOKEN: "va.JApNvUOx3549h20I6tnl1kOQDc75NDIp.0jG3dA.EE3gZgV", + + API: { + V5: "https://api.topcoder-dev.com/v5", + V3: "https://api.topcoder-dev.com/v3", + }, + + STRIPE: { + API_KEY: "pk_test_rfcS49MHRVUKomQ9JgSH7Xqz", + API_VERSION: "2020-08-27", + CUSTOMER_TOKEN: + "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlcyI6WyJUb3Bjb2RlciBVc2VyIl0sImlzcyI6Imh0dHBzOi8vYXBpLnRvcGNvZGVyLWRldi5jb20iLCJoYW5kbGUiOiJ0ZXN0MSIsImV4cCI6MjU2MzA3NjY4OSwidXNlcklkIjoiNDAwNTEzMzMiLCJpYXQiOjE0NjMwNzYwODksImVtYWlsIjoidGVzdEB0b3Bjb2Rlci5jb20iLCJqdGkiOiJiMzNiNzdjZC1iNTJlLTQwZmUtODM3ZS1iZWI4ZTBhZTZhNGEifQ.jl6Lp_friVNwEP8nfsfmL-vrQFzOFp2IfM_HC7AwGcg", + ADMIN_TOKEN: + "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlcyI6WyJUb3Bjb2RlciBVc2VyIiwiYWRtaW5pc3RyYXRvciJdLCJpc3MiOiJodHRwczovL2FwaS50b3Bjb2Rlci1kZXYuY29tIiwiaGFuZGxlIjoidGVzdDEiLCJleHAiOjI1NjMwNzY2ODksInVzZXJJZCI6IjQwMDUxMzMzIiwiaWF0IjoxNDYzMDc2MDg5LCJlbWFpbCI6InRlc3RAdG9wY29kZXIuY29tIiwianRpIjoiYjMzYjc3Y2QtYjUyZS00MGZlLTgzN2UtYmViOGUwYWU2YTRhIn0.wKWUe0-SaiFVN-VR_-GwgFlvWaDkSbc8H55ktb9LAVw", + }, + /** + * Expire time period of auto saved intake form: 24 hours + */ + AUTO_SAVED_COOKIE_EXPIRED_IN: 24 * 60, + TIME_ZONE: "Europe/London", +}; diff --git a/config/index.js b/config/index.js new file mode 100644 index 000000000..4cbf464b5 --- /dev/null +++ b/config/index.js @@ -0,0 +1,14 @@ +/* global process */ + +module.exports = (() => { + const env = process.env.APPENV || "dev"; + + console.info(`APPENV: "${env}"`); + + // for security reason don't let to require any arbitrary file defined in process.env + if (["prod", "dev"].indexOf(env) < 0) { + return require("./dev"); + } + + return require("./" + env); +})(); diff --git a/config/local.js b/config/local.js new file mode 100644 index 000000000..7af0bba50 --- /dev/null +++ b/config/local.js @@ -0,0 +1,3 @@ +module.exports = { + COMMUNITY_ADMIN_URL: "", +}; diff --git a/config/prod.js b/config/prod.js new file mode 100644 index 000000000..ff5d082bc --- /dev/null +++ b/config/prod.js @@ -0,0 +1,39 @@ +module.exports = { + /** + * URL of Topcoder Community Website + */ + TOPCODER_COMMUNITY_WEBSITE_URL: "https://topcoder.com", + TERMS_URL: + "https://www.topcoder.com/challenges/terms/detail/564a981e-6840-4a5c-894e-d5ad22e9cd6f", + PRIVACY_POLICY_URL: "https://www.topcoder.com/policy", + SIGN_IN_URL: `https://accounts-auth0.topcoder.com/?retUrl=https%3A%2F%2Fplatform.topcoder.com%2Fself-service%2Fwizard®Source=selfService`, + SIGN_UP_URL: `https://accounts-auth0.topcoder.com/?retUrl=https%3A%2F%2Fplatform.topcoder.com%2Fself-service%2Fwizard®Source=selfService&mode=signUp`, + + /** + * URL of Topcoder Connect Website + */ + CONNECT_WEBSITE_URL: "https://connect.topcoder.com", + VANILLA_EMBED_JS: "https://discussions.topcoder.com/js/embed.js", + VANILLA_EMBED_TYPE: "standard", + VANILLA_FORUM_API: "https://vanilla.topcoder.com/api/v2", + VANILLA_ACCESS_TOKEN: "va.JApNvUOx3549h20I6tnl1kOQDc75NDIp.0jG3dA.EE3gZgV", + + API: { + V5: "https://api.topcoder.com/v5", + V3: "https://api.topcoder.com/v3", + }, + + STRIPE: { + API_KEY: "pk_live_m3bCBVSfkfMOEp3unZFRsHXi", + API_VERSION: "2020-08-27", + CUSTOMER_TOKEN: + "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlcyI6WyJUb3Bjb2RlciBVc2VyIl0sImlzcyI6Imh0dHBzOi8vYXBpLnRvcGNvZGVyLWRldi5jb20iLCJoYW5kbGUiOiJ0ZXN0MSIsImV4cCI6MjU2MzA3NjY4OSwidXNlcklkIjoiNDAwNTEzMzMiLCJpYXQiOjE0NjMwNzYwODksImVtYWlsIjoidGVzdEB0b3Bjb2Rlci5jb20iLCJqdGkiOiJiMzNiNzdjZC1iNTJlLTQwZmUtODM3ZS1iZWI4ZTBhZTZhNGEifQ.jl6Lp_friVNwEP8nfsfmL-vrQFzOFp2IfM_HC7AwGcg", + ADMIN_TOKEN: + "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJyb2xlcyI6WyJUb3Bjb2RlciBVc2VyIiwiYWRtaW5pc3RyYXRvciJdLCJpc3MiOiJodHRwczovL2FwaS50b3Bjb2Rlci1kZXYuY29tIiwiaGFuZGxlIjoidGVzdDEiLCJleHAiOjI1NjMwNzY2ODksInVzZXJJZCI6IjQwMDUxMzMzIiwiaWF0IjoxNDYzMDc2MDg5LCJlbWFpbCI6InRlc3RAdG9wY29kZXIuY29tIiwianRpIjoiYjMzYjc3Y2QtYjUyZS00MGZlLTgzN2UtYmViOGUwYWU2YTRhIn0.wKWUe0-SaiFVN-VR_-GwgFlvWaDkSbc8H55ktb9LAVw", + }, + /** + * Expire time period of auto saved intake form: 24 hours + */ + AUTO_SAVED_COOKIE_EXPIRED_IN: 24 * 60, + TIME_ZONE: "Europe/London", +}; diff --git a/package.json b/package.json index a4abcac26..c07ef512c 100644 --- a/package.json +++ b/package.json @@ -5,6 +5,7 @@ "scripts": { "start": "sh start-ssl.sh", "start:bsouza": "sh start-ssl-bsouza.sh", + "start:mfe": "cross-env webpack-dev-server --port 8519 --host 0.0.0.0", "build": "react-scripts build", "build:dev": "sh build-dev.sh", "build:prod": "sh build-prod.sh", @@ -17,32 +18,98 @@ "dependencies": { "@datadog/browser-logs": "^4.5.0", "@heroicons/react": "^1.0.6", + "@reach/router": "^1.3.4", + "apexcharts": "^3.35.3", "axios": "^0.26.1", "browser-cookies": "^1.2.0", "classnames": "^2.3.1", + "crypto-js": "^4.1.1", + "lodash": "^4.17.21", + "moment": "^2.29.3", + "moment-timezone": "^0.5.34", + "prop-types": "^15.8.1", + "rc-checkbox": "^2.3.2", "react": "^17.0.2", + "react-apexcharts": "^1.4.0", "react-dom": "^17.0.2", + "react-elastic-carousel": "^0.11.5", "react-gtm-module": "^2.0.11", + "react-redux": "^8.0.2", + "react-redux-toastr": "^7.6.8", "react-responsive-modal": "^6.2.0", "react-router-dom": "^6.2.1", "react-scripts": "5.0.0", + "react-select": "^5.3.2", + "react-spinners": "^0.13.1", "react-toastify": "^8.2.0", + "react-tooltip": "^4.2.21", + "redux": "^4.2.0", + "redux-logger": "^3.0.6", + "redux-promise-middleware": "^6.1.2", + "redux-thunk": "^2.4.1", "sass": "^1.49.8", + "styled-components": "^5.3.5", "tc-auth-lib": "topcoder-platform/tc-auth-lib#1.0.3", "typescript": "^4.4.2", + "uuid": "^8.3.2", "web-vitals": "^2.1.0" }, "devDependencies": { + "@babel/core": "^7.7.5", + "@babel/plugin-syntax-jsx": "^7.17.12", + "@babel/plugin-transform-runtime": "^7.8.3", + "@babel/preset-env": "^7.7.6", + "@babel/preset-react": "^7.7.4", + "@babel/preset-typescript": "^7.16.7", + "@babel/runtime": "^7.8.7", + "@stripe/react-stripe-js": "1.7.2", + "@stripe/stripe-js": "1.29.0", "@testing-library/jest-dom": "^5.14.1", "@testing-library/react": "^12.0.0", "@testing-library/user-event": "^13.2.1", "@types/axios": "^0.14.0", "@types/jest": "^27.0.1", + "@types/lodash": "^4.14.182", "@types/node": "^16.7.13", + "@types/reach__router": "^1.3.10", "@types/react": "^17.0.20", "@types/react-dom": "^17.0.9", "@types/react-gtm-module": "^2.0.1", - "@types/react-router-dom": "^5.3.3" + "@types/react-redux-toastr": "^7.6.2", + "@types/react-router-dom": "^5.3.3", + "@types/systemjs": "^6.1.0", + "autoprefixer": "^9.8.6", + "babel-eslint": "^11.0.0-beta.2", + "babel-jest": "^24.9.0", + "babel-plugin-inline-react-svg": "^1.1.2", + "babel-plugin-module-resolver": "^4.0.0", + "babel-plugin-react-css-modules": "^5.2.6", + "concurrently": "^5.0.1", + "config": "^3.3.6", + "cross-env": "^7.0.2", + "eslint": "^6.7.2", + "eslint-config-prettier": "^6.7.0", + "eslint-config-react-important-stuff": "^2.0.0", + "eslint-plugin-prettier": "^3.1.1", + "file-loader": "^6.2.0", + "identity-obj-proxy": "^3.0.0", + "jest": "^25.2.7", + "jest-cli": "^25.2.7", + "postcss-loader": "^4.0.4", + "postcss-scss": "^3.0.2", + "prettier": "^2.0.4", + "pretty-quick": "^2.0.1", + "resolve-url-loader": "^3.1.2", + "sass": "^1.48.0", + "sass-loader": "^10.0.5", + "single-spa-react": "^2.14.0", + "style-loader": "^2.0.0", + "systemjs-webpack-interop": "^2.1.2", + "webpack": "^4.41.2", + "webpack-cli": "^3.3.10", + "webpack-config-single-spa-react": "^1.0.3", + "webpack-dev-server": "^3.9.0", + "webpack-merge": "^4.2.2" }, "eslintConfig": { "extends": [ @@ -66,4 +133,4 @@ ] }, "types": "./types/index.d.ts" -} \ No newline at end of file +} diff --git a/src-ts/App.test.tsx b/src-ts/App.test.tsx deleted file mode 100644 index 112d36d48..000000000 --- a/src-ts/App.test.tsx +++ /dev/null @@ -1,4 +0,0 @@ -describe('', () => { - - test('renders the body of the application', () => {}) -}) diff --git a/src-ts/header/Header.test.tsx b/src-ts/header/Header.test.tsx deleted file mode 100644 index d1922dc20..000000000 --- a/src-ts/header/Header.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe('
', () => { - - test('it should render the header', () => {}) -}) diff --git a/src-ts/header/logo/Logo.test.tsx b/src-ts/header/logo/Logo.test.tsx deleted file mode 100644 index a212db06a..000000000 --- a/src-ts/header/logo/Logo.test.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' is on the home page', () => { - - test('it should only display the logo and should NOT be a link', () => { }) -}) - -describe(' is NOT on the home page', () => { - - test('it should display the logo and have it be a link', () => { }) -}) diff --git a/src-ts/header/tool-selectors/ToolSelectors.test.tsx b/src-ts/header/tool-selectors/ToolSelectors.test.tsx deleted file mode 100644 index 0a8b36550..000000000 --- a/src-ts/header/tool-selectors/ToolSelectors.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe('', () => { - - test('it should render the tool sections', () => { }) -}) diff --git a/src-ts/header/tool-selectors/tool-selectors-narrow/ToolSelectorsNarrow.test.tsx b/src-ts/header/tool-selectors/tool-selectors-narrow/ToolSelectorsNarrow.test.tsx deleted file mode 100644 index f29765cf5..000000000 --- a/src-ts/header/tool-selectors/tool-selectors-narrow/ToolSelectorsNarrow.test.tsx +++ /dev/null @@ -1,11 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' is closed', () => { - - test('it should render the tool-selectors-narrow-closed icon', () => { }) -}) - -describe(' is open', () => { - - test('it should render the tool-selectors-narrow-open icon', () => { }) -}) diff --git a/src-ts/header/tool-selectors/tool-selectors-narrow/tool-selector-narrow/ToolSelectorNarrow.test.tsx b/src-ts/header/tool-selectors/tool-selectors-narrow/tool-selector-narrow/ToolSelectorNarrow.test.tsx deleted file mode 100644 index a80e60ec4..000000000 --- a/src-ts/header/tool-selectors/tool-selectors-narrow/tool-selector-narrow/ToolSelectorNarrow.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' is NOT open', () => { - - test('it should render the tool-selector-narrow icon', () => { }) -}) diff --git a/src-ts/header/tool-selectors/tool-selectors-wide/ToolSelectorsWide.test.tsx b/src-ts/header/tool-selectors/tool-selectors-wide/ToolSelectorsWide.test.tsx deleted file mode 100644 index c17488673..000000000 --- a/src-ts/header/tool-selectors/tool-selectors-wide/ToolSelectorsWide.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe('', () => { - - test('it should render the tool selectors in wide format', () => { }) -}) diff --git a/src-ts/header/tool-selectors/tool-selectors-wide/tool-selector-wide/ToolSelectorWide.test.tsx b/src-ts/header/tool-selectors/tool-selectors-wide/tool-selector-wide/ToolSelectorWide.test.tsx deleted file mode 100644 index a3ec22da7..000000000 --- a/src-ts/header/tool-selectors/tool-selectors-wide/tool-selector-wide/ToolSelectorWide.test.tsx +++ /dev/null @@ -1,16 +0,0 @@ -import '@testing-library/jest-dom' - -describe('', () => { - - test('it should render the tools selector in wide format', () => { }) -}) - -describe(' tool is the currently active tool', () => { - - test('it should render the tools selector active indicator', () => { }) -}) - -describe(' tool is NOT the currently active tool', () => { - - test('it should NOT render the tools selector active indicator', () => { }) -}) diff --git a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/ProfileSelector.test.tsx b/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/ProfileSelector.test.tsx deleted file mode 100644 index ddf29e295..000000000 --- a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/ProfileSelector.test.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' when the props have NOT been initialized', () => { - - test('it should NOT display the ProfileSelector', () => { }) -}) - -describe(' when the props have been initialized', () => { - - test('it should display the ProfileSelector', () => { }) -}) - -describe(' when the props have been initialized and there NOT is a profile', () => { - - test('it should display the login', () => { }) - - test('it should display the signup', () => { }) - - test('it should NOT display the Avatar', () => { }) -}) - -describe(' when the props have been initialized and there is a profile', () => { - - test('it should NOT display the login', () => { }) - - test('it should NOT display the signup', () => { }) - - test('it should display the Avatar', () => { }) -}) diff --git a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/ProfileLoggedIn.test.tsx b/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/ProfileLoggedIn.test.tsx deleted file mode 100644 index ab432ac63..000000000 --- a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/ProfileLoggedIn.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' ', () => { - - test('it should display the ProfileLoggedIn', () => { }) -}) diff --git a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/profile-panel/ProfilePanel.test.tsx b/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/profile-panel/ProfilePanel.test.tsx deleted file mode 100644 index fc87dd23a..000000000 --- a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-logged-in/profile-panel/ProfilePanel.test.tsx +++ /dev/null @@ -1,14 +0,0 @@ -import '@testing-library/jest-dom' - -describe('', () => { - - test('it should display the ProfilePanel', () => { - /* const renderResult: RenderResult = render( - - - - ) - const ProfilePanelElement: HTMLElement | null = renderResult.container.querySelector('.profile-selector') - expect(ProfilePanelElement).toBeNull() */ - }) -}) diff --git a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-not-logged-in/ProfileNotLoggedIn.test.tsx b/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-not-logged-in/ProfileNotLoggedIn.test.tsx deleted file mode 100644 index 1363fa83a..000000000 --- a/src-ts/header/utility-selectors/UtilitySelector/ProfileSelector/profile-not-logged-in/ProfileNotLoggedIn.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' ', () => { - - test('it should display the ProfileNotLoggedIn', () => {}) -}) diff --git a/src-ts/header/utility-selectors/UtilitySelectors.test.tsx b/src-ts/header/utility-selectors/UtilitySelectors.test.tsx deleted file mode 100644 index fa74ea43b..000000000 --- a/src-ts/header/utility-selectors/UtilitySelectors.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe('', () => { - - test('it should display the utility selectors', () => { }) -}) diff --git a/src-ts/lib/avatar/Avatar.test.tsx b/src-ts/lib/avatar/Avatar.test.tsx deleted file mode 100644 index aedefe45f..000000000 --- a/src-ts/lib/avatar/Avatar.test.tsx +++ /dev/null @@ -1,19 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' and there is NOT a profile', () => { - - test('it should NOT display the Avatar', () => {}) -}) - -describe(' and there is a profile', () => { - - test('if there is NO photoURL, firstname, or lastname, it should NOT display the Avatar', () => { }) - - test('if there is a photoURL, it should display the Avatar', () => { }) - - test('if there is a photoURL, it should NOT display the Avatar letters', () => { }) - - test('if there is NOT a photoURL, it should display the Avatar Letters', () => { }) - - test('if there is NOT an avatar URL, it should NOT display the Avatar', () => {}) -}) diff --git a/src-ts/lib/button/Button.test.tsx b/src-ts/lib/button/Button.test.tsx deleted file mode 100644 index 0dae599ff..000000000 --- a/src-ts/lib/button/Button.test.tsx +++ /dev/null @@ -1,6 +0,0 @@ -import '@testing-library/jest-dom' - -describe(' + ); + + return routeTo ? {button} : button; + } +}; + +Button.propTypes = { + children: PT.node, + size: PT.oneOf(Object.values(BUTTON_SIZE)), + type: PT.oneOf(Object.values(BUTTON_TYPE)), + onClick: PT.func, + className: PT.string, + innerRef: PT.func, + disabled: PT.bool, + routeTo: PT.string, + href: PT.string, + isSubmit: PT.bool, +}; + +export default Button; diff --git a/src/components/Button/styles.module.scss b/src/components/Button/styles.module.scss new file mode 100644 index 000000000..3168f947a --- /dev/null +++ b/src/components/Button/styles.module.scss @@ -0,0 +1,118 @@ +@import "styles/include"; + +.button { + @include font-roboto; + background: transparent; + border: 0; + box-sizing: border-box; + cursor: pointer; + align-items: center; + display: flex; + justify-content: center; + margin: 0; + padding: 0; + text-decoration: none; + outline: none; + white-space: nowrap; + + &[disabled] { + cursor: default; + } + + svg { + fill: white; + } +} + +.size-large { + border-radius: 25px; + font-size: 20px; + font-weight: 700; + letter-spacing: 0.8px; + line-height: 46px; + height: 48px; + padding: 18px 30px; + text-transform: uppercase; +} + +.size-medium { + border-radius: 20px; + font-size: 14px; + font-weight: 700; + letter-spacing: 0.8px; + line-height: 38px; + height: 40px; + padding: 0 19px; + text-transform: uppercase; +} + +.size-small { + border-radius: 15px; + font-size: 12px; + font-weight: 700; + line-height: 28px; + letter-spacing: 0.8px; + height: 30px; + padding: 0 14px; + text-transform: uppercase; +} + +.size-tiny { + border-radius: 12px; + padding: 6px 15px; + height: 24px; + font-size: 10px; + font-weight: 700; + line-height: 22px; + letter-spacing: 0.8px; + text-transform: uppercase; +} + +.type-primary { + border: 2px solid $green1; + background-color: $green1; + color: #fff; +} + +.type-warning { + border: 2px solid #ef476f; + background-color: #ef476f; + color: #fff; +} + +.type-secondary { + background-color: #fff; + border: 2px solid $green1; + color: #229174; +} + +.type-secondary[disabled] { + border-color: #b5b5b5; + color: #b5b5b5; +} + +.type-rounded { + position: relative; + width: 22px; + border-radius: 50%; + background-color: #fff; + border: 1px solid $green1; + color: #229174; + + svg { + position: absolute; + left: 37%; + } +} + +.type-rounded[disabled] { + border-radius: 50%; + border-color: #b5b5b5; + color: #b5b5b5; +} + +.type-primary[disabled], +.type-warning[disabled] { + background-color: #b5b5b5; + border-color: #b5b5b5; +} diff --git a/src/components/DateInput/index.jsx b/src/components/DateInput/index.jsx new file mode 100644 index 000000000..e5d93747b --- /dev/null +++ b/src/components/DateInput/index.jsx @@ -0,0 +1,81 @@ +/** + * DateInput + * + * Date Input control. + */ +import React, { createRef, useState } from "react"; +import PT from "prop-types"; +import DatePicker from "react-datepicker"; +import cn from "classnames"; +import "react-datepicker/dist/react-datepicker.css"; +import CalendarIcon from "../../assets/images/icon-calendar.svg"; +import ArrowIcon from "../../assets/images/icon-arrow.svg"; +import styles from "./styles.module.scss"; +import moment from "moment"; + +const DateInput = (props) => { + const [open, setOpen] = useState(false); + const calendarRef = createRef(); + return ( +
+
calendarRef.current.setOpen(true)} + styleName={cn("styles.icon", "styles.icon-calendar")} + role="button" + tabIndex={0} + > + +
+ { + setOpen(false); + }} + onFocus={props.onFocus} + showYearDropdown + onCalendarOpen={() => setOpen(true)} + maxDate={ + props.allowFutureDate ? null : moment().subtract(1, "days").toDate() + } + disabled={props.disabled} + /> +
calendarRef.current.setOpen(true)} + role="button" + tabIndex={0} + > + +
+
+ ); +}; + +DateInput.propTypes = { + value: PT.string, + onChange: PT.func.isRequired, + placeholder: PT.string, + onBlur: PT.func, + onFocus: PT.func, + className: PT.string, + style2: PT.bool, + disabled: PT.bool, + allowFutureDate: PT.bool, +}; + +export default DateInput; diff --git a/src/components/DateInput/styles.module.scss b/src/components/DateInput/styles.module.scss new file mode 100644 index 000000000..6949cde2a --- /dev/null +++ b/src/components/DateInput/styles.module.scss @@ -0,0 +1,64 @@ +@import "styles/include"; + +.datepicker-wrapper { + position: relative; + padding: 0 10px; + .icon { + position: absolute; + display: flex; + padding: 8px 0 8px 4px; + align-items: center; + & > svg { + width: 20px; + height: 20px; + } + } + .icon-calendar { + left: 8px; + cursor: pointer; + } + + .icon-arrow { + right: 8px; + top: 0; + & > svg { + color: hsl(0, 0%, 80%); + } + &:hover { + & > svg { + color: hsl(0, 0%, 60%); + } + } + &.icon-arrow-open { + & > svg { + color: hsl(0, 0%, 40%); + } + } + } + + &.error { + input { + border-color: #fe665d; + } + } + + & > div:nth-child(2) { + margin-left: 24px; + } + + &.style2 input { + border: none !important; + box-shadow: none !important; + margin-bottom: 0 !important; + font-size: 18px; + &::placeholder { + color: #aaa; + font-size: 18px; + text-transform: none !important; + } + } +} + +.datepicker-wrapper > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) { + z-index: 100; +} diff --git a/src/components/FormElements/FormField/index.jsx b/src/components/FormElements/FormField/index.jsx new file mode 100644 index 000000000..1c00cab13 --- /dev/null +++ b/src/components/FormElements/FormField/index.jsx @@ -0,0 +1,72 @@ +/** + * FormField + * + * A Form Field Is a wrapper for input to add the label to it + */ +import cn from "classnames"; +import PT from "prop-types"; +import React from "react"; +import "./styles.module.scss"; + +const FormField = ({ + children, + label = "", + placeholder = "", + onChange = (f) => f, + className, + styleName, + disabled, + helperText, + ...props +}) => { + const handleClick = (e) => { + // focus on input label click + const inputElement = e.target.closest(".form-field").querySelector("input"); + inputElement && inputElement.focus(); + }; + return ( +
+
+
+ {label} +
+ {children} +
+ {helperText &&
{helperText}
} + +
+ {props.error} +
+
+ ); +}; + +FormField.propTypes = { + onChange: PT.func, + label: PT.string, + placeholder: PT.string, + children: PT.node, + error: PT.string, +}; + +export default FormField; diff --git a/src/components/FormElements/FormField/styles.module.scss b/src/components/FormElements/FormField/styles.module.scss new file mode 100644 index 000000000..3547a2ae8 --- /dev/null +++ b/src/components/FormElements/FormField/styles.module.scss @@ -0,0 +1,64 @@ +@import "styles/include"; + +.form-field-wrapper { + position: relative; + display: flex; + flex-direction: column; + justify-content: flex-start; + margin-bottom: 18px; + @include mobile { + margin-bottom: 0px; + } + + &.helper { + margin-bottom: 35px !important; + } + + .form-field { + border: 1px solid #b7b7b7; + border-radius: 4px; + background: white; + padding-top: 24px; + margin-bottom: 10px; + + &.disabled { + background-color: $grey-bg !important; + } + + .label { + position: absolute; + top: 5px; + left: 15px; + color: $green1; + font-size: 13px; + } + + > div { + border-radius: 4px; + } + } + .error { + color: $red; + } + + .helperText { + @include font-roboto; + font-weight: 400; + font-size: 12px; + line-height: 14px; + color: #555; + margin-top: -6px; + } +} + +.labelStyle { + font-size: 11px !important; + margin-top: 10px; + left: 10px !important; + top: 8px !important; +} + +.formTitleStyle { + margin-top: 12px !important; + padding-top: 0 !important; +} diff --git a/src/components/FormElements/FormInputCheckbox/index.jsx b/src/components/FormElements/FormInputCheckbox/index.jsx new file mode 100644 index 000000000..7e5843a0a --- /dev/null +++ b/src/components/FormElements/FormInputCheckbox/index.jsx @@ -0,0 +1,54 @@ +/* eslint-disable jsx-a11y/label-has-associated-control */ +/** + * FormInputCheckbox + * + * Form Input Checkbox + */ +import cn from "classnames"; +import PT from "prop-types"; +import Checkbox from "rc-checkbox"; +import "rc-checkbox/assets/index.css"; +import React from "react"; +import styles from "./styles.module.scss"; + +const FormInputCheckbox = ({ + label, + additionalContent, + onChange = (f) => f, + styleName, + inline, + ...props +}) => { + return inline ? ( +
+ +
+ ) : ( + // eslint-disable-next-line jsx-a11y/label-has-associated-control + + ); +}; + +FormInputCheckbox.propTypes = { + label: PT.string, +}; + +export default FormInputCheckbox; diff --git a/src/components/FormElements/FormInputCheckbox/styles.module.scss b/src/components/FormElements/FormInputCheckbox/styles.module.scss new file mode 100644 index 000000000..da8a7afdb --- /dev/null +++ b/src/components/FormElements/FormInputCheckbox/styles.module.scss @@ -0,0 +1,60 @@ +@import "styles/include"; + +.form-input-checkbox { + display: flex; + align-items: center; + + .label { + @include font-roboto; + font-size: 14px; + line-height: 18px; + margin-left: 8px; + font-weight: normal; + + span { + text-decoration: underline; + color: $link-blue; + cursor: pointer; + } + } +} + +/* rc checkbox custom style */ +:global { + .rc-checkbox.form-input-rc-checkbox { + display: flex; + + .rc-checkbox-inner { + width: 20px !important; + height: 20px !important; + + &:hover { + border-color: $green1; + } + } + + .rc-checkbox-inner:after { + left: 6px !important; + top: 0 !important; + width: 7px !important; + height: 14px !important; + } + + + } + + .rc-checkbox.form-input-rc-checkbox.rc-checkbox-checked { + .rc-checkbox-inner { + background-color: $green1; + border-color: $green1; + } + } +} + +.inline { + display: inline-block; + .span { + color: $link-blue; + text-decoration: underline; + } +} diff --git a/src/components/FormElements/FormInputNumber/index.jsx b/src/components/FormElements/FormInputNumber/index.jsx new file mode 100644 index 000000000..253380384 --- /dev/null +++ b/src/components/FormElements/FormInputNumber/index.jsx @@ -0,0 +1,22 @@ +/** + * FormInputNumber + * + * Form Input Type=text + */ +import cn from "classnames"; +import React from "react"; +import "./styles.module.scss"; + +const FormInputNumber = ({ styleName, ...props }) => { + return ( + + ); +}; + +FormInputNumber.propTypes = {}; + +export default FormInputNumber; diff --git a/src/components/FormElements/FormInputNumber/styles.module.scss b/src/components/FormElements/FormInputNumber/styles.module.scss new file mode 100644 index 000000000..2724e6ac4 --- /dev/null +++ b/src/components/FormElements/FormInputNumber/styles.module.scss @@ -0,0 +1,25 @@ +@import "styles/include"; + +.form-input-number { + background-color: #ffffff !important; + box-sizing: border-box !important; + color: #444 !important; + font-size: 18px !important; + height: 32px !important; + outline: none !important; + border: 0 !important; + padding: 0 15px !important; + width: 100% !important; + &::placeholder { + color: #aaaaaa !important; + font-size: 18px !important; + text-transform: none !important; + } + &:focus { + box-shadow: none !important; + } + + &:disabled { + background-color: $grey-bg !important; + } +} diff --git a/src/components/FormElements/FormInputText/index.jsx b/src/components/FormElements/FormInputText/index.jsx new file mode 100644 index 000000000..47bfa8d02 --- /dev/null +++ b/src/components/FormElements/FormInputText/index.jsx @@ -0,0 +1,22 @@ +/** + * FormInputText + * + * Form Input Type=text + */ +import cn from "classnames"; +import React from "react"; +import "./styles.module.scss"; + +const FormInputText = ({ styleName, ...props }) => { + return ( + + ); +}; + +FormInputText.propTypes = {}; + +export default FormInputText; diff --git a/src/components/FormElements/FormInputText/styles.module.scss b/src/components/FormElements/FormInputText/styles.module.scss new file mode 100644 index 000000000..6a5264f42 --- /dev/null +++ b/src/components/FormElements/FormInputText/styles.module.scss @@ -0,0 +1,5 @@ +@import "styles/include"; + +.form-input-text { + @include formInputText; +} diff --git a/src/components/FormElements/FormInputTextArea/index.jsx b/src/components/FormElements/FormInputTextArea/index.jsx new file mode 100644 index 000000000..8d9f65f9e --- /dev/null +++ b/src/components/FormElements/FormInputTextArea/index.jsx @@ -0,0 +1,22 @@ +/** + * FormInputTextArea + * + * Form Input textarea + */ +import cn from "classnames"; +import React from "react"; +import "./styles.module.scss"; + +const FormInputTextArea = ({ styleName, ...props }) => { + return ( +