From c051db4b1ff8880f7e136e8350c66770384eeefa Mon Sep 17 00:00:00 2001
From: liliana <liliana.sanfilippo@uni-bielefeld.de>
Date: Fri, 23 Aug 2024 21:22:29 +0200
Subject: [PATCH] fixed useNavigate

---
 src/components/goto.tsx    | 14 +++++++-------
 src/contents/education.tsx |  9 +++++----
 src/utils/useNavigation.ts | 15 +++++++++++++++
 3 files changed, 27 insertions(+), 11 deletions(-)
 create mode 100644 src/utils/useNavigation.ts

diff --git a/src/components/goto.tsx b/src/components/goto.tsx
index 5eb41f11..9b7a26dc 100644
--- a/src/components/goto.tsx
+++ b/src/components/goto.tsx
@@ -1,4 +1,4 @@
-import { useNavigate } from "react-router-dom";
+/* import { useNavigate } from "react-router-dom"; */
 
 export const goTo = (el: HTMLElement): void => {
     const elementTop = el.getBoundingClientRect().top;
@@ -50,12 +50,12 @@ export const SupScrollLink : React.FC<SupScrollLinkProps> = ({label }) => {
         </sup> 
     );
 };
-
-export const goToTextsAndOpenCollapsible = (collapseId: string) => {
+/* 
+export const goToTextsAndOpenCollapsible = ({collapseId, path}: {collapseId: string, path: string}) => {
     const navigate = useNavigate();
-    navigate(collapseId);
+    navigate(`${path}${collapseId}`);
 };
-export const goToPagesAndOpenTab = (tabId: string) => {
+export const goToPagesAndOpenTab = (tabId: string, path: string) => {
     const navigate = useNavigate();
-    navigate(tabId);
-};
\ No newline at end of file
+    navigate(`${path}${tabId}`);
+}; */
\ No newline at end of file
diff --git a/src/contents/education.tsx b/src/contents/education.tsx
index 8d40105e..22f9e8b3 100644
--- a/src/contents/education.tsx
+++ b/src/contents/education.tsx
@@ -1,11 +1,12 @@
 
 import { ButtonOne} from "../components/Buttons";
-import { goToPagesAndOpenTab, goToTextsAndOpenCollapsible } from "../components/goto";
 import { useEffect } from "react";
 import { useLocation } from "react-router-dom";
 import { openFromOtherPage } from "../components/Buttons";
+import { useNavigation } from "../utils/useNavigation";
 
 export function Education() {
+  const { goToPagesAndOpenTab, goToTextsAndOpenCollapsible } = useNavigation();
   const location = useLocation();
     useEffect(() => {
         const params = new URLSearchParams(location.search);
@@ -37,9 +38,9 @@ export function Education() {
       <>
         <div>
             <h2>Interviews Page</h2>
-            <button onClick={() => goToTextsAndOpenCollapsible("/description?collapseId=symptoms-collapsible")}>
+            <a onClick={() => goToTextsAndOpenCollapsible("symptoms-collapsible", "/description?collapseId=")}>  {/*   */}
                 Go to Texts and Open Collapsible 1
-            </button>
+            </a>
         </div>
         <div className="row align-items-center" style={{marginTop: "5vh", marginBottom: "5vh"}}>
         <div className="col">
@@ -96,7 +97,7 @@ export function Education() {
             <h3>Why and in which ways were we invested in MUKOmove? </h3>
           <p>We did not stop at our participation itself – we wanted to make other people from our university and city 
             aware of the event and collect sport hours for cystic fibrosis with them by inviting them to join our team. 
-            Our survey about cystic fibrosis awareness and our discussions with <a onClick={() => goToPagesAndOpenTab('/human-practices?tab=InvWesthoff')}>Kathrin Westhoff</a>, the head of a 
+            Our survey about cystic fibrosis awareness and our discussions with <a onClick={() => goToPagesAndOpenTab('InvWesthoff', '/human-practices?tab=')}>Kathrin Westhoff</a>, the head of a 
             practice for physiotherapy in Gütersloh who is also treating young CF patients, showed us how little known 
             this illness still is. Especially the interview with the physiotherapist made us realize how important 
             exercise is for everyone and how it brings a community together – we wanted to establish MUKOmove in 
diff --git a/src/utils/useNavigation.ts b/src/utils/useNavigation.ts
new file mode 100644
index 00000000..204956bd
--- /dev/null
+++ b/src/utils/useNavigation.ts
@@ -0,0 +1,15 @@
+import { useNavigate } from "react-router-dom";
+
+export const useNavigation = () => {
+    const navigate = useNavigate();
+
+    const goToPagesAndOpenTab = (tabId: string, path: string) => {
+        navigate(`${path}${tabId}`);
+    };
+
+    const goToTextsAndOpenCollapsible = (collapseId: string, path: string) => {
+        navigate(`${path}${collapseId}`);
+    };
+
+    return { goToPagesAndOpenTab, goToTextsAndOpenCollapsible };
+};
\ No newline at end of file
-- 
GitLab