Alex/implement admin league operation

api/apiFunctions.test.tsx

@@ -5,6 +5,7 @@ import {
   resetPassword,
   resetRecoveredPassword,
   updateUserEmail,
+  getTotalEntries
 } from './apiFunctions';
 import { IUser } from './apiFunctions.interface';
 import { account, databases, ID } from './config';
@@ -497,4 +498,70 @@ describe('apiFunctions', () => {
       );
     });
   });
+
+  describe('getTotalEntries()', () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
+    it('should return the total number of entries and alive entries in a league', async () => {
+      (databases.listDocuments as jest.Mock).mockResolvedValue({
+        documents: [
+          {
+            name: 'Entry 1',
+            user: '1234',
+            league: {
+              $id: 'league1',
+              survivors: ['123'],
+              participants: ['123', '1234'],
+              leagueName: 'League 1',
+              logo: '',
+            },
+            eliminated: true,
+            selectedTeams: ['Browns', 'Bears'],
+          },
+          {
+            name: 'Entry 2',
+            user: '1234',
+            league: {
+              $id: 'league1',
+              survivors: ['123'],
+              participants: ['123', '1234'],
+              leagueName: 'League 1',
+              logo: '',
+            },
+            eliminated: false,
+            selectedTeams: ['Patriots', 'Eagles'],
+          },
+          {
+            name: 'Entry 3',
+            user: '1234',
+            league: {
+              $id: 'league2',
+              survivors: ['123'],
+              participants: ['123', '1234'],
+              leagueName: 'League 2',
+              logo: '',
+            },
+            eliminated: false,
+            selectedTeams: ['Bears', 'Cowboys'],
+          },
+        ],
+      });
+
+      const leagues = ['league1', 'league2'];
+
+      const result = await getTotalEntries({ leagues });
+
+      expect(result).toEqual([
+        {
+          totalEntries: 2,
+          alive: 1,
+        },
+        {
+          totalEntries: 1,
+          alive: 1,
+        },
+      ]);
+    });
+  });
 });

api/apiFunctions.ts

@@ -398,7 +398,6 @@ export async function createEntry({
 }
 
 /**
-
  * Update an entry
  * @param props - The entry data
  * @param props.entryId - The entry ID
@@ -498,3 +497,39 @@ export async function addUserToLeague({
     throw new Error('Error getting user document ID', { cause: error });
   }
 }
+
+/**
+ * Grabs the length of entries in each league.
+ * @param props - Props being passed in.
+ * @param props.leagues - All user leagues.
+ * @returns {Promise<number>} - Length of entries.
+ */
+export async function getTotalEntries({
+  leagues,
+}: {
+  leagues: string[];
+}): Promise<{ totalEntries: number; alive: number }[]> {
+  try {
+    const response = await databases.listDocuments(
+      appwriteConfig.databaseId,
+      Collection.ENTRIES,
+      [Query.limit(5000)],
+    );
+    const entries = leagues.map((leagueId) => {
+      const leagueEntries = response.documents.filter(
+        (entry) => entry.league.$id === leagueId,
+      );
+      const aliveEntries = leagueEntries.filter(
+        (aliveEntry) => aliveEntry.eliminated === false,
+      );
+
+      return {
+        totalEntries: leagueEntries.length,
+        alive: aliveEntries.length,
+      };
+    });
+    return entries;
+  } catch (error) {
+    throw error;
+  }
+}

app/(admin)/admin/leagues/page.test.tsx

@@ -1,10 +1,46 @@
-import { render, screen } from '@testing-library/react';
+import { render, screen, waitFor } from '@testing-library/react';
 import AdminLeagues from './page';
+import { getUserLeagues } from '@/utils/utils';
+import { getTotalEntries } from '@/api/apiFunctions';
+
+jest.mock('@/store/dataStore', () => ({
+  useDataStore: jest.fn(() => ({
+    user: {
+      documentId: '123',
+      id: '1234',
+      email: '[email protected]',
+      leagues: ['league1', 'league2'],
+    },
+  })),
+}));
+
+jest.mock('@/utils/utils', () => ({
+  getUserLeagues: jest.fn(() => Promise.resolve([])),
+  cn: jest.fn(),
+}));
+
+jest.mock('@/api/apiFunctions', () => ({
+  getTotalEntries: jest.fn(),
+}));
 
 describe('AdminLeagues', () => {
-  it('should render the AdminLeagues page with LeagueCard components', () => {
-    render(<AdminLeagues />);
-    const leagueCards = screen.getAllByTestId('LeagueCard');
-    expect(leagueCards.length).toBe(3);
+  render(<AdminLeagues />);
+
+  const mockGetUserLeagues = getUserLeagues as jest.Mock;
+  const mockGetTotalEntries = getTotalEntries as jest.Mock;
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should render the League data table component', async () => {
+    mockGetTotalEntries.mockResolvedValue([]);
+
+    mockGetUserLeagues.mockResolvedValue([]);
+
+    await waitFor(() => {
+      const leagueTable = screen.getByTestId('data-table');
+      expect(leagueTable).toBeInTheDocument();
+    });
   });
 });

app/(admin)/admin/leagues/page.tsx

@@ -1,34 +1,48 @@
 // Copyright (c) Gridiron Survivor.
 // Licensed under the MIT License.
 
-import { JSX } from 'react';
-import { LeagueCard } from '@/components/LeagueCard/LeagueCard';
+'use client';
+import { getTotalEntries } from '@/api/apiFunctions';
+import { getUserLeagues } from '@/utils/utils';
+import { IEntryWithLeague } from '@/components/TableColumns/TableColumns.interface';
+import { JSX, useEffect, useState } from 'react';
+import { leagueColumns } from '@/components/TableColumns/TableColumns';
+import TableData from '@/components/TableData/TableData';
+import { useDataStore } from '@/store/dataStore';
 
 /**
  * Renders the admin page.
  * @returns {JSX.Element} - The rendered Admin Leagues page.
  */
 const AdminLeagues = (): JSX.Element => {
+  const [leaguesData, setLeaguesData] = useState<IEntryWithLeague[]>([]);
+  const { user } = useDataStore((state) => state);
+
+  /**
+   * Get all leagues the user is a part of.
+   */
+  const fetchData = async (): Promise<void> => {
+    const entries = await getTotalEntries({ leagues: user.leagues });
+    const leagues = await getUserLeagues(user.leagues);
+    const combinedData = leagues.map((league, index) => ({
+      aliveEntries: entries[index].alive,
+      leagueId: '',
+      leagueName: league.leagueName,
+      logo: '',
+      participants: league.participants,
+      survivors: league.survivors,
+      totalEntries: entries[index].totalEntries,
+    }));
+    setLeaguesData(combinedData);
+  };
+
+  useEffect(() => {
+    fetchData();
+  }, [user.leagues]);
+
   return (
     <section className="grid grid-cols-2 gap-6">
-      <LeagueCard
-        href={'#'}
-        survivors={20}
-        title={'Demo League 1'}
-        totalPlayers={30}
-      />
-      <LeagueCard
-        href={'#'}
-        survivors={20}
-        title={'Demo League 2'}
-        totalPlayers={30}
-      />
-      <LeagueCard
-        href={'#'}
-        survivors={20}
-        title={'Demo League 3'}
-        totalPlayers={30}
-      />
+      <TableData columns={leagueColumns} data={leaguesData} />
     </section>
   );
 };

components/Table/Table.tsx

@@ -12,6 +12,7 @@ const Table = React.forwardRef<
     ref={ref}
     className={cn('table-auto border border-border rounded-md', className)}
     {...props}
+    data-testid="data-table"
   />
 ));
 Table.displayName = 'Table';

components/TableColumns/TableColumns.interface.ts

@@ -0,0 +1,9 @@
+// Copyright (c) Gridiron Survivor.
+// Licensed under the MIT License.
+
+import { ILeague } from '@/api/apiFunctions.interface';
+
+export interface IEntryWithLeague extends ILeague {
+  aliveEntries: number;
+  totalEntries: number;
+}