BUG - Chapter page issues 188

gita · Sep 8, 2023 · 8bc4ae6 · 8bc4ae6
1 parent d9960c4
commit 8bc4ae6
Showing 1 changed file with 9 additions and 5 deletions.
diff --git a/src/components/Chapter/VerseNavigator.tsx b/src/components/Chapter/VerseNavigator.tsx
@@ -1,12 +1,14 @@
 import { Dispatch, SetStateAction } from "react";
 import { useSelector } from "react-redux";
 
+import LinkWithLocale from "components/LinkWithLocale";
 import useMyStyles from "hooks/useMyStyles";
 import { RootState } from "redux/reducers/rootReducer";
 import { classNames } from "shared/functions";
 
 interface Props {
   verseCount: number;
+  currentChapter: number;
   currentVerse: number;
   viewNavigation: boolean;
   setViewNavigation: Dispatch<SetStateAction<boolean>>;
@@ -15,6 +17,7 @@ interface Props {
 
 function VerseNavigator({
   verseCount,
+  currentChapter,
   currentVerse,
   viewNavigation,
   setViewNavigation,
@@ -49,21 +52,22 @@ function VerseNavigator({
       {Array(verseCount)
         .fill(verseCount)
         .map((_verse, index) => (
+          <LinkWithLocale
+          href={`/chapter/${currentChapter}/verse/${index + 1}`}
+          prefetch={false}
+        >
           <div
-            onClick={() => {
-              setViewNavigation(false);
-              setVerseId(index + 1);
-            }}
             key={index}
             className={classNames(
-              `m-px flex min-w-[2.5rem] items-center justify-center rounded p-2 hover:cursor-pointer hover:bg-my-orange hover:text-white ${
+              `m-px flex min-w-[2.35rem] items-center justify-center rounded p-2 hover:cursor-pointer hover:bg-my-orange hover:text-white ${
                 index + 1 === currentVerse && "bg-my-orange text-white"
               }`,
               styles.fontSize.para,
             )}
           >
             {index + 1}
           </div>
+          </LinkWithLocale>
         ))}
     </div>
   );