Fix scoreboard on porta;

apps/portal/components/scoreboard-grid.tsx

@@ -1,9 +1,10 @@
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import { Box, Typography, useMediaQuery } from '@mui/material';
-import { DataGrid, GridColDef } from '@mui/x-data-grid';
+import { DataGrid, GridColDef, GridComparatorFn } from '@mui/x-data-grid';
 import { heIL } from '@mui/x-data-grid/locales';
 import { PortalScore } from '@lems/types';
 import theme from '../lib/theme';
+import { compareScoreArrays } from '@lems/utils/arrays';
 
 interface ScoreboardGridProps {
   data: PortalScore[];
@@ -13,6 +14,12 @@ const ScoreboardGrid: React.FC<ScoreboardGridProps> = ({ data }) => {
   const localizedTheme = createTheme(theme, heIL);
   const isDesktop = useMediaQuery(localizedTheme.breakpoints.up('md'));
 
+  const scoreComparator: GridComparatorFn<PortalScore> = (a, b, paramA, paramB) => {
+    const scoresA = paramA.api.getRow(paramA.id).scores;
+    const scoresB = paramB.api.getRow(paramB.id).scores;
+    return compareScoreArrays(scoresA, scoresB, true);
+  };
+
   const matches = data[0]?.scores.length ?? 1;
   const columns: GridColDef<(typeof data)[number]>[] = [
     {
@@ -26,7 +33,14 @@ const ScoreboardGrid: React.FC<ScoreboardGridProps> = ({ data }) => {
         return `#${row.team.number}`;
       }
     },
-    { field: 'maxScore', headerName: 'ניקוד', width: isDesktop ? 150 : 100 },
+    {
+      field: 'maxScore',
+      type: 'number',
+      headerName: 'ניקוד',
+      width: isDesktop ? 150 : 100,
+      sortable: true,
+      sortComparator: scoreComparator
+    },
     ...Array.from(
       { length: matches },
       (_, index) =>

apps/portal/pages/events/[id]/scoreboard.tsx

@@ -3,10 +3,10 @@ import { NextPage, GetServerSideProps, GetServerSidePropsContext } from 'next';
 import { Container, Typography, Box, Stack } from '@mui/material';
 import { PortalScore, PortalEvent, PortalEventStatus } from '@lems/types';
 import { fetchEvent } from '../../../lib/api';
+import { localizedMatchStage } from '../../../lib/localization';
 import ScoreboardGrid from '../../../components/scoreboard-grid';
 import { useRealtimeData } from '../../../hooks/use-realtime-data';
 import LoadingAnimation from '../../../components/loading-animation';
-import { localizedMatchStage } from 'apps/portal/lib/localization';
 
 interface Props {
   event: PortalEvent;

libs/utils/arrays/src/lib/utils-arrays.ts

@@ -13,7 +13,8 @@ export const reorder = (arr: Array<any>, startIndex: number, endIndex: number) =
 
 export const compareScoreArrays = (
   scoresA: (number | undefined)[],
-  scoresB: (number | undefined)[]
+  scoresB: (number | undefined)[],
+  reverse = false
 ) => {
   const sortedA = [...scoresA].sort((a, b) => (b || 0) - (a || 0));
   const sortedB = [...scoresB].sort((a, b) => (b || 0) - (a || 0));
@@ -24,6 +25,8 @@ export const compareScoreArrays = (
   for (let i = 0; i < maxLen && difference == 0; i++) {
     difference = (sortedB[i] || 0) - (sortedA[i] || 0);
   }
+
+  if (reverse) difference *= -1;
   return difference;
 };