Merge pull request #605 from topcoder-platform/rc-3.1

v3.1 TCA April release

Author: testflyjets

.circleci/config.yml

@@ -129,13 +129,13 @@ deploy_steps: &deploy_steps
           ./master_deploy.sh -d CFRONT -e $DEPLOY_ENV -c $ENABLE_CACHE
 
 jobs:
-  # lint-dev:
-  #   <<: *defaults
-  #   environment:
-  #     DEPLOY_ENV: "DEV"
-  #     LOGICAL_ENV: "dev"
-  #     APPNAME: "platform-ui-mvp"
-  #   steps: *lint_steps
+  lint-dev:
+    <<: *defaults
+    environment:
+      DEPLOY_ENV: "DEV"
+      LOGICAL_ENV: "dev"
+      APPNAME: "platform-ui-mvp"
+    steps: *lint_steps
 
   # lint-prod:
   #   <<: *defaults
@@ -144,7 +144,7 @@ jobs:
   #     LOGICAL_ENV: "prod"
   #     APPNAME: "platform-ui-mvp"
   #   steps: *lint_steps
-    
+
   build-dev:
     <<: *defaults
     environment:
@@ -160,7 +160,7 @@ jobs:
       LOGICAL_ENV: "prod"
       APPNAME: "platform-ui-mvp"
     steps: *build_steps
-  
+
   test-dev:
     <<: *test_defaults
     environment:
@@ -192,12 +192,12 @@ workflows:
   version: 2
   build:
     jobs:
-      # - lint-dev:
-      #     context : org-global
-      #     filters:
-      #       branches:
-      #         ignore:
-      #           - master
+      - lint-dev:
+          context : org-global
+          filters:
+            branches:
+              ignore:
+                - master
 
       # - lint-prod:
       #     context : org-global
@@ -224,7 +224,7 @@ workflows:
           context : org-global
           requires:
             - build-dev
-          filters: 
+          filters:
             branches:
               only:
                 - dev

.editorconfig

@@ -0,0 +1,12 @@
+# EditorConfig is awesome: https://EditorConfig.org
+
+# top-most EditorConfig file
+root = true
+
+[*]
+indent_style = space
+indent_size = 4
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true

.gitignore

@@ -26,6 +26,3 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-
-# Editors
-.editorconfig

package.json

@@ -26,6 +26,7 @@
         "@sprig-technologies/sprig-browser": "^2.20.1",
         "@stripe/react-stripe-js": "1.13.0",
         "@stripe/stripe-js": "1.41.0",
+        "@types/testing-library__jest-dom": "^5.14.5",
         "apexcharts": "^3.36.0",
         "axios": "^1.1.2",
         "browser-cookies": "^1.2.0",
@@ -52,6 +53,7 @@
         "react-dom": "^18.2.0",
         "react-elastic-carousel": "^0.11.5",
         "react-gtm-module": "^2.0.11",
+        "react-helmet": "^6.1.0",
         "react-redux": "^8.0.4",
         "react-redux-toastr": "^7.6.10",
         "react-responsive-modal": "^6.2.0",
@@ -99,6 +101,7 @@
         "@types/react": "^18.0.21",
         "@types/react-dom": "^18.0.6",
         "@types/react-gtm-module": "^2.0.1",
+        "@types/react-helmet": "^6.1.6",
         "@types/react-redux-toastr": "^7.6.2",
         "@types/react-router-dom": "^5.3.3",
         "@types/sanitize-html": "^2.6.2",
@@ -126,10 +129,10 @@
         "eslint-plugin-cypress": "^2.12.1",
         "eslint-plugin-import": "^2.25.3",
         "eslint-plugin-jsx-a11y": "^6.5.1",
-        "eslint-plugin-no-null": "^1.0.2",
         "eslint-plugin-ordered-imports": "^0.6.0",
         "eslint-plugin-react": "^7.28.0",
         "eslint-plugin-react-hooks": "^4.3.0",
+        "eslint-plugin-unicorn": "^46.0.0",
         "file-loader": "^6.2.0",
         "husky": "^8.0.1",
         "identity-obj-proxy": "^3.0.0",
@@ -154,15 +157,6 @@
         "webpack-dev-server": "^4.11.1",
         "webpack-merge": "^5.8.0"
     },
-    "eslintConfig": {
-        "extends": [
-            "react-app",
-            "react-app/jest"
-        ],
-        "rules": {
-            "no-useless-escape": 0
-        }
-    },
     "browserslist": {
         "production": [
             ">0.2%",

src-ts/.eslintrc.js

@@ -21,7 +21,7 @@ module.exports = {
     },
     plugins: [
         '@typescript-eslint',
-        'no-null',
+        'unicorn',
         'ordered-imports',
         'react',
         'react-hooks'
@@ -35,6 +35,7 @@ module.exports = {
         }
     },
     rules: {
+        '@typescript-eslint/ban-ts-comment': 'off',
         '@typescript-eslint/ban-types': [
             'error',
             {
@@ -50,7 +51,7 @@ module.exports = {
                 allowExpressions: true
             }
         ],
-        '@typescript-eslint/no-explicit-any': 'error',
+        '@typescript-eslint/no-explicit-any': 'off',
         '@typescript-eslint/no-inferrable-types': 'off',
         '@typescript-eslint/no-shadow': 'error',
         '@typescript-eslint/no-unused-vars': 'error',
@@ -89,9 +90,10 @@ module.exports = {
             'error',
             'prefer-single'
         ],
-        'jsx-a11y/click-events-have-key-events': 'warn',
-        'jsx-a11y/no-noninteractive-element-interactions': 'warn',
-        'jsx-a11y/no-static-element-interactions': 'warn',
+        'jsx-a11y/click-events-have-key-events': 'off',
+        'jsx-a11y/no-noninteractive-element-interactions': 'off',
+        'jsx-a11y/no-static-element-interactions': 'off',
+        'jsx-a11y/label-has-associated-control': 'off',
         'jsx-a11y/tabindex-no-positive': [
             'warn'
         ],
@@ -107,7 +109,6 @@ module.exports = {
         ],
         'no-extra-boolean-cast': 'off',
         'no-nested-ternary': 'off',
-        'no-null/no-null': 'error',
         'no-param-reassign': [
             'error',
             {
@@ -181,6 +182,7 @@ module.exports = {
                 ],
             },
         ],
+        'no-empty': ["error", { "allowEmptyCatch": true }],
         'padded-blocks': 'off',
         'padding-line-between-statements': [
             'error',
@@ -263,12 +265,14 @@ module.exports = {
         'react/jsx-props-no-spreading': [
             0
         ],
+        'react/no-danger': 'off',
         'react/react-in-jsx-scope': 'off',
         'react/require-default-props': 'off',
         'semi': [
             'error',
             'never',
         ],
-        'sort-keys': 'error'
+        'sort-keys': 'error',
+        'unicorn/no-null': 'error'
     },
 };

src-ts/config/environments/environment.default.config.ts

@@ -13,6 +13,7 @@ export const EnvironmentConfigDefault: EnvironmentConfigModel = {
         FORUM_ACCESS_TOKEN: 'va.JApNvUOx3549h20I6tnl1kOQDc75NDIp.0jG3dA.EE3gZgV',
         FORUM_V2: 'https://vanilla.topcoder-dev.com/api/v2',
         V3: 'https://api.topcoder-dev.com/v3',
+        V4: 'https://api.topcoder-dev.com/v4',
         V5: 'https://api.topcoder-dev.com/v5',
     },
     AUTH: {
@@ -23,6 +24,8 @@ export const EnvironmentConfigDefault: EnvironmentConfigModel = {
         PUBLIC_TOKEN: 'puba0825671e469d16f940c5a30dc738f11',
         SERVICE: 'platform-ui',
     },
+    MEMBER_VERIFY_LOOKER: 3322,
+    REACT_APP_ENABLE_TCA_CERT_MONETIZATION: process.env.REACT_APP_ENABLE_TCA_CERT_MONETIZATION as unknown as boolean || false,
     REAUTH_OFFSET: 55,
     SPRIG: {
         ENVIRONMENT_ID: 'bUcousVQ0-yF',

src-ts/config/environments/environment.prod.config.ts

@@ -15,6 +15,7 @@ export const EnvironmentConfigProd: EnvironmentConfigModel = {
         FORUM_ACCESS_TOKEN: EnvironmentConfigDefault.API.FORUM_ACCESS_TOKEN,
         FORUM_V2: 'https://discussions.topcoder.com/api/v2',
         V3: 'https://api.topcoder.com/v3',
+        V4: 'https://api.topcoder.com/v4',
         V5: 'https://api.topcoder.com/v5',
     },
     AUTH: {

src-ts/header/Header.tsx

@@ -90,6 +90,9 @@ const Header: FC = () => {
             navElementId,
             {
                 handleNavigation: navigationHandler,
+                integrations: {
+                    sprig: 'disable',
+                },
                 onReady() { setReady(true) },
                 signIn() { window.location.href = authUrlLogin() },
                 signOut() { window.location.href = authUrlLogout },

src-ts/lib/breadcrumb/Breadcrumb.module.scss

@@ -40,8 +40,8 @@
             padding: 0;
             @include ltesm {
                 flex: 0 1 auto;
-                &:first-child {
-                    flex: 1 0 auto;
+                &:first-child:not(:global(.elipsis)) {
+                    flex: 1 0 0;
                 }
             }
             a {

src-ts/lib/breadcrumb/Breadcrumb.tsx

@@ -28,6 +28,7 @@ const Breadcrumb: FC<BreadcrumbProps> = (props: BreadcrumbProps) => {
                                     <BreadcrumbItem
                                         index={index + 1}
                                         item={item}
+                                        // eslint-disable-next-line react/no-array-index-key
                                         key={index}
                                     />
                                 ))
@@ -63,6 +64,7 @@ const Breadcrumb: FC<BreadcrumbProps> = (props: BreadcrumbProps) => {
                             <BreadcrumbItem
                                 index={index + 1}
                                 item={item}
+                                // eslint-disable-next-line react/no-array-index-key
                                 key={index}
                             />
                         ))}

src-ts/lib/breadcrumb/breadcrumb-item/BreadcrumbItem.tsx

@@ -1,5 +1,6 @@
 import { FC } from 'react'
 import { Link } from 'react-router-dom'
+import classNames from 'classnames'
 
 import styles from '../Breadcrumb.module.scss'
 
@@ -19,10 +20,11 @@ const BreadcrumbItem: FC<BreadcrumbItemProps> = (props: BreadcrumbItemProps) =>
     return (
         <li
             key={props.index}
-            onClick={() => onClick()}
+            onClick={onClick}
+            className={props.item.isElipsis ? 'elipsis' : ''}
         >
             <Link
-                className={props.item.isElipsis && styles.elipsis}
+                className={classNames(props.item.isElipsis && styles.elipsis)}
                 to={props.item.url}
             >
                 {props.item.name}

src-ts/lib/button/Button.tsx

@@ -24,6 +24,7 @@ export interface ButtonProps {
     readonly onClick?: (event?: any) => void
     readonly rel?: string
     readonly route?: string
+    readonly routeState?: Record<string, any>
     readonly size?: ButtonSize
     readonly tabIndex?: number
     readonly target?: string
@@ -70,6 +71,7 @@ const Button: FC<ButtonProps> = (props: ButtonProps) => {
                 tabIndex={props.tabIndex}
                 title={props.title}
                 to={props.route}
+                state={props.routeState}
             >
                 {content}
             </Link>

src-ts/lib/contact-support-form/ContactSupportForm.tsx

@@ -1,6 +1,7 @@
 import { Dispatch, FC, SetStateAction, useCallback, useContext, useEffect, useState } from 'react'
 
 import { Form, FormDefinition, formGetInputModel, FormInputModel } from '../form'
+import { FormValue } from '../form/form-functions'
 import { LoadingSpinner } from '../loading-spinner'
 import { profileContext, ProfileContextData } from '../profile-provider'
 
@@ -27,13 +28,13 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
 
     useEffect(() => {
         if (!loading && saveOnSuccess) {
-            props.onSave()
+            props.onSave.call(undefined)
         }
     }, [loading, saveOnSuccess, props.onSave])
 
-    const generateRequest: (inputs: ReadonlyArray<FormInputModel>) => void = useCallback((
+    const generateRequest: (inputs: ReadonlyArray<FormInputModel>) => FormValue = useCallback((
         inputs: ReadonlyArray<FormInputModel>,
-    ): ContactSupportRequest => {
+    ): FormValue => {
         const firstName: string
             = formGetInputModel(inputs, ContactSupportFormField.first).value as string
         const lastName: string
@@ -50,12 +51,12 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
             lastName,
             question,
         }
-    }, [props.workId])
+    }, [props.isSelfService, props.workId])
 
-    const saveAsync: (request: ContactSupportRequest) => Promise<void>
-        = useCallback(async (request: ContactSupportRequest): Promise<void> => {
+    const saveAsync: (request: FormValue) => Promise<void>
+        = useCallback(async (request: FormValue): Promise<void> => {
             setLoading(true)
-            return contactSupportSubmitRequestAsync(request)
+            return contactSupportSubmitRequestAsync(request as unknown as ContactSupportRequest)
                 .then(() => {
                     setSaveOnSuccess(true)
                 })
@@ -92,7 +93,7 @@ const ContactSupportForm: FC<ContactSupportFormProps> = (props: ContactSupportFo
 
             <Form
                 formDef={props.formDef}
-                formValues={profile}
+                formValues={profile as unknown as FormValue}
                 requestGenerator={generateRequest}
                 save={saveAsync}
             />