Remove empty input fields in yaml preview

Signed-off-by: Yi Cai <[email protected]>

Author: ciiay

plugins/bulk-import/src/components/PreviewFile/PreviewPullRequest.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { useAsync } from 'react-use';
 
+import { Entity, EntityMeta } from '@backstage/catalog-model';
 import { useApi } from '@backstage/core-plugin-api';
 import {
   PreviewCatalogInfoComponent,
@@ -161,50 +162,60 @@ export const PreviewPullRequest = ({
       }
     }
     if (event.target.name.split('.').find(s => s === 'prAnnotations')) {
-      const annotations = getYamlKeyValuePairs(event.target.value);
+      const annotationsInput = event.target.value;
+      const yamlUpdate = { ...pullRequest[repoName]?.yaml };
+
+      if (annotationsInput.length === 0) {
+        delete yamlUpdate.metadata.annotations;
+      } else {
+        yamlUpdate.metadata.annotations =
+          getYamlKeyValuePairs(annotationsInput);
+      }
+
       setPullRequest({
         ...pullRequest,
         [repoName]: {
           ...pullRequest[repoName],
-          prAnnotations: event.target.value,
-          yaml: {
-            ...pullRequest[repoName]?.yaml,
-            metadata: {
-              ...pullRequest[repoName]?.yaml.metadata,
-              annotations: annotations,
-            },
-          },
+          prAnnotations: annotationsInput,
+          yaml: yamlUpdate,
         },
       });
     }
     if (event.target.name.split('.').find(s => s === 'prLabels')) {
-      const labels = getYamlKeyValuePairs(event.target.value);
+      const labelsInput = event.target.value;
+      const yamlUpdate = { ...pullRequest[repoName]?.yaml };
+
+      if (labelsInput.length === 0) {
+        delete yamlUpdate.metadata.labels;
+      } else {
+        yamlUpdate.metadata.labels = getYamlKeyValuePairs(labelsInput);
+      }
+
       setPullRequest({
         ...pullRequest,
         [repoName]: {
           ...pullRequest[repoName],
-          prLabels: event.target.value,
-          yaml: {
-            ...pullRequest[repoName]?.yaml,
-            metadata: {
-              ...pullRequest[repoName]?.yaml.metadata,
-              labels: labels,
-            },
-          },
+          prLabels: labelsInput,
+          yaml: yamlUpdate,
         },
       });
     }
     if (event.target.name.split('.').find(s => s === 'prSpec')) {
-      const spec = getYamlKeyValuePairs(event.target.value);
+      const specInput = event.target.value;
+      const yamlUpdate = { ...pullRequest[repoName]?.yaml };
+
+      if (specInput.length === 0) {
+        delete yamlUpdate.spec;
+      } else {
+        yamlUpdate.spec = getYamlKeyValuePairs(specInput);
+      }
+
       setPullRequest({
         ...pullRequest,
         [repoName]: {
           ...pullRequest[repoName],
-          prSpec: event.target.value,
-          yaml: {
-            ...pullRequest[repoName]?.yaml,
-            spec: spec,
-          },
+          prSpec: specInput,
+          yaml: yamlUpdate,
         },
       });
     }