From 01e56cd95be299438e2afd16deb4c59919f7cedc Mon Sep 17 00:00:00 2001
From: Sebastian Tilsch <sebastian.tilsch@slub-dresden.de>
Date: Sat, 10 Feb 2024 13:41:38 +0100
Subject: [PATCH] disallow adding of Involved things if data not valid

---
 .../renderer/MaterialArrayLayout.tsx          | 33 ++++++++++++++++---
 1 file changed, 28 insertions(+), 5 deletions(-)

diff --git a/apps/exhibition-live/components/renderer/MaterialArrayLayout.tsx b/apps/exhibition-live/components/renderer/MaterialArrayLayout.tsx
index 8353b8e6..74cf33a6 100644
--- a/apps/exhibition-live/components/renderer/MaterialArrayLayout.tsx
+++ b/apps/exhibition-live/components/renderer/MaterialArrayLayout.tsx
@@ -31,9 +31,7 @@ import {
   JsonSchema7,
   Resolve,
 } from "@jsonforms/core";
-import map from "lodash/map";
 import merge from "lodash/merge";
-import range from "lodash/range";
 import React, { useCallback, useMemo, useState } from "react";
 
 import { ArrayLayoutToolbar, getDefaultKey } from "./ArrayToolbar";
@@ -57,6 +55,7 @@ import AddIcon from "@mui/icons-material/Add";
 import { useGlobalCRUDOptions } from "../state/useGlobalCRUDOptions";
 import { useCRUDWithQueryClient } from "../state/useCRUDWithQueryClient";
 import { useSnackbar } from "notistack";
+import { ErrorObject } from "ajv";
 
 type OwnProps = {
   removeItems(path: string, toDelete: number[]): () => void;
@@ -90,6 +89,16 @@ const MaterialArrayLayoutComponent = (props: ArrayLayoutProps & {}) => {
     irisToData(slent(uuidv4()).value, typeIRI),
   );
 
+  const handleInlineFormDataChange = useCallback(
+    (data: any) => {
+      console.log("data", data);
+      setFormData({
+        data,
+      });
+    },
+    [setFormData],
+  );
+
   const handleCreateNew = useCallback(() => {
     setFormData(irisToData(slent(uuidv4()).value, typeIRI));
     setModalIsOpen(true);
@@ -147,6 +156,16 @@ const MaterialArrayLayoutComponent = (props: ArrayLayoutProps & {}) => {
   }, [setModalIsOpen, addItem, formData, setFormData, typeIRI]);
 
   const isReifiedStatement = Boolean(appliedUiSchemaOptions.isReifiedStatement);
+  const [inlineErrors, setInlineErrors] = useState<ErrorObject[]>([]);
+  const handleErrors = useCallback(
+    (err: ErrorObject[]) => {
+      console.log("errors", err);
+      setInlineErrors(err);
+    },
+    [setInlineErrors],
+  );
+
+  const formsPath = useMemo(() => makeFormsPath(config?.formsPath, path), [config?.formsPath, path]);
 
   return (
     <div>
@@ -195,16 +214,20 @@ const MaterialArrayLayoutComponent = (props: ArrayLayoutProps & {}) => {
               schema={subSchema}
               entityIRI={formData["@id"]}
               typeIRI={typeIRI}
+              onError={handleErrors}
               formData={formData}
-              onFormDataChange={(data) => setFormData(data)}
+              onFormDataChange={handleInlineFormDataChange}
               semanticJsonFormsProps={{
                 disableSimilarityFinder: true,
               }}
-              formsPath={makeFormsPath(config?.formsPath, path)}
+              formsPath={formsPath}
             />
           </Grid>
           <Grid item>
-            <IconButton onClick={handleSaveAndAdd}>
+            <IconButton
+              disabled={inlineErrors?.length > 0}
+              onClick={handleSaveAndAdd}
+            >
               <AddIcon style={{ fontSize: 40 }} />
             </IconButton>
           </Grid>