Merge pull request #1335 from topcoder-platform/fix-review-tab

Fix order of ai review in review tab

Author: vas3a

src/apps/review/src/lib/components/Scorecard/ScorecardViewer/ScorecardQuestion/AiFeedback/AiFeedback.tsx

@@ -6,6 +6,7 @@ import { ReviewsContextModel, ScorecardQuestion } from '~/apps/review/src/lib/mo
 import { createFeedbackComment } from '~/apps/review/src/lib/services'
 import { useReviewsContext } from '~/apps/review/src/pages/reviews/ReviewsContext'
 import { EnvironmentConfig } from '~/config'
+import { Tooltip } from '~/libs/ui'
 
 import { ScorecardViewerContextValue, useScorecardViewerContext } from '../../ScorecardViewer.context'
 import { ScorecardQuestionRow } from '../ScorecardQuestionRow'
@@ -61,11 +62,21 @@ const AiFeedback: FC<AiFeedbackProps> = props => {
                 />
             )}
         >
-            {isYesNo && (
-                <p>
-                    <strong>{feedback.questionScore ? 'Yes' : 'No'}</strong>
-                </p>
-            )}
+            <p>
+                <strong>
+                    {isYesNo && (feedback.questionScore ? 'Yes' : 'No')}
+                    {!isYesNo && (
+                        <Tooltip
+                            content={`On a scale of ${props.question.scaleMin} to ${props.question.scaleMax}`}
+                            triggerOn='hover'
+                        >
+                            <span>
+                                {feedback.questionScore}
+                            </span>
+                        </Tooltip>
+                    )}
+                </strong>
+            </p>
 
             <MarkdownReview value={feedback.content} />
 

src/apps/review/src/lib/components/TableReview/TableReview.tsx

@@ -621,22 +621,6 @@ export const TableReview: FC<TableReviewProps> = (props: TableReviewProps) => {
         }
 
         baseColumns.push(
-            ...(props.aiReviewers ? [{
-                columnId: 'ai-reviews-table',
-                isExpand: true,
-                label: '',
-                renderer: (submission: SubmissionRow, allRows: SubmissionRow[]) => (
-                    props.aiReviewers && (
-                        <CollapsibleAiReviewsRow
-                            className={styles.aiReviews}
-                            aiReviewers={props.aiReviewers}
-                            submission={submission as any}
-                            defaultOpen={allRows ? !allRows.indexOf(submission) : false}
-                        />
-                    )
-                ),
-                type: 'element',
-            }] : []) as TableColumn<SubmissionRow>[],
             {
                 columnId: 'review-date',
                 label: 'Review Date',
@@ -688,6 +672,25 @@ export const TableReview: FC<TableReviewProps> = (props: TableReviewProps) => {
             })
         }
 
+        if (props.aiReviewers) {
+            baseColumns.push({
+                columnId: 'ai-reviews-table',
+                isExpand: true,
+                label: '',
+                renderer: (submission: SubmissionRow, allRows: SubmissionRow[]) => (
+                    props.aiReviewers && (
+                        <CollapsibleAiReviewsRow
+                            className={styles.aiReviews}
+                            aiReviewers={props.aiReviewers}
+                            submission={submission as any}
+                            defaultOpen={allRows ? !allRows.indexOf(submission) : false}
+                        />
+                    )
+                ),
+                type: 'element',
+            })
+        }
+
         return baseColumns
     }, [
         downloadButtonConfig,

src/apps/review/src/lib/components/common/TableColumnRenderers.module.scss

@@ -91,10 +91,6 @@
     font-weight: 700;
 }
 
-.appealsLink {
-    padding: 0 $sp-1;
-}
-
 .tableCellNoWrap {
     white-space: nowrap;
     text-align: left !important;

src/apps/review/src/pages/reviews/components/ReviewsSidebar/ReviewsSidebar.tsx

@@ -5,7 +5,7 @@ import classNames from 'classnames'
 import { ReviewsContextModel } from '~/apps/review/src/lib/models'
 import { AiWorkflowRunStatus } from '~/apps/review/src/lib/components/AiReviewsTable'
 import { IconAiReview, IconPhaseReview } from '~/apps/review/src/lib/assets/icons'
-import { IconOutline, IconSolid } from '~/libs/ui'
+import { IconOutline, IconSolid, Tooltip } from '~/libs/ui'
 import StatusLabel from '~/apps/review/src/lib/components/AiReviewsTable/StatusLabel'
 
 import { useReviewsContext } from '../../ReviewsContext'
@@ -37,6 +37,10 @@ const ReviewsSidebar: FC<ReviewsSidebarProps> = props => {
         setIsMobileOpen(false)
     }, [])
 
+    const runUrl = useCallback((runWorkflowId: string) => (
+        `../reviews/${submissionId}?workflowId=${runWorkflowId}&reviewId=${reviewId}`
+    ), [reviewId, submissionId])
+
     return (
         <div className={classNames(props.className, styles.wrap)}>
             {((workflow && workflowRun) || reviewId) && (
@@ -82,14 +86,20 @@ const ReviewsSidebar: FC<ReviewsSidebarProps> = props => {
                                 }
                                 key={run.id}
                             >
-                                <Link
-                                    to={`../reviews/${submissionId}?workflowId=${run.workflow.id}&reviewId=${reviewId}`}
-                                    onClick={close}
-                                />
-                                <span className={styles.workflowNameWrap}>
-                                    <IconAiReview />
-                                    <span className={styles.workflowName}>{run.workflow.name}</span>
-                                </span>
+                                <Tooltip
+                                    content={run.workflow.name}
+                                    triggerOn='hover'
+                                    disableWrap
+                                >
+                                    <Link
+                                        to={runUrl(run.workflow.id)}
+                                        onClick={close}
+                                    />
+                                    <span className={styles.workflowNameWrap}>
+                                        <IconAiReview />
+                                        <span className={styles.workflowName}>{run.workflow.name}</span>
+                                    </span>
+                                </Tooltip>
                                 <AiWorkflowRunStatus run={run} showScore hideLabel />
                             </li>
                         ))}

src/libs/shared/lib/components/notifications/NotificationsContainer.module.scss

@@ -3,5 +3,5 @@
 .wrap {
     position: relative;
     width: 100%;
-    z-index: 20;
+    z-index: 1;
 }