feat: brackets

.todo

@@ -0,0 +1,3 @@
+1vs1:
+    - ila knti t9dr tzid chi l3iba li drafti numbers of players matalan tkhtar 16 players t3tik 16 random players 7it bhad l3iba li daro ki yakhdo par rapport l lanes fhmti machi ghir random o sf
+    - Roulette 

app/dashboard/page.tsx

@@ -20,6 +20,9 @@ const Dashboard = async () => {
         participants: true,
         createdBy: true,
       },
+      orderBy: {
+        createdAt: 'desc',
+      },
     })) ?? [];
 
   const mapTournament = (tournament: (typeof tournaments)[0]) => ({

components/organisms/brackets.tsx

@@ -0,0 +1,11 @@
+import { Tournament } from '@prisma/client';
+
+interface BracketsProps {
+  tournament: Tournament;
+}
+
+const Brackets = ({ tournament }: BracketsProps) => {
+  return <div>WIP, stay tuned!</div>;
+};
+
+export default Brackets;

components/organisms/tournament-dashboard.tsx

@@ -13,6 +13,8 @@ import TournamentControls from '../molecules/tournament-controls';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { LuSwords, LuUsers2, LuUserX } from 'react-icons/lu';
 import Status from '../tournament-status';
+import { TbTournament } from 'react-icons/tb';
+import Brackets from './brackets';
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -22,19 +24,18 @@ const queryClient = new QueryClient({
   },
 });
 
-const TournamentDashboardConsumer = ({ tournamentId }: { tournamentId: string }) => {
-  const [open, setOpen] = useState(false);
+interface TournamentDashboardProps {
+  tournamentId: string;
+}
 
+const TournamentDashboardConsumer = ({ tournamentId }: TournamentDashboardProps) => {
+  const [open, setOpen] = useState(false);
   const { error, data } = useQuery(
     'tounament',
     () => fetch(`/api/tournament/${tournamentId}`).then((res) => res.json()),
-    {
-      refetchInterval: 5_000,
-    },
+    { refetchInterval: 5_000 },
   );
-
   if (error) return 'An error has occurred: ' + (error as Error).message;
-
   const tournament = data as TournamentData;
 
   return (
@@ -65,6 +66,10 @@ const TournamentDashboardConsumer = ({ tournamentId }: { tournamentId: string })
             <LuSwords className="w-4 h-4 mr-2" />
             Teams
           </TabsTrigger>
+          <TabsTrigger className="uppercase text-xl" value="brackets">
+            <TbTournament className="w-4 h-4 mr-2" />
+            Brackets
+          </TabsTrigger>
           <TabsTrigger className="uppercase text-xl" value="blacklisted">
             <LuUserX className="w-4 h-4 mr-2" />
             Blacklisted
@@ -80,14 +85,12 @@ const TournamentDashboardConsumer = ({ tournamentId }: { tournamentId: string })
                 <PickRandom tournamentId={tournamentId} open={open} onOpenChange={setOpen} />
               </div>
             </div>
-
             <TeamsTable data={tournament.teams} />
           </div>
         </TabsContent>
         <TabsContent value="participants" className="w-full flex-grow py-8">
           <div className="flex flex-col gap-4">
             <h3 className="text-3xl font-semibold">Participants:</h3>
-
             <ParticipantsTable data={tournament.participants} />
           </div>
         </TabsContent>
@@ -97,12 +100,20 @@ const TournamentDashboardConsumer = ({ tournamentId }: { tournamentId: string })
             <ParticipantsTable data={tournament.kickedPlayers} />
           </div>
         </TabsContent>
+        <TabsContent value="brackets" className="w-full flex-grow py-8">
+          <div className="flex flex-row gap-4 justify-between items-center">
+            <h3 className="text-3xl font-semibold">Brackets:</h3>
+            <div className="space-x-2">
+              <Brackets tournament={tournament} />
+            </div>
+          </div>
+        </TabsContent>
       </Tabs>
     </div>
   );
 };
 
-const TournamentDashboard = ({ tournamentId }: { tournamentId: string }) => {
+const TournamentDashboard = ({ tournamentId }: TournamentDashboardProps) => {
   return (
     <QueryClientProvider client={queryClient}>
       <TournamentDashboardConsumer tournamentId={tournamentId} />

lib/bracket.ts

@@ -0,0 +1,10 @@
+import { SqlDatabase } from 'brackets-prisma-db';
+import { BracketsManager } from 'brackets-manager';
+
+import prisma from './prisma';
+
+const storage = new SqlDatabase(prisma);
+
+const manager = new BracketsManager(storage);
+
+export default manager;

lib/table.ts

@@ -20,7 +20,7 @@ export const sortByStatus = (
   const bIndex = orderedEnum.indexOf(bStatus);
 
   if (aIndex === bIndex) {
-    return aCreatedAt > bCreatedAt ? 1 : -1;
+    return aCreatedAt < bCreatedAt ? 1 : -1;
   }
 
   return aIndex > bIndex ? 1 : -1;

package.json

@@ -3,7 +3,7 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
+    "dev": "next dev --turbo",
     "postinstall": "prisma generate",
     "build": "bash ./build.sh",
     "start": "next start",
@@ -27,6 +27,8 @@
     "@react-spring/web": "^9.7.3",
     "@t3-oss/env-nextjs": "^0.7.1",
     "@tanstack/react-table": "^8.10.7",
+    "brackets-manager": "^1.6.4",
+    "brackets-prisma-db": "^1.0.2",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.0.0",
     "d3-ease": "^3.0.1",