Skip to content

Commit ab3b2d1

Browse files
jmgasperjmgasper
committed
Fixes for tab consistency and user handle colouring
1 parent eed2f5f commit ab3b2d1

File tree

3 files changed

+138
-96
lines changed

3 files changed

+138
-96
lines changed

‎src/apps/review/src/lib/components/TableReviewAppeals/TableReviewAppeals.module.scss‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -52,22 +52,6 @@
5252
gap: $sp-2;
5353
}
5454

55-
.linkButton {
56-
background: none;
57-
border: none;
58-
padding: 0;
59-
margin: 0;
60-
font: inherit;
61-
line-height: inherit;
62-
color: $link-blue-dark;
63-
cursor: pointer;
64-
65-
&:disabled {
66-
opacity: 0.7;
67-
pointer-events: none;
68-
}
69-
}
70-
7155
.copyButton {
7256
display: inline-flex;
7357
align-items: center;

‎src/apps/review/src/lib/components/TableReviewAppeals/TableReviewAppeals.tsx‎

Lines changed: 83 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import { MobileTableColumn } from '~/apps/admin/src/lib/models/MobileTableColumn
2121
import { EnvironmentConfig } from '~/config'
2222
import { copyTextToClipboard, handleError, useWindowSize, WindowSize } from '~/libs/shared'
2323
import { IconOutline, Table, TableColumn, Tooltip } from '~/libs/ui'
24+
import { getRatingColor } from '~/libs/core'
2425

2526
import { APPROVAL, REVIEWER, WITHOUT_APPEAL } from '../../../config/index.config'
2627
import { ChallengeDetailContext, ReviewAppContext } from '../../contexts'
@@ -67,6 +68,24 @@ type SubmissionRow = SubmissionInfo & {
6768
aggregated?: AggregatedSubmissionReviews
6869
}
6970

71+
const resolveRatingValue = (value: number | string | null | undefined): number | undefined => {
72+
if (typeof value === 'number' && Number.isFinite(value)) {
73+
return value
74+
}
75+
76+
if (typeof value === 'string') {
77+
const trimmed = value.trim()
78+
if (!trimmed.length) {
79+
return undefined
80+
}
81+
82+
const parsed = Number.parseFloat(trimmed)
83+
return Number.isFinite(parsed) ? parsed : undefined
84+
}
85+
86+
return undefined
87+
}
88+
7089
function createReopenActionButtons(
7190
submission: SubmissionRow,
7291
aggregatedReviews: AggregatedReviewDetail[] | undefined,
@@ -529,7 +548,7 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
529548
// eslint-disable-next-line complexity
530549
const columns = useMemo<TableColumn<SubmissionRow>[]>(() => {
531550
const submissionColumn: TableColumn<SubmissionRow> = {
532-
className: classNames(styles.textBlue, styles.submissionColumn),
551+
className: styles.submissionColumn,
533552
columnId: 'submission-id',
534553
label: 'Submission ID',
535554
propertyName: 'id',
@@ -550,7 +569,7 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
550569

551570
downloadSubmission(data.id)
552571
}}
553-
className={classNames(styles.textBlue, styles.linkButton)}
572+
className={styles.textBlue}
554573
disabled={isButtonDisabled}
555574
type='button'
556575
>
@@ -614,19 +633,32 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
614633
columnId: 'handle-aggregated',
615634
label: 'Handle',
616635
propertyName: 'handle',
617-
renderer: (data: SubmissionRow) => (
618-
<a
619-
href={getHandleUrl(data.userInfo)}
620-
target='_blank'
621-
rel='noreferrer'
622-
style={{ color: data.aggregated?.submitterHandleColor }}
623-
onClick={function onClick() {
624-
window.open(getHandleUrl(data.userInfo), '_blank')
625-
}}
626-
>
627-
{data.aggregated?.submitterHandle ?? data.userInfo?.memberHandle ?? ''}
628-
</a>
629-
),
636+
renderer: (data: SubmissionRow) => {
637+
const aggregatedRating = resolveRatingValue(data.aggregated?.submitterMaxRating)
638+
const reviewRating = resolveRatingValue(data.review?.submitterMaxRating)
639+
const userRating = resolveRatingValue(data.userInfo?.maxRating)
640+
const computedColor = data.aggregated?.submitterHandleColor
641+
?? data.review?.submitterHandleColor
642+
?? (aggregatedRating !== undefined ? getRatingColor(aggregatedRating) : undefined)
643+
?? (reviewRating !== undefined ? getRatingColor(reviewRating) : undefined)
644+
?? data.userInfo?.handleColor
645+
?? (userRating !== undefined ? getRatingColor(userRating) : undefined)
646+
?? '#2a2a2a'
647+
648+
return (
649+
<a
650+
href={getHandleUrl(data.userInfo)}
651+
target='_blank'
652+
rel='noreferrer'
653+
style={{ color: computedColor }}
654+
onClick={function onClick() {
655+
window.open(getHandleUrl(data.userInfo), '_blank')
656+
}}
657+
>
658+
{data.aggregated?.submitterHandle ?? data.userInfo?.memberHandle ?? ''}
659+
</a>
660+
)
661+
},
630662
type: 'element',
631663
}
632664

@@ -771,9 +803,6 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
771803
}
772804

773805
const totalAppeals = reviewDetail?.totalAppeals ?? 0
774-
const finishedAppeals = reviewDetail?.finishedAppeals ?? 0
775-
const unresolvedAppeals = reviewDetail?.unresolvedAppeals
776-
?? Math.max(totalAppeals - finishedAppeals, 0)
777806
if (!totalAppeals && (reviewInfo.status ?? '').toUpperCase() !== 'COMPLETED') {
778807
return (
779808
<span className={styles.notReviewed}>
@@ -793,22 +822,12 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
793822
)
794823
}
795824

796-
const primaryAppealsCount = unresolvedAppeals
797-
798825
return (
799826
<Link
800827
to={`./../review/${reviewInfo.id}`}
801828
className={styles.appealsLink}
802829
>
803-
[
804-
{' '}
805-
<span className={styles.textBlue}>{primaryAppealsCount}</span>
806-
{' '}
807-
/
808-
{' '}
809830
<span className={styles.textBlue}>{totalAppeals}</span>
810-
{' '}
811-
]
812831
</Link>
813832
)
814833
}
@@ -1009,24 +1028,34 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
10091028
columnId: 'handle',
10101029
label: 'Handle',
10111030
propertyName: 'handle',
1012-
renderer: (data: SubmissionRow) => (
1013-
<a
1014-
href={getHandleUrl(data.userInfo)}
1015-
target='_blank'
1016-
rel='noreferrer'
1017-
style={{
1018-
color: data.userInfo?.handleColor,
1019-
}}
1020-
onClick={function onClick() {
1021-
window.open(
1022-
getHandleUrl(data.userInfo),
1023-
'_blank',
1024-
)
1025-
}}
1026-
>
1027-
{data.userInfo?.memberHandle ?? ''}
1028-
</a>
1029-
),
1031+
renderer: (data: SubmissionRow) => {
1032+
const reviewRating = resolveRatingValue(data.review?.submitterMaxRating)
1033+
const userRating = resolveRatingValue(data.userInfo?.maxRating)
1034+
const computedColor = data.review?.submitterHandleColor
1035+
?? data.userInfo?.handleColor
1036+
?? (reviewRating !== undefined ? getRatingColor(reviewRating) : undefined)
1037+
?? (userRating !== undefined ? getRatingColor(userRating) : undefined)
1038+
?? '#2a2a2a'
1039+
1040+
return (
1041+
<a
1042+
href={getHandleUrl(data.userInfo)}
1043+
target='_blank'
1044+
rel='noreferrer'
1045+
style={{
1046+
color: computedColor,
1047+
}}
1048+
onClick={function onClick() {
1049+
window.open(
1050+
getHandleUrl(data.userInfo),
1051+
'_blank',
1052+
)
1053+
}}
1054+
>
1055+
{data.userInfo?.memberHandle ?? ''}
1056+
</a>
1057+
)
1058+
},
10301059
type: 'element',
10311060
}
10321061

@@ -1351,22 +1380,14 @@ export const TableReviewAppeals: FC<Props> = (props: Props) => {
13511380
}
13521381

13531382
return (
1354-
<>
1355-
[
1356-
<Link
1357-
to={`./../review/${reviewId}`}
1358-
className={styles.appealsLink}
1359-
>
1360-
<span className={styles.textBlue}>{appealInfo.finishAppeals}</span>
1361-
{' '}
1362-
/
1363-
{' '}
1364-
<span className={styles.textBlue}>
1365-
{appealInfo.totalAppeals}
1366-
</span>
1367-
</Link>
1368-
]
1369-
</>
1383+
<Link
1384+
to={`./../review/${reviewId}`}
1385+
className={styles.appealsLink}
1386+
>
1387+
<span className={styles.textBlue}>
1388+
{appealInfo.totalAppeals}
1389+
</span>
1390+
</Link>
13701391
)
13711392
},
13721393
type: 'element',

‎src/apps/review/src/lib/utils/aggregateSubmissionReviews.ts‎

Lines changed: 55 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,37 @@ interface AggregateSubmissionReviewsParams {
4747
reviewers: BackendResource[]
4848
}
4949

50+
const normalizeRatingValue = (value: number | string | null | undefined): number | undefined => {
51+
if (typeof value === 'number' && Number.isFinite(value)) {
52+
return value
53+
}
54+
55+
if (typeof value === 'string') {
56+
const trimmed = value.trim()
57+
if (!trimmed.length) {
58+
return undefined
59+
}
60+
61+
const parsed = Number.parseFloat(trimmed)
62+
return Number.isFinite(parsed) ? parsed : undefined
63+
}
64+
65+
return undefined
66+
}
67+
68+
function resolveHandleColor(
69+
explicitColor: string | undefined,
70+
handle: string | undefined,
71+
maxRating: number | string | undefined | null,
72+
): string | undefined {
73+
const normalizedRating = normalizeRatingValue(maxRating)
74+
75+
return explicitColor
76+
?? (handle && normalizedRating !== undefined
77+
? getRatingColor(normalizedRating)
78+
: undefined)
79+
}
80+
5081
/* eslint-disable complexity */
5182
/* eslint-disable no-console */
5283
export function aggregateSubmissionReviews({
@@ -75,8 +106,7 @@ export function aggregateSubmissionReviews({
75106
submission,
76107
submitterHandle: submission.review?.submitterHandle ?? undefined,
77108
submitterHandleColor: submission.review?.submitterHandleColor ?? undefined,
78-
submitterMaxRating: submission.review?.submitterMaxRating
79-
?? undefined,
109+
submitterMaxRating: normalizeRatingValue(submission.review?.submitterMaxRating),
80110
})
81111
}
82112

@@ -124,17 +154,23 @@ export function aggregateSubmissionReviews({
124154
reviewerHandleByResourceId[resourceId] = finalReviewerHandle
125155
}
126156

127-
const finalReviewerHandleColor = reviewInfo?.reviewerHandleColor
128-
?? matchingReviewResult?.reviewerHandleColor
129-
?? reviewerInfo?.handleColor
130-
const finalReviewerMaxRating = reviewInfo?.reviewerMaxRating
131-
?? matchingReviewResult?.reviewerMaxRating
132-
?? reviewerInfo?.rating
157+
const finalReviewerMaxRating = normalizeRatingValue(
158+
reviewInfo?.reviewerMaxRating
159+
?? matchingReviewResult?.reviewerMaxRating
160+
?? reviewerInfo?.rating,
161+
)
162+
const finalReviewerHandleColor = resolveHandleColor(
163+
reviewInfo?.reviewerHandleColor
164+
?? matchingReviewResult?.reviewerHandleColor
165+
?? reviewerInfo?.handleColor,
166+
finalReviewerHandle,
167+
finalReviewerMaxRating,
168+
)
133169

134170
if (reviewInfo?.submitterHandle) {
135171
group.submitterHandle = reviewInfo.submitterHandle
136172
group.submitterHandleColor = reviewInfo.submitterHandleColor
137-
group.submitterMaxRating = reviewInfo.submitterMaxRating
173+
group.submitterMaxRating = normalizeRatingValue(reviewInfo.submitterMaxRating)
138174
}
139175

140176
if (process.env.NODE_ENV !== 'production') {
@@ -293,15 +329,16 @@ export function aggregateSubmissionReviews({
293329
const submitterHandle = group.submitterHandle
294330
?? group.submission.review?.submitterHandle
295331
?? undefined
296-
const submitterMaxRating = group.submitterMaxRating
297-
?? group.submission.review?.submitterMaxRating
298-
?? undefined
299-
const submitterHandleColor = group.submitterHandleColor
300-
?? group.submission.review?.submitterHandleColor
301-
?? (submitterHandle
302-
&& typeof submitterMaxRating === 'number'
303-
? getRatingColor(submitterMaxRating)
304-
: undefined)
332+
const submitterMaxRating = normalizeRatingValue(
333+
group.submitterMaxRating
334+
?? group.submission.review?.submitterMaxRating
335+
?? undefined,
336+
)
337+
const submitterHandleColor = resolveHandleColor(
338+
group.submitterHandleColor ?? group.submission.review?.submitterHandleColor,
339+
submitterHandle,
340+
submitterMaxRating,
341+
)
305342

306343
aggregatedRows.push({
307344
...group,

0 commit comments

Comments
 (0)