From 36ded8fea35525bfa428e747b1ea572bfa79c87d Mon Sep 17 00:00:00 2001
From: Philip Forsberg <philip.forsberg@etimo.se>
Date: Fri, 15 Nov 2024 12:11:37 +0100
Subject: [PATCH] fix: team logotype on highscore list

---
 .../frontend/src/components/HighScoreTable.tsx | 18 ++++++++++++------
 packages/types/src/dto/highscore-dto.ts        |  2 +-
 2 files changed, 13 insertions(+), 7 deletions(-)

diff --git a/packages/frontend/src/components/HighScoreTable.tsx b/packages/frontend/src/components/HighScoreTable.tsx
index d55a76aaa..24a45349a 100644
--- a/packages/frontend/src/components/HighScoreTable.tsx
+++ b/packages/frontend/src/components/HighScoreTable.tsx
@@ -1,3 +1,4 @@
+import { IHighscoreDto } from '@etimo/diamonds2-types';
 import { FC, memo } from 'react';
 import { useHighScore } from '../hooks/useHighScore';
 import { Spinner } from './Spinner';
@@ -9,6 +10,16 @@ type HighScoreProps = {
 export const HighScoreTable: FC<HighScoreProps> = memo((props) => {
   const { seasonId } = props;
 
+  const logotype = (item: IHighscoreDto) => {
+    if (item.teamLogotype) {
+      return <img src={item.teamLogotype} alt="school-logo" />;
+    }
+    if (item.team) {
+      return item.team;
+    }
+    return '';
+  };
+
   if (!seasonId) {
     return <Spinner />;
   }
@@ -20,12 +31,7 @@ export const HighScoreTable: FC<HighScoreProps> = memo((props) => {
       data={highscore.map((item) => {
         return {
           name: item.botName,
-          team:
-            item.teamLogotype !== '' ? (
-              <img src={item.teamLogotype} alt="school-logo" />
-            ) : (
-              item.team
-            ),
+          team: logotype(item),
           score: item.score,
         };
       })}
diff --git a/packages/types/src/dto/highscore-dto.ts b/packages/types/src/dto/highscore-dto.ts
index 17da04e10..1c8a769d8 100644
--- a/packages/types/src/dto/highscore-dto.ts
+++ b/packages/types/src/dto/highscore-dto.ts
@@ -3,5 +3,5 @@ export interface IHighscoreDto {
   score: number;
   seasonId: string;
   team: string | null;
-  teamLogotype: string;
+  teamLogotype: string | null;
 }