Add Reactjs modal form clear collection values

Signed-off-by: Hamza JGUERIM <hamzajg@gmail.com>
vlingo · Sep 4, 2021 · 59c4268 · 59c4268
1 parent 78fb17b
commit 59c4268
Show file tree

Hide file tree

Showing 8 changed files with 57 additions and 9 deletions.
diff --git a/src/main/resources/codegen/reactjs/AggregateDetail.ftl b/src/main/resources/codegen/reactjs/AggregateDetail.ftl
@@ -110,21 +110,40 @@ const ${fns.capitalize(aggregate.aggregateName)} = () => {
     }
     setCurrentModal(null);
   }, []);
-
   <#list aggregate.methods as method>
     <#if !method.useFactory >
+
   const _${method.name} = useCallback((e) => {
     console.log('showing ${method.name} modal');
     const form = {
       id: item.id,
       <#list method.parameters as p>
-      ${p}: item.${p}<#if p?has_next>,</#if>
+      ${p}: copyAndClearObject(item.${p})<#if p?has_next>,</#if>
       </#list>
     };
     setCurrentModal(<${aggregate.aggregateName}${fns.capitalize(method.name)} id={id} defaultForm={form} complete={onModalActionComplete}/>);
   }, [id, item, onModalActionComplete]);
     </#if>
   </#list>
+  <#if aggregate.methods?filter(method -> !method.useFactory)?has_content >
+
+  const copyAndClearObject = (obj) => {
+    if(obj === undefined || !Array.isArray(obj))
+      return obj;
+    return clearObjectValues(JSON.parse(JSON.stringify(obj)))
+  }
+
+  const clearObjectValues = (objToClear) => {
+    Object.keys(objToClear).forEach((param) => {
+      if (Array.isArray(objToClear[param]) || (objToClear[param]).toString() === "[object Object]") {
+        clearObjectValues(objToClear[param]);
+      } else {
+        objToClear[param] = undefined;
+      }
+    })
+    return objToClear;
+  };
+  </#if>
 
   useEffect(() => {
     setLoading(true);

diff --git a/src/test/resources/text-expectations/reactjs/author-detail-without-change-rank.text b/src/test/resources/text-expectations/reactjs/author-detail-without-change-rank.text
@@ -34,7 +34,6 @@ const Author = () => {
     setCurrentModal(null);
   }, []);
 
-
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/author-detail.text b/src/test/resources/text-expectations/reactjs/author-detail.text
@@ -39,11 +39,28 @@ const Author = () => {
     console.log('showing changeRank modal');
     const form = {
       id: item.id,
-      rank: item.rank
+      rank: copyAndClearObject(item.rank)
     };
     setCurrentModal(<AuthorChangeRank id={id} defaultForm={form} complete={onModalActionComplete}/>);
   }, [id, item, onModalActionComplete]);
 
+  const copyAndClearObject = (obj) => {
+    if(obj === undefined || !Array.isArray(obj))
+      return obj;
+    return clearObjectValues(JSON.parse(JSON.stringify(obj)))
+  }
+
+  const clearObjectValues = (objToClear) => {
+    Object.keys(objToClear).forEach((param) => {
+      if (Array.isArray(objToClear[param]) || (objToClear[param]).toString() === "[object Object]") {
+        clearObjectValues(objToClear[param]);
+      } else {
+        objToClear[param] = undefined;
+      }
+    })
+    return objToClear;
+  };
+
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/catalog-detail.text b/src/test/resources/text-expectations/reactjs/catalog-detail.text
@@ -39,11 +39,28 @@ const Catalog = () => {
     console.log('showing addItem modal');
     const form = {
       id: item.id,
-      items: item.items
+      items: copyAndClearObject(item.items)
     };
     setCurrentModal(<CatalogAddItem id={id} defaultForm={form} complete={onModalActionComplete}/>);
   }, [id, item, onModalActionComplete]);
 
+  const copyAndClearObject = (obj) => {
+    if(obj === undefined || !Array.isArray(obj))
+      return obj;
+    return clearObjectValues(JSON.parse(JSON.stringify(obj)))
+  }
+
+  const clearObjectValues = (objToClear) => {
+    Object.keys(objToClear).forEach((param) => {
+      if (Array.isArray(objToClear[param]) || (objToClear[param]).toString() === "[object Object]") {
+        clearObjectValues(objToClear[param]);
+      } else {
+        objToClear[param] = undefined;
+      }
+    })
+    return objToClear;
+  };
+
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/order-detail.text b/src/test/resources/text-expectations/reactjs/order-detail.text
@@ -34,7 +34,6 @@ const Order = () => {
     setCurrentModal(null);
   }, []);
 
-
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/proposal-detail.text b/src/test/resources/text-expectations/reactjs/proposal-detail.text
@@ -34,7 +34,6 @@ const Proposal = () => {
     setCurrentModal(null);
   }, []);
 
-
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/proposals-detail.text b/src/test/resources/text-expectations/reactjs/proposals-detail.text
@@ -34,7 +34,6 @@ const Proposal = () => {
     setCurrentModal(null);
   }, []);
 
-
   useEffect(() => {
     setLoading(true);
     loadItem(id);

diff --git a/src/test/resources/text-expectations/reactjs/user-detail.text b/src/test/resources/text-expectations/reactjs/user-detail.text
@@ -34,7 +34,6 @@ const User = () => {
     setCurrentModal(null);
   }, []);
 
-
   useEffect(() => {
     setLoading(true);
     loadItem(id);