Handle empty object in web actions (cashapp#2782)

jpulgarin · May 17, 2023 · f85afaa · f85afaa
1 parent 6782b81
commit f85afaa
Show file tree

Hide file tree

Showing 2 changed files with 36 additions and 21 deletions.
diff --git a/misk-admin/web/tabs/web-actions/package.json b/misk-admin/web/tabs/web-actions/package.json
@@ -30,7 +30,10 @@
     "@misk/prettier": "0.4.0",
     "@misk/tslint": "0.4.0",
     "tslib": "2.3.0",
-    "@misk/cli": "0.4.0"
+    "@misk/cli": "0.4.0",
+    "webpack": "4.43.0",
+    "webpack-cli": "3.3.11",
+    "webpack-dev-server": "3.11.0"
   },
   "jest": {
     "testEnvironment": "jsdom",

diff --git a/misk-admin/web/tabs/web-actions/src/rewrite/WebActionSendRequestFormComponents.tsx b/misk-admin/web/tabs/web-actions/src/rewrite/WebActionSendRequestFormComponents.tsx
@@ -1,6 +1,7 @@
 import React, { useState } from "react"
 import {
   Button,
+  Checkbox,
   Collapse,
   HTMLSelect,
   Icon,
@@ -220,27 +221,38 @@ function FormObjectComponent({
       protoType={field.type}
     >
       <div style={{ marginLeft: "12px" }}>
-        {complexType.fields.map(subField => {
-          return (
-            <FormComponent
-              webActionMetadata={webActionMetadata}
-              field={subField}
-              onChange={newChildVal => {
-                const newValue = _(_.clone(value) || {})
-                  .set(subField.name, newChildVal)
-                  .omitBy(_.isNull)
-                  .value()
+        {complexType.fields.length > 0 ? (
+          complexType.fields.map(subField => {
+            return (
+              <FormComponent
+                webActionMetadata={webActionMetadata}
+                field={subField}
+                onChange={newChildVal => {
+                  const newValue = _(_.clone(value) || {})
+                    .set(subField.name, newChildVal)
+                    .omitBy(_.isNull)
+                    .value()
 
-                if (_.isEmpty(newValue)) {
-                  onChange(null)
-                } else {
-                  onChange(newValue)
-                }
-              }}
-              value={_.get(value, subField.name, null)}
-            />
-          )
-        })}
+                  if (_.isEmpty(newValue)) {
+                    onChange(null)
+                  } else {
+                    onChange(newValue)
+                  }
+                }}
+                value={_.get(value, subField.name, null)}
+              />
+            )
+          })
+        ) : (
+          <Checkbox
+            onChange={e => {
+              const value = e.currentTarget.checked
+              onChange(value ? {} : undefined)
+            }}
+          >
+            Add as an empty object
+          </Checkbox>
+        )}
       </div>
     </FormComponentWrapper>
   )