From 6c08d374a2c53c66a8acd518dae86ef3495cacfb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B8rnar=20=C3=98sttveit?=
 <47412359+bjosttveit@users.noreply.github.com>
Date: Wed, 22 Mar 2023 11:50:34 +0100
Subject: [PATCH] Fix custom receipt not showing the correct layout (#1024)

* Fix custom receipt

* fix receipt test
---
 .../customReceipt/containers/CustomReceipt.tsx    | 15 +++++----------
 .../receipt/containers/ReceiptContainer.test.tsx  |  8 ++++++--
 2 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/src/features/customReceipt/containers/CustomReceipt.tsx b/src/features/customReceipt/containers/CustomReceipt.tsx
index 5c8a22de9a..0b2559bfe6 100644
--- a/src/features/customReceipt/containers/CustomReceipt.tsx
+++ b/src/features/customReceipt/containers/CustomReceipt.tsx
@@ -11,24 +11,19 @@ import { useExprContext } from 'src/utils/layout/ExprContext';
 import { getFormHasErrors } from 'src/utils/validation/validation';
 
 export function CustomReceipt() {
-  const page = useExprContext()?.current();
-  const customReceipt = useAppSelector(
-    (state) =>
-      state.formLayout.layouts &&
-      state.formLayout.uiConfig.receiptLayoutName &&
-      state.formLayout.layouts[state.formLayout.uiConfig.receiptLayoutName],
-  );
+  const receiptLayoutName = useAppSelector((state) => state.formLayout.uiConfig.receiptLayoutName);
+  const page = useExprContext()?.findLayout(receiptLayoutName);
   const language = useAppSelector((state) => state.language.language);
   const hasErrors = useAppSelector((state) => getFormHasErrors(state.formValidations.validations));
 
   const [mainNodes, errorReportNodes] = React.useMemo(() => {
-    if (!customReceipt || !page) {
+    if (!page) {
       return [[], []];
     }
     return hasErrors ? extractBottomButtons(page) : [page.children(), []];
-  }, [page, customReceipt, hasErrors]);
+  }, [page, hasErrors]);
 
-  if (!language || !customReceipt) {
+  if (!language || !page) {
     return null;
   }
 
diff --git a/src/features/receipt/containers/ReceiptContainer.test.tsx b/src/features/receipt/containers/ReceiptContainer.test.tsx
index 9b38d09728..022a645218 100644
--- a/src/features/receipt/containers/ReceiptContainer.test.tsx
+++ b/src/features/receipt/containers/ReceiptContainer.test.tsx
@@ -5,6 +5,7 @@ import { screen } from '@testing-library/react';
 
 import { dataTypes, instanceOwner, partyMember, partyTypesAllowed, userProfile } from 'src/__mocks__/constants';
 import { getInstanceDataStateMock } from 'src/__mocks__/instanceDataStateMock';
+import { getUiConfigStateMock } from 'src/__mocks__/uiConfigStateMock';
 import { ReceiptContainer, returnInstanceMetaDataObject } from 'src/features/receipt/containers/ReceiptContainer';
 import { MemoryRouterWithRedirectingRoot, renderWithProviders } from 'src/testUtils';
 import type { ILayout } from 'src/layout/layout';
@@ -102,7 +103,7 @@ function getMockState({
 
   const receiptLayout = receiptLayoutExist ? { receipt } : {};
 
-  const customReceipt = setCustomReceipt ? { hiddenFields: [], receiptLayoutName: 'receipt' } : {};
+  const customReceipt = setCustomReceipt ? { receiptLayoutName: 'receipt' } : {};
 
   return {
     organisationMetaData: {
@@ -138,7 +139,10 @@ function getMockState({
       },
     },
     formLayout: {
-      uiConfig: customReceipt,
+      uiConfig: {
+        ...getUiConfigStateMock(),
+        ...customReceipt,
+      },
       layouts: {
         ...receiptLayout,
       },