同じURLで遷移できるように修正 ページがリセットされるイメージ

SATE_RECEIPT-27 領収証作成時

src/contexts/SearchConditionContext.tsx

@@ -99,7 +99,7 @@ export function SearchConditionContextProvider({ children }: Props) {
   const applyToURL = () => {
     if (!initialized) return;
 
-    navigateWhenChanged(pathname, condition, "applyToURL");
+    navigateWhenChanged(pathname, condition, { context: "applyToURL" });
   };
 
   const clearCondition = () => {

src/hooks/useNavigateCustom.ts

@@ -1,6 +1,7 @@
 import { useLocation, useNavigate } from "react-router";
 import { Dictionary } from "@types";
 import { PageID } from "codes/page";
+import { getPath } from "routes/path";
 
 export default function useNavigateCustom() {
   const navigate = useNavigate();
@@ -9,7 +10,10 @@ export default function useNavigateCustom() {
   const navigateWhenChanged = (
     path: string,
     param?: Dictionary | URLSearchParams | string,
-    context?: any
+    option?: {
+      reload?: boolean;
+      context?: any;
+    }
   ) => {
     const currentUrl = pathname + search;
     let newPath = path;
@@ -34,11 +38,21 @@ export default function useNavigateCustom() {
       }
     }
 
-    if (currentUrl !== newPath) {
-      if (context) {
-        console.log("navigate to", newPath, context);
+    if (currentUrl !== newPath || option?.reload) {
+      if (option?.context) {
+        console.log("navigate to", newPath, option.context);
+      }
+
+      // 同じURLで遷移要求があった場合、reload設定されていれば同じページを読み込みなおす
+      // 一旦、空白のページを経由する必要がある
+      if (currentUrl === newPath && option?.reload) {
+        navigate(getPath(PageID.NONE));
+        setTimeout(() => {
+          navigate(newPath);
+        }, 50);
+      } else {
+        navigate(newPath);
       }
-      navigate(newPath);
     }
   };
   return { navigate, navigateWhenChanged };

src/hooks/useTable.ts

@@ -134,7 +134,9 @@ export default function useTable<T extends object>(): UseTableReturn<T> {
       if (requestPage !== newPage) {
         setRequestPage(newPage);
       }
-      navigateWhenChanged(paging(newPage), search, "useTable.paging");
+      navigateWhenChanged(paging(newPage), search, {
+        context: "useTable.paging",
+      });
     }
   }, [requestPage, maxPage, fetched, page]);
 

src/layouts/dashbord/navigator.tsx

@@ -247,7 +247,7 @@ function SubGroup({ icon, label, id, children, option }: SubGroup) {
     const handleClick = () => {
       if (id) {
         const path = getPath(id, option);
-        navigateWhenChanged(path);
+        navigateWhenChanged(path, undefined, { reload: true });
       }
     };
     const selected = id === pageId;
@@ -280,8 +280,7 @@ function useContents(children: Child[]) {
 
         const handleClick = () => {
           const path = getPath(id, option);
-          console.log(path, id, option);
-          navigateWhenChanged(path);
+          navigateWhenChanged(path, undefined, { reload: true });
         };
 
         return (

src/routes/index.tsx

@@ -70,6 +70,10 @@ const DashboardRoutes = (): RouteObject => {
   const { canAccess } = useAuth();
 
   const allChildren = [
+    {
+      pageId: PageID.NONE,
+      element: null,
+    },
     {
       pageId: PageID.DASHBOARD_OVERVIEW,
       element: <Dashboard />,