From ad4a92eb45ae0ee10a4159f788cde7f3d212f1f1 Mon Sep 17 00:00:00 2001
From: JamalAlabdullah <jamal.mustafa.alabdullah@digdir.no>
Date: Fri, 23 Aug 2024 12:24:09 +0200
Subject: [PATCH] added validation for CreateCustomReceiptForm and test.

---
 .../CreateCustomReceiptForm.test.tsx          | 35 +++++++++++++++++++
 .../CreateCustomReceiptForm.tsx               |  4 +++
 2 files changed, 39 insertions(+)

diff --git a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.test.tsx b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.test.tsx
index 155ce6f0706..7f1e2e421ac 100644
--- a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.test.tsx
+++ b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.test.tsx
@@ -105,6 +105,41 @@ describe('CreateCustomReceiptForm', () => {
     expect(mockOnCloseForm).toHaveBeenCalledTimes(0);
   });
 
+  it('Displays error when there is just one character present for layouSetId', async () => {
+    const user = userEvent.setup();
+    renderCreateCustomReceiptForm();
+
+    const layoutSetInput = screen.getByLabelText(
+      textMock('process_editor.configuration_panel_custom_receipt_textfield_label'),
+    );
+    await user.type(layoutSetInput, 'a');
+
+    const combobox = screen.getByRole('combobox', {
+      name: textMock('process_editor.configuration_panel_custom_receipt_select_data_model_label'),
+    });
+    await user.click(combobox);
+
+    const optionElement = screen.getByRole('option', { name: mockAllDataModelIds[0] });
+    await user.click(optionElement);
+    await user.keyboard('{Escape}');
+
+    const createButton = screen.getByRole('button', {
+      name: textMock('process_editor.configuration_panel_custom_receipt_create_button'),
+    });
+    await user.click(createButton);
+
+    const layoutIdError = screen.getByText(
+      textMock('process_editor.configuration_panel_custom_receipt_layout_set_name_validation'),
+    );
+    expect(layoutIdError).toBeInTheDocument();
+
+    const dataModelIdError = screen.queryByText(
+      textMock('process_editor.configuration_panel_custom_receipt_create_data_model_error'),
+    );
+    expect(dataModelIdError).not.toBeInTheDocument();
+    expect(mockOnCloseForm).toHaveBeenCalledTimes(0);
+  });
+
   it('shows correct errormessage when layoutSetId is empty when typing in the textbox', async () => {
     const user = userEvent.setup();
     renderCreateCustomReceiptForm({
diff --git a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.tsx b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.tsx
index 75d5e42fe14..d6a6cfc1706 100644
--- a/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.tsx
+++ b/frontend/packages/process-editor/src/components/ConfigPanel/ConfigEndEvent/CustomReceiptContent/CreateCustomReceiptForm/CreateCustomReceiptForm.tsx
@@ -47,6 +47,10 @@ export const CreateCustomReceiptForm = ({
   const updateErrors = (customReceiptForm: CustomReceiptType) => {
     const { layoutSetId, dataModelId } = customReceiptForm;
     setLayoutSetError(!layoutSetId ? t('validation_errors.required') : null);
+    layoutSetId.length === 1 &&
+      setLayoutSetError(
+        t('process_editor.configuration_panel_custom_receipt_layout_set_name_validation'),
+      );
 
     setDataModelError(
       !dataModelId