web: make shooters in classifier runs table cliclabke

CodeHowlerMonkey · Feb 24, 2024 · 071a97d · 071a97d
1 parent db0df34
commit 071a97d
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 5 deletions.
diff --git a/web/src/components/RunsTable.jsx b/web/src/components/RunsTable.jsx
@@ -70,7 +70,11 @@ const DropdownFilter = ({
   />
 );
 
-export const useRunsTableData = ({ division, classifier }) => {
+export const useRunsTableData = ({
+  division,
+  classifier,
+  onShooterSelection,
+}) => {
   const {
     query: pageQuery,
     reset: resetPage,
@@ -132,6 +136,7 @@ const RunsTable = ({
   setFilter,
   setFilterHHF,
   setFilterClub,
+  onShooterSelection,
 }) => {
   return (
     <DataTable
@@ -172,7 +177,10 @@ const RunsTable = ({
         header="Shooter"
         sortable
         body={(run) => (
-          <>
+          <div
+            style={{ cursor: "pointer" }}
+            onClick={() => onShooterSelection?.(run.memberNumber)}
+          >
             <div style={{ position: "relative" }}>
               {run.memberNumber}
               <Tag
@@ -191,7 +199,7 @@ const RunsTable = ({
               />
             </div>
             <div style={{ fontSize: 14 }}>{run.name}</div>
-          </>
+          </div>
         )}
       />
       <Column

diff --git a/web/src/pages/ClassifiersPage/index.jsx b/web/src/pages/ClassifiersPage/index.jsx
@@ -20,6 +20,10 @@ const ClassifiersPage = () => {
     () => navigate(`/classifiers/${division}`),
     [navigate, division]
   );
+  const onShooterSelection = (memberNumber) =>
+    navigate(`/shooters/${division}/${memberNumber}`);
+
+  const onClubSelection = (club) => navigate("/clubs/" + club);
 
   return (
     <div className="mx-">
@@ -37,6 +41,8 @@ const ClassifiersPage = () => {
           division={division}
           classifier={classifier}
           onBackToClassifiers={onBackToClassifiers}
+          onShooterSelection={onShooterSelection}
+          onClubSelection={onClubSelection}
         />
       )}
     </div>
@@ -47,6 +53,8 @@ export const ClassifierRunsAndInfo = ({
   division,
   classifier,
   onBackToClassifiers,
+  onShooterSelection,
+  onClubSelection,
 }) => {
   const { info, ...useRunsTableDataResults } = useRunsTableData({
     division,
@@ -79,8 +87,8 @@ export const ClassifierRunsAndInfo = ({
 
       <RunsTable
         {...useRunsTableDataResults}
-        onShooterSelection={(shooter) => navigate("/shooters/" + shooter)}
-        onClubSelection={(club) => navigate("/clubs/" + club)}
+        onShooterSelection={onShooterSelection}
+        onClubSelection={onClubSelection}
       />
     </>
   );