From cc1b61a4da9d7b7114f7858f2eda94277ef26a62 Mon Sep 17 00:00:00 2001
From: Sondre Lefsaker <sondre.lefsaker@nav.no>
Date: Thu, 10 Oct 2024 15:55:47 +0200
Subject: [PATCH] wrap suspense query in <Suspense>

---
 .../TiltaksgjennomforingSkjemaContainer.tsx      | 16 +++++++++++-----
 .../TiltaksgjennomforingSkjemaDetaljer.tsx       |  2 +-
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaContainer.tsx b/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaContainer.tsx
index c425d3b749..18d8c0af9e 100644
--- a/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaContainer.tsx
+++ b/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaContainer.tsx
@@ -25,7 +25,9 @@ import { TiltaksgjennomforingSkjemaKnapperad } from "./TiltaksgjennomforingSkjem
 import { logEvent } from "@/logging/amplitude";
 import { RedaksjoneltInnholdBunnKnapperad } from "@/components/redaksjoneltInnhold/RedaksjoneltInnholdBunnKnapperad";
 import { TabWithErrorBorder } from "../skjema/TabWithErrorBorder";
-import { useCallback } from "react";
+import React, { useCallback } from "react";
+import { Laster } from "@/components/laster/Laster";
+import { InlineErrorBoundary } from "@mr/frontend-common";
 
 interface Props {
   onClose: () => void;
@@ -174,10 +176,14 @@ export function TiltaksgjennomforingSkjemaContainer({
             />
           </Tabs.List>
           <Tabs.Panel value="detaljer">
-            <TiltaksgjennomforingSkjemaDetaljer
-              avtale={avtale}
-              tiltaksgjennomforing={tiltaksgjennomforing}
-            />
+            <InlineErrorBoundary>
+              <React.Suspense fallback={<Laster tekst="Laster innhold" />}>
+                <TiltaksgjennomforingSkjemaDetaljer
+                  avtale={avtale}
+                  tiltaksgjennomforing={tiltaksgjennomforing}
+                />
+              </React.Suspense>
+            </InlineErrorBoundary>
           </Tabs.Panel>
           <Tabs.Panel value="redaksjonelt-innhold">
             <TiltakgjennomforingRedaksjoneltInnholdForm avtale={avtale} />
diff --git a/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaDetaljer.tsx b/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaDetaljer.tsx
index ef6b028770..2efb33ca3e 100644
--- a/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaDetaljer.tsx
+++ b/frontend/mr-admin-flate/src/components/tiltaksgjennomforinger/TiltaksgjennomforingSkjemaDetaljer.tsx
@@ -45,7 +45,7 @@ import { SkjemaKolonne } from "@/components/skjema/SkjemaKolonne";
 import { VertikalSeparator } from "@/components/skjema/VertikalSeparator";
 import { KontaktpersonButton } from "@/components/kontaktperson/KontaktpersonButton";
 import { isKursTiltak } from "@mr/frontend-common/utils/utils";
-import { useFeatureToggle } from "../../api/features/useFeatureToggle";
+import { useFeatureToggle } from "@/api/features/useFeatureToggle";
 import { TiltaksgjennomforingUtdanningskategorierSkjema } from "../utdanning/TiltaksgjennomforingUtdanningskategorierSkjema";
 
 interface Props {