From 01bfdbf6cd28fbc221f2fe99ac502a8d862770e1 Mon Sep 17 00:00:00 2001 From: Hentry Martin Date: Thu, 14 Aug 2025 01:14:01 +0200 Subject: [PATCH 1/3] feat: view scorecard implementation --- .../review/src/lib/hooks/useFetchScorecard.ts | 27 +++++ .../review/src/lib/models/Scorecard.model.ts | 7 ++ .../ScorecardDetails.module.scss | 53 +++++++++ .../ScorecardDetails/ScorecardDetails.tsx | 48 ++++++++ .../ScorecardDetails/index.ts | 1 + .../ScorecardGroups.module.scss | 48 ++++++++ .../ScorecardGroups/ScorecardGroups.tsx | 29 +++++ .../ScorecardGroups/index.ts | 1 + .../ScorecardSections.module.scss | 107 ++++++++++++++++++ .../ScorecardSections/ScorecardSections.tsx | 60 ++++++++++ .../ScorecardSections/index.ts | 0 .../ViewScorecardPage.module.scss | 14 +++ .../ViewScorecardPage/ViewScorecardPage.tsx | 58 +++++++++- src/apps/review/src/review-app.routes.tsx | 7 +- .../router.context-provider.tsx | 1 + 15 files changed, 455 insertions(+), 6 deletions(-) create mode 100644 src/apps/review/src/lib/hooks/useFetchScorecard.ts create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.module.scss create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/index.ts create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.module.scss create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/index.ts create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.module.scss create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx create mode 100644 src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts diff --git a/src/apps/review/src/lib/hooks/useFetchScorecard.ts b/src/apps/review/src/lib/hooks/useFetchScorecard.ts new file mode 100644 index 000000000..963aca936 --- /dev/null +++ b/src/apps/review/src/lib/hooks/useFetchScorecard.ts @@ -0,0 +1,27 @@ +import useSWR, { SWRResponse } from 'swr' + +import { EnvironmentConfig } from '~/config' +import { xhrGetAsync } from '~/libs/core' + +import { Scorecard } from '../models' + +interface UseFetchScorecardParams { + id: string; +} +const baseUrl = `${EnvironmentConfig.API.V6}/review` + +export function useFetchScorecard( + { + id, + }: UseFetchScorecardParams, +): Scorecard { + + const fetcher = (url: string): Promise => xhrGetAsync(url) + + const { data }: SWRResponse = useSWR( + `${baseUrl}/scorecards/${id}`, + fetcher, + ) + + return data as Scorecard +} diff --git a/src/apps/review/src/lib/models/Scorecard.model.ts b/src/apps/review/src/lib/models/Scorecard.model.ts index 81c7c8f69..dd40af253 100644 --- a/src/apps/review/src/lib/models/Scorecard.model.ts +++ b/src/apps/review/src/lib/models/Scorecard.model.ts @@ -2,6 +2,8 @@ * Scorecard */ +import { ScorecardGroup } from './ScorecardGroup.model' + export enum ProjectType { DEVELOPMENT = 'DEVELOPMENT', DATA_SCIENCE = 'DATA_SCIENCE', @@ -94,4 +96,9 @@ export interface Scorecard { category: string status: ScorecardStatus index?: number + version: string + challengeType: string + minScore: number + maxScore: number + scorecardGroups: ScorecardGroup[] } diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.module.scss b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.module.scss new file mode 100644 index 000000000..41f8159c2 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.module.scss @@ -0,0 +1,53 @@ +.container { + display: flex; + flex-direction: row; + padding: 32px; + background-color: #F6F7F9; + margin-top: 20px; + border-radius: 8px; + .left { + display: flex; + flex: 1; + flex-direction: column; + } + + .item { + display: flex; + flex-direction: column; + margin-bottom: 20px; + .label { + font-weight: 700; + font-family: "Nunito Sans", sans-serif; + font-size: 16px; + color: #000000; + margin-bottom: 6px; + } + .value { + font-weight: 400; + font-family: "Nunito Sans", sans-serif; + font-size: 16px; + color: #0A0A0A; + text-transform: capitalize; + &.active { + color: #00797A; + } + + &.inactive, &.deleted { + color: #767676; + font-family: 'Inter', sans-serif; + font-weight: 600; + font-size: 14px; + } + } + } + + .right { + display: flex; + flex: 3; + flex-direction: column; + .item { + display: flex; + flex-direction: column; + } + } +} \ No newline at end of file diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx new file mode 100644 index 000000000..13f9518d0 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx @@ -0,0 +1,48 @@ +import { FC } from 'react' +import cn from 'classnames' + +import { ProjectTypeLabels, Scorecard, ScorecardStatusLabels, ScorecardTypeLabels } from '~/apps/review/src/lib/models' + +import styles from './ScorecardDetails.module.scss' + +interface ScorecardDetailsProps { + scorecard: Scorecard +} + +const ScorecardDetails: FC = ({ scorecard }) => { + const getStatusClassname = () => styles[ScorecardStatusLabels[scorecard.status]?.toLowerCase()] + return ( +
+
+
+
Version
+
{scorecard.version}
+
+
+
Type
+
{ScorecardTypeLabels[scorecard.type]}
+
+
+
Project Type
+
{ProjectTypeLabels[scorecard.challengeTrack]}
+
+
+
+
+
Category
+
{scorecard.challengeType}
+
+
+
Status
+
{ScorecardStatusLabels[scorecard.status]}
+
+
+
Min - Max. Score
+
{`${scorecard.minScore} - ${scorecard.maxScore}`}
+
+
+
+ ) +} + +export default ScorecardDetails diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/index.ts b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/index.ts new file mode 100644 index 000000000..51a168df3 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/index.ts @@ -0,0 +1 @@ +export { default as ScorecardDetails } from './ScorecardDetails' diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.module.scss b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.module.scss new file mode 100644 index 000000000..0ab9472a5 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.module.scss @@ -0,0 +1,48 @@ +@import '@libs/ui/styles/includes'; + +.container { + margin-top: 32px; + .group { + .heading { + padding: 12px 16px; + background-color: #0F172A; + color: #ffffff; + display: flex; + flex-direction: column; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + .groupNumber { + font-size: 14px; + font-family: "Nunito Sans", sans-serif; + font-weight: 400; + } + .groupInfo { + display: flex; + flex-direction: row; + font-size: 16px; + font-family: "Nunito Sans", sans-serif; + margin-top: 4px; + .name { + display: flex; + flex: 1; + font-weight: 700; + } + } + } + } +} + +@media (max-width: #{$lg-max}) { + .container { + .group { + .heading { + .groupInfo { + flex-direction: column; + .name { + margin-bottom: 8px; + } + } + } + } + } +} \ No newline at end of file diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx new file mode 100644 index 000000000..5cecf5c75 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx @@ -0,0 +1,29 @@ +import { ScorecardGroup } from '~/apps/review/src/lib/models' +import { FC } from 'react' +import ScorecardSections from '../ScorecardSections/ScorecardSections' +import styles from './ScorecardGroups.module.scss' + +interface ScorecardGroupsProps { + groups: ScorecardGroup[] +} + +const ScorecardGroups: FC = ({ groups }) => ( +
+ { + groups.map((group, index) => ( +
+
+
{`Group ${index + 1}`}
+
+
{group.name}
+
{group.weight}
+
+
+ +
+ )) + } +
+) + +export default ScorecardGroups diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/index.ts b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/index.ts new file mode 100644 index 000000000..dedd1564e --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/index.ts @@ -0,0 +1 @@ +export { default as ScorecardGroups } from './ScorecardGroups' diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.module.scss b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.module.scss new file mode 100644 index 000000000..c3142a557 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.module.scss @@ -0,0 +1,107 @@ +@import '@libs/ui/styles/includes'; + +.container { + background-color: #E0E4E84D; + padding: 40px 32px; + .section { + .heading { + padding: 12px 16px; + background-color: #00797A; + color: #ffffff; + display: flex; + flex-direction: column; + border-top-left-radius: 8px; + border-top-right-radius: 8px; + .sectionInfo { + display: flex; + flex-direction: row; + margin-top: 4px; + font-size: 16px; + font-family: "Nunito Sans", sans-serif; + .name { + display: flex; + flex: 1; + font-weight: 700; + } + } + } + .questions { + background-color: #FFFFFF; + padding: 32px 20px; + .question { + background-color: #F6F7F9; + padding: 20px 16px; + display: flex; + flex-direction: row; + color: #0A0A0A; + margin-bottom: 0px; + &.notLast { + margin-bottom: 20px; + } + .left { + display: flex; + flex: 4; + flex-direction: column; + .description { + font-weight: 700; + font-size: 16px; + } + .detailItemsWrapper { + margin-top: 16px; + .detailItem { + display: flex; + flex-direction: row; + font-family: "Nunito Sans", sans-serif; + margin-bottom: 8px; + .label { + font-weight: 700; + font-size: 14px; + min-width: 142px; + } + .value { + font-weight: 400; + font-size: 14px; + } + } + } + } + .right { + display: flex; + flex: 1; + justify-content: flex-end; + } + } + } + } +} + +@media (max-width: #{$lg-max}) { + .container { + .section { + .heading { + .sectionInfo { + flex-direction: column; + .name { + margin-bottom: 4px; + } + } + } + .questions { + .question { + flex-direction: column; + .left { + .detailItemsWrapper { + .detailItem { + flex-direction: column; + min-width: auto; + } + } + } + .right { + justify-content: flex-start; + } + } + } + } + } +} \ No newline at end of file diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx new file mode 100644 index 000000000..e50ec5b03 --- /dev/null +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx @@ -0,0 +1,60 @@ +import { FC } from 'react' +import { ScorecardSection } from '~/apps/review/src/lib/models' +import cn from 'classnames' +import styles from './ScorecardSections.module.scss' + +interface ScorecardSectionsProps { + sections: ScorecardSection[] +} + +const ScorecardSections: FC = ({ sections }) => ( +
+ { + sections.map((section, sectionIndex) => ( +
+
+
{`Section ${sectionIndex + 1}`}
+
+
{section.name}
+
{section.weight}
+
+
+
+ { + section.questions.map((question, index) => ( +
+
+
{`${sectionIndex + 1}.${index + 1} ${question.description}`}
+
+
+
Guidelines:
+
{question.guidelines}
+
+
+
Scale:
+
{`Scale ${question.scaleMin} - ${question.scaleMax}`}
+
+
+
Document Upload:
+ {/* This will be added once upload functionality works */} +
NA
+
+
+
+
+
{question.weight}
+
+
+ )) + } +
+
+ )) + } +
+) + +export default ScorecardSections diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts new file mode 100644 index 000000000..e69de29bb diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.module.scss b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.module.scss index e69de29bb..7fc297673 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.module.scss +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.module.scss @@ -0,0 +1,14 @@ +.container { + padding: 32px 0; + .section { + &.evaluationStructureSection { + margin-top: 54px; + } + .heading { + font-weight: 700; + font-size: 24px; + color: #0A0A0A; + line-height: 30px; + } + } +} \ No newline at end of file diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx index 1de00f221..c2babdf54 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx @@ -1,7 +1,57 @@ -import { FC } from 'react' +import { FC, useContext, useMemo } from 'react' +import { PencilIcon } from '@heroicons/react/solid' +import { useParams } from 'react-router-dom' +import cn from 'classnames' -const ViewScorecardPage: FC = () => ( -
View scorecard
-) +import { Button } from '~/libs/ui' + +import { profileContext, ProfileContextData, UserRole } from '~/libs/core' +import { PageWrapper } from '../../../lib' +import { useFetchScorecard } from '../../../lib/hooks/useFetchScorecard' +import { ScorecardDetails } from './ScorecardDetails' + +import { ScorecardGroups } from './ScorecardGroups' +import styles from './ViewScorecardPage.module.scss' + +const ViewScorecardPage: FC = () => { + const { scorecardId } = useParams() + const { profile }: ProfileContextData = useContext(profileContext) + const isAdmin = profile?.roles.includes(UserRole.administrator) + console.log(profile, 'profile') + // const admin = isAdmin + const breadCrumb = useMemo( + () => [{ index: 1, label: 'Scorecards', path: '/review/scorecard' }, { index: 2, label: 'Scorecards Details' }], + [], + ) + + const scorecard = useFetchScorecard({ id: scorecardId as string }) + console.log(scorecard, 'scorecard') + return ( + } className='borderButton' secondary>Edit Scorecard} + > + { + scorecard && ( +
+
+

1. Scorecard Information

+ {scorecard && } +
+ { + scorecard.scorecardGroups.length > 0 && ( +
+

2. Evaluation Structure

+ +
+ ) + } +
+ ) + } +
+ ) +} export default ViewScorecardPage diff --git a/src/apps/review/src/review-app.routes.tsx b/src/apps/review/src/review-app.routes.tsx index f508a8c4d..baf3fa3d1 100644 --- a/src/apps/review/src/review-app.routes.tsx +++ b/src/apps/review/src/review-app.routes.tsx @@ -57,9 +57,9 @@ export const toolTitle: string = ToolTitle.review export const reviewRoutes: ReadonlyArray = [ // Review App Root { - authRequired: true, children: [ { + authRequired: true, element: , route: '', }, @@ -67,11 +67,13 @@ export const reviewRoutes: ReadonlyArray = [ { children: [ { + authRequired: true, element: , id: 'active-reviews-page', route: '', }, { + authRequired: true, children: [ { element: , @@ -83,7 +85,6 @@ export const reviewRoutes: ReadonlyArray = [ id: 'scorecard-details-page', route: 'scorecard-details/:scorecardId', }, - ], element: , id: challengeDetailRouteId, @@ -97,11 +98,13 @@ export const reviewRoutes: ReadonlyArray = [ { children: [ { + authRequired: true, element: , id: 'list-scorecards-page', route: '', }, { + authRequired: false, element: , id: 'view-scorecard-page', route: ':scorecardId', diff --git a/src/libs/core/lib/router/router-context/router.context-provider.tsx b/src/libs/core/lib/router/router-context/router.context-provider.tsx index 97f89e93d..aa083bcc8 100644 --- a/src/libs/core/lib/router/router-context/router.context-provider.tsx +++ b/src/libs/core/lib/router/router-context/router.context-provider.tsx @@ -100,6 +100,7 @@ export const RouterProvider: FC = (props: RouterProviderPro function getRouteElement(route: PlatformRoute): JSX.Element { + console.log(route, 'route') // create the route element const routeElement: JSX.Element = !route.authRequired ? route.element From d465f4ebd7634fc906d31e2b2d275ea1ceee69f1 Mon Sep 17 00:00:00 2001 From: Hentry Martin Date: Thu, 14 Aug 2025 17:27:20 +0200 Subject: [PATCH 2/3] fix: lint --- .../ScorecardDetails/ScorecardDetails.tsx | 20 +++++++++------ .../ScorecardGroups/ScorecardGroups.tsx | 9 ++++--- .../ScorecardSections/ScorecardSections.tsx | 20 +++++++++++---- .../ViewScorecardPage/ViewScorecardPage.tsx | 25 +++++++++++++------ 4 files changed, 50 insertions(+), 24 deletions(-) diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx index 13f9518d0..3d99c7b97 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardDetails/ScorecardDetails.tsx @@ -9,36 +9,40 @@ interface ScorecardDetailsProps { scorecard: Scorecard } -const ScorecardDetails: FC = ({ scorecard }) => { - const getStatusClassname = () => styles[ScorecardStatusLabels[scorecard.status]?.toLowerCase()] +const ScorecardDetails: FC = (props: ScorecardDetailsProps) => { + const getStatusClassname = (): string => styles[ScorecardStatusLabels[props.scorecard.status]?.toLowerCase()] return (
Version
-
{scorecard.version}
+
{props.scorecard.version}
Type
-
{ScorecardTypeLabels[scorecard.type]}
+
{ScorecardTypeLabels[props.scorecard.type]}
Project Type
-
{ProjectTypeLabels[scorecard.challengeTrack]}
+
{ProjectTypeLabels[props.scorecard.challengeTrack]}
Category
-
{scorecard.challengeType}
+
{props.scorecard.challengeType}
Status
-
{ScorecardStatusLabels[scorecard.status]}
+
+ {ScorecardStatusLabels[props.scorecard.status]} +
Min - Max. Score
-
{`${scorecard.minScore} - ${scorecard.maxScore}`}
+
{`${props.scorecard.minScore} - ${props.scorecard.maxScore}`}
diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx index 5cecf5c75..8d96dc65b 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardGroups/ScorecardGroups.tsx @@ -1,16 +1,19 @@ -import { ScorecardGroup } from '~/apps/review/src/lib/models' import { FC } from 'react' + +import { ScorecardGroup } from '~/apps/review/src/lib/models' + import ScorecardSections from '../ScorecardSections/ScorecardSections' + import styles from './ScorecardGroups.module.scss' interface ScorecardGroupsProps { groups: ScorecardGroup[] } -const ScorecardGroups: FC = ({ groups }) => ( +const ScorecardGroups: FC = (props: ScorecardGroupsProps) => (
{ - groups.map((group, index) => ( + props.groups.map((group, index) => (
{`Group ${index + 1}`}
diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx index e50ec5b03..0c35f2be8 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/ScorecardSections.tsx @@ -1,16 +1,18 @@ import { FC } from 'react' -import { ScorecardSection } from '~/apps/review/src/lib/models' import cn from 'classnames' + +import { ScorecardSection } from '~/apps/review/src/lib/models' + import styles from './ScorecardSections.module.scss' interface ScorecardSectionsProps { sections: ScorecardSection[] } -const ScorecardSections: FC = ({ sections }) => ( +const ScorecardSections: FC = (props: ScorecardSectionsProps) => (
{ - sections.map((section, sectionIndex) => ( + props.sections.map((section, sectionIndex) => (
{`Section ${sectionIndex + 1}`}
@@ -27,7 +29,11 @@ const ScorecardSections: FC = ({ sections }) => ( })} >
-
{`${sectionIndex + 1}.${index + 1} ${question.description}`}
+
+ {`${sectionIndex + 1}.${index + 1} ${question.description}`} +
Guidelines:
@@ -35,7 +41,11 @@ const ScorecardSections: FC = ({ sections }) => (
Scale:
-
{`Scale ${question.scaleMin} - ${question.scaleMax}`}
+
+ {`Scale ${question.scaleMin} - ${question.scaleMax}`} +
Document Upload:
diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx index c2babdf54..7632a2cba 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ViewScorecardPage.tsx @@ -1,36 +1,45 @@ import { FC, useContext, useMemo } from 'react' -import { PencilIcon } from '@heroicons/react/solid' import { useParams } from 'react-router-dom' import cn from 'classnames' +import { PencilIcon } from '@heroicons/react/solid' import { Button } from '~/libs/ui' - import { profileContext, ProfileContextData, UserRole } from '~/libs/core' + import { PageWrapper } from '../../../lib' import { useFetchScorecard } from '../../../lib/hooks/useFetchScorecard' -import { ScorecardDetails } from './ScorecardDetails' +import { ScorecardDetails } from './ScorecardDetails' import { ScorecardGroups } from './ScorecardGroups' import styles from './ViewScorecardPage.module.scss' +const PencilIconWrapper: FC = () => + const ViewScorecardPage: FC = () => { - const { scorecardId } = useParams() + const { scorecardId = '' }: { scorecardId?: string } = useParams<{ scorecardId: string }>() const { profile }: ProfileContextData = useContext(profileContext) const isAdmin = profile?.roles.includes(UserRole.administrator) - console.log(profile, 'profile') - // const admin = isAdmin const breadCrumb = useMemo( () => [{ index: 1, label: 'Scorecards', path: '/review/scorecard' }, { index: 2, label: 'Scorecards Details' }], [], ) const scorecard = useFetchScorecard({ id: scorecardId as string }) - console.log(scorecard, 'scorecard') + return ( } className='borderButton' secondary>Edit Scorecard} + rightHeader={isAdmin && ( + + )} > { scorecard && ( From c199705d5ded79f2599fc40affb0ab0cc80f56d6 Mon Sep 17 00:00:00 2001 From: Hentry Martin Date: Mon, 18 Aug 2025 18:01:23 +0200 Subject: [PATCH 3/3] fix: build --- .../scorecards/ViewScorecardPage/ScorecardSections/index.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts index e69de29bb..e326e1290 100644 --- a/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts +++ b/src/apps/review/src/pages/scorecards/ViewScorecardPage/ScorecardSections/index.ts @@ -0,0 +1 @@ +export { default as ScorecardSections } from './ScorecardSections'