Convert saved object management to json editor

[timroes]

Summary

PoC for #59588

TODO:

• Remove getEditUrl from saved object management definition
• Fix all the tests
• Write new tests
• Remove old form based UI
• Remove client side SO mapping
• Figure out what else can be removed
• Fix design issue (small scrolling behavior, inline heights, etc.)

Checklist

Delete any items that are not applicable to this PR.

• Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
• Documentation was added for features that require explanation or tutorials
• Unit or functional tests were updated or added to match the most common scenarios
• Any UI touched in this PR is usable by keyboard only (learn more about keyboard accessibility)
• Any UI touched in this PR does not create any new axe failures (run axe in browser: FF, Chrome)
• If a plugin configuration key changed, check if it needs to be allowlisted in the cloud and added to the docker list
• This renders correctly on smaller devices using a responsive layout. (You can test this in your browser)
• This was checked for cross-browser compatibility

For maintainers

• This was checked for breaking API changes and was labeled appropriately

[kibanamachine]

💔 Build Failed

• continuous-integration/kibana-ci/pull-request
• Commit: 18ceac6
• Storybooks Preview
• Pipeline Steps (look for red circles / failed steps)
• Interpreting CI Failures

Failed CI Steps

• Jest Unit Tests
• Execute xpack-kibana-ciGroup2
• Execute xpack-kibana-ciGroup2
• Check Types and Public API Docs
• Execute kibana-ciGroup7

---

Test Failures

Kibana Pipeline / jest / Jest Tests.src/plugins/saved_objects_management/public/management_section/objects_table/components.Table should render normally

Link to Jenkins

Standard Out

Failed Tests Reporter:
  - Test has not failed recently on tracked branches

Stack Trace

Error: expect(received).toMatchSnapshot()

Snapshot name: `Table should render normally 1`

- Snapshot  - 1
+ Received  + 0

@@ -140,11 +140,10 @@
              "sortable": false,
            },
            Object {
              "actions": Array [
                Object {
-                 "available": [Function],
                  "data-test-subj": "savedObjectsTableAction-inspect",
                  "description": "Inspect this saved object",
                  "icon": "inspect",
                  "name": "Inspect",
                  "onClick": [Function],
    at Object.<anonymous> (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx:80:23)
    at Promise.then.completed (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:276:28)
    at new Promise (<anonymous>)
    at callAsyncCircusFn (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:216:10)
    at _callCircusTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:212:40)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at _runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:149:3)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:63:9)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:57:9)
    at run (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:25:3)
    at runAndTransformResultsToJestFormat (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:176:21)
    at jestAdapter (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:109:19)
    at runTestInternal (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:380:16)
    at runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:472:34)
    at Object.worker (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/testWorker.js:133:12)

---

Kibana Pipeline / jest / Jest Tests.src/plugins/saved_objects_management/public/management_section/objects_table/components.Table prevents saved objects from being deleted

Link to Jenkins

Standard Out

Failed Tests Reporter:
  - Test has not failed recently on tracked branches

Stack Trace

Error: expect(received).toMatchSnapshot()

Snapshot name: `Table prevents saved objects from being deleted 1`

- Snapshot  - 1
+ Received  + 0

@@ -141,11 +141,10 @@
              "sortable": false,
            },
            Object {
              "actions": Array [
                Object {
-                 "available": [Function],
                  "data-test-subj": "savedObjectsTableAction-inspect",
                  "description": "Inspect this saved object",
                  "icon": "inspect",
                  "name": "Inspect",
                  "onClick": [Function],
    at Object.<anonymous> (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/src/plugins/saved_objects_management/public/management_section/objects_table/components/table.test.tsx:119:23)
    at Promise.then.completed (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:276:28)
    at new Promise (<anonymous>)
    at callAsyncCircusFn (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:216:10)
    at _callCircusTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:212:40)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at _runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:149:3)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:63:9)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:57:9)
    at run (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:25:3)
    at runAndTransformResultsToJestFormat (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:176:21)
    at jestAdapter (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:109:19)
    at runTestInternal (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:380:16)
    at runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:472:34)
    at Object.worker (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/testWorker.js:133:12)

---

Kibana Pipeline / jest / Jest Tests.src/plugins/saved_objects_management/public/management_section/object_view/components.Intro component renders correctly

Link to Jenkins

Standard Out

Failed Tests Reporter:
  - Test has not failed recently on tracked branches

Stack Trace

Error: expect(received).toMatchSnapshot()

Snapshot name: `Intro component renders correctly 1`

- Snapshot  - 71
+ Received  + 17

@@ -6,108 +6,72 @@
    type="search"
    viewUrl="/some-url"
  >
    <EuiPageHeader
      bottomBorder={true}
-     pageTitle={
-       <FormattedMessage
-         defaultMessage="Edit {title}"
-         id="savedObjectsManagement.view.editItemTitle"
-         values={
-           Object {
-             "title": "search",
-           }
-         }
-       />
-     }
+     pageTitle="Inspect saved object"
      rightSideItems={
        Array [
          <EuiButton
            data-test-subj="savedObjectEditViewInApp"
            href="/some-url"
            iconType="eye"
            size="s"
          >
            <FormattedMessage
-             defaultMessage="View {title}"
+             defaultMessage="View in application"
              id="savedObjectsManagement.view.viewItemButtonLabel"
-             values={
-               Object {
-                 "title": "search",
-               }
-             }
+             values={Object {}}
            />
          </EuiButton>,
          <EuiButton
            color="danger"
            data-test-subj="savedObjectEditDelete"
            iconType="trash"
            onClick={[Function]}
            size="s"
          >
            <FormattedMessage
-             defaultMessage="Delete {title}"
+             defaultMessage="Delete"
              id="savedObjectsManagement.view.deleteItemButtonLabel"
-             values={
-               Object {
-                 "title": "search",
-               }
-             }
+             values={Object {}}
            />
          </EuiButton>,
        ]
      }
    >
      <header
        className="euiPageHeader euiPageHeader--bottomBorder euiPageHeader--responsive euiPageHeader--center"
      >
        <EuiPageHeaderContent
-         pageTitle={
-           <FormattedMessage
-             defaultMessage="Edit {title}"
-             id="savedObjectsManagement.view.editItemTitle"
-             values={
-               Object {
-                 "title": "search",
-               }
-             }
-           />
-         }
+         pageTitle="Inspect saved object"
          responsive={true}
          rightSideItems={
            Array [
              <EuiButton
                data-test-subj="savedObjectEditViewInApp"
                href="/some-url"
                iconType="eye"
                size="s"
              >
                <FormattedMessage
-                 defaultMessage="View {title}"
+                 defaultMessage="View in application"
                  id="savedObjectsManagement.view.viewItemButtonLabel"
-                 values={
-                   Object {
-                     "title": "search",
-                   }
-                 }
+                 values={Object {}}
                />
              </EuiButton>,
              <EuiButton
                color="danger"
                data-test-subj="savedObjectEditDelete"
                iconType="trash"
                onClick={[Function]}
                size="s"
              >
                <FormattedMessage
-                 defaultMessage="Delete {title}"
+                 defaultMessage="Delete"
                  id="savedObjectsManagement.view.deleteItemButtonLabel"
-                 values={
-                   Object {
-                     "title": "search",
-                   }
-                 }
+                 values={Object {}}
                />
              </EuiButton>,
            ]
          }
        >
@@ -131,21 +95,11 @@
                      size="l"
                    >
                      <h1
                        className="euiTitle euiTitle--large"
                      >
-                       <FormattedMessage
-                         defaultMessage="Edit {title}"
-                         id="savedObjectsManagement.view.editItemTitle"
-                         values={
-                           Object {
-                             "title": "search",
-                           }
-                         }
-                       >
-                         Edit search
-                       </FormattedMessage>
+                       Inspect saved object
                      </h1>
                    </EuiTitle>
                  </div>
                </EuiFlexItem>
                <EuiFlexItem
@@ -225,19 +179,15 @@
                                      </EuiIcon>
                                      <span
                                        className="euiButton__text"
                                      >
                                        <FormattedMessage
-                                         defaultMessage="View {title}"
+                                         defaultMessage="View in application"
                                          id="savedObjectsManagement.view.viewItemButtonLabel"
-                                         values={
-                                           Object {
-                                             "title": "search",
-                                           }
-                                         }
+                                         values={Object {}}
                                        >
-                                         View search
+                                         View in application
                                        </FormattedMessage>
                                      </span>
                                    </span>
                                  </EuiButtonContent>
                                </a>
@@ -311,19 +261,15 @@
                                      </EuiIcon>
                                      <span
                                        className="euiButton__text"
                                      >
                                        <FormattedMessage
-                                         defaultMessage="Delete {title}"
+                                         defaultMessage="Delete"
                                          id="savedObjectsManagement.view.deleteItemButtonLabel"
-                                         values={
-                                           Object {
-                                             "title": "search",
-                                           }
-                                         }
+                                         values={Object {}}
                                        >
-                                         Delete search
+                                         Delete
                                        </FormattedMessage>
                                      </span>
                                    </span>
                                  </EuiButtonContent>
                                </button>
    at Object.<anonymous> (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/src/plugins/saved_objects_management/public/management_section/object_view/components/header.test.tsx:42:21)
    at Promise.then.completed (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:276:28)
    at new Promise (<anonymous>)
    at callAsyncCircusFn (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/utils.js:216:10)
    at _callCircusTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:212:40)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at _runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:149:3)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:63:9)
    at _runTestsForDescribeBlock (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:57:9)
    at run (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/run.js:25:3)
    at runAndTransformResultsToJestFormat (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapterInit.js:176:21)
    at jestAdapter (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-circus/build/legacy-code-todo-rewrite/jestAdapter.js:109:19)
    at runTestInternal (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:380:16)
    at runTest (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/runTest.js:472:34)
    at Object.worker (/var/lib/jenkins/workspace/elastic+kibana+pipeline-pull-request/kibana/node_modules/jest-runner/build/testWorker.js:133:12)

---

and 5 more failures, only showing the first 3.

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
savedObjectsManagement	79	78	-1

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
savedObjectsManagement	140.8KB	132.4KB	-8.3KB

Page load bundle

Size of the bundles that are downloaded on every page load. Target size is below 100kb

id	before	after	diff
savedObjectsManagement	34.3KB	33.9KB	-448.0B

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[timroes]

cc @TinaHeiligers I started a POC a while ago to show how this looks. I am going to close this (since this was never cleaned up or anything), but just wanted to make you aware in case anything here might help.