From 87495cf7fb508240a00b19a215f1a043c61fbff5 Mon Sep 17 00:00:00 2001
From: Ian Paschal <ianpaschal@users.noreply.github.com>
Date: Sun, 3 Aug 2025 17:03:21 +0200
Subject: [PATCH] fix: Dashboard match results card create button

---
 .../MatchResultsCard/MatchResultsCard.tsx     | 79 ++++++++++---------
 1 file changed, 42 insertions(+), 37 deletions(-)

diff --git a/src/pages/DashboardPage/components/MatchResultsCard/MatchResultsCard.tsx b/src/pages/DashboardPage/components/MatchResultsCard/MatchResultsCard.tsx
index 9c95dfa5..8566df14 100644
--- a/src/pages/DashboardPage/components/MatchResultsCard/MatchResultsCard.tsx
+++ b/src/pages/DashboardPage/components/MatchResultsCard/MatchResultsCard.tsx
@@ -7,6 +7,7 @@ import { ScrollArea } from '~/components/generic/ScrollArea';
 import { Separator } from '~/components/generic/Separator';
 import { Spinner } from '~/components/generic/Spinner';
 import { MatchResultCard } from '~/components/MatchResultCard';
+import { MatchResultCreateDialog, useMatchResultCreateDialog } from '~/components/MatchResultCreateDialog';
 import { useGetMatchResults } from '~/services/matchResults';
 import { PATHS } from '~/settings';
 
@@ -21,54 +22,58 @@ export const MatchResultsCard = ({
 }: MatchResultsCardProps): JSX.Element => {
   const navigate = useNavigate();
   const { data: matchResults, loading } = useGetMatchResults({});
+  const { open } = useMatchResultCreateDialog();
 
   const handleViewMore = (): void => {
     navigate(PATHS.matchResults);
   };
 
   const handleCreate = (): void => {
-    navigate(PATHS.tournamentCreate);
+    open();
   };
 
   return (
-    <div className={clsx(styles.MatchResultsCard, className)}>
-      {loading ? (
-        <div className={styles.MatchResultsCard_Loading}>
-          <Spinner /> Loading...
-        </div>
-      ) : (
-        <>
-          <div className={styles.MatchResultsCard_Header}>
-            <h2>
-              Recent Matches
-            </h2>
-            <div className={styles.MatchResultsCard_Header_Actions}>
-              <Button variant="secondary" onClick={handleViewMore}>
-                <ChevronRight />
-              </Button>
-            </div>
+    <>
+      <div className={clsx(styles.MatchResultsCard, className)}>
+        {loading ? (
+          <div className={styles.MatchResultsCard_Loading}>
+            <Spinner /> Loading...
           </div>
-          <Separator />
-          {(matchResults ?? []).length ? (
-            <ScrollArea className={styles.MatchResultsCard_ScrollArea}>
-              <div className={styles.MatchResultsCard_List}>
-                {(matchResults ?? []).map((matchResult) => (
-                  <MatchResultCard key={matchResult._id} matchResult={matchResult} />
-                ))}
-                <div className={styles.MatchResultsCard_List_ViewAllButton} onClick={handleViewMore}>
-                  <Button>View All<ChevronRight /></Button>
-                </div>
+        ) : (
+          <>
+            <div className={styles.MatchResultsCard_Header}>
+              <h2>
+                Recent Matches
+              </h2>
+              <div className={styles.MatchResultsCard_Header_Actions}>
+                <Button variant="secondary" onClick={handleViewMore}>
+                  <ChevronRight />
+                </Button>
               </div>
-            </ScrollArea>
-          ) : (
-            <div className={styles.MatchResultsCard_EmptyState}>
-              <Button onClick={handleCreate}>
-                Check-In<Plus />
-              </Button>
             </div>
-          )}
-        </>
-      )}
-    </div>
+            <Separator />
+            {(matchResults ?? []).length ? (
+              <ScrollArea className={styles.MatchResultsCard_ScrollArea}>
+                <div className={styles.MatchResultsCard_List}>
+                  {(matchResults ?? []).map((matchResult) => (
+                    <MatchResultCard key={matchResult._id} matchResult={matchResult} />
+                  ))}
+                  <div className={styles.MatchResultsCard_List_ViewAllButton} onClick={handleViewMore}>
+                    <Button>View All<ChevronRight /></Button>
+                  </div>
+                </div>
+              </ScrollArea>
+            ) : (
+              <div className={styles.MatchResultsCard_EmptyState}>
+                <Button onClick={handleCreate}>
+                  Check-In<Plus />
+                </Button>
+              </div>
+            )}
+          </>
+        )}
+      </div>
+      <MatchResultCreateDialog />
+    </>
   );
 };