feat: enables average calc on custom games that has only numeric values

src/components/Players/CardPicker/CardConfigs.ts

@@ -121,7 +121,11 @@ export const getRandomEmoji = () => {
 
 export const getCustomCards = (values: string[]) => {
   const customCards: CardConfig[] = customCardsTemplate;
-  values.forEach((value, index) => (customCards[index].displayValue = value));
+  const isEveryCardValueNumber = values.every((value) => !isNaN(Number(value)));
+  values.forEach((value, index) => {
+    customCards[index].displayValue = value;
+    if (isEveryCardValueNumber) customCards[index].value = Number(value);
+  });
 
   return customCards.filter(
     (card) => card.displayValue !== undefined && card.displayValue.trim() !== '',

src/components/Players/CardPicker/CardPicker.test.tsx

@@ -7,7 +7,7 @@ import * as playersService from '../../../service/players';
 import { Game, GameType } from '../../../types/game';
 import { Player } from '../../../types/player';
 import { Status } from '../../../types/status';
-import { getCards, getCustomCards } from './CardConfigs';
+import { getCards } from './CardConfigs';
 import { CardPicker } from './CardPicker';
 import * as cardConfigs from './CardConfigs';
 

src/components/Poker/GameController/GameController.test.tsx

@@ -19,9 +19,9 @@
     id: 'xyz',
     name: 'testGame',
     cards: [
-      { value: 1, displayValue: '1', color: 'red' },
-      { value: 2, displayValue: '2', color: 'blue' },
-      { value: 3, displayValue: '3', color: 'green' },
+      { value: 1, displayValue: 'A', color: 'red' },
+      { value: 2, displayValue: 'B', color: 'blue' },
+      { value: 3, displayValue: 'C', color: 'green' },
     ],
     createdBy: 'someone',
     createdAt: new Date(),
@@ -84,9 +84,26 @@
         currentPlayerId={mockCurrentPlayerId}
       />,
     );
-
+ 
     expect(screen.queryByText('Average:')).not.toBeInTheDocument();
   });
+  it('should display game average for Custom GameType', () => {
+    const mockGameWithNumericDisplayValues = { ...mockGame };
+    mockGameWithNumericDisplayValues.cards = [
+      { value: 1, displayValue: '1', color: 'red' },
+      { value: 2, displayValue: '2', color: 'blue' },
+      { value: 3, displayValue: '3', color: 'green' },
+    ]
+
+    render(
+      <GameController
+        game={{ ...mockGameWithNumericDisplayValues, gameType: GameType.Custom }}
+        currentPlayerId={mockCurrentPlayerId}
+      />,
+    );
+
+    expect(screen.queryByText('Average:')).toBeInTheDocument();
+  });
   it('should display exit option', () => {
     render(<GameController game={mockGame} currentPlayerId={mockCurrentPlayerId} />);
 

src/components/Poker/GameController/GameController.tsx

@@ -23,6 +23,7 @@ import { AlertDialog } from '../../../components/AlertDialog/AlertDialog';
 import { finishGame, removeGame, resetGame, updateStoryName } from '../../../service/games';
 import { Game, GameType } from '../../../types/game';
 import { isModerator } from '../../../utils/isModerator';
+import { isNumeric } from '../../../utils/isStringNumeric';
 import './GameController.css';
 
 interface GameControllerProps {
@@ -43,6 +44,8 @@ export const GameController: React.FC<GameControllerProps> = ({ game, currentPla
     document.body.removeChild(dummy);
     setShowCopiedMessage(true);
   };
+  const canShowAverageForCustomGameType =
+    game.gameType === GameType.Custom && game.cards.every((card) => isNumeric(card.displayValue));
 
   const leaveGame = () => {
     history.push(`/`);
@@ -67,7 +70,7 @@ export const GameController: React.FC<GameControllerProps> = ({ game, currentPla
                 </Typography>
                 {game.gameType !== GameType.TShirt &&
                   game.gameType !== GameType.TShirtAndNumber &&
-                  game.gameType !== GameType.Custom && (
+                  (game.gameType !== GameType.Custom || canShowAverageForCustomGameType) && (
                     <>
                       <Divider className='GameControllerDivider' orientation='vertical' flexItem />
                       <Typography variant='subtitle1'>Average:</Typography>

src/utils/isStringNumeric.test.ts

@@ -0,0 +1,53 @@
+import { isNumeric } from './isStringNumeric';
+
+describe('isModerator', () => {
+  it('"1" must be numeric', () => {
+    const result = isNumeric('1');
+
+    expect(result).toBe(true);
+  });
+
+  it('"2" must be numeric', () => {
+    const result = isNumeric('2');
+
+    expect(result).toBe(true);
+  });
+
+  it('"0" must be numeric', () => {
+    const result = isNumeric('0');
+
+    expect(result).toBe(true);
+  });
+
+
+  it('"-1" must be numeric', () => {
+    const result = isNumeric('-1');
+
+    expect(result).toBe(true);
+  });
+
+  it('"1.0" must be numeric', () => {
+    const result = isNumeric('1.0');
+
+    expect(result).toBe(true);
+  });
+
+  it('"1 1" must not be numeric', () => {
+    const result = isNumeric('1 1');
+
+    expect(result).toBe(false);
+  });
+
+
+  it('"z" must not be numeric', () => {
+    const result = isNumeric('z');
+
+    expect(result).toBe(false);
+  });
+
+  it('"1b" must not be numeric', () => {
+    const result = isNumeric('1b');
+
+    expect(result).toBe(false);
+  });
+});

src/utils/isStringNumeric.ts

@@ -0,0 +1,6 @@
+export const isNumeric = (incomingNumber: string | number) => {
+  if (typeof incomingNumber !== 'string' && typeof incomingNumber !== 'number') return false;
+  if (typeof incomingNumber === 'string' && incomingNumber.trim() === '') return false;
+  const number = Number(incomingNumber);
+  return Number.isFinite(number);
+};