diff --git a/src/plugins/discover/public/application/components/context_app/__snapshots__/context_app_legacy.test.tsx.snap b/src/plugins/discover/public/application/components/context_app/__snapshots__/context_app_legacy.test.tsx.snap
deleted file mode 100644
index e0841683c370c..0000000000000
--- a/src/plugins/discover/public/application/components/context_app/__snapshots__/context_app_legacy.test.tsx.snap
+++ /dev/null
@@ -1,1775 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`ContextAppLegacy test renders correctly 1`] = `
-<ContextAppLegacy
-  columns={
-    Array [
-      "_source",
-    ]
-  }
-  filter={[Function]}
-  hits={
-    Array [
-      Object {
-        "_id": "123",
-        "_index": "test_index",
-        "_score": null,
-        "_source": Object {
-          "category": Array [
-            "Men's Clothing",
-          ],
-          "currency": "EUR",
-          "customer_first_name": "Walker",
-          "customer_full_name": "Walker Texas Ranger",
-          "customer_gender": "MALE",
-          "customer_last_name": "Ranger",
-        },
-        "_version": 1,
-        "fields": Array [
-          Object {
-            "order_date": Array [
-              "2020-10-19T13:35:02.000Z",
-            ],
-          },
-        ],
-        "sort": Array [
-          1603114502000,
-          2092,
-        ],
-      },
-    ]
-  }
-  indexPattern={
-    Object {
-      "id": "test_index_pattern",
-    }
-  }
-  intl={
-    Object {
-      "defaultFormats": Object {},
-      "defaultLocale": "en",
-      "formatDate": [Function],
-      "formatHTMLMessage": [Function],
-      "formatMessage": [Function],
-      "formatNumber": [Function],
-      "formatPlural": [Function],
-      "formatRelative": [Function],
-      "formatTime": [Function],
-      "formats": Object {
-        "date": Object {
-          "full": Object {
-            "day": "numeric",
-            "month": "long",
-            "weekday": "long",
-            "year": "numeric",
-          },
-          "long": Object {
-            "day": "numeric",
-            "month": "long",
-            "year": "numeric",
-          },
-          "medium": Object {
-            "day": "numeric",
-            "month": "short",
-            "year": "numeric",
-          },
-          "short": Object {
-            "day": "numeric",
-            "month": "numeric",
-            "year": "2-digit",
-          },
-        },
-        "number": Object {
-          "currency": Object {
-            "style": "currency",
-          },
-          "percent": Object {
-            "style": "percent",
-          },
-        },
-        "relative": Object {
-          "days": Object {
-            "units": "day",
-          },
-          "hours": Object {
-            "units": "hour",
-          },
-          "minutes": Object {
-            "units": "minute",
-          },
-          "months": Object {
-            "units": "month",
-          },
-          "seconds": Object {
-            "units": "second",
-          },
-          "years": Object {
-            "units": "year",
-          },
-        },
-        "time": Object {
-          "full": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-            "timeZoneName": "short",
-          },
-          "long": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-            "timeZoneName": "short",
-          },
-          "medium": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-          },
-          "short": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-          },
-        },
-      },
-      "formatters": Object {
-        "getDateTimeFormat": [Function],
-        "getMessageFormat": [Function],
-        "getNumberFormat": [Function],
-        "getPluralFormat": [Function],
-        "getRelativeFormat": [Function],
-      },
-      "locale": "en",
-      "messages": Object {},
-      "now": [Function],
-      "onError": [Function],
-      "textComponent": Symbol(react.fragment),
-      "timeZone": null,
-    }
-  }
-  minimumVisibleRows={5}
-  onChangePredecessorCount={[MockFunction]}
-  onChangeSuccessorCount={[MockFunction]}
-  predecessorAvailable={10}
-  predecessorCount={10}
-  predecessorStatus="loaded"
-  sorting={
-    Array [
-      "order_date",
-      "desc",
-    ]
-  }
-  status="loaded"
-  successorAvailable={10}
-  successorCount={10}
-  successorStatus="loaded"
->
-  <I18nProvider>
-    <IntlProvider
-      defaultLocale="en"
-      formats={
-        Object {
-          "date": Object {
-            "full": Object {
-              "day": "numeric",
-              "month": "long",
-              "weekday": "long",
-              "year": "numeric",
-            },
-            "long": Object {
-              "day": "numeric",
-              "month": "long",
-              "year": "numeric",
-            },
-            "medium": Object {
-              "day": "numeric",
-              "month": "short",
-              "year": "numeric",
-            },
-            "short": Object {
-              "day": "numeric",
-              "month": "numeric",
-              "year": "2-digit",
-            },
-          },
-          "number": Object {
-            "currency": Object {
-              "style": "currency",
-            },
-            "percent": Object {
-              "style": "percent",
-            },
-          },
-          "relative": Object {
-            "days": Object {
-              "units": "day",
-            },
-            "hours": Object {
-              "units": "hour",
-            },
-            "minutes": Object {
-              "units": "minute",
-            },
-            "months": Object {
-              "units": "month",
-            },
-            "seconds": Object {
-              "units": "second",
-            },
-            "years": Object {
-              "units": "year",
-            },
-          },
-          "time": Object {
-            "full": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-              "timeZoneName": "short",
-            },
-            "long": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-              "timeZoneName": "short",
-            },
-            "medium": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-            },
-            "short": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-            },
-          },
-        }
-      }
-      locale="en"
-      messages={Object {}}
-      textComponent={Symbol(react.fragment)}
-    >
-      <PseudoLocaleWrapper>
-        <ActionBar
-          docCount={10}
-          docCountAvailable={10}
-          isDisabled={false}
-          isLoading={false}
-          onChangeCount={[MockFunction]}
-          type="predecessors"
-        >
-          <I18nProvider>
-            <IntlProvider
-              defaultLocale="en"
-              formats={
-                Object {
-                  "date": Object {
-                    "full": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "weekday": "long",
-                      "year": "numeric",
-                    },
-                    "long": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "year": "numeric",
-                    },
-                    "medium": Object {
-                      "day": "numeric",
-                      "month": "short",
-                      "year": "numeric",
-                    },
-                    "short": Object {
-                      "day": "numeric",
-                      "month": "numeric",
-                      "year": "2-digit",
-                    },
-                  },
-                  "number": Object {
-                    "currency": Object {
-                      "style": "currency",
-                    },
-                    "percent": Object {
-                      "style": "percent",
-                    },
-                  },
-                  "relative": Object {
-                    "days": Object {
-                      "units": "day",
-                    },
-                    "hours": Object {
-                      "units": "hour",
-                    },
-                    "minutes": Object {
-                      "units": "minute",
-                    },
-                    "months": Object {
-                      "units": "month",
-                    },
-                    "seconds": Object {
-                      "units": "second",
-                    },
-                    "years": Object {
-                      "units": "year",
-                    },
-                  },
-                  "time": Object {
-                    "full": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "long": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "medium": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                    },
-                    "short": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                    },
-                  },
-                }
-              }
-              locale="en"
-              messages={Object {}}
-              textComponent={Symbol(react.fragment)}
-            >
-              <PseudoLocaleWrapper>
-                <form
-                  onSubmit={[Function]}
-                >
-                  <EuiFlexGroup
-                    direction="row"
-                    gutterSize="s"
-                    responsive={false}
-                  >
-                    <div
-                      className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow"
-                    >
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiButtonEmpty
-                            data-test-subj="predecessorsLoadMoreButton"
-                            flush="right"
-                            iconType="arrowUp"
-                            isDisabled={false}
-                            isLoading={false}
-                            onClick={[Function]}
-                          >
-                            <button
-                              className="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--flushRight"
-                              data-test-subj="predecessorsLoadMoreButton"
-                              onClick={[Function]}
-                              type="button"
-                            >
-                              <EuiButtonContent
-                                className="euiButtonEmpty__content"
-                                iconSide="left"
-                                iconType="arrowUp"
-                                isLoading={false}
-                                textProps={
-                                  Object {
-                                    "className": "euiButtonEmpty__text",
-                                  }
-                                }
-                              >
-                                <span
-                                  className="euiButtonContent euiButtonEmpty__content"
-                                >
-                                  <EuiIcon
-                                    className="euiButtonContent__icon"
-                                    size="m"
-                                    type="arrowUp"
-                                  >
-                                    <div
-                                      className="euiButtonContent__icon"
-                                      data-euiicon-type="arrowUp"
-                                      size="m"
-                                    />
-                                  </EuiIcon>
-                                  <span
-                                    className="euiButtonEmpty__text"
-                                  >
-                                    <FormattedMessage
-                                      defaultMessage="Load"
-                                      id="discover.context.loadButtonLabel"
-                                      values={Object {}}
-                                    >
-                                      Load
-                                    </FormattedMessage>
-                                  </span>
-                                </span>
-                              </EuiButtonContent>
-                            </button>
-                          </EuiButtonEmpty>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i27538080-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper"
-                              >
-                                <EuiFieldNumber
-                                  aria-label="Number of newer documents"
-                                  className="cxtSizePicker"
-                                  data-test-subj="predecessorsCountPicker"
-                                  disabled={false}
-                                  id="i27538080-1438-11eb-a63b-8fe591e95cbc"
-                                  max={10000}
-                                  min={0}
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  type="number"
-                                  value={10}
-                                >
-                                  <EuiFormControlLayout
-                                    compressed={false}
-                                    fullWidth={false}
-                                    inputId="i27538080-1438-11eb-a63b-8fe591e95cbc"
-                                    isLoading={false}
-                                  >
-                                    <div
-                                      className="euiFormControlLayout"
-                                    >
-                                      <div
-                                        className="euiFormControlLayout__childrenWrapper"
-                                      >
-                                        <EuiValidatableControl>
-                                          <input
-                                            aria-label="Number of newer documents"
-                                            className="euiFieldNumber cxtSizePicker"
-                                            data-test-subj="predecessorsCountPicker"
-                                            disabled={false}
-                                            id="i27538080-1438-11eb-a63b-8fe591e95cbc"
-                                            max={10000}
-                                            min={0}
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
-                                            type="number"
-                                            value={10}
-                                          />
-                                        </EuiValidatableControl>
-                                        <EuiFormControlLayoutIcons
-                                          isLoading={false}
-                                        />
-                                      </div>
-                                    </div>
-                                  </EuiFormControlLayout>
-                                </EuiFieldNumber>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem>
-                        <div
-                          className="euiFlexItem"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            displayOnly={true}
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i27555541-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper euiFormRow__fieldWrapperDisplayOnly"
-                              >
-                                <FormattedMessage
-                                  defaultMessage="newer documents"
-                                  id="i27555541-1438-11eb-a63b-8fe591e95cbc"
-                                  onBlur={[Function]}
-                                  onFocus={[Function]}
-                                  values={Object {}}
-                                >
-                                  newer documents
-                                </FormattedMessage>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                    </div>
-                  </EuiFlexGroup>
-                  <EuiSpacer
-                    size="s"
-                  >
-                    <div
-                      className="euiSpacer euiSpacer--s"
-                    />
-                  </EuiSpacer>
-                </form>
-              </PseudoLocaleWrapper>
-            </IntlProvider>
-          </I18nProvider>
-        </ActionBar>
-        <EuiPanel
-          paddingSize="none"
-        >
-          <div
-            className="euiPanel"
-          >
-            <div
-              className="discover-table"
-            >
-              <DocTableLegacy
-                columns={
-                  Array [
-                    "_source",
-                  ]
-                }
-                indexPattern={
-                  Object {
-                    "id": "test_index_pattern",
-                  }
-                }
-                minimumVisibleRows={5}
-                onFilter={[Function]}
-                rows={
-                  Array [
-                    Object {
-                      "_id": "123",
-                      "_index": "test_index",
-                      "_score": null,
-                      "_source": Object {
-                        "category": Array [
-                          "Men's Clothing",
-                        ],
-                        "currency": "EUR",
-                        "customer_first_name": "Walker",
-                        "customer_full_name": "Walker Texas Ranger",
-                        "customer_gender": "MALE",
-                        "customer_last_name": "Ranger",
-                      },
-                      "_version": 1,
-                      "fields": Array [
-                        Object {
-                          "order_date": Array [
-                            "2020-10-19T13:35:02.000Z",
-                          ],
-                        },
-                      ],
-                      "sort": Array [
-                        1603114502000,
-                        2092,
-                      ],
-                    },
-                  ]
-                }
-                sort={
-                  Array [
-                    Array [
-                      "order_date",
-                    ],
-                    Array [
-                      "desc",
-                    ],
-                  ]
-                }
-              >
-                <div />
-              </DocTableLegacy>
-            </div>
-          </div>
-        </EuiPanel>
-        <ActionBar
-          docCount={10}
-          docCountAvailable={10}
-          isDisabled={false}
-          isLoading={false}
-          onChangeCount={[MockFunction]}
-          type="successors"
-        >
-          <I18nProvider>
-            <IntlProvider
-              defaultLocale="en"
-              formats={
-                Object {
-                  "date": Object {
-                    "full": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "weekday": "long",
-                      "year": "numeric",
-                    },
-                    "long": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "year": "numeric",
-                    },
-                    "medium": Object {
-                      "day": "numeric",
-                      "month": "short",
-                      "year": "numeric",
-                    },
-                    "short": Object {
-                      "day": "numeric",
-                      "month": "numeric",
-                      "year": "2-digit",
-                    },
-                  },
-                  "number": Object {
-                    "currency": Object {
-                      "style": "currency",
-                    },
-                    "percent": Object {
-                      "style": "percent",
-                    },
-                  },
-                  "relative": Object {
-                    "days": Object {
-                      "units": "day",
-                    },
-                    "hours": Object {
-                      "units": "hour",
-                    },
-                    "minutes": Object {
-                      "units": "minute",
-                    },
-                    "months": Object {
-                      "units": "month",
-                    },
-                    "seconds": Object {
-                      "units": "second",
-                    },
-                    "years": Object {
-                      "units": "year",
-                    },
-                  },
-                  "time": Object {
-                    "full": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "long": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "medium": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                    },
-                    "short": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                    },
-                  },
-                }
-              }
-              locale="en"
-              messages={Object {}}
-              textComponent={Symbol(react.fragment)}
-            >
-              <PseudoLocaleWrapper>
-                <form
-                  onSubmit={[Function]}
-                >
-                  <EuiSpacer
-                    size="s"
-                  >
-                    <div
-                      className="euiSpacer euiSpacer--s"
-                    />
-                  </EuiSpacer>
-                  <EuiFlexGroup
-                    direction="row"
-                    gutterSize="s"
-                    responsive={false}
-                  >
-                    <div
-                      className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow"
-                    >
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiButtonEmpty
-                            data-test-subj="successorsLoadMoreButton"
-                            flush="right"
-                            iconType="arrowDown"
-                            isDisabled={false}
-                            isLoading={false}
-                            onClick={[Function]}
-                          >
-                            <button
-                              className="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--flushRight"
-                              data-test-subj="successorsLoadMoreButton"
-                              onClick={[Function]}
-                              type="button"
-                            >
-                              <EuiButtonContent
-                                className="euiButtonEmpty__content"
-                                iconSide="left"
-                                iconType="arrowDown"
-                                isLoading={false}
-                                textProps={
-                                  Object {
-                                    "className": "euiButtonEmpty__text",
-                                  }
-                                }
-                              >
-                                <span
-                                  className="euiButtonContent euiButtonEmpty__content"
-                                >
-                                  <EuiIcon
-                                    className="euiButtonContent__icon"
-                                    size="m"
-                                    type="arrowDown"
-                                  >
-                                    <div
-                                      className="euiButtonContent__icon"
-                                      data-euiicon-type="arrowDown"
-                                      size="m"
-                                    />
-                                  </EuiIcon>
-                                  <span
-                                    className="euiButtonEmpty__text"
-                                  >
-                                    <FormattedMessage
-                                      defaultMessage="Load"
-                                      id="discover.context.loadButtonLabel"
-                                      values={Object {}}
-                                    >
-                                      Load
-                                    </FormattedMessage>
-                                  </span>
-                                </span>
-                              </EuiButtonContent>
-                            </button>
-                          </EuiButtonEmpty>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i2756b4d1-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper"
-                              >
-                                <EuiFieldNumber
-                                  aria-label="Number of older documents"
-                                  className="cxtSizePicker"
-                                  data-test-subj="successorsCountPicker"
-                                  disabled={false}
-                                  id="i2756b4d1-1438-11eb-a63b-8fe591e95cbc"
-                                  max={10000}
-                                  min={0}
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  type="number"
-                                  value={10}
-                                >
-                                  <EuiFormControlLayout
-                                    compressed={false}
-                                    fullWidth={false}
-                                    inputId="i2756b4d1-1438-11eb-a63b-8fe591e95cbc"
-                                    isLoading={false}
-                                  >
-                                    <div
-                                      className="euiFormControlLayout"
-                                    >
-                                      <div
-                                        className="euiFormControlLayout__childrenWrapper"
-                                      >
-                                        <EuiValidatableControl>
-                                          <input
-                                            aria-label="Number of older documents"
-                                            className="euiFieldNumber cxtSizePicker"
-                                            data-test-subj="successorsCountPicker"
-                                            disabled={false}
-                                            id="i2756b4d1-1438-11eb-a63b-8fe591e95cbc"
-                                            max={10000}
-                                            min={0}
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
-                                            type="number"
-                                            value={10}
-                                          />
-                                        </EuiValidatableControl>
-                                        <EuiFormControlLayoutIcons
-                                          isLoading={false}
-                                        />
-                                      </div>
-                                    </div>
-                                  </EuiFormControlLayout>
-                                </EuiFieldNumber>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem>
-                        <div
-                          className="euiFlexItem"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            displayOnly={true}
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i27572a01-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper euiFormRow__fieldWrapperDisplayOnly"
-                              >
-                                <FormattedMessage
-                                  defaultMessage="older documents"
-                                  id="i27572a01-1438-11eb-a63b-8fe591e95cbc"
-                                  onBlur={[Function]}
-                                  onFocus={[Function]}
-                                  values={Object {}}
-                                >
-                                  older documents
-                                </FormattedMessage>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                    </div>
-                  </EuiFlexGroup>
-                </form>
-              </PseudoLocaleWrapper>
-            </IntlProvider>
-          </I18nProvider>
-        </ActionBar>
-      </PseudoLocaleWrapper>
-    </IntlProvider>
-  </I18nProvider>
-</ContextAppLegacy>
-`;
-
-exports[`ContextAppLegacy test renders loading indicator 1`] = `
-<ContextAppLegacy
-  columns={
-    Array [
-      "_source",
-    ]
-  }
-  filter={[Function]}
-  hits={
-    Array [
-      Object {
-        "_id": "123",
-        "_index": "test_index",
-        "_score": null,
-        "_source": Object {
-          "category": Array [
-            "Men's Clothing",
-          ],
-          "currency": "EUR",
-          "customer_first_name": "Walker",
-          "customer_full_name": "Walker Texas Ranger",
-          "customer_gender": "MALE",
-          "customer_last_name": "Ranger",
-        },
-        "_version": 1,
-        "fields": Array [
-          Object {
-            "order_date": Array [
-              "2020-10-19T13:35:02.000Z",
-            ],
-          },
-        ],
-        "sort": Array [
-          1603114502000,
-          2092,
-        ],
-      },
-    ]
-  }
-  indexPattern={
-    Object {
-      "id": "test_index_pattern",
-    }
-  }
-  intl={
-    Object {
-      "defaultFormats": Object {},
-      "defaultLocale": "en",
-      "formatDate": [Function],
-      "formatHTMLMessage": [Function],
-      "formatMessage": [Function],
-      "formatNumber": [Function],
-      "formatPlural": [Function],
-      "formatRelative": [Function],
-      "formatTime": [Function],
-      "formats": Object {
-        "date": Object {
-          "full": Object {
-            "day": "numeric",
-            "month": "long",
-            "weekday": "long",
-            "year": "numeric",
-          },
-          "long": Object {
-            "day": "numeric",
-            "month": "long",
-            "year": "numeric",
-          },
-          "medium": Object {
-            "day": "numeric",
-            "month": "short",
-            "year": "numeric",
-          },
-          "short": Object {
-            "day": "numeric",
-            "month": "numeric",
-            "year": "2-digit",
-          },
-        },
-        "number": Object {
-          "currency": Object {
-            "style": "currency",
-          },
-          "percent": Object {
-            "style": "percent",
-          },
-        },
-        "relative": Object {
-          "days": Object {
-            "units": "day",
-          },
-          "hours": Object {
-            "units": "hour",
-          },
-          "minutes": Object {
-            "units": "minute",
-          },
-          "months": Object {
-            "units": "month",
-          },
-          "seconds": Object {
-            "units": "second",
-          },
-          "years": Object {
-            "units": "year",
-          },
-        },
-        "time": Object {
-          "full": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-            "timeZoneName": "short",
-          },
-          "long": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-            "timeZoneName": "short",
-          },
-          "medium": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-            "second": "numeric",
-          },
-          "short": Object {
-            "hour": "numeric",
-            "minute": "numeric",
-          },
-        },
-      },
-      "formatters": Object {
-        "getDateTimeFormat": [Function],
-        "getMessageFormat": [Function],
-        "getNumberFormat": [Function],
-        "getPluralFormat": [Function],
-        "getRelativeFormat": [Function],
-      },
-      "locale": "en",
-      "messages": Object {},
-      "now": [Function],
-      "onError": [Function],
-      "textComponent": Symbol(react.fragment),
-      "timeZone": null,
-    }
-  }
-  minimumVisibleRows={5}
-  onChangePredecessorCount={[MockFunction]}
-  onChangeSuccessorCount={[MockFunction]}
-  predecessorAvailable={10}
-  predecessorCount={10}
-  predecessorStatus="loaded"
-  sorting={
-    Array [
-      "order_date",
-      "desc",
-    ]
-  }
-  status="loading"
-  successorAvailable={10}
-  successorCount={10}
-  successorStatus="loaded"
->
-  <I18nProvider>
-    <IntlProvider
-      defaultLocale="en"
-      formats={
-        Object {
-          "date": Object {
-            "full": Object {
-              "day": "numeric",
-              "month": "long",
-              "weekday": "long",
-              "year": "numeric",
-            },
-            "long": Object {
-              "day": "numeric",
-              "month": "long",
-              "year": "numeric",
-            },
-            "medium": Object {
-              "day": "numeric",
-              "month": "short",
-              "year": "numeric",
-            },
-            "short": Object {
-              "day": "numeric",
-              "month": "numeric",
-              "year": "2-digit",
-            },
-          },
-          "number": Object {
-            "currency": Object {
-              "style": "currency",
-            },
-            "percent": Object {
-              "style": "percent",
-            },
-          },
-          "relative": Object {
-            "days": Object {
-              "units": "day",
-            },
-            "hours": Object {
-              "units": "hour",
-            },
-            "minutes": Object {
-              "units": "minute",
-            },
-            "months": Object {
-              "units": "month",
-            },
-            "seconds": Object {
-              "units": "second",
-            },
-            "years": Object {
-              "units": "year",
-            },
-          },
-          "time": Object {
-            "full": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-              "timeZoneName": "short",
-            },
-            "long": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-              "timeZoneName": "short",
-            },
-            "medium": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-              "second": "numeric",
-            },
-            "short": Object {
-              "hour": "numeric",
-              "minute": "numeric",
-            },
-          },
-        }
-      }
-      locale="en"
-      messages={Object {}}
-      textComponent={Symbol(react.fragment)}
-    >
-      <PseudoLocaleWrapper>
-        <ActionBar
-          docCount={10}
-          docCountAvailable={10}
-          isDisabled={true}
-          isLoading={false}
-          onChangeCount={[MockFunction]}
-          type="predecessors"
-        >
-          <I18nProvider>
-            <IntlProvider
-              defaultLocale="en"
-              formats={
-                Object {
-                  "date": Object {
-                    "full": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "weekday": "long",
-                      "year": "numeric",
-                    },
-                    "long": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "year": "numeric",
-                    },
-                    "medium": Object {
-                      "day": "numeric",
-                      "month": "short",
-                      "year": "numeric",
-                    },
-                    "short": Object {
-                      "day": "numeric",
-                      "month": "numeric",
-                      "year": "2-digit",
-                    },
-                  },
-                  "number": Object {
-                    "currency": Object {
-                      "style": "currency",
-                    },
-                    "percent": Object {
-                      "style": "percent",
-                    },
-                  },
-                  "relative": Object {
-                    "days": Object {
-                      "units": "day",
-                    },
-                    "hours": Object {
-                      "units": "hour",
-                    },
-                    "minutes": Object {
-                      "units": "minute",
-                    },
-                    "months": Object {
-                      "units": "month",
-                    },
-                    "seconds": Object {
-                      "units": "second",
-                    },
-                    "years": Object {
-                      "units": "year",
-                    },
-                  },
-                  "time": Object {
-                    "full": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "long": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "medium": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                    },
-                    "short": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                    },
-                  },
-                }
-              }
-              locale="en"
-              messages={Object {}}
-              textComponent={Symbol(react.fragment)}
-            >
-              <PseudoLocaleWrapper>
-                <form
-                  onSubmit={[Function]}
-                >
-                  <EuiFlexGroup
-                    direction="row"
-                    gutterSize="s"
-                    responsive={false}
-                  >
-                    <div
-                      className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow"
-                    >
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiButtonEmpty
-                            data-test-subj="predecessorsLoadMoreButton"
-                            flush="right"
-                            iconType="arrowUp"
-                            isDisabled={true}
-                            isLoading={false}
-                            onClick={[Function]}
-                          >
-                            <button
-                              className="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--flushRight euiButtonEmpty-isDisabled"
-                              data-test-subj="predecessorsLoadMoreButton"
-                              disabled={true}
-                              onClick={[Function]}
-                              type="button"
-                            >
-                              <EuiButtonContent
-                                className="euiButtonEmpty__content"
-                                iconSide="left"
-                                iconType="arrowUp"
-                                isLoading={false}
-                                textProps={
-                                  Object {
-                                    "className": "euiButtonEmpty__text",
-                                  }
-                                }
-                              >
-                                <span
-                                  className="euiButtonContent euiButtonEmpty__content"
-                                >
-                                  <EuiIcon
-                                    className="euiButtonContent__icon"
-                                    size="m"
-                                    type="arrowUp"
-                                  >
-                                    <div
-                                      className="euiButtonContent__icon"
-                                      data-euiicon-type="arrowUp"
-                                      size="m"
-                                    />
-                                  </EuiIcon>
-                                  <span
-                                    className="euiButtonEmpty__text"
-                                  >
-                                    <FormattedMessage
-                                      defaultMessage="Load"
-                                      id="discover.context.loadButtonLabel"
-                                      values={Object {}}
-                                    >
-                                      Load
-                                    </FormattedMessage>
-                                  </span>
-                                </span>
-                              </EuiButtonContent>
-                            </button>
-                          </EuiButtonEmpty>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i2769a091-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper"
-                              >
-                                <EuiFieldNumber
-                                  aria-label="Number of newer documents"
-                                  className="cxtSizePicker"
-                                  data-test-subj="predecessorsCountPicker"
-                                  disabled={true}
-                                  id="i2769a091-1438-11eb-a63b-8fe591e95cbc"
-                                  max={10000}
-                                  min={0}
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  type="number"
-                                  value={10}
-                                >
-                                  <EuiFormControlLayout
-                                    compressed={false}
-                                    fullWidth={false}
-                                    inputId="i2769a091-1438-11eb-a63b-8fe591e95cbc"
-                                    isLoading={false}
-                                  >
-                                    <div
-                                      className="euiFormControlLayout"
-                                    >
-                                      <div
-                                        className="euiFormControlLayout__childrenWrapper"
-                                      >
-                                        <EuiValidatableControl>
-                                          <input
-                                            aria-label="Number of newer documents"
-                                            className="euiFieldNumber cxtSizePicker"
-                                            data-test-subj="predecessorsCountPicker"
-                                            disabled={true}
-                                            id="i2769a091-1438-11eb-a63b-8fe591e95cbc"
-                                            max={10000}
-                                            min={0}
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
-                                            type="number"
-                                            value={10}
-                                          />
-                                        </EuiValidatableControl>
-                                        <EuiFormControlLayoutIcons
-                                          isLoading={false}
-                                        />
-                                      </div>
-                                    </div>
-                                  </EuiFormControlLayout>
-                                </EuiFieldNumber>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem>
-                        <div
-                          className="euiFlexItem"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            displayOnly={true}
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i276a63e1-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper euiFormRow__fieldWrapperDisplayOnly"
-                              >
-                                <FormattedMessage
-                                  defaultMessage="newer documents"
-                                  id="i276a63e1-1438-11eb-a63b-8fe591e95cbc"
-                                  onBlur={[Function]}
-                                  onFocus={[Function]}
-                                  values={Object {}}
-                                >
-                                  newer documents
-                                </FormattedMessage>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                    </div>
-                  </EuiFlexGroup>
-                  <EuiSpacer
-                    size="s"
-                  >
-                    <div
-                      className="euiSpacer euiSpacer--s"
-                    />
-                  </EuiSpacer>
-                </form>
-              </PseudoLocaleWrapper>
-            </IntlProvider>
-          </I18nProvider>
-        </ActionBar>
-        <EuiPanel
-          data-test-subj="contextApp_loadingIndicator"
-          paddingSize="l"
-        >
-          <div
-            className="euiPanel euiPanel--paddingLarge"
-            data-test-subj="contextApp_loadingIndicator"
-          >
-            <EuiText
-              textAlign="center"
-            >
-              <div
-                className="euiText euiText--medium"
-              >
-                <EuiTextAlign
-                  textAlign="center"
-                >
-                  <div
-                    className="euiTextAlign euiTextAlign--center"
-                  >
-                    <FormattedMessage
-                      defaultMessage="Loading..."
-                      id="discover.context.loadingDescription"
-                      values={Object {}}
-                    >
-                      Loading...
-                    </FormattedMessage>
-                  </div>
-                </EuiTextAlign>
-              </div>
-            </EuiText>
-          </div>
-        </EuiPanel>
-        <ActionBar
-          docCount={10}
-          docCountAvailable={10}
-          isDisabled={true}
-          isLoading={false}
-          onChangeCount={[MockFunction]}
-          type="successors"
-        >
-          <I18nProvider>
-            <IntlProvider
-              defaultLocale="en"
-              formats={
-                Object {
-                  "date": Object {
-                    "full": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "weekday": "long",
-                      "year": "numeric",
-                    },
-                    "long": Object {
-                      "day": "numeric",
-                      "month": "long",
-                      "year": "numeric",
-                    },
-                    "medium": Object {
-                      "day": "numeric",
-                      "month": "short",
-                      "year": "numeric",
-                    },
-                    "short": Object {
-                      "day": "numeric",
-                      "month": "numeric",
-                      "year": "2-digit",
-                    },
-                  },
-                  "number": Object {
-                    "currency": Object {
-                      "style": "currency",
-                    },
-                    "percent": Object {
-                      "style": "percent",
-                    },
-                  },
-                  "relative": Object {
-                    "days": Object {
-                      "units": "day",
-                    },
-                    "hours": Object {
-                      "units": "hour",
-                    },
-                    "minutes": Object {
-                      "units": "minute",
-                    },
-                    "months": Object {
-                      "units": "month",
-                    },
-                    "seconds": Object {
-                      "units": "second",
-                    },
-                    "years": Object {
-                      "units": "year",
-                    },
-                  },
-                  "time": Object {
-                    "full": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "long": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                      "timeZoneName": "short",
-                    },
-                    "medium": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                      "second": "numeric",
-                    },
-                    "short": Object {
-                      "hour": "numeric",
-                      "minute": "numeric",
-                    },
-                  },
-                }
-              }
-              locale="en"
-              messages={Object {}}
-              textComponent={Symbol(react.fragment)}
-            >
-              <PseudoLocaleWrapper>
-                <form
-                  onSubmit={[Function]}
-                >
-                  <EuiSpacer
-                    size="s"
-                  >
-                    <div
-                      className="euiSpacer euiSpacer--s"
-                    />
-                  </EuiSpacer>
-                  <EuiFlexGroup
-                    direction="row"
-                    gutterSize="s"
-                    responsive={false}
-                  >
-                    <div
-                      className="euiFlexGroup euiFlexGroup--gutterSmall euiFlexGroup--directionRow"
-                    >
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiButtonEmpty
-                            data-test-subj="successorsLoadMoreButton"
-                            flush="right"
-                            iconType="arrowDown"
-                            isDisabled={true}
-                            isLoading={false}
-                            onClick={[Function]}
-                          >
-                            <button
-                              className="euiButtonEmpty euiButtonEmpty--primary euiButtonEmpty--flushRight euiButtonEmpty-isDisabled"
-                              data-test-subj="successorsLoadMoreButton"
-                              disabled={true}
-                              onClick={[Function]}
-                              type="button"
-                            >
-                              <EuiButtonContent
-                                className="euiButtonEmpty__content"
-                                iconSide="left"
-                                iconType="arrowDown"
-                                isLoading={false}
-                                textProps={
-                                  Object {
-                                    "className": "euiButtonEmpty__text",
-                                  }
-                                }
-                              >
-                                <span
-                                  className="euiButtonContent euiButtonEmpty__content"
-                                >
-                                  <EuiIcon
-                                    className="euiButtonContent__icon"
-                                    size="m"
-                                    type="arrowDown"
-                                  >
-                                    <div
-                                      className="euiButtonContent__icon"
-                                      data-euiicon-type="arrowDown"
-                                      size="m"
-                                    />
-                                  </EuiIcon>
-                                  <span
-                                    className="euiButtonEmpty__text"
-                                  >
-                                    <FormattedMessage
-                                      defaultMessage="Load"
-                                      id="discover.context.loadButtonLabel"
-                                      values={Object {}}
-                                    >
-                                      Load
-                                    </FormattedMessage>
-                                  </span>
-                                </span>
-                              </EuiButtonContent>
-                            </button>
-                          </EuiButtonEmpty>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem
-                        grow={false}
-                      >
-                        <div
-                          className="euiFlexItem euiFlexItem--flexGrowZero"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i276c38a1-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper"
-                              >
-                                <EuiFieldNumber
-                                  aria-label="Number of older documents"
-                                  className="cxtSizePicker"
-                                  data-test-subj="successorsCountPicker"
-                                  disabled={true}
-                                  id="i276c38a1-1438-11eb-a63b-8fe591e95cbc"
-                                  max={10000}
-                                  min={0}
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  type="number"
-                                  value={10}
-                                >
-                                  <EuiFormControlLayout
-                                    compressed={false}
-                                    fullWidth={false}
-                                    inputId="i276c38a1-1438-11eb-a63b-8fe591e95cbc"
-                                    isLoading={false}
-                                  >
-                                    <div
-                                      className="euiFormControlLayout"
-                                    >
-                                      <div
-                                        className="euiFormControlLayout__childrenWrapper"
-                                      >
-                                        <EuiValidatableControl>
-                                          <input
-                                            aria-label="Number of older documents"
-                                            className="euiFieldNumber cxtSizePicker"
-                                            data-test-subj="successorsCountPicker"
-                                            disabled={true}
-                                            id="i276c38a1-1438-11eb-a63b-8fe591e95cbc"
-                                            max={10000}
-                                            min={0}
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
-                                            type="number"
-                                            value={10}
-                                          />
-                                        </EuiValidatableControl>
-                                        <EuiFormControlLayoutIcons
-                                          isLoading={false}
-                                        />
-                                      </div>
-                                    </div>
-                                  </EuiFormControlLayout>
-                                </EuiFieldNumber>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                      <EuiFlexItem>
-                        <div
-                          className="euiFlexItem"
-                        >
-                          <EuiFormRow
-                            describedByIds={Array []}
-                            display="row"
-                            displayOnly={true}
-                            fullWidth={false}
-                            hasChildLabel={true}
-                            hasEmptyLabelSpace={false}
-                            labelType="label"
-                          >
-                            <div
-                              className="euiFormRow"
-                              id="i276cfbf1-1438-11eb-a63b-8fe591e95cbc-row"
-                            >
-                              <div
-                                className="euiFormRow__fieldWrapper euiFormRow__fieldWrapperDisplayOnly"
-                              >
-                                <FormattedMessage
-                                  defaultMessage="older documents"
-                                  id="i276cfbf1-1438-11eb-a63b-8fe591e95cbc"
-                                  onBlur={[Function]}
-                                  onFocus={[Function]}
-                                  values={Object {}}
-                                >
-                                  older documents
-                                </FormattedMessage>
-                              </div>
-                            </div>
-                          </EuiFormRow>
-                        </div>
-                      </EuiFlexItem>
-                    </div>
-                  </EuiFlexGroup>
-                </form>
-              </PseudoLocaleWrapper>
-            </IntlProvider>
-          </I18nProvider>
-        </ActionBar>
-      </PseudoLocaleWrapper>
-    </IntlProvider>
-  </I18nProvider>
-</ContextAppLegacy>
-`;
diff --git a/src/plugins/discover/public/application/components/context_app/context_app_legacy.test.tsx b/src/plugins/discover/public/application/components/context_app/context_app_legacy.test.tsx
index 3968e882aa7bb..716cf4c6d4e4f 100644
--- a/src/plugins/discover/public/application/components/context_app/context_app_legacy.test.tsx
+++ b/src/plugins/discover/public/application/components/context_app/context_app_legacy.test.tsx
@@ -65,7 +65,6 @@ describe('ContextAppLegacy test', () => {
 
   it('renders correctly', () => {
     const component = mountWithIntl(<ContextAppLegacy {...defaultProps} />);
-    expect(component).toMatchSnapshot();
     expect(component.find(DocTableLegacy).length).toBe(1);
     const loadingIndicator = findTestSubject(component, 'contextApp_loadingIndicator');
     expect(loadingIndicator.length).toBe(0);
@@ -76,7 +75,6 @@ describe('ContextAppLegacy test', () => {
     const props = { ...defaultProps };
     props.status = 'loading';
     const component = mountWithIntl(<ContextAppLegacy {...props} />);
-    expect(component).toMatchSnapshot();
     expect(component.find('DocTableLegacy').length).toBe(0);
     const loadingIndicator = findTestSubject(component, 'contextApp_loadingIndicator');
     expect(loadingIndicator.length).toBe(1);