solve 694

barbalex · Dec 12, 2024 · ce3cf5c · ce3cf5c
1 parent 1f38f2c
commit ce3cf5c
Show file tree

Hide file tree

Showing 10 changed files with 45 additions and 31 deletions.
diff --git a/src/components/Projekte/Daten/ApRouter/index.jsx b/src/components/Projekte/Daten/ApRouter/index.jsx
@@ -37,7 +37,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { apId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const { data, error, loading } = useQuery(query, {
     variables: { id: apId },
@@ -47,8 +47,10 @@ export const Component = () => {
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(apId) ? navigate(`./${value}`) : navigate(value),
-    [apId, navigate],
+      pathname.endsWith(apId) ?
+        navigate(`${value}${search}`)
+      : navigate(`../${value}${search}`),
+    [pathname, apId, navigate, search],
   )
 
   return (

diff --git a/src/components/Projekte/Daten/IdealbiotopRouter/index.jsx b/src/components/Projekte/Daten/IdealbiotopRouter/index.jsx
@@ -33,12 +33,14 @@ const TabContent = styled.div`
 export const Component = () => {
   const { apId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(apId) ? navigate(`./${value}`) : navigate(value),
-    [],
+      pathname.endsWith(apId) ?
+        navigate(`./${value}${search}`)
+      : navigate(`${value}${search}`),
+    [pathname, apId, navigate, search],
   )
   const path = pathname.split('/').filter((el) => !!el)
   const lastPathEl = path.at(-1)

diff --git a/src/components/Projekte/Daten/PopRouter/index.jsx b/src/components/Projekte/Daten/PopRouter/index.jsx
@@ -37,7 +37,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { popId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const {
     data,
@@ -54,8 +54,10 @@ export const Component = () => {
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(popId) ? navigate(`./${value}`) : navigate(value),
-    [popId, navigate],
+      pathname.endsWith(popId) ?
+        navigate(`./${value}${search}`)
+      : navigate(`${value}${search}`),
+    [pathname, popId, navigate, search],
   )
 
   return (

diff --git a/src/components/Projekte/Daten/QkRouter/index.jsx b/src/components/Projekte/Daten/QkRouter/index.jsx
@@ -36,7 +36,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { apId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const { data, loading, error, refetch } = useQuery(query, {
     variables: { apId },
@@ -48,8 +48,10 @@ export const Component = () => {
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(apId) ? navigate(`./${value}`) : navigate(value),
-    [pathname, apId, navigate],
+      pathname.endsWith(apId) ?
+        navigate(`./${value}${search}`)
+      : navigate(`${value}${search}`),
+    [pathname, apId, navigate, search],
   )
   const path = pathname.split('/').filter((el) => !!el)
   const lastPathEl = path.at(-1)

diff --git a/src/components/Projekte/Daten/TpopRouter/index.jsx b/src/components/Projekte/Daten/TpopRouter/index.jsx
@@ -38,7 +38,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { tpopId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const {
     data,
@@ -55,8 +55,10 @@ export const Component = () => {
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(tpopId) ? navigate(`./${value}`) : navigate(value),
-    [tpopId, navigate],
+      pathname.endsWith(tpopId) ?
+        navigate(`./${value}${search}`)
+      : navigate(`${value}${search}`),
+    [pathname, tpopId, navigate, search],
   )
 
   return (

diff --git a/src/components/Projekte/Daten/TpopfeldkontrRouter/index.jsx b/src/components/Projekte/Daten/TpopfeldkontrRouter/index.jsx
@@ -37,7 +37,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { tpopkontrId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const { data, loading, error } = useQuery(query, {
     variables: {
@@ -49,8 +49,10 @@ export const Component = () => {
 
   const onChangeTab = useCallback(
     (event, value) =>
-      pathname.endsWith(tpopkontrId) ? navigate(`./${value}`) : navigate(value),
-    [tpopkontrId, navigate, pathname],
+      pathname.endsWith(tpopkontrId) ?
+        navigate(`./${value}${search}`)
+      : navigate(`${value}${search}`),
+    [pathname, tpopkontrId, navigate, search],
   )
 
   return (

diff --git a/src/components/Projekte/Daten/TpopmassnRouter/index.jsx b/src/components/Projekte/Daten/TpopmassnRouter/index.jsx
@@ -37,7 +37,7 @@ const TabContent = styled.div`
 export const Component = () => {
   const { tpopmassnId, tpopId, popId, apId, projId } = useParams()
   const navigate = useNavigate()
-  const { pathname } = useLocation()
+  const { pathname, search } = useLocation()
 
   const { data, loading, error } = useQuery(query, {
     variables: {
@@ -50,10 +50,10 @@ export const Component = () => {
   const onChangeTab = useCallback(
     (event, value) => {
       navigate(
-        `/Daten/Projekte/${projId}/Arten/${apId}/Populationen/${popId}/Teil-Populationen/${tpopId}/Massnahmen/${tpopmassnId}/${value}`,
+        `/Daten/Projekte/${projId}/Arten/${apId}/Populationen/${popId}/Teil-Populationen/${tpopId}/Massnahmen/${tpopmassnId}/${value}${search}`,
       )
     },
-    [projId, apId, popId, tpopId, tpopmassnId, navigate],
+    [projId, apId, popId, tpopId, tpopmassnId, navigate, search],
   )
 
   return (

diff --git a/src/components/shared/Files/Menu/ListMenus.jsx b/src/components/shared/Files/Menu/ListMenus.jsx
@@ -17,7 +17,7 @@ export const ListMenus = memo(({ files }) => {
 
   const onClickPreview = useCallback(() => {
     navigate(`${firstFileId}/Vorschau${search}`)
-  }, [firstFileId])
+  }, [firstFileId, search, navigate])
 
   return (
     <ErrorBoundary>

diff --git a/src/components/shared/Files/Menu/PreviewMenus.jsx b/src/components/shared/Files/Menu/PreviewMenus.jsx
@@ -42,7 +42,7 @@ export const PreviewMenus = memo(
       const fileIdBeginsAt = pathname.indexOf(fileId)
       const newPathname = pathname.slice(0, fileIdBeginsAt)
       navigate(`${newPathname}${search}`)
-    }, [pathname, fileId])
+    }, [pathname, fileId, search, navigate])
 
     const [delMenuAnchorEl, setDelMenuAnchorEl] = useState(null)
     const delMenuOpen = Boolean(delMenuAnchorEl)
@@ -88,7 +88,7 @@ export const PreviewMenus = memo(
       }
       setDelMenuAnchorEl(null)
       refetch()
-      navigate(nextPathname)
+      navigate(`${nextPathname}${search}`)
     }, [
       fileId,
       files,
@@ -99,18 +99,19 @@ export const PreviewMenus = memo(
       refetch,
       store,
       navigate,
+      search,
     ])
 
     const onClickNext = useCallback(() => {
       const nextFileIndex = fileIndex + 1
       const nextFile = files[nextFileIndex] ?? files[0]
-      navigate(`${nextFile.fileId}/Vorschau`)
-    }, [fileIndex, files, navigate])
+      navigate(`${nextFile.fileId}/Vorschau${search}`)
+    }, [fileIndex, files, navigate, search])
 
     const onClickPrev = useCallback(() => {
       const prevFile = files[fileIndex - 1] ?? files[files.length - 1]
-      navigate(`${prevFile.fileId}/Vorschau`)
-    }, [fileIndex, files, navigate])
+      navigate(`${prevFile.fileId}/Vorschau${search}`)
+    }, [fileIndex, files, navigate, search])
 
     // enable reacting to fullscreen changes
     const [isFullscreen, setIsFullscreen] = useState(false)

diff --git a/src/components/shared/Files/index.jsx b/src/components/shared/Files/index.jsx
@@ -4,7 +4,7 @@ import { useApolloClient, gql } from '@apollo/client'
 import { useQuery } from '@tanstack/react-query'
 import styled from '@emotion/styled'
 import upperFirst from 'lodash/upperFirst'
-import { useNavigate, Outlet, useParams } from 'react-router'
+import { useNavigate, Outlet, useParams, useLocation } from 'react-router'
 
 import './index.css'
 
@@ -51,6 +51,7 @@ export const FilesRouter = memo(
   observer(({ parentId = '99999999-9999-9999-9999-999999999999', parent }) => {
     const store = useContext(StoreContext)
     const { fileId } = useParams()
+    const { search } = useLocation()
     const navigate = useNavigate()
     const client = useApolloClient()
     const uploaderCtx = useContext(UploaderContext)
@@ -148,11 +149,11 @@ export const FilesRouter = memo(
               `${parent}File`
             ]
           if (newFile) {
-            navigate(`${newFile.fileId}/Vorschau`)
+            navigate(`${newFile.fileId}/Vorschau${search}`)
           }
         }
       },
-      [client, fields, fragment, parent, parentId, refetch],
+      [client, fields, fragment, parent, parentId, refetch, search],
     )
 
     const onFileUploadFailed = useCallback((error) => {