implemented v7_relativeSplatPath

Altinn · Dec 10, 2024 · 8d5b1d4 · 8d5b1d4
1 parent 871592b
commit 8d5b1d4
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 55 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -28,44 +28,50 @@ export const App = () => (
         element={<FormFirstPage />}
       />
     </Route>
-    <Route
-      path='/instance-selection/*'
-      element={<InstanceSelectionWrapper />}
-    />
-
-    <Route
-      path='/party-selection/*'
-      element={<PartySelection />}
-    />
 
-    <Route
-      path='/instance/:partyId/:instanceGuid/*'
-      element={
-        <InstanceProvider>
-          <Outlet />
-        </InstanceProvider>
-      }
-    >
+    <Route path='/instance-selection'>
       <Route
-        path=':taskId/*'
-        element={<ProcessWrapper />}
+        path='*'
+        element={<InstanceSelectionWrapper />}
       />
+    </Route>
+
+    <Route path='/party-selection'>
       <Route
-        path={TaskKeys.ProcessEnd}
-        element={<DefaultReceipt />}
+        path='*'
+        element={<PartySelection />}
       />
-      <Route path={TaskKeys.CustomReceipt}>
+    </Route>
+
+    <Route path='/instance/:partyId/:instanceGuid'>
+      <Route
+        path='*'
+        element={
+          <InstanceProvider>
+            <Outlet />
+          </InstanceProvider>
+        }
+      >
         <Route
-          path='*'
-          element={<CustomReceipt />}
+          path=':taskId/*'
+          element={<ProcessWrapper />}
+        />
+        <Route
+          path={TaskKeys.ProcessEnd}
+          element={<DefaultReceipt />}
+        />
+        <Route path={TaskKeys.CustomReceipt}>
+          <Route
+            path='*'
+            element={<CustomReceipt />}
+          />
+        </Route>
+        <Route
+          index
+          element={<NavigateToStartUrl />}
         />
       </Route>
-      <Route
-        index
-        element={<NavigateToStartUrl />}
-      />
     </Route>
-
     {/**
      * Redirects from legacy URLs to new URLs
      */}

diff --git a/src/components/wrappers/ProcessWrapper.tsx b/src/components/wrappers/ProcessWrapper.tsx
@@ -140,14 +140,16 @@ export const ProcessWrapper = () => {
     return (
       <FormProvider>
         <Routes>
-          <Route
-            path=':pageKey/:componentId/*'
-            element={
-              <PresentationComponent type={ProcessTaskType.Data}>
-                <ComponentRouting />
-              </PresentationComponent>
-            }
-          />
+          <Route path=':pageKey/:componentId'>
+            <Route
+              path='*'
+              element={
+                <PresentationComponent type={ProcessTaskType.Data}>
+                  <ComponentRouting />
+                </PresentationComponent>
+              }
+            />
+          </Route>
           <Route
             path='*'
             element={

diff --git a/src/features/receipt/ReceiptContainer.tsx b/src/features/receipt/ReceiptContainer.tsx
@@ -116,14 +116,16 @@ export function CustomReceipt() {
   return (
     <FormProvider>
       <Routes>
-        <Route
-          path=':pageKey/:componentId/*'
-          element={
-            <PresentationComponent type={ProcessTaskType.Archived}>
-              <ComponentRouting />
-            </PresentationComponent>
-          }
-        />
+        <Route path=':pageKey/:componentId'>
+          <Route
+            path='*'
+            element={
+              <PresentationComponent type={ProcessTaskType.Archived}>
+                <ComponentRouting />
+              </PresentationComponent>
+            }
+          />
+        </Route>
         <Route
           path='*'
           element={

diff --git a/src/index.tsx b/src/index.tsx
@@ -44,18 +44,25 @@ import 'react-toastify/dist/ReactToastify.css';
 import 'src/index.css';
 import '@digdir/designsystemet-theme/brand/altinn/tokens.css';
 
-const router = createHashRouter([
+const router = createHashRouter(
+  [
+    {
+      path: '*',
+      element: (
+        <AppRoutingProvider>
+          <ErrorBoundary>
+            <Root />
+          </ErrorBoundary>
+        </AppRoutingProvider>
+      ),
+    },
+  ],
   {
-    path: '*',
-    element: (
-      <AppRoutingProvider>
-        <ErrorBoundary>
-          <Root />
-        </ErrorBoundary>
-      </AppRoutingProvider>
-    ),
+    future: {
+      v7_relativeSplatPath: true,
+    },
   },
-]);
+);
 
 document.addEventListener('DOMContentLoaded', () => {
   propagateTraceWhenPdf();