diff --git a/src-ts/lib/form/form-functions/form.functions.ts b/src-ts/lib/form/form-functions/form.functions.ts index 1c4eaf1a3..0d32fd6de 100644 --- a/src-ts/lib/form/form-functions/form.functions.ts +++ b/src-ts/lib/form/form-functions/form.functions.ts @@ -72,13 +72,13 @@ export async function onSubmitAsync( ): Promise { event.preventDefault() + event.stopPropagation() const { groups, shortName, successMessage }: FormDefinition = formDef const inputs: Array = getFormInputFields(groups || []) // get the dirty fields before we validate b/c validation marks them dirty on submit const dirty: FormInputModel | undefined = inputs?.find(fieldDef => !!fieldDef.dirty) - // if there are any validation errors, display a message and stop submitting // NOTE: need to check this before we check if the form is dirty bc you // could have a form that's not dirty but has errors and you wouldn't diff --git a/src-ts/lib/svgs/icon-wrapper/IconWrapper.module.scss b/src-ts/lib/svgs/icon-wrapper/IconWrapper.module.scss new file mode 100644 index 000000000..432d0158e --- /dev/null +++ b/src-ts/lib/svgs/icon-wrapper/IconWrapper.module.scss @@ -0,0 +1,17 @@ +@import '../../styles/includes'; + +.iconWrapper { + @include icon-mxx; + + margin: 0 $space-lg $space-lg $space-lg; + background: $tc-grad12; + border-radius: $space-xxl; + display: flex; + align-items: center; + justify-content: center; + + svg { + @include icon-xl; + color: $tc-white; + } +} diff --git a/src-ts/lib/svgs/icon-wrapper/IconWrapper.tsx b/src-ts/lib/svgs/icon-wrapper/IconWrapper.tsx new file mode 100644 index 000000000..6c97dd1d2 --- /dev/null +++ b/src-ts/lib/svgs/icon-wrapper/IconWrapper.tsx @@ -0,0 +1,17 @@ +import classNames from 'classnames' +import { FC } from 'react' + +import styles from './IconWrapper.module.scss' + +interface IconWrapperProps { + className?: string + icon: JSX.Element +} + +const IconWrapper: FC = ({ className, icon }: IconWrapperProps) => ( +
+ <>{icon} +
+) + +export default IconWrapper diff --git a/src-ts/lib/svgs/icon-wrapper/index.ts b/src-ts/lib/svgs/icon-wrapper/index.ts new file mode 100644 index 000000000..768299dbd --- /dev/null +++ b/src-ts/lib/svgs/icon-wrapper/index.ts @@ -0,0 +1 @@ +export { default as IconWrapper } from './IconWrapper' diff --git a/src-ts/lib/svgs/index.ts b/src-ts/lib/svgs/index.ts index 55c230790..389ea834b 100644 --- a/src-ts/lib/svgs/index.ts +++ b/src-ts/lib/svgs/index.ts @@ -37,3 +37,4 @@ export { GitlabIcon, GithubIcon } +export * from './icon-wrapper' diff --git a/src-ts/tools/index.ts b/src-ts/tools/index.ts index c4c7be5c9..bf19d7574 100644 --- a/src-ts/tools/index.ts +++ b/src-ts/tools/index.ts @@ -28,4 +28,5 @@ export { WorkTypeCategoryUnknownIcon, WorkTypeConfigs, BugHuntIntakeForm, + bugHuntRoute } from './work' diff --git a/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts b/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts index af613f1b6..5eb4d4556 100644 --- a/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts +++ b/src-ts/tools/work/work-lib/work-provider/work-functions/work-factory/work.factory.ts @@ -548,7 +548,11 @@ function getProgress(challenge: Challenge, workStatus: WorkStatus): WorkProgress name: 'Submitted', }, { - date: getProgressStepDateStart(challenge, [ChallengePhaseName.registration]), + date: getProgressStepDateStart(challenge, [ + ChallengePhaseName.specificationReview, + ChallengePhaseName.specificationSubmission, + ChallengePhaseName.registration, + ]), name: 'Started', }, { @@ -694,7 +698,10 @@ function getTypeCategory(type: WorkType): WorkTypeCategory { case WorkType.designLegacy: return WorkTypeCategory.design - // TOOD: other categories: qa and dev + case WorkType.bugHunt: + return WorkTypeCategory.qa + + // TOOD: other categories: dev default: return WorkTypeCategory.unknown } diff --git a/src-ts/tools/work/work-lib/work-provider/work-functions/work-store/challenge-phase-name.enum.ts b/src-ts/tools/work/work-lib/work-provider/work-functions/work-store/challenge-phase-name.enum.ts index dd3bffc1d..4b4267942 100644 --- a/src-ts/tools/work/work-lib/work-provider/work-functions/work-store/challenge-phase-name.enum.ts +++ b/src-ts/tools/work/work-lib/work-provider/work-functions/work-store/challenge-phase-name.enum.ts @@ -1,4 +1,6 @@ export enum ChallengePhaseName { + specificationReview = 'Specification Review', + specificationSubmission = 'Specification Submission', appeals = 'Appeals', appealsResponse = 'Appeals Response', approval = 'Approval', diff --git a/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx b/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx index b0440119f..500204dfa 100644 --- a/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx +++ b/src-ts/tools/work/work-self-service/intake-forms/bug-hunt/BugHuntIntakeForm.tsx @@ -29,7 +29,7 @@ import { } from '../../../work-lib' import { WorkServicePrice } from '../../../work-service-price' import { WorkTypeBanner } from '../../../work-type-banner' -import { dashboardRoute } from '../../../work.routes' +import { dashboardRoute, selfServiceStartRoute } from '../../../work.routes' import IntakeFormsBreadcrumb from '../intake-forms-breadcrumb/IntakeFormsBreadcrumb' import { BugHuntFormConfig } from './bug-hunt.form.config' @@ -52,7 +52,7 @@ const BugHuntIntakeForm: React.FC = () => { BugHuntFormConfig.buttons.primaryGroup[0].hidden = !isLoggedIn BugHuntFormConfig.buttons.primaryGroup[1].onClick = () => { setAction('submit') } if (BugHuntFormConfig.buttons.secondaryGroup) { - BugHuntFormConfig.buttons.secondaryGroup[0].onClick = () => { navigate(-1) } + BugHuntFormConfig.buttons.secondaryGroup[0].onClick = () => { navigate(selfServiceStartRoute) } } const [challenge, setChallenge]: [Challenge | undefined, Dispatch>] = useState() diff --git a/src-ts/tools/work/work-service-price/WorkServicePrice.module.scss b/src-ts/tools/work/work-service-price/WorkServicePrice.module.scss index d07266f40..71aeb5e19 100644 --- a/src-ts/tools/work/work-service-price/WorkServicePrice.module.scss +++ b/src-ts/tools/work/work-service-price/WorkServicePrice.module.scss @@ -4,20 +4,6 @@ margin-top: $space-xl; - .iconWrapper { - height: 48; - width: 48; - margin: 0 $space-lg $space-lg $space-lg; - background: $tc-grad12; - border-radius: 24px; - - svg { - @include icon-xl; - margin: $space-md; - color: $tc-white; - } - } - .inline { display: flex; flex-direction: row; diff --git a/src-ts/tools/work/work-service-price/WorkServicePrice.tsx b/src-ts/tools/work/work-service-price/WorkServicePrice.tsx index 2082b065f..51ff7fa5e 100644 --- a/src-ts/tools/work/work-service-price/WorkServicePrice.tsx +++ b/src-ts/tools/work/work-service-price/WorkServicePrice.tsx @@ -1,6 +1,6 @@ import { FC } from 'react' -import { IconOutline, textFormatMoneyLocaleString, Tooltip } from '../../../lib' +import { IconOutline, IconWrapper, textFormatMoneyLocaleString, Tooltip } from '../../../lib' import styles from './WorkServicePrice.module.scss' @@ -20,11 +20,9 @@ const ServicePrice: FC = (props: WorkServicePriceProps) = return (
-
- {!!showIcon && !!icon && ( - <>{icon} - )} -
+ {!!showIcon && !!icon && ( + + )}
{!hideTitle && (

diff --git a/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.module.scss b/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.module.scss index 759aff46c..5138e0082 100644 --- a/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.module.scss +++ b/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.module.scss @@ -27,4 +27,13 @@ margin-top: 6px; @include text-clamp(3); } + + .qa-icon { + margin: 0px 12px 0px 0px; + + svg { + min-width: unset; + margin: 0px; + } + } } diff --git a/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.tsx b/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.tsx index e413f74b6..c04f027b9 100644 --- a/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.tsx +++ b/src-ts/tools/work/work-table/work-table-title-renderer/WorkTableTitleRenderer.tsx @@ -1,5 +1,4 @@ -import { FC, SVGProps } from 'react' - +import { IconOutline, IconWrapper } from '../../../../lib' import { Work, WorkTypeCategory, @@ -12,26 +11,35 @@ import styles from './WorkTableTitleRenderer.module.scss' function WorkTableTitleRenderer(data: Work): JSX.Element { - let Icon: FC> + let Icon: JSX.Element switch (data.typeCategory) { case WorkTypeCategory.data: - Icon = WorkTypeCategoryDataIcon + Icon = break case WorkTypeCategory.design: - Icon = WorkTypeCategoryDesignIcon + Icon = break - // TODO: qa and dev work categories + case WorkTypeCategory.qa: + Icon = ( + } + /> + ) + break + + // TODO: dev work categories default: - Icon = WorkTypeCategoryUnknownIcon + Icon = break } return (
- + {Icon}
{data.title} diff --git a/src-ts/tools/work/work.routes.tsx b/src-ts/tools/work/work.routes.tsx index 8f2676974..83cd53e31 100644 --- a/src-ts/tools/work/work.routes.tsx +++ b/src-ts/tools/work/work.routes.tsx @@ -20,6 +20,7 @@ export const rootRoute: string = '/work' export const selfServiceRootRoute: string = '/self-service' export const selfServiceStartRoute: string = `${selfServiceRootRoute}/wizard` export const dashboardRoute: string = `${rootRoute}/dashboard` +export const bugHuntRoute: string = 'bug-hunt/' export function workDashboardRoute(active: string): string { return `${dashboardRoute}/${active}` @@ -82,23 +83,23 @@ export const workRoutes: Array = [ // Bug Hunt { element: , - route: `bug-hunt/basic-info`, + route: `${bugHuntRoute}basic-info`, }, { element: , - route: `bug-hunt/basic-info/:workId`, + route: `${bugHuntRoute}basic-info/:workId`, }, { element: , - route: `bug-hunt/review`, + route: `${bugHuntRoute}review`, }, { element: , - route: `bug-hunt/review/:workId`, + route: `${bugHuntRoute}review/:workId`, }, { element: , - route: `bug-hunt/login-prompt/:retUrl`, + route: `${bugHuntRoute}login-prompt/:retUrl`, }, // General { diff --git a/src/IntakeForm.jsx b/src/IntakeForm.jsx index 7a043f806..b0889c6dd 100644 --- a/src/IntakeForm.jsx +++ b/src/IntakeForm.jsx @@ -1,4 +1,4 @@ -import { useNavigate, Route, Routes } from "react-router-dom"; +import { useNavigate, Route, Routes, useLocation } from "react-router-dom"; import _ from "lodash"; import React, { useContext, useEffect, useState } from "react"; import { useDispatch } from "react-redux"; @@ -28,11 +28,12 @@ import WebsiteDesign from "./routes/Products/WebsiteDesign"; import DataAdvisory from "./routes/Products/DataAdvisory"; import WebsiteDesignLegacy from "./routes/Products/WebsiteDesignLegacy"; -import { profileContext, WorkType } from "../src-ts"; +import { profileContext, WorkType, bugHuntRoute } from "../src-ts"; export default function IntakeForm() { const dispatch = useDispatch(); + const location = useLocation(); const [isLoading, setIsLoading] = useState(false); const navigate = useNavigate() @@ -141,7 +142,8 @@ export default function IntakeForm() { }; const syncSavedData = (savedData) => { - if (!savedData) return; + const isBugHuntRoute = location.pathname.indexOf(`/${bugHuntRoute}`) > -1 + if (!savedData || isBugHuntRoute) return; const { form, progress } = savedData; if (form) dispatch(saveForm(form)); if (progress?.currentStep) {