From 8250d89821b11608780b14c102c6bce84ae38f1d Mon Sep 17 00:00:00 2001 From: Kiril Kartunov Date: Thu, 20 Jul 2023 03:37:28 +0300 Subject: [PATCH 1/4] MP-168 updated for self editing view --- .../src/member-profile/links/MemberLinks.tsx | 2 +- .../HowSkillsWorkModal/HowSkillsWorkModal.tsx | 41 +++++++++++++++++-- .../skills/MemberSkillsInfo.tsx | 1 + 3 files changed, 40 insertions(+), 4 deletions(-) diff --git a/src/apps/profiles/src/member-profile/links/MemberLinks.tsx b/src/apps/profiles/src/member-profile/links/MemberLinks.tsx index 2dfd226e8..81d450f4e 100644 --- a/src/apps/profiles/src/member-profile/links/MemberLinks.tsx +++ b/src/apps/profiles/src/member-profile/links/MemberLinks.tsx @@ -83,7 +83,7 @@ const MemberLinks: FC = (props: MemberLinksProps) => { }, 1000) } - return !loading && (canEdit || memberLinks?.links) ? ( + return !loading && (canEdit || memberLinks?.links?.length) ? (

Links

diff --git a/src/apps/profiles/src/member-profile/skills/HowSkillsWorkModal/HowSkillsWorkModal.tsx b/src/apps/profiles/src/member-profile/skills/HowSkillsWorkModal/HowSkillsWorkModal.tsx index 62f781d26..847f3c82c 100644 --- a/src/apps/profiles/src/member-profile/skills/HowSkillsWorkModal/HowSkillsWorkModal.tsx +++ b/src/apps/profiles/src/member-profile/skills/HowSkillsWorkModal/HowSkillsWorkModal.tsx @@ -7,17 +7,48 @@ import styles from './HowSkillsWorkModal.module.scss' interface HowSkillsWorkModalProps { onClose: () => void isTalentSearch?: boolean + canEdit?: boolean } const HowSkillsWorkModal: FC = (props: HowSkillsWorkModalProps) => ( { - props.isTalentSearch ? ( + !!props.canEdit && ( +
+

+ Topcoder Proven Skills +

+

+ Look for the proven + + next to skills. +

+

Here’s how it works:

+
    +
  • You perform specific Topcoder opportunities
    • +
  • Each opportunity has associated skills (ex: javascript, HTML)
    • +
  • + You can prove you are proficient in these skills + by completing opportunities on the platform +
    • +
  • Topcoder tracks and labels these skills, displaying what skills have been proven
    • +
  • The more opportunities our experts complete the higher they rate for associated skills
    • +
+

+ You can also self-proclaim skills that have not yet been proven. + These will display as skills without a checkmark. +

+
+ ) + } + + { + !props.canEdit && props.isTalentSearch && (

Topcoder Skill Matching @@ -44,7 +75,11 @@ const HowSkillsWorkModal: FC = (props: HowSkillsWorkMod These will display as skills without a checkmark.

- ) : ( + ) + } + + { + !props.canEdit && !props.isTalentSearch && (

Topcoder Proven Skills diff --git a/src/apps/profiles/src/member-profile/skills/MemberSkillsInfo.tsx b/src/apps/profiles/src/member-profile/skills/MemberSkillsInfo.tsx index ff6bea85c..c4bfd5ad6 100644 --- a/src/apps/profiles/src/member-profile/skills/MemberSkillsInfo.tsx +++ b/src/apps/profiles/src/member-profile/skills/MemberSkillsInfo.tsx @@ -143,6 +143,7 @@ const MemberSkillsInfo: FC = (props: MemberSkillsInfoProp ) } From 39ded8dc47b8f07df17c08ce64220c9d6c146e2e Mon Sep 17 00:00:00 2001 From: Kiril Kartunov Date: Thu, 20 Jul 2023 04:39:42 +0300 Subject: [PATCH 2/4] MP-276 Challenge winner banner update --- src/apps/profiles/src/lib/helpers.ts | 12 + .../ChallengeWin/ChallengeWin.module.scss | 18 + .../ChallengeWin/ChallengeWin.tsx | 22 ++ .../ChallengeWinsBanner/ChallengeWin/index.ts | 1 + .../ChallengeWinsBanner.module.scss | 17 +- .../ChallengeWinsBanner.tsx | 335 ++++++++++++++---- .../MemberTCAchievements.module.scss | 1 + .../tc-achievements/MemberTCAchievements.tsx | 1 + 8 files changed, 329 insertions(+), 78 deletions(-) create mode 100644 src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.module.scss create mode 100644 src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx create mode 100644 src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/index.ts diff --git a/src/apps/profiles/src/lib/helpers.ts b/src/apps/profiles/src/lib/helpers.ts index e79b1eeed..43837d44c 100644 --- a/src/apps/profiles/src/lib/helpers.ts +++ b/src/apps/profiles/src/lib/helpers.ts @@ -32,6 +32,18 @@ export function subTrackLabelToHumanName(label: string): string { return 'First2Finish' case 'CONCEPTUALIZATION': return 'Conceptualization' + case 'SPECIFICATION': + return 'Specification' + case 'BUG_HUNT': + return 'Bug Hunt' + case 'TEST_SUITES': + return 'Test Suites' + case 'TEST_SCENARIOS': + return 'Test Scenarios' + case 'CONTENT_CREATION': + return 'Content Creation' + case 'COPILOT_POSTING': + return 'Copilot Posting' default: return label } diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.module.scss b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.module.scss new file mode 100644 index 000000000..5f95aa387 --- /dev/null +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.module.scss @@ -0,0 +1,18 @@ +@import "@libs/ui/styles/includes"; + +.winWrapper { + display: flex; + flex-direction: column; + align-items: center; + padding: 0 $sp-2; + cursor: pointer; + min-width: 115px; + + .winCnt { + font-family: $font-barlow-condensed; + font-size: 32px; + font-weight: 500; + line-height: 34px; + margin-top: $sp-8; + } +} diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx new file mode 100644 index 000000000..ccb0be7dd --- /dev/null +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx @@ -0,0 +1,22 @@ +import { FC } from 'react' + +import styles from './ChallengeWin.module.scss' + +interface ChallengeWinProps { + typeName: string + onClick: () => void + winCnt: number +} + +const ChallengeWin: FC = (props: ChallengeWinProps) => ( +

+

+ {props.winCnt} + {' '} +

+

WINS

+

{props.typeName}

+
+) + +export default ChallengeWin diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/index.ts b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/index.ts new file mode 100644 index 000000000..575b4cc38 --- /dev/null +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/index.ts @@ -0,0 +1 @@ +export { default as ChallengeWin } from './ChallengeWin' diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.module.scss b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.module.scss index e1373ca5d..595e8389a 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.module.scss +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.module.scss @@ -23,7 +23,7 @@ margin-bottom: $sp-8; background-image: linear-gradient(90deg, #7B21A7, #1974AD); color: $tc-white; - padding: $sp-8; + padding: $sp-4; @include ltelg { padding: $sp-4; @@ -36,21 +36,8 @@ .wins { display: flex; flex-wrap: wrap; - justify-content: space-evenly; + justify-content: center; width: 100%; - - .winWrapper { - display: flex; - flex-direction: column; - align-items: center; - - .winCnt { - font-size: 44px; - font-weight: 500; - line-height: 34px; - margin-top: $sp-8; - } - } } } } \ No newline at end of file diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx index 70a5f34ea..787332698 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx @@ -1,77 +1,286 @@ -import { FC } from 'react' +/* eslint-disable complexity */ +import { Dispatch, FC, SetStateAction, useState } from 'react' +import { bind } from 'lodash' -import { MemberStats, UserStats } from '~/libs/core' +import { MemberStats, UserProfile, UserStats } from '~/libs/core' import { subTrackLabelToHumanName } from '../../../lib/helpers' +import { + AssemblyDetailsModal, + BugHuntDetailsModal, + CodeDetailsModal, + ContentCreationDetailsModal, + DesignF2FDetailsModal, + F2FDetailsModal, + LogoDesignDetailsModal, + MMDetailsModal, + SRMDetailsModal, + TestScenariosDetailsModal, + UIPrototypeDetailsModal, + WebDesignDetailsModal, +} from '../../../components' +import { ChallengeWin } from './ChallengeWin' import styles from './ChallengeWinsBanner.module.scss' interface ChallengeWinsBannerProps { memberStats: UserStats + profile: UserProfile } -const ChallengeWinsBanner: FC = (props: ChallengeWinsBannerProps) => ( -
-
-

Topcoder Challenge Winner

-
- { - !!props.memberStats.DATA_SCIENCE?.SRM?.wins && ( -
-

- {props.memberStats.DATA_SCIENCE.SRM.wins} - {' '} -

-

WINS

-

SRM

-
- ) - } - { - !!props.memberStats.DATA_SCIENCE?.MARATHON_MATCH?.wins && ( -
-

- {props.memberStats.DATA_SCIENCE.MARATHON_MATCH.wins} - {' '} -

-

WINS

-

Marathon Match

-
- ) - } - { - !!props.memberStats.DEVELOP?.wins - && props.memberStats.DEVELOP?.subTracks.map((ms: MemberStats) => (ms.wins ? ( -
-

- {ms.wins} - {' '} -

-

WINS

-

{subTrackLabelToHumanName(ms.name)}

-
- ) : undefined)) - } - { - !!props.memberStats.DESIGN?.wins - && props.memberStats.DESIGN?.subTracks.map((ms: MemberStats) => (ms.wins ? ( -
-

- {ms.wins} - {' '} -

-

WINS

-

{subTrackLabelToHumanName(ms.name)}

-
- ) : undefined)) - } +const ChallengeWinsBanner: FC = (props: ChallengeWinsBannerProps) => { + const f2fStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks.find(subTrack => subTrack.name === 'FIRST_2_FINISH') + const codeStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks.find(subTrack => subTrack.name === 'CODE') + const assemblyStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks.find(subTrack => subTrack.name === 'ASSEMBLY_COMPETITION') + const contentCreationStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks.find(subTrack => subTrack.name === 'CONTENT_CREATION') + const uiPrototypeStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks.find(subTrack => subTrack.name === 'UI_PROTOTYPE_COMPETITION') + const designF2FStats: MemberStats | undefined + = props.memberStats?.DESIGN?.subTracks.find(subTrack => subTrack.name === 'DESIGN_FIRST_2_FINISH') + const webDesignStats: MemberStats | undefined + = props.memberStats?.DESIGN?.subTracks.find(subTrack => subTrack.name === 'WEB_DESIGNS') + const logoDesignStats: MemberStats | undefined + = props.memberStats?.DESIGN?.subTracks.find(subTrack => subTrack.name === 'LOGO_DESIGN') + const bugHuntStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks?.find(subTrack => subTrack.name === 'BUG_HUNT') + const testScenStats: MemberStats | undefined + = props.memberStats?.DEVELOP?.subTracks?.find(subTrack => subTrack.name === 'TEST_SCENARIOS') + + const [isDesignF2FsDetailsOpen, setIsDesignF2FsDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isWebDesignDetailsOpen, setIsWebDesignDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isLogoDesignDetailsOpen, setIsLogoDesignDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isF2FDetailsOpen, setIsF2FDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isCodeDetailsOpen, setIsCodeDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isAssemblyDetailsOpen, setIsAssemblyDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isContentCreationDetailsOpen, setIsContentCreationDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isUIPrototypeDetailsOpen, setIsUIPrototypeDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isDSDetailsOpen, setIsDSDetailsOpen]: [boolean, Dispatch>] = useState(false) + const [isSRMDetailsOpen, setIsSRMDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isBugHuntDetailsOpen, setIsBugHuntDetailsOpen]: [boolean, Dispatch>] + = useState(false) + const [isTestScenDetailsOpen, setIsTestScenDetailsOpen]: [boolean, Dispatch>] + = useState(false) + + function handleShowDSModal(): void { + setIsDSDetailsOpen(!isDSDetailsOpen) + } + + function handleShowSRMModal(): void { + setIsSRMDetailsOpen(!isSRMDetailsOpen) + } + + function handleChallengeWinModalToggle(subTrack: string): void { + switch (subTrack) { + case 'ASSEMBLY_COMPETITION': + setIsAssemblyDetailsOpen(!isAssemblyDetailsOpen) + break + case 'CODE': + setIsCodeDetailsOpen(!isCodeDetailsOpen) + break + case 'FIRST_2_FINISH': + setIsF2FDetailsOpen(!isF2FDetailsOpen) + break + case 'UI_PROTOTYPE_COMPETITION': + setIsUIPrototypeDetailsOpen(!isUIPrototypeDetailsOpen) + break + case 'DESIGN_FIRST_2_FINISH': + setIsDesignF2FsDetailsOpen(!isDesignF2FsDetailsOpen) + break + case 'WEB_DESIGNS': + setIsWebDesignDetailsOpen(!isWebDesignDetailsOpen) + break + case 'LOGO_DESIGN': + setIsLogoDesignDetailsOpen(!isLogoDesignDetailsOpen) + break + // case 'CONCEPTUALIZATION': + // return 'Conceptualization' + // case 'SPECIFICATION': + // return 'Specification' + case 'BUG_HUNT': + setIsBugHuntDetailsOpen(!isBugHuntDetailsOpen) + break + // case 'TEST_SUITES': + // return 'Test Suites' + case 'TEST_SCENARIOS': + setIsTestScenDetailsOpen(!isTestScenDetailsOpen) + break + case 'CONTENT_CREATION': + setIsContentCreationDetailsOpen(!isContentCreationDetailsOpen) + break + // case 'COPILOT_POSTING': + // return 'Copilot Posting' + default: break + } + } + + return ( +
+
+

Topcoder Challenge Winner

+
+ { + !!props.memberStats.DATA_SCIENCE?.SRM?.wins && ( + + ) + } + { + !!props.memberStats.DATA_SCIENCE?.MARATHON_MATCH?.wins && ( + + ) + } + { + !!props.memberStats.DEVELOP?.wins + && props.memberStats.DEVELOP?.subTracks.map((ms: MemberStats) => (ms.wins ? ( + + ) : undefined)) + } + { + !!props.memberStats.DESIGN?.wins + && props.memberStats.DESIGN?.subTracks.map((ms: MemberStats) => (ms.wins ? ( + + ) : undefined)) + } +
+

+ Topcoder challenges are open competitions where community + members participate in small units of work to deliver projects. +

+ + {isSRMDetailsOpen && ( + + )} + + {isDSDetailsOpen && ( + + )} + + {isCodeDetailsOpen && ( + + )} + + {isF2FDetailsOpen && ( + + )} + + {isAssemblyDetailsOpen && ( + + )} + + {isContentCreationDetailsOpen && ( + + )} + + {isUIPrototypeDetailsOpen && ( + + )} + + {isWebDesignDetailsOpen && ( + + )} + + {isLogoDesignDetailsOpen && ( + + )} + + {isDesignF2FsDetailsOpen && ( + + )} + + {isTestScenDetailsOpen && ( + + )} + + {isBugHuntDetailsOpen && ( + + )} +
-

- Topcoder challenges are open competitions where community - members participate in small units of work to deliver projects. -

-
-) + ) +} export default ChallengeWinsBanner diff --git a/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.module.scss b/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.module.scss index 565b2b9c4..21518a959 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.module.scss +++ b/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.module.scss @@ -19,6 +19,7 @@ .achievementsWrap { display: flex; margin: $sp-4 0 $sp-2; + align-items: flex-start; @include ltelg { flex-direction: column; diff --git a/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.tsx b/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.tsx index 39d48610e..4e1db588b 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.tsx +++ b/src/apps/profiles/src/member-profile/tc-achievements/MemberTCAchievements.tsx @@ -50,6 +50,7 @@ const MemberTCAchievements: FC = (props: MemberTCAchi !!memberStats?.wins && memberStats.wins > 0 && ( ) } From 8e6249c2badab2df94c022b94c5435c3c8055cfa Mon Sep 17 00:00:00 2001 From: Kiril Kartunov Date: Thu, 20 Jul 2023 04:53:18 +0300 Subject: [PATCH 3/4] MP-276 clean up code base --- .../page-layout/ProfilePageLayout.tsx | 2 - .../ChallengeWin/ChallengeWin.tsx | 3 +- .../ChallengeWinsBanner.tsx | 24 ++ .../Copilot/CopilotActivity.module.scss | 22 -- .../tc-activity/Copilot/CopilotActivity.tsx | 30 --- .../tc-activity/Copilot/index.ts | 1 - .../tc-activity/DS/DSActivity.module.scss | 35 --- .../tc-activity/DS/DSActivity.tsx | 49 ---- .../member-profile/tc-activity/DS/index.ts | 1 - .../Develop/DevelopActivity.module.scss | 35 --- .../tc-activity/Develop/DevelopActivity.tsx | 209 ------------------ .../tc-activity/Develop/index.ts | 1 - .../MemberTCActivityInfo.module.scss | 18 -- .../tc-activity/MemberTCActivityInfo.tsx | 157 ------------- .../ModalTriggerButton.module.scss | 12 - .../ModalTriggerButton/ModalTriggerButton.tsx | 22 -- .../tc-activity/ModalTriggerButton/index.ts | 1 - .../tc-activity/QA/QAActivity.module.scss | 35 --- .../tc-activity/QA/QAActivity.tsx | 57 ----- .../member-profile/tc-activity/QA/index.ts | 1 - .../tc-activity/UX/UXActivity.module.scss | 35 --- .../tc-activity/UX/UXActivity.tsx | 124 ----------- .../member-profile/tc-activity/UX/index.ts | 1 - .../src/member-profile/tc-activity/index.ts | 1 - 24 files changed, 26 insertions(+), 850 deletions(-) delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Copilot/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/DS/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/Develop/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/QA/QAActivity.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/QA/QAActivity.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/QA/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/UX/UXActivity.module.scss delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/UX/UXActivity.tsx delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/UX/index.ts delete mode 100644 src/apps/profiles/src/member-profile/tc-activity/index.ts diff --git a/src/apps/profiles/src/member-profile/page-layout/ProfilePageLayout.tsx b/src/apps/profiles/src/member-profile/page-layout/ProfilePageLayout.tsx index 017340fda..7b7b9af43 100644 --- a/src/apps/profiles/src/member-profile/page-layout/ProfilePageLayout.tsx +++ b/src/apps/profiles/src/member-profile/page-layout/ProfilePageLayout.tsx @@ -96,8 +96,6 @@ const ProfilePageLayout: FC = (props: ProfilePageLayoutP
- {/* */} - diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx index ccb0be7dd..05e0db56c 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWin/ChallengeWin.tsx @@ -6,6 +6,7 @@ interface ChallengeWinProps { typeName: string onClick: () => void winCnt: number + winLabel?: string } const ChallengeWin: FC = (props: ChallengeWinProps) => ( @@ -14,7 +15,7 @@ const ChallengeWin: FC = (props: ChallengeWinProps) => ( {props.winCnt} {' '}

-

WINS

+

{props.winLabel || 'WINS'}

{props.typeName}

) diff --git a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx index 787332698..1cd3f4cbf 100644 --- a/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx +++ b/src/apps/profiles/src/member-profile/tc-achievements/ChallengeWinsBanner/ChallengeWinsBanner.tsx @@ -10,6 +10,7 @@ import { BugHuntDetailsModal, CodeDetailsModal, ContentCreationDetailsModal, + CopilotDetailsModal, DesignF2FDetailsModal, F2FDetailsModal, LogoDesignDetailsModal, @@ -73,6 +74,8 @@ const ChallengeWinsBanner: FC = (props: ChallengeWinsB = useState(false) const [isTestScenDetailsOpen, setIsTestScenDetailsOpen]: [boolean, Dispatch>] = useState(false) + const [isCopilotDetailsOpen, setIsCopilotDetailsOpen]: [boolean, Dispatch>] + = useState(false) function handleShowDSModal(): void { setIsDSDetailsOpen(!isDSDetailsOpen) @@ -120,6 +123,9 @@ const ChallengeWinsBanner: FC = (props: ChallengeWinsB case 'CONTENT_CREATION': setIsContentCreationDetailsOpen(!isContentCreationDetailsOpen) break + case 'COPILOT': + setIsCopilotDetailsOpen(!isCopilotDetailsOpen) + break // case 'COPILOT_POSTING': // return 'Copilot Posting' default: break @@ -169,6 +175,16 @@ const ChallengeWinsBanner: FC = (props: ChallengeWinsB /> ) : undefined)) } + { + !!props.memberStats.COPILOT && ( + + ) + }

@@ -279,6 +295,14 @@ const ChallengeWinsBanner: FC = (props: ChallengeWinsB /> )} + {isCopilotDetailsOpen && ( + + )} + ) } diff --git a/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.module.scss b/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.module.scss deleted file mode 100644 index 110eadfae..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.module.scss +++ /dev/null @@ -1,22 +0,0 @@ -@import "@libs/ui/styles/includes"; - -.content { - display: flex; - justify-content: space-between; - align-items: center; - border-top: 1px solid $black-10; - border-bottom: 1px solid $black-10; - padding: $sp-3 0; - - .progress { - display: flex; - align-items: center; - - .progressValue { - text-transform: uppercase; - color: $teal-140; - font-weight: $font-weight-bold; - } - - } -} \ No newline at end of file diff --git a/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.tsx b/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.tsx deleted file mode 100644 index e73ac7113..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Copilot/CopilotActivity.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import { FC } from 'react' - -import { Collapsible } from '~/libs/ui' -import { UserStats } from '~/libs/core' - -import { ModalTriggerButton } from '../ModalTriggerButton' - -import styles from './CopilotActivity.module.scss' - -interface CopilotActivityProps { - handleShowCopilotModal: () => void - copilotData: UserStats['COPILOT'] -} - -const CopilotActivity: FC = (props: CopilotActivityProps) => ( - SPECIALIZED ROLES}> -

- Copilot -
-
- {props.copilotData?.fulfillment} - % FULFILLMENT -
- -
-
- -) - -export default CopilotActivity diff --git a/src/apps/profiles/src/member-profile/tc-activity/Copilot/index.ts b/src/apps/profiles/src/member-profile/tc-activity/Copilot/index.ts deleted file mode 100644 index ee3598610..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Copilot/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default as CopilotActivity } from './CopilotActivity' diff --git a/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.module.scss b/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.module.scss deleted file mode 100644 index 0178db8cb..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.module.scss +++ /dev/null @@ -1,35 +0,0 @@ -@import "@libs/ui/styles/includes"; - -.activitySection { - margin-bottom: $sp-4; -} - -.contentGrid { - display: grid; - grid-template-columns: 1fr 1fr; - column-gap: $sp-8; - - @include ltelg { - grid-template-columns: 1fr; - } -} - -.content { - display: flex; - justify-content: space-between; - align-items: center; - border-top: 1px solid $black-10; - border-bottom: 1px solid $black-10; - padding: $sp-3 0; - - .progress { - display: flex; - align-items: center; - - .progressValue { - text-transform: uppercase; - color: $teal-140; - font-weight: $font-weight-bold; - } - } -} diff --git a/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.tsx b/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.tsx deleted file mode 100644 index ccf02d978..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/DS/DSActivity.tsx +++ /dev/null @@ -1,49 +0,0 @@ -import { FC } from 'react' - -import { Collapsible } from '~/libs/ui' -import { ratingToCSScolor } from '~/libs/core' - -import { ModalTriggerButton } from '../ModalTriggerButton' - -import styles from './DSActivity.module.scss' - -interface DSActivityProps { - handleShowSRMModal: () => void - handleShowDSModal: () => void - mmRating: number - srmRating: number -} - -const DSActivity: FC = (props: DSActivityProps) => ( - DATA SCIENCE} - containerClass={styles.activitySection} - > -
-
- SRM -
-
- {props.srmRating} - {' '} - RATING -
- -
-
-
- Marathon Match -
-
- {props.mmRating || 'NO'} - {' '} - RATING -
- -
-
-
- -) - -export default DSActivity diff --git a/src/apps/profiles/src/member-profile/tc-activity/DS/index.ts b/src/apps/profiles/src/member-profile/tc-activity/DS/index.ts deleted file mode 100644 index 7e7591f8d..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/DS/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default as DSActivity } from './DSActivity' diff --git a/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.module.scss b/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.module.scss deleted file mode 100644 index 0178db8cb..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.module.scss +++ /dev/null @@ -1,35 +0,0 @@ -@import "@libs/ui/styles/includes"; - -.activitySection { - margin-bottom: $sp-4; -} - -.contentGrid { - display: grid; - grid-template-columns: 1fr 1fr; - column-gap: $sp-8; - - @include ltelg { - grid-template-columns: 1fr; - } -} - -.content { - display: flex; - justify-content: space-between; - align-items: center; - border-top: 1px solid $black-10; - border-bottom: 1px solid $black-10; - padding: $sp-3 0; - - .progress { - display: flex; - align-items: center; - - .progressValue { - text-transform: uppercase; - color: $teal-140; - font-weight: $font-weight-bold; - } - } -} diff --git a/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.tsx b/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.tsx deleted file mode 100644 index bb268c683..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Develop/DevelopActivity.tsx +++ /dev/null @@ -1,209 +0,0 @@ -/* eslint-disable complexity */ -import { Dispatch, FC, SetStateAction, useState } from 'react' - -import { MemberStats, ratingToCSScolor, UserProfile } from '~/libs/core' -import { Collapsible } from '~/libs/ui' - -import { ModalTriggerButton } from '../ModalTriggerButton' -import { - AssemblyDetailsModal, - CodeDetailsModal, - ContentCreationDetailsModal, - F2FDetailsModal, - UIPrototypeDetailsModal, -} from '../../../components' - -import styles from './DevelopActivity.module.scss' - -interface DevelopActivityProps { - activityData: MemberStats[] - profile: UserProfile | undefined -} - -const DevelopActivity: FC = (props: DevelopActivityProps) => { - const f2fStats: MemberStats | undefined - = props.activityData.find(subTrack => subTrack.name === 'FIRST_2_FINISH') - const codeStats: MemberStats | undefined - = props.activityData.find(subTrack => subTrack.name === 'CODE') - const assemblyStats: MemberStats | undefined - = props.activityData.find(subTrack => subTrack.name === 'ASSEMBLY_COMPETITION') - const contentCreationStats: MemberStats | undefined - = props.activityData.find(subTrack => subTrack.name === 'CONTENT_CREATION') - const uiPrototypeStats: MemberStats | undefined - = props.activityData.find(subTrack => subTrack.name === 'UI_PROTOTYPE_COMPETITION') - - const [isF2FDetailsOpen, setIsF2FDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isCodeDetailsOpen, setIsCodeDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isAssemblyDetailsOpen, setIsAssemblyDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isContentCreationDetailsOpen, setIsContentCreationDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isUIPrototypeDetailsOpen, setIsUIPrototypeDetailsOpen]: [boolean, Dispatch>] - = useState(false) - - function handleShowF2FModal(): void { - setIsF2FDetailsOpen(!isF2FDetailsOpen) - } - - function handleShowCodeModal(): void { - setIsCodeDetailsOpen(!isCodeDetailsOpen) - } - - function handleShowAssemblyModal(): void { - setIsAssemblyDetailsOpen(!isAssemblyDetailsOpen) - } - - function handleShowContentCreationModal(): void { - setIsContentCreationDetailsOpen(!isContentCreationDetailsOpen) - } - - function handleShowUIPrototypeModal(): void { - setIsUIPrototypeDetailsOpen(!isUIPrototypeDetailsOpen) - } - - return ( - <> - DEVELOPMENT} - containerClass={styles.activitySection} - > -
- { - assemblyStats && ( -
- Assembly Competition -
-
- {assemblyStats.rank.rating || 0} - {' '} - RATING -
- -
-
- ) - } - { - codeStats && ( -
- Code -
-
- {codeStats.wins || 0} - {' '} - WINS -
- -
-
- ) - } - { - contentCreationStats && ( -
- Content Creation -
-
- {contentCreationStats.rank.rating || 0} - {' '} - RATING -
- -
-
- ) - } - { - f2fStats && ( -
- First2Finish -
-
- {f2fStats.wins || 0} - {' '} - WINS -
- -
-
- ) - } - { - uiPrototypeStats && ( -
- UI Prototype Competition -
-
- {uiPrototypeStats.rank.rating || 0} - {' '} - RATING -
- -
-
- ) - } -
- - - {isCodeDetailsOpen && ( - - )} - - {isF2FDetailsOpen && ( - - )} - - {isAssemblyDetailsOpen && ( - - )} - - {isContentCreationDetailsOpen && ( - - )} - - {isUIPrototypeDetailsOpen && ( - - )} - - ) -} - -export default DevelopActivity diff --git a/src/apps/profiles/src/member-profile/tc-activity/Develop/index.ts b/src/apps/profiles/src/member-profile/tc-activity/Develop/index.ts deleted file mode 100644 index 16f5ca275..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/Develop/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { default as DevelopActivity } from './DevelopActivity' diff --git a/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.module.scss b/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.module.scss deleted file mode 100644 index a96e370ea..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.module.scss +++ /dev/null @@ -1,18 +0,0 @@ -@import "@libs/ui/styles/includes"; - -.container { - background-color: $black-5; - padding: $sp-8; - display: flex; - flex-direction: column; - border-radius: 8px; - margin-bottom: $sp-8; - - @include ltelg { - padding: $sp-4; - } - - h3 { - margin-bottom: $sp-8; - } -} diff --git a/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.tsx b/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.tsx deleted file mode 100644 index 1d8b5837a..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/MemberTCActivityInfo.tsx +++ /dev/null @@ -1,157 +0,0 @@ -/* eslint-disable complexity */ -import { Dispatch, FC, SetStateAction, useState } from 'react' - -import { MemberStats, useMemberStats, UserProfile, UserStats } from '~/libs/core' - -import { - BugHuntDetailsModal, - CopilotDetailsModal, - MMDetailsModal, - SRMDetailsModal, - TestScenariosDetailsModal, -} from '../../components' - -import { DSActivity } from './DS' -import { CopilotActivity } from './Copilot' -import { DevelopActivity } from './Develop' -import { QAActivity } from './QA' -import { UXActivity } from './UX' -import styles from './MemberTCActivityInfo.module.scss' - -interface MemberTCActivityInfoProps { - profile: UserProfile | undefined -} - -const MemberTCActivityInfo: FC = (props: MemberTCActivityInfoProps) => { - const memberStats: UserStats | undefined = useMemberStats(props.profile?.handle) - const srmRating: number = memberStats?.DATA_SCIENCE?.SRM?.rank?.maximumRating || 0 - const mmRating: number = memberStats?.DATA_SCIENCE?.MARATHON_MATCH?.rank?.maximumRating || 0 - const bugHuntStats: MemberStats | undefined - = memberStats?.DEVELOP?.subTracks?.find(subTrack => subTrack.name === 'BUG_HUNT') - const testScenStats: MemberStats | undefined - = memberStats?.DEVELOP?.subTracks?.find(subTrack => subTrack.name === 'TEST_SCENARIOS') - - const [isCopilotDetailsOpen, setIsCopilotDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isDSDetailsOpen, setIsDSDetailsOpen]: [boolean, Dispatch>] = useState(false) - const [isSRMDetailsOpen, setIsSRMDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isBugHuntDetailsOpen, setIsBugHuntDetailsOpen]: [boolean, Dispatch>] - = useState(false) - const [isTestScenDetailsOpen, setIsTestScenDetailsOpen]: [boolean, Dispatch>] - = useState(false) - - function handleShowCopilotModal(): void { - setIsCopilotDetailsOpen(!isCopilotDetailsOpen) - } - - function handleShowDSModal(): void { - setIsDSDetailsOpen(!isDSDetailsOpen) - } - - function handleShowSRMModal(): void { - setIsSRMDetailsOpen(!isSRMDetailsOpen) - } - - function handleShowBugHuntModal(): void { - setIsBugHuntDetailsOpen(!isBugHuntDetailsOpen) - } - - function handleShowTestScenModal(): void { - setIsTestScenDetailsOpen(!isTestScenDetailsOpen) - } - - return memberStats ? ( -
-

TC ACTIVITY

- { - memberStats?.DESIGN && ( - - ) - } - { - memberStats?.DEVELOP && ( - - ) - } - { - memberStats?.DATA_SCIENCE && ( - - ) - } - { - bugHuntStats || testScenStats ? ( - - ) : <> - } - { - memberStats?.COPILOT && ( - - ) - } - - {isSRMDetailsOpen && ( - - )} - - {isDSDetailsOpen && ( - - )} - - {isCopilotDetailsOpen && ( - - )} - - {isTestScenDetailsOpen && ( - - )} - - {isBugHuntDetailsOpen && ( - - )} -
- ) : <> -} - -export default MemberTCActivityInfo diff --git a/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.module.scss b/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.module.scss deleted file mode 100644 index 73fc8f2fd..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.module.scss +++ /dev/null @@ -1,12 +0,0 @@ -@import "@libs/ui/styles/includes"; - -.btn { - border: 1px solid $black-10; - padding: $sp-1 $sp-4 !important; - margin-left: $sp-2; - - svg { - width: 24px; - height: 24px; - } -} \ No newline at end of file diff --git a/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.tsx b/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.tsx deleted file mode 100644 index 2150de35f..000000000 --- a/src/apps/profiles/src/member-profile/tc-activity/ModalTriggerButton/ModalTriggerButton.tsx +++ /dev/null @@ -1,22 +0,0 @@ -import { FC, SVGProps } from 'react' - -import { ChevronRightIcon } from '@heroicons/react/outline' -import { Button } from '~/libs/ui' - -import styles from './ModalTriggerButton.module.scss' - -interface ModalTriggerButtonProps { - icon?: FC> - onClick: () => void -} - -const ModalTriggerButton: FC = (props: ModalTriggerButtonProps) => ( -