github-mirrors/kibana
1
0
Fork 0
mirror of https://github.com/elastic/kibana.git synced 2025-04-23 17:28:26 -04:00
Code Issues Projects Releases Packages Wiki Activity

Upgrade EUI to v94.1.0 (major EuiTable refactors) (#180514)

Browse source 
`v93.6.0` ⏩ `v94.1.0`

> [!important]
> 👋 Hello everyone - this is a special release containing `EuiTable`'s
conversion to Emotion, several long-overdue cleanups and breaking
changes, and one or two fun new features. First, let's address the big
questions:

### Q: I'm listed as a codeowner, how much should I manually QA/review?

Answer: It depends on what exactly in your code changed, but _in
general_ I would strongly suggest at least pulling this branch down and
doing a quick visual smoke test of all tables (_note: **not**
datagrids_) in your apps/plugins. You should not expect to see any major
visual regressions.

If your table contained any kind of custom styling or behavior (e.g.
custom CSS, etc.) I **strongly** recommend taking more time to QA
thoroughly to ensure your table still looks and behaves as expected.
Teams with very manual or specific updates will be flagged below in
comment threads.

### Q: When do I need to review by?

This PR will be merged **after** 8.14FF. Because this upgrade touches so
many files and teams, we're aiming for asking for an admin merge by EOD
4/18 regardless of full approval status.

As always, you're welcome to ping us after merge if you find any issues
later ([see our
FAQ](https://github.com/elastic/eui/blob/main/wiki/eui-team-processes/upgrading-kibana.md#faq-for-kibana-teams)),
as you will have until 8.15FF to catch any bugs.

### Q: What breaking changes were made, and why?

Here's a quick shortlist of all the changes made that affected the
majority of the commits in this PR:

#### <u>Removed several top-level table props</u>
- The `responsive` prop has been removed in favor of the new
`responsiveBreakpoint` prop (same `false` behavior as before)
- The following props were removed from basic and in-memory tables:
  - `hasActions`, `isSelectable`, and `isExpandable`
- These props were not used for functionality and were only used for
styling tables in mobile/responsive views, which is not a best practice
pattern we wanted for our APIs. Mobile tables are now styled correctly
without needing consumers to pass these extra props.
  - `textOnly`
- This prop was unused and had no meaningful impact on tables or table
content.

#### Removed hidden mobile vs. desktop DOM

Previously, EUI would set classes that applied `display: none` CSS for
content that was hidden for mobile vs. desktop. This is no longer the
case, and content that only displays for mobile or only displays for
desktop will no longer render to the DOM at all if the table is not in
that responsive state.

This is both more performant when rendering large quantities of
cells/content, and simpler to write test assertions for when comparing
what the user actually sees vs. what the DOM ‘sees’.
(c3eeb08441e4b6efe6505e7cddaa87b540ddb259,
78cefcd954a7b46eaccd05e431b5e24dc86071a3)

#### Removed direct usages of table `className`s

EuiTable `classNames` no longer have any styles attached to them, so
some instances where Kibana usages were applying the `className` for
styles have been replaced with direct component usage or removed
entirely (86ce80b61f).

#### Custom table cell styles

Any custom CSS for table cells was previously being applied to the inner
`div.euiTableCellContent` wrapper. As of this latest release, the
`className` and `css` props will now be applied directly to the outer
`td.euiTableRowCell` element. If you were targeting custom styles table
cells, please re-QA your styles to ensure everything still looks as
expected.

---

<details open><summary>Full changelog (click to collapse)</summary>

##
[`v94.1.0-backport.0`](https://github.com/elastic/eui/releases/v94.1.0-backport.0)

**This is a backport release only intended for use by Kibana.**

**Bug fixes**

- Fixed a visual text alignment regression in `EuiTableRowCell`s with
the `row` header scope
([#7681](https://github.com/elastic/eui/pull/7681))

**Accessibility**

- Improved `EuiBasicTable` and `EuiInMemoryTable`'s selection checkboxes
to have unique aria-labels per row
([#7672](https://github.com/elastic/eui/pull/7672))

## [`v94.1.0`](https://github.com/elastic/eui/releases/v94.1.0)

- Updated `EuiTableHeaderCell` to show a subdued `sortable` icon for
columns that are not currently sorted but can be
([#7656](https://github.com/elastic/eui/pull/7656))
- Updated `EuiBasicTable` and `EuiInMemoryTable`'s
`columns[].actions[]`'s to pass back click events to `onClick` callbacks
as the second callback
([#7667](https://github.com/elastic/eui/pull/7667))

## [`v94.0.0`](https://github.com/elastic/eui/releases/v94.0.0)

- Updated `EuiTable`, `EuiBasicTable`, and `EuiInMemoryTable` with a new
`responsiveBreakpoint` prop, which allows customizing the point at which
the table collapses into a mobile-friendly view with cards
([#7625](https://github.com/elastic/eui/pull/7625))
- Updated `EuiProvider`'s `componentDefaults` prop to allow configuring
`EuiTable.responsiveBreakpoint`
([#7625](https://github.com/elastic/eui/pull/7625))

**Bug fixes**

- `EuiBasicTable` & `EuiInMemoryTable` `isPrimary` actions are now
correctly shown on mobile views
([#7640](https://github.com/elastic/eui/pull/7640))
- Table `mobileOptions`:
([#7642](https://github.com/elastic/eui/pull/7642))
- `mobileOptions.align` is now respected instead of all cells being
forced to left alignment
- `textTruncate` and `textOnly` are now respected even if a `render`
function is not passed

**Breaking changes**

- Removed unused `EuiTableHeaderButton` component
([#7621](https://github.com/elastic/eui/pull/7621))
- Removed the `responsive` prop from `EuiTable`, `EuiBasicTable`, and
`EuiInMemoryTable`. Use the new `responsiveBreakpoint` prop instead
([#7625](https://github.com/elastic/eui/pull/7625))
- The following props are no longer needed by `EuiBasicTable` or
`EuiInMemoryTable` for responsive table behavior to work correctly, and
can be removed: ([#7632](https://github.com/elastic/eui/pull/7632))
  - `isSelectable`
  - `isExpandable`
  - `hasActions`
- Removed the `showOnHover` prop from `EuiTableRowCell` /
`EuiBasicTable`/`EuiInMemoryTable`'s `columns` API. Use the new actions
`columns[].actions[].showOnHover` API instead.
([#7640](https://github.com/elastic/eui/pull/7640))
- Removed top-level `textOnly` prop from `EuiBasicTable` and
`EuiInMemoryTable`. Use `columns[].textOnly` instead.
([#7642](https://github.com/elastic/eui/pull/7642))

**DOM changes**

- `EuiTable` mobile headers no longer render in the DOM when not visible
(previously rendered with `display: none`). This may affect DOM testing
assertions. ([#7625](https://github.com/elastic/eui/pull/7625))
- `EuiTableRowCell` now applies passed `className`s to the parent `<td>`
element, instead of to the inner cell content `<div>`.
([#7631](https://github.com/elastic/eui/pull/7631))
- `EuiTableRow`s rendered by basic and memory tables now only render a
`.euiTableRow-isSelectable` className if the selection checkbox is not
disabled ([#7632](https://github.com/elastic/eui/pull/7632))
- `EuiTableRowCell`s with `textOnly` set to `false` will no longer
attempt to apply the `.euiTableCellContent__text` className to child
elements. ([#7641](https://github.com/elastic/eui/pull/7641))
- `EuiTableRowCell` no longer renders mobile headers to the DOM unless
the current table is displaying its responsive view.
([#7642](https://github.com/elastic/eui/pull/7642))
- `EuiTableHeaderCell` and `EuiTableRowCell` will no longer render in
the DOM at all on mobile if their columns' `mobileOptions.show` is set
to `false`. ([#7642](https://github.com/elastic/eui/pull/7642))
- `EuiTableHeaderCell` and `EuiTableRowCell` will no longer render in
the DOM at all on desktop if their columns' `mobileOptions.only` is set
to `true`. ([#7642](https://github.com/elastic/eui/pull/7642))

**CSS-in-JS conversions**

- Converted `EuiTable`, `EuiTableRow`, `EuiTableRowCell`, and all other
table subcomponents to Emotion
([#7654](https://github.com/elastic/eui/pull/7654))
- Removed the following `EuiTable` Sass variables:
([#7654](https://github.com/elastic/eui/pull/7654))
  - `$euiTableCellContentPadding`
  - `$euiTableCellContentPaddingCompressed`
  - `$euiTableCellCheckboxWidth`
  - `$euiTableHoverColor`
  - `$euiTableSelectedColor`
  - `$euiTableHoverSelectedColor`
  - `$euiTableActionsBorderColor`
  - `$euiTableHoverClickableColor`
  - `$euiTableFocusClickableColor`
- Removed the following `EuiTable` Sass mixins:
([#7654](https://github.com/elastic/eui/pull/7654))
  - `euiTableActionsBackgroundMobile`
  - `euiTableCellCheckbox`
  - `euiTableCell`
</details>
This commit is contained in:
Cee Chen 2024-04-18 16:05:48 -07:00 • committed by GitHub
parent 8f23f23f4d
commit cbc68cd40c
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
214 changed files with 1144 additions and 1732 deletions
Download patch file Download diff file Expand all files Collapse all files

12
examples/data_view_field_editor_example/public/app.tsx
View file

@ -7,6 +7,7 @@
*/
import {
EuiProvider,
DefaultItemAction,
EuiButton,
EuiCheckbox,
@ -121,7 +122,6 @@ const DataViewFieldEditorExample = ({ dataView, dataViewFieldEditor }: Props) =>
items={fields}
columns={columns}
pagination={true}
hasActions={true}
sorting={{
sort: {
field: 'name',
@ -135,10 +135,12 @@ const DataViewFieldEditorExample = ({ dataView, dataViewFieldEditor }: Props) =>
);
return (
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Data view field editor demo" />
<EuiPageTemplate.Section>{content}</EuiPageTemplate.Section>
</EuiPageTemplate>
<EuiProvider>
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Data view field editor demo" />
<EuiPageTemplate.Section>{content}</EuiPageTemplate.Section>
</EuiPageTemplate>
</EuiProvider>
);
};

53
examples/field_formats_example/public/app.tsx
View file

@ -14,6 +14,7 @@ import {
EuiCodeBlock,
EuiLink,
EuiPageTemplate,
EuiProvider,
EuiSpacer,
EuiText,
EuiTitle,
@ -61,7 +62,6 @@ const UsingAnExistingFieldFormatExample: React.FC<{ deps: Deps }> = (props) => {
<EuiBasicTable
data-test-subj={'example1 sample table'}
items={sample}
textOnly={true}
columns={[
{
field: 'raw',
@ -100,7 +100,6 @@ const CreatingCustomFieldFormat: React.FC<{ deps: Deps }> = (props) => {
<EuiSpacer size={'s'} />
<EuiBasicTable
items={sample}
textOnly={true}
data-test-subj={'example2 sample table'}
columns={[
{
@ -168,29 +167,31 @@ const CreatingCustomFieldFormatEditor: React.FC<{ deps: Deps }> = (props) => {
export const App: React.FC<{ deps: Deps }> = (props) => {
return (
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Field formats examples" />
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Using an existing field format</h2>
</EuiTitle>
<EuiSpacer />
<UsingAnExistingFieldFormatExample deps={props.deps} />
</EuiPageTemplate.Section>
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Creating a custom field format</h2>
</EuiTitle>
<EuiSpacer />
<CreatingCustomFieldFormat deps={props.deps} />
</EuiPageTemplate.Section>
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Creating a custom field format editor</h2>
</EuiTitle>
<EuiSpacer />
<CreatingCustomFieldFormatEditor deps={props.deps} />
</EuiPageTemplate.Section>
</EuiPageTemplate>
<EuiProvider>
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Field formats examples" />
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Using an existing field format</h2>
</EuiTitle>
<EuiSpacer />
<UsingAnExistingFieldFormatExample deps={props.deps} />
</EuiPageTemplate.Section>
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Creating a custom field format</h2>
</EuiTitle>
<EuiSpacer />
<CreatingCustomFieldFormat deps={props.deps} />
</EuiPageTemplate.Section>
<EuiPageTemplate.Section grow={false}>
<EuiTitle size="m">
<h2>Creating a custom field format editor</h2>
</EuiTitle>
<EuiSpacer />
<CreatingCustomFieldFormatEditor deps={props.deps} />
</EuiPageTemplate.Section>
</EuiPageTemplate>
</EuiProvider>
);
};

5
examples/files_example/public/components/app.tsx
View file

@ -12,6 +12,7 @@ import type { FileJSON } from '@kbn/files-plugin/common';
import type { FilesClientResponses } from '@kbn/files-plugin/public';
import {
EuiProvider,
EuiPageTemplate,
EuiInMemoryTable,
EuiInMemoryTableProps,
@ -131,7 +132,7 @@ export const FilesExampleApp = ({ files, notifications }: FilesExampleAppDeps) =
];
return (
<>
<EuiProvider>
<EuiPageTemplate restrictWidth>
<EuiPageTemplate.Header pageTitle="Files example" />
<EuiPageTemplate.Section>
@ -185,6 +186,6 @@ export const FilesExampleApp = ({ files, notifications }: FilesExampleAppDeps) =
}}
/>
)}
</>
</EuiProvider>
);
};

62
examples/partial_results_example/public/app/app.tsx
View file

@ -9,6 +9,7 @@
import React, { useContext, useEffect, useState } from 'react';
import { pluck } from 'rxjs';
import {
EuiProvider,
EuiBasicTable,
EuiCallOut,
EuiCodeBlock,
@ -40,35 +41,36 @@ export function App() {
}, [expressions]);
return (
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Partial Results Demo" />
<EuiPageTemplate.Section>
<EuiText data-test-subj="example-help">
<p>
This example listens for the window events and adds them to the table along with a
trigger counter.
</p>
</EuiText>
<EuiSpacer size={'m'} />
<EuiCodeBlock>{expression}</EuiCodeBlock>
<EuiSpacer size={'m'} />
{datatable ? (
<EuiBasicTable
textOnly={true}
data-test-subj={'example-table'}
columns={datatable.columns?.map(({ id: field, name }) => ({
field,
name,
'data-test-subj': `example-column-${field.toLowerCase()}`,
}))}
items={datatable.rows ?? []}
/>
) : (
<EuiCallOut color="success">
<p>Click or press any key.</p>
</EuiCallOut>
)}
</EuiPageTemplate.Section>
</EuiPageTemplate>
<EuiProvider>
<EuiPageTemplate offset={0}>
<EuiPageTemplate.Header pageTitle="Partial Results Demo" />
<EuiPageTemplate.Section>
<EuiText data-test-subj="example-help">
<p>
This example listens for the window events and adds them to the table along with a
trigger counter.
</p>
</EuiText>
<EuiSpacer size={'m'} />
<EuiCodeBlock>{expression}</EuiCodeBlock>
<EuiSpacer size={'m'} />
{datatable ? (
<EuiBasicTable
data-test-subj={'example-table'}
columns={datatable.columns?.map(({ id: field, name }) => ({
field,
name,
'data-test-subj': `example-column-${field.toLowerCase()}`,
}))}
items={datatable.rows ?? []}
/>
) : (
<EuiCallOut color="success">
<p>Click or press any key.</p>
</EuiCallOut>
)}
</EuiPageTemplate.Section>
</EuiPageTemplate>
</EuiProvider>
);
}

2
package.json
View file

@ -107,7 +107,7 @@
"@elastic/ecs": "^8.11.1",
"@elastic/elasticsearch": "^8.13.0",
"@elastic/ems-client": "8.5.1",
"@elastic/eui": "93.6.0",
"@elastic/eui": "94.1.0-backport.0",
"@elastic/filesaver": "1.1.2",
"@elastic/node-crypto": "1.2.1",
"@elastic/numeral": "^2.5.1",

1
packages/content-management/table_list_view_table/src/components/table.tsx
View file

@ -242,7 +242,6 @@ export function Table<T extends UserContentCommonSchema>({
data-test-subj="itemsInMemTable"
rowHeader="attributes.title"
tableCaption={tableCaption}
isSelectable
/>
);
}

2
packages/core/apps/core-apps-browser-internal/src/status/components/__snapshots__/status_table.test.tsx.snap generated
View file

@ -38,7 +38,6 @@ exports[`StatusTable renders when statuses is provided 1`] = `
]
}
data-test-subj="statusBreakdown"
isExpandable={true}
itemId={[Function]}
itemIdToExpandedRowMap={Object {}}
items={
@ -58,7 +57,6 @@ exports[`StatusTable renders when statuses is provided 1`] = `
},
]
}
responsive={true}
rowProps={[Function]}
searchFormat="eql"
sorting={

1
packages/core/apps/core-apps-browser-internal/src/status/components/status_table.tsx
View file

@ -104,7 +104,6 @@ export const StatusTable: FunctionComponent<StatusTableProps> = ({ statuses }) =
columns={tableColumns}
itemId={(item) => item.id}
items={statuses}
isExpandable={true}
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
rowProps={({ state }) => ({
className: `status-table-row-${state.uiColor}`,

2
packages/core/i18n/core-i18n-browser-internal/src/__snapshots__/i18n_service.test.tsx.snap generated
View file

@ -14,7 +14,7 @@ exports[`#start() returns \`Context\` component 1`] = `
"euiAutoRefresh.buttonLabelOn": [Function],
"euiBasicTable.noItemsMessage": "No items found",
"euiBasicTable.selectAllRows": "Select all rows",
"euiBasicTable.selectThisRow": "Select this row",
"euiBasicTable.selectThisRow": [Function],
"euiBasicTable.tableAutoCaptionWithPagination": [Function],
"euiBasicTable.tableAutoCaptionWithoutPagination": [Function],
"euiBasicTable.tableCaptionWithPagination": [Function],

10
packages/core/i18n/core-i18n-browser-internal/src/i18n_eui_mapping.tsx
View file

@ -38,10 +38,12 @@ export const getEuiContextMapping = (): EuiTokensObject => {
defaultMessage: 'Select all rows',
description: 'ARIA and displayed label on a checkbox to select all table rows',
}),
'euiBasicTable.selectThisRow': i18n.translate('core.euiBasicTable.selectThisRow', {
defaultMessage: 'Select this row',
description: 'ARIA and displayed label on a checkbox to select a single table row',
}),
'euiBasicTable.selectThisRow': ({ index }: EuiValues) =>
i18n.translate('core.euiBasicTable.selectThisRow', {
defaultMessage: 'Select row {index}',
values: { index },
description: 'ARIA and displayed label on a checkbox to select a single table row',
}),
'euiBasicTable.tableCaptionWithPagination': ({ tableCaption, page, pageCount }: EuiValues) =>
i18n.translate('core.euiBasicTable.tableCaptionWithPagination', {
defaultMessage: '{tableCaption}; Page {page} of {pageCount}.',

1
packages/kbn-search-connectors/components/sync_jobs/__snapshots__/documents_panel.test.tsx.snap generated
View file

@ -119,7 +119,6 @@ exports[`DocumentsPanel renders 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
</FlyoutPanel>

2
packages/kbn-search-connectors/components/sync_jobs/__snapshots__/events_panel.test.tsx.snap generated
View file

@ -54,7 +54,6 @@ exports[`EventsPanel renders 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
</FlyoutPanel>
@ -110,7 +109,6 @@ exports[`EventsPanel renders with some values missing 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
</FlyoutPanel>

1
packages/kbn-search-connectors/components/sync_jobs/__snapshots__/pipeline_panel.test.tsx.snap generated
View file

@ -43,7 +43,6 @@ exports[`PipelinePanel renders 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
</FlyoutPanel>

1
packages/kbn-search-connectors/components/sync_jobs/sync_jobs_table.tsx
View file

@ -263,7 +263,6 @@ export const SyncJobsTable: React.FC<SyncJobHistoryTableProps> = ({
data-test-subj={`entSearchContent-index-${type}-syncJobs-table`}
items={syncJobs}
columns={columns}
hasActions
onChange={onPaginate}
pagination={pagination}
tableLayout="fixed"

4
packages/kbn-test-jest-helpers/src/testbed/testbed.ts
View file

@ -263,11 +263,11 @@ export function registerTestBed<T extends string = string, P extends object = an
.slice(1) // we remove the first row as it is the table header
.map((row) => ({
reactWrapper: row,
columns: row.find('.euiTableCellContent').map((col) => ({
columns: row.find('div.euiTableCellContent').map((col) => ({
reactWrapper: col,
// We can't access the td value with col.text() because
// eui adds an extra div in td on mobile => (.euiTableRowCell__mobileHeader)
value: col.find('.euiTableCellContent').text(),
value: col.find('div.euiTableCellContent').text(),
})),
}));

2
packages/kbn-text-based-editor/src/query_history.test.tsx
View file

@ -159,7 +159,7 @@ describe('QueryHistory', () => {
/>
);
expect(screen.getByRole('table')).toHaveTextContent(
'Time ranRecent queriesLast durationTime ranMar. 25, 24 08:45:27Recent queriesfrom kibana_sample_data_flights | limit 10Last duration2ms'
'Time ranRecent queriesLast durationMar. 25, 24 08:45:27from kibana_sample_data_flights | limit 102ms'
);
});
});

2
packages/kbn-text-based-editor/src/query_history.tsx
View file

@ -380,7 +380,7 @@ export function QueryHistory({
defaultMessage: 'Queries history table',
}
)}
responsive={false}
responsiveBreakpoint={false}
items={historyItems}
columns={columns}
sorting={sorting}

2
packages/kbn-unified-field-list/src/components/field_stats/field_number_summary.tsx
View file

@ -88,7 +88,7 @@ export const FieldNumberSummary: React.FC<FieldNumberSummaryProps> = ({
columns={summaryTableColumns}
tableCaption={summaryTableTitle}
data-test-subj={`${dataTestSubject}-numberSummary`}
responsive={false}
responsiveBreakpoint={false}
css={css`
& .euiTableHeaderCell {
${euiScreenReaderOnly()}

2
src/dev/license_checker/config.ts
View file

@ -86,7 +86,7 @@ export const LICENSE_OVERRIDES = {
'jsts@1.6.2': ['Eclipse Distribution License - v 1.0'], // cf. https://github.com/bjornharrtell/jsts
'@mapbox/jsonlint-lines-primitives@2.0.2': ['MIT'], // license in readme https://github.com/tmcw/jsonlint
'@elastic/ems-client@8.5.1': ['Elastic License 2.0'],
'@elastic/eui@93.6.0': ['SSPL-1.0 OR Elastic License 2.0'],
'@elastic/eui@94.1.0-backport.0': ['SSPL-1.0 OR Elastic License 2.0'],
'language-subtag-registry@0.3.21': ['CC-BY-4.0'], // retired ODC‑By license https://github.com/mattcg/language-subtag-registry
'buffers@0.1.1': ['MIT'], // license in importing module https://www.npmjs.com/package/binary
'@bufbuild/protobuf@1.2.1': ['Apache-2.0'], // license (Apache-2.0 AND BSD-3-Clause)

15
src/plugins/data/public/search/session/sessions_mgmt/components/table/table.test.tsx
View file

@ -100,8 +100,7 @@ describe('Background Search Session Management Table', () => {
);
});
expect(table.find('thead th .euiTableCellContent__text').map((node) => node.text()))
.toMatchInlineSnapshot(`
expect(table.find('thead th').map((node) => node.text())).toMatchInlineSnapshot(`
Array [
"App",
"Name",
@ -136,12 +135,12 @@ describe('Background Search Session Management Table', () => {
expect(table.find('tbody td').map((node) => node.text())).toMatchInlineSnapshot(`
Array [
"App",
"Namevery background search Info",
"# Searches0",
"StatusExpired",
"Created2 Dec, 2020, 00:19:32",
"Expiration--",
"",
"very background search Info",
"0",
"Expired",
"2 Dec, 2020, 00:19:32",
"--",
"",
"",
]

314
src/plugins/data/public/utils/table_inspector_view/components/__snapshots__/data_view.test.tsx.snap generated
View file

@ -200,123 +200,79 @@ Array [
class="euiBasicTable insDataTableFormat__table eui-xScroll css-1f59z3t"
data-test-subj="inspectorTable"
>
<div>
<div
class="euiTableHeaderMobile"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-l-spaceBetween-baseline-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
/>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
<table
class="euiTable emotion-euiTable-auto-uncompressed-desktop"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiTableCaptionStyles-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
aria-sort="none"
class="euiTableHeaderCell emotion-euiTableHeaderCell"
data-test-subj="tableHeaderCell_1_0"
role="columnheader"
scope="col"
>
<div
class="euiTableSortMobile"
<button
class="euiTableHeaderButton emotion-euiTableHeaderCell__button"
data-test-subj="tableHeaderSortButton"
type="button"
>
<div
class="euiPopover emotion-euiPopover-inline-block"
>
<button
class="euiButtonEmpty emotion-euiButtonDisplay-euiButtonEmpty-xs-empty-primary-flush-right"
type="button"
>
<span
class="euiButtonEmpty__content emotion-euiButtonDisplayContent"
>
<span
class="eui-textTruncate euiButtonEmpty__text"
>
Sorting
</span>
<span
color="inherit"
data-euiicon-type="arrowDown"
/>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
<table
class="euiTable css-0 euiTable--responsive euiTable--auto"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
aria-live="polite"
aria-sort="none"
class="euiTableHeaderCell"
data-test-subj="tableHeaderCell_1_0"
role="columnheader"
scope="col"
>
<button
class="euiTableHeaderButton"
data-test-subj="tableHeaderSortButton"
type="button"
class="euiTableCellContent emotion-euiTableCellContent-euiTableHeaderCell__content"
>
<span
class="euiTableCellContent"
class="eui-textTruncate"
>
<span
class="euiTableCellContent__text"
>
column1
</span>
column1
</span>
</button>
</th>
</tr>
</thead>
<tbody
class="css-0"
<span
class="euiTableSortIcon euiTableSortIcon--sortable"
color="subdued"
data-euiicon-type="sortable"
/>
</div>
</button>
</th>
</tr>
</thead>
<tbody
class="css-0"
>
<tr
class="euiTableRow euiTableRow-isSelectable emotion-euiTableRow-desktop"
>
<tr
class="euiTableRow"
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<td
class="euiTableRowCell euiTableRowCell--middle"
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
column1
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
class="euiFlexItem emotion-euiFlexItem-growZero"
>
123
</div>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
123
</div>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-none-flexStart-center-row"
/>
</div>
class="euiFlexGroup emotion-euiFlexGroup-none-flexStart-center-row"
/>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div>
<div
class="euiSpacer euiSpacer--m emotion-euiSpacer-m"
@ -523,124 +479,80 @@ Array [
class="euiBasicTable insDataTableFormat__table eui-xScroll css-1f59z3t"
data-test-subj="inspectorTable"
>
<div>
<div
class="euiTableHeaderMobile"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-l-spaceBetween-baseline-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
/>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
<table
class="euiTable emotion-euiTable-auto-uncompressed-desktop"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiTableCaptionStyles-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
aria-sort="none"
class="euiTableHeaderCell emotion-euiTableHeaderCell"
data-test-subj="tableHeaderCell_1_0"
role="columnheader"
scope="col"
>
<div
class="euiTableSortMobile"
<button
class="euiTableHeaderButton emotion-euiTableHeaderCell__button"
data-test-subj="tableHeaderSortButton"
type="button"
>
<div
class="euiPopover emotion-euiPopover-inline-block"
>
<button
class="euiButtonEmpty emotion-euiButtonDisplay-euiButtonEmpty-xs-empty-primary-flush-right"
type="button"
>
<span
class="euiButtonEmpty__content emotion-euiButtonDisplayContent"
>
<span
class="eui-textTruncate euiButtonEmpty__text"
>
Sorting
</span>
<span
color="inherit"
data-euiicon-type="arrowDown"
/>
</span>
</button>
</div>
</div>
</div>
</div>
</div>
<table
class="euiTable css-0 euiTable--responsive euiTable--auto"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
aria-live="polite"
aria-sort="none"
class="euiTableHeaderCell"
data-test-subj="tableHeaderCell_1_0"
role="columnheader"
scope="col"
>
<button
class="euiTableHeaderButton"
data-test-subj="tableHeaderSortButton"
type="button"
class="euiTableCellContent emotion-euiTableCellContent-euiTableHeaderCell__content"
>
<span
class="euiTableCellContent"
class="eui-textTruncate"
title="column1"
>
<span
class="euiTableCellContent__text"
title="column1"
>
column1
</span>
column1
</span>
</button>
</th>
</tr>
</thead>
<tbody
class="css-0"
<span
class="euiTableSortIcon euiTableSortIcon--sortable"
color="subdued"
data-euiicon-type="sortable"
/>
</div>
</button>
</th>
</tr>
</thead>
<tbody
class="css-0"
>
<tr
class="euiTableRow euiTableRow-isSelectable emotion-euiTableRow-desktop"
>
<tr
class="euiTableRow"
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<td
class="euiTableRowCell euiTableRowCell--middle"
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
column1
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-s-flexStart-center-row"
class="euiFlexItem emotion-euiFlexItem-growZero"
>
123
</div>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
123
</div>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-none-flexStart-center-row"
/>
</div>
class="euiFlexGroup emotion-euiFlexGroup-none-flexStart-center-row"
/>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
</table>
<div>
<div
class="euiSpacer euiSpacer--m emotion-euiSpacer-m"

12
src/plugins/data_view_editor/public/components/preview_panel/indices_list/__snapshots__/indices_list.test.tsx.snap generated
View file

@ -3,7 +3,7 @@
exports[`IndicesList should change pages 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>
@ -104,7 +104,7 @@ exports[`IndicesList should change pages 1`] = `
exports[`IndicesList should change per page 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>
@ -206,7 +206,7 @@ exports[`IndicesList should change per page 1`] = `
exports[`IndicesList should highlight fully when an exact match 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>
@ -314,7 +314,7 @@ exports[`IndicesList should highlight fully when an exact match 1`] = `
exports[`IndicesList should highlight the query in the matches 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>
@ -422,7 +422,7 @@ exports[`IndicesList should highlight the query in the matches 1`] = `
exports[`IndicesList should render normally 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>
@ -523,7 +523,7 @@ exports[`IndicesList should render normally 1`] = `
exports[`IndicesList updating props should render all new indices 1`] = `
<div>
<EuiTable
responsive={false}
responsiveBreakpoint={false}
tableLayout="auto"
>
<EuiTableBody>

2
src/plugins/data_view_editor/public/components/preview_panel/indices_list/indices_list.tsx
View file

@ -218,7 +218,7 @@ export class IndicesList extends React.Component<IndicesListProps, IndicesListSt
return (
<div {...rest}>
<EuiTable responsive={false} tableLayout="auto">
<EuiTable responsiveBreakpoint={false} tableLayout="auto">
<EuiTableBody>{rows}</EuiTableBody>
</EuiTable>
<EuiSpacer size="m" />

3
src/plugins/data_view_field_editor/public/components/field_format_editor/editors/color/__snapshots__/color.test.tsx.snap generated
View file

@ -82,7 +82,6 @@ exports[`ColorFormatEditor should render multiple colors 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
<EuiSpacer
@ -181,7 +180,6 @@ exports[`ColorFormatEditor should render other type normally (range field) 1`] =
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
<EuiSpacer
@ -280,7 +278,6 @@ exports[`ColorFormatEditor should render string type normally (regex field) 1`]
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
<EuiSpacer

2
src/plugins/data_view_field_editor/public/components/field_format_editor/editors/static_lookup/__snapshots__/static_lookup.test.tsx.snap generated
View file

@ -61,7 +61,6 @@ exports[`StaticLookupFormatEditor should render multiple lookup entries and unkn
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
style={
Object {
"maxWidth": "400px",
@ -169,7 +168,6 @@ exports[`StaticLookupFormatEditor should render normally 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
style={
Object {
"maxWidth": "400px",

260
src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/__snapshots__/url.test.tsx.snap generated
View file

@ -282,181 +282,129 @@ exports[`UrlFormatEditor should render normally 1`] = `
class="euiBasicTable kbnFieldFormatEditor__samples"
id="generated-id"
>
<div>
<div
class="euiTableHeaderMobile"
>
<div
class="euiFlexGroup emotion-euiFlexGroup-l-spaceBetween-baseline-row"
>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
/>
<div
class="euiFlexItem emotion-euiFlexItem-growZero"
/>
</div>
</div>
<table
class="euiTable css-0 euiTable--compressed euiTable--responsive"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
class="euiTableHeaderCell"
data-test-subj="tableHeaderCell_input_0"
role="columnheader"
scope="col"
<table
class="euiTable emotion-euiTable-fixed-compressed-desktop"
id="__table_generated-id"
tabindex="-1"
>
<caption
class="euiTableCaption emotion-euiTableCaptionStyles-euiScreenReaderOnly"
/>
<thead>
<tr>
<th
class="euiTableHeaderCell emotion-euiTableHeaderCell"
data-test-subj="tableHeaderCell_input_0"
role="columnheader"
scope="col"
>
<div
class="euiTableCellContent emotion-euiTableCellContent-euiTableHeaderCell__content"
>
<span
class="euiTableCellContent"
class="eui-textTruncate"
title="Input"
>
<span
class="euiTableCellContent__text"
title="Input"
>
Input
</span>
Input
</span>
</th>
<th
class="euiTableHeaderCell"
data-test-subj="tableHeaderCell_output_1"
role="columnheader"
scope="col"
</div>
</th>
<th
class="euiTableHeaderCell emotion-euiTableHeaderCell"
data-test-subj="tableHeaderCell_output_1"
role="columnheader"
scope="col"
>
<div
class="euiTableCellContent emotion-euiTableCellContent-euiTableHeaderCell__content"
>
<span
class="euiTableCellContent"
class="eui-textTruncate"
title="Output"
>
<span
class="euiTableCellContent__text"
title="Output"
>
Output
</span>
Output
</span>
</th>
</tr>
</thead>
<tbody
class="css-0"
</div>
</th>
</tr>
</thead>
<tbody
class="css-0"
>
<tr
class="euiTableRow euiTableRow-isSelectable emotion-euiTableRow-desktop"
>
<tr
class="euiTableRow"
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<td
class="euiTableRowCell euiTableRowCell--middle"
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Input
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
john
</div>
</td>
<td
class="euiTableRowCell euiTableRowCell--middle"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Output
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
<div
class=""
>
converted url for john
</div>
</div>
</td>
</tr>
<tr
class="euiTableRow"
john
</div>
</td>
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<td
class="euiTableRowCell euiTableRowCell--middle"
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Input
<div>
converted url for john
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
/some/pathname/asset.png
</div>
</td>
<td
class="euiTableRowCell euiTableRowCell--middle"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Output
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
<div
class=""
>
converted url for /some/pathname/asset.png
</div>
</div>
</td>
</tr>
<tr
class="euiTableRow"
</div>
</td>
</tr>
<tr
class="euiTableRow euiTableRow-isSelectable emotion-euiTableRow-desktop"
>
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<td
class="euiTableRowCell euiTableRowCell--middle"
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Input
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
1234
</div>
</td>
<td
class="euiTableRowCell euiTableRowCell--middle"
/some/pathname/asset.png
</div>
</td>
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div
class="euiTableRowCell__mobileHeader euiTableRowCell--hideForDesktop"
>
Output
<div>
converted url for /some/pathname/asset.png
</div>
<div
class="euiTableCellContent euiTableCellContent--overflowingContent"
>
<div
class=""
>
converted url for 1234
</div>
</div>
</td>
</tr>
<tr
class="euiTableRow euiTableRow-isSelectable emotion-euiTableRow-desktop"
>
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
1234
</div>
</td>
<td
class="euiTableRowCell emotion-euiTableRowCell-middle-desktop"
>
<div
class="euiTableCellContent emotion-euiTableCellContent-wrapText"
>
<div>
converted url for 1234
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

1
src/plugins/data_view_field_editor/public/components/field_format_editor/samples/__snapshots__/samples.test.tsx.snap generated
View file

@ -57,7 +57,6 @@ exports[`FormatEditorSamples should render normally 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableLayout="fixed"
/>
</EuiFormRow>

2
src/plugins/data_view_management/public/components/edit_index_pattern/indexed_fields_table/components/table/__snapshots__/table.test.tsx.snap generated
View file

@ -57,7 +57,6 @@ exports[`Table render conflict summary modal 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
rowHeader="firstName"
tableCaption="Demo of EuiBasicTable"
tableLayout="auto"
@ -304,7 +303,6 @@ exports[`Table should render normally 1`] = `
],
}
}
responsive={true}
searchFormat="eql"
sorting={
Object {

1
src/plugins/data_view_management/public/components/edit_index_pattern/scripted_fields_table/components/table/__snapshots__/table.test.tsx.snap generated
View file

@ -86,7 +86,6 @@ exports[`Table should render normally 1`] = `
],
}
}
responsive={true}
searchFormat="eql"
sorting={true}
tableLayout="fixed"

1
src/plugins/data_view_management/public/components/edit_index_pattern/source_filters_table/components/table/__snapshots__/table.test.tsx.snap generated
View file

@ -91,7 +91,6 @@ exports[`Table should render normally 1`] = `
],
}
}
responsive={true}
searchFormat="eql"
sorting={true}
tableLayout="fixed"

4
src/plugins/data_view_management/public/components/index_pattern_table/__snapshots__/delete_modal_msg.test.tsx.snap generated
View file

@ -64,7 +64,6 @@ exports[`delete modal content render 1`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableCaption="Data views selected for deletion"
tableLayout="fixed"
/>
@ -127,7 +126,6 @@ exports[`delete modal content render 2`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableCaption="Data views selected for deletion"
tableLayout="fixed"
/>
@ -196,7 +194,6 @@ exports[`delete modal content render 3`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableCaption="Data views selected for deletion"
tableLayout="fixed"
/>
@ -276,7 +273,6 @@ exports[`delete modal content render 4`] = `
token="euiBasicTable.noItemsMessage"
/>
}
responsive={true}
tableCaption="Data views selected for deletion"
tableLayout="fixed"
/>

1
src/plugins/data_view_management/public/components/index_pattern_table/index_pattern_table.tsx
View file

@ -340,7 +340,6 @@ export const IndexPatternTable = ({
<EuiInMemoryTable
allowNeutralSort={false}
itemId="id"
isSelectable={dataViews.getCanSaveSync()}
items={indexPatterns}
columns={columns}
pagination={pagination}

1
src/plugins/discover/public/application/main/components/no_results/no_results_suggestions/syntax_suggestions_popover.tsx
View file

@ -90,7 +90,6 @@ export const SyntaxSuggestionsPopover: React.FC<SyntaxSuggestionsPopoverProps> =
compressed={true}
rowHeader="label"
columns={columns}
responsive
/>
</EuiPanel>
<EuiPanel color="transparent" paddingSize="s">

18
src/plugins/inspector/public/views/requests/components/details/clusters_view/clusters_table/clusters_table.test.tsx
View file

@ -32,9 +32,9 @@ describe('ClustersTable', () => {
render(<ClustersTable clusters={clusters} />);
const tableRows = screen.getAllByRole('row');
expect(tableRows.length).toBe(4); // 1 header row, 3 data rows
expect(tableRows[1]).toHaveTextContent('Nameremote1StatussuccessfulResponse time50ms');
expect(tableRows[2]).toHaveTextContent('Nameremote2StatusskippedResponse time1000ms');
expect(tableRows[3]).toHaveTextContent('Nameremote3StatusfailedResponse time90ms');
expect(tableRows[1]).toHaveTextContent('remote1successful50ms');
expect(tableRows[2]).toHaveTextContent('remote2skipped1000ms');
expect(tableRows[3]).toHaveTextContent('remote3failed90ms');
});
test('should sort by response time', () => {
@ -45,16 +45,16 @@ describe('ClustersTable', () => {
fireEvent.click(button);
const tableRowsAsc = screen.getAllByRole('row');
expect(tableRowsAsc.length).toBe(4); // 1 header row, 3 data rows
expect(tableRowsAsc[1]).toHaveTextContent('Nameremote1StatussuccessfulResponse time50ms');
expect(tableRowsAsc[2]).toHaveTextContent('Nameremote3StatusfailedResponse time90ms');
expect(tableRowsAsc[3]).toHaveTextContent('Nameremote2StatusskippedResponse time1000ms');
expect(tableRowsAsc[1]).toHaveTextContent('remote1successful50ms');
expect(tableRowsAsc[2]).toHaveTextContent('remote3failed90ms');
expect(tableRowsAsc[3]).toHaveTextContent('remote2skipped1000ms');
fireEvent.click(button);
const tableRowsDesc = screen.getAllByRole('row');
expect(tableRowsDesc.length).toBe(4); // 1 header row, 3 data rows
expect(tableRowsDesc[1]).toHaveTextContent('Nameremote2StatusskippedResponse time1000ms');
expect(tableRowsDesc[2]).toHaveTextContent('Nameremote3StatusfailedResponse time90ms');
expect(tableRowsDesc[3]).toHaveTextContent('Nameremote1StatussuccessfulResponse time50ms');
expect(tableRowsDesc[1]).toHaveTextContent('remote2skipped1000ms');
expect(tableRowsDesc[2]).toHaveTextContent('remote3failed90ms');
expect(tableRowsDesc[3]).toHaveTextContent('remote1successful50ms');
});
});
});

1
src/plugins/inspector/public/views/requests/components/details/clusters_view/clusters_table/clusters_table.tsx
View file

@ -137,7 +137,6 @@ export function ClustersTable({ clusters }: Props) {
? items.sort(Comparators.property(sortField, Comparators.default(sortDirection)))
: items
}
isExpandable={true}
itemIdToExpandedRowMap={expandedRows}
itemId="name"
columns={columns}

1
src/plugins/inspector/public/views/requests/components/details/clusters_view/clusters_table/shards_view/shard_failure_table.tsx
View file

@ -108,7 +108,6 @@ export function ShardFailureTable({ failures }: Props) {
failureType: failure.reason.type,
};
})}
isExpandable={true}
itemIdToExpandedRowMap={expandedRows}
itemId="rowId"
columns={columns}

2
src/plugins/inspector/public/views/requests/components/details/req_details_stats.tsx
View file

@ -66,7 +66,7 @@ export class RequestDetailsStats extends Component<DetailViewProps> {
.map((id) => ({ id, ...stats[id] } as RequestDetailsStatRow));
return (
<EuiTable responsive={false}>
<EuiTable responsiveBreakpoint={false}>
<EuiTableBody>{sortedStats.map(this.renderStatRow)}</EuiTableBody>
</EuiTable>
);

1
src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/flyout.test.tsx.snap generated
View file

@ -114,7 +114,6 @@ exports[`Flyout conflicts should allow conflict resolution 1`] = `
],
}
}
responsive={true}
searchFormat="eql"
tableLayout="fixed"
/>

6
src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/relationships.test.tsx.snap generated
View file

@ -111,7 +111,6 @@ exports[`Relationships should render dashboards normally 1`] = `
]
}
pagination={true}
responsive={true}
rowProps={[Function]}
search={
Object {
@ -313,7 +312,6 @@ exports[`Relationships should render index patterns normally 1`] = `
]
}
pagination={true}
responsive={true}
rowProps={[Function]}
search={
Object {
@ -447,7 +445,6 @@ exports[`Relationships should render invalid relations 1`] = `
]
}
pagination={true}
responsive={true}
rowProps={[Function]}
searchFormat="eql"
tableLayout="fixed"
@ -506,7 +503,6 @@ exports[`Relationships should render invalid relations 1`] = `
}
items={Array []}
pagination={true}
responsive={true}
rowProps={[Function]}
search={
Object {
@ -658,7 +654,6 @@ exports[`Relationships should render searches normally 1`] = `
]
}
pagination={true}
responsive={true}
rowProps={[Function]}
search={
Object {
@ -820,7 +815,6 @@ exports[`Relationships should render visualizations normally 1`] = `
]
}
pagination={true}
responsive={true}
rowProps={[Function]}
search={
Object {

6
src/plugins/saved_objects_management/public/management_section/objects_table/components/__snapshots__/table.test.tsx.snap generated
View file

@ -144,7 +144,7 @@ exports[`Table prevents hidden saved objects from being deleted 1`] = `
"name": "Type",
"render": [Function],
"sortable": true,
"width": "50px",
"width": "65px",
},
Object {
"data-test-subj": "savedObjectsTableRowTitle",
@ -227,7 +227,6 @@ exports[`Table prevents hidden saved objects from being deleted 1`] = `
"totalItemCount": 3,
}
}
responsive={true}
rowProps={[Function]}
selection={
Object {
@ -384,7 +383,7 @@ exports[`Table should render normally 1`] = `
"name": "Type",
"render": [Function],
"sortable": true,
"width": "50px",
"width": "65px",
},
Object {
"data-test-subj": "savedObjectsTableRowTitle",
@ -467,7 +466,6 @@ exports[`Table should render normally 1`] = `
"totalItemCount": 3,
}
}
responsive={true}
rowProps={[Function]}
selection={
Object {

4
src/plugins/saved_objects_management/public/management_section/objects_table/components/delete_confirm_modal.test.tsx
View file

@ -84,7 +84,7 @@ describe('DeleteConfirmModal', () => {
allowedTypes={allowedTypes}
/>
);
expect(wrapper.find('.euiTableRow')).toHaveLength(3);
expect(wrapper.find('tr.euiTableRow')).toHaveLength(3);
});
it('calls `onCancel` when clicking on the cancel button', () => {
@ -135,7 +135,7 @@ describe('DeleteConfirmModal', () => {
allowedTypes={allowedTypes}
/>
);
expect(wrapper.find('.euiTableRow')).toHaveLength(1);
expect(wrapper.find('tr.euiTableRow')).toHaveLength(1);
});
it('displays a callout when at least one object cannot be deleted', () => {

2
src/plugins/saved_objects_management/public/management_section/objects_table/components/table.tsx
View file

@ -234,7 +234,7 @@ export class Table extends PureComponent<TableProps, TableState> {
name: i18n.translate('savedObjectsManagement.objectsTable.table.columnTypeName', {
defaultMessage: 'Type',
}),
width: '50px',
width: '65px',
align: 'center',
description: i18n.translate(
'savedObjectsManagement.objectsTable.table.columnTypeDescription',

4
src/plugins/ui_actions_enhanced/public/drilldowns/drilldown_manager/components/drilldown_table/drilldown_table.tsx
View file

@ -147,8 +147,7 @@ export const DrilldownTable: React.FC<DrilldownTableProps> = ({
items={drilldowns}
itemId="id"
columns={columns}
isSelectable={true}
responsive={false}
responsiveBreakpoint={false}
selection={{
onSelectionChange: (selection) => {
setSelectedDrilldowns(selection.map((drilldown) => drilldown.id));
@ -158,7 +157,6 @@ export const DrilldownTable: React.FC<DrilldownTableProps> = ({
rowProps={{
'data-test-subj': TEST_SUBJ_DRILLDOWN_ITEM,
}}
hasActions={true}
sorting={{
sort: {
field: 'drilldownName',

6
src/plugins/ui_actions_enhanced/public/drilldowns/drilldown_manager/components/drilldown_template_table/drilldown_template_table.tsx
View file

@ -107,11 +107,10 @@ export const DrilldownTemplateTable: React.FC<DrilldownTemplateTableProps> = ({
<>
<EuiInMemoryTable
itemId="id"
tableLayout={'auto'}
tableLayout="auto"
items={items}
columns={columns}
isSelectable={!!onClone}
responsive={false}
responsiveBreakpoint={false}
search={search}
sorting={{
sort: {
@ -125,7 +124,6 @@ export const DrilldownTemplateTable: React.FC<DrilldownTemplateTableProps> = ({
},
selectableMessage: () => txtSelectableMessage,
}}
hasActions={true}
/>
<EuiSpacer />
{!!onClone && !!selected.length && (

3
src/plugins/unified_doc_viewer/public/components/doc_viewer_table/legacy/table.tsx
View file

@ -116,8 +116,7 @@ export const DocViewerLegacyTable = ({
items={items}
columns={tableColumns}
rowProps={onSetRowProps}
pagination={false}
responsive={false}
responsiveBreakpoint={false}
/>
);
};

12
src/plugins/unified_doc_viewer/public/components/doc_viewer_table/table.scss
View file

@ -41,13 +41,17 @@
.kbnDocViewer__tableActionsCell,
.kbnDocViewer__tableFieldNameCell {
align-items: flex-start;
padding: $euiSizeXS;
.euiTableCellContent {
align-items: flex-start;
padding: $euiSizeXS;
}
}
.kbnDocViewer__tableValueCell {
flex-direction: column;
align-items: flex-start;
.euiTableCellContent {
flex-direction: column;
align-items: flex-start;
}
}
.kbnDocViewer__value {

2
src/plugins/unified_doc_viewer/public/components/doc_viewer_table/table.tsx
View file

@ -434,7 +434,7 @@ export const DocViewerTable = ({
</EuiSelectableMessage>
) : (
<EuiFlexItem grow={false}>
<EuiTable responsive={false}>
<EuiTable responsiveBreakpoint={false}>
<EuiTableHeader>{headers}</EuiTableHeader>
<EuiTableBody>{rowElements}</EuiTableBody>
</EuiTable>

2
test/functional/services/inspector.ts
View file

@ -144,7 +144,7 @@ export class InspectorService extends FtrService {
return await inspectorPanel.findByTagName('thead');
});
const $ = await dataTableHeader.parseDomContent();
return $('th span.euiTableCellContent__text')
return $('th .euiTableCellContent span')
.toArray()
.map((cell) => $(cell).text().trim());
}

10
test/functional/services/listing_table.ts
View file

@ -69,14 +69,10 @@ export class ListingTableService extends FtrService {
private async getAllSelectableItemsNamesOnCurrentPage(): Promise<string[]> {
const visualizationNames = [];
// TODO - use .euiTableRow-isSelectable when it's working again (https://github.com/elastic/eui/issues/7515)
const rows = await this.find.allByCssSelector('.euiTableRow');
const rows = await this.find.allByCssSelector('.euiTableRow-isSelectable');
for (let i = 0; i < rows.length; i++) {
const checkbox = await rows[i].findByCssSelector('.euiCheckbox__input');
if (await checkbox.isEnabled()) {
const link = await rows[i].findByCssSelector('.euiLink');
visualizationNames.push(await link.getVisibleText());
}
const link = await rows[i].findByCssSelector('.euiLink');
visualizationNames.push(await link.getVisibleText());
}
this.log.debug(`Found ${visualizationNames.length} selectable visualizations on current page`);
return visualizationNames;

1
x-pack/packages/kbn-elastic-assistant/impl/data_anonymization_editor/context_editor/index.tsx
View file

@ -133,7 +133,6 @@ const ContextEditorComponent: React.FC<Props> = ({
columns={columns}
compressed={true}
data-test-subj="contextEditor"
isSelectable={true}
itemId={FIELDS.FIELD}
items={rows}
pagination={pagination}

2
x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality/data_quality_panel/summary_table/helpers.test.tsx
View file

@ -177,7 +177,7 @@ describe('helpers', () => {
name: 'Result',
sortable: true,
truncateText: false,
width: '50px',
width: '65px',
},
{ field: 'indexName', name: 'Index', sortable: true, truncateText: false, width: '300px' },
{ field: 'docsCount', name: 'Docs', sortable: true, truncateText: false },

2
x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality/data_quality_panel/summary_table/helpers.tsx
View file

@ -194,7 +194,7 @@ export const getSummaryTableColumns = ({
),
sortable: true,
truncateText: false,
width: '50px',
width: '65px',
},
{
field: 'indexName',

1
x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality/data_quality_panel/summary_table/index.tsx
View file

@ -108,7 +108,6 @@ const SummaryTableComponent: React.FC<Props> = ({
compressed={true}
columns={columns}
data-test-subj="summaryTable"
isExpandable={true}
itemId={getItemId}
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
items={items}

7
x-pack/plugins/aiops/public/components/change_point_detection/change_points_table.tsx
View file

@ -153,9 +153,7 @@ export const ChangePointsTable: FC<ChangePointsTableProps> = ({
truncateText: false,
valign: 'middle',
css: {
// Extra specificity needed here to override Sass styles
// TODO: Can be removed once EuiTable has been converted to Emotion
['&.euiTableCellContent']: { display: 'block', padding: 0 },
'.euiTableCellContent': { display: 'block', padding: 0 },
},
render: (annotation: ChangePointAnnotation) => {
return (
@ -313,7 +311,7 @@ export const ChangePointsTable: FC<ChangePointsTableProps> = ({
return (
<EuiInMemoryTable<ChangePointAnnotation>
itemId={'id'}
itemId="id"
selection={selectionValue}
loading={isLoading}
data-test-subj={`aiopsChangePointResultsTable ${isLoading ? 'loading' : 'loaded'}`}
@ -324,7 +322,6 @@ export const ChangePointsTable: FC<ChangePointsTableProps> = ({
}
sorting={sorting}
onTableChange={onTableChange}
hasActions={hasActions}
rowProps={(item) => ({
'data-test-subj': `aiopsChangePointResultsTableRow row-${item.id}`,
})}

2
x-pack/plugins/aiops/public/components/log_categorization/category_table/category_table.tsx
View file

@ -317,14 +317,12 @@ export const CategoryTable: FC<Props> = ({
compressed
items={categories}
columns={columns}
isSelectable={true}
selection={selectionValue}
itemId="key"
onTableChange={onTableChange}
pagination={pagination}
sorting={sorting}
data-test-subj="aiopsLogPatternsTable"
isExpandable={true}
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
rowProps={(category) => {
return enableRowActions

1
x-pack/plugins/alerting/public/pages/maintenance_windows/components/maintenance_windows_list.tsx
View file

@ -191,7 +191,6 @@ export const MaintenanceWindowsList = React.memo<MaintenanceWindowsListProps>(
sorting={sorting}
rowProps={rowProps}
search={search}
hasActions={true}
/>
);
}

1
x-pack/plugins/canvas/public/components/var_config/var_config.tsx
View file

@ -212,7 +212,6 @@ export const VarConfig: FC<Props> = ({
className="canvasVarConfig__list"
items={variables}
columns={varColumns}
hasActions={true}
pagination={false}
sorting={true}
compressed

7
x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx
View file

@ -368,13 +368,6 @@ describe('AllCasesListGeneric', () => {
});
});
it('case table should not be selectable when isSelectorView=true', async () => {
appMockRenderer.render(<AllCasesList isSelectorView={true} />);
await waitFor(() => {
expect(screen.queryByTestId('cases-table')).not.toHaveAttribute('isSelectable');
});
});
it('should call onRowClick with no cases and isSelectorView=true when create case is clicked', async () => {
appMockRenderer.render(<AllCasesList isSelectorView={true} onRowClick={onRowClick} />);
userEvent.click(screen.getByTestId('cases-table-add-case-filter-bar'));

2
x-pack/plugins/cases/public/components/all_cases/table.tsx
View file

@ -82,7 +82,6 @@ export const CasesTable: FunctionComponent<CasesTableProps> = ({
className={classnames({ isSelectorView })}
columns={columns}
data-test-subj="cases-table"
isSelectable={!isSelectorView}
itemId="id"
items={data.cases}
loading={isCommentUpdating}
@ -114,7 +113,6 @@ export const CasesTable: FunctionComponent<CasesTableProps> = ({
rowProps={tableRowProps}
selection={!isSelectorView ? selection : undefined}
sorting={sorting}
hasActions={false}
/>
</>
);

2
x-pack/plugins/cloud_security_posture/public/pages/compliance_dashboard/dashboard_sections/benchmarks_section.tsx
View file

@ -133,7 +133,7 @@ export const BenchmarksSection = ({
id="xpack.csp.dashboard.benchmarkSection.columnsHeader.complianceScoreTitle"
defaultMessage="Compliance Score"
/>
<EuiIcon className="euiTableSortIcon" type={benchmarkSortingIcon} />
<EuiIcon type={benchmarkSortingIcon} />
</div>
</EuiTitle>
</button>

1
x-pack/plugins/cross_cluster_replication/public/app/sections/home/auto_follow_pattern_list/components/auto_follow_pattern_table/auto_follow_pattern_table.js
View file

@ -341,7 +341,6 @@ export class AutoFollowPatternTable extends PureComponent {
pagination={pagination}
sorting={sorting}
selection={selection}
isSelectable={true}
rowProps={() => ({
'data-test-subj': 'row',
})}

1
x-pack/plugins/cross_cluster_replication/public/app/sections/home/follower_indices_list/components/follower_indices_table/follower_indices_table.js
View file

@ -326,7 +326,6 @@ export class FollowerIndicesTable extends PureComponent {
pagination={pagination}
sorting={sorting}
selection={selection}
isSelectable={true}
rowProps={() => ({
'data-test-subj': 'row',
})}

2
x-pack/plugins/data_visualizer/public/application/common/components/field_types_filter/field_types_help_popover.tsx
View file

@ -130,7 +130,7 @@ export const FieldTypesHelpPopover: FC<{
compressed={true}
rowHeader="firstName"
columns={columnsSidebar}
responsive={false}
responsiveBreakpoint={false}
/>
</EuiPanel>
<EuiPanel color="transparent" paddingSize="s">

4
x-pack/plugins/data_visualizer/public/application/common/components/stats_table/data_visualizer_stats_table.tsx
View file

@ -395,7 +395,7 @@ export const DataVisualizerTable = <T extends DataVisualizerTableItem>({
backgroundColor: euiTheme.colors.emptyShade,
boxShadow: `inset 0 0px 0, inset 0 -1px 0 ${euiTheme.border.color}`,
},
'.euiTableRow > .euiTableRowCel': {
'.euiTableRow > .euiTableRowCell': {
borderTop: 0,
},
[useEuiMinBreakpoint('s')]: {
@ -481,9 +481,7 @@ export const DataVisualizerTable = <T extends DataVisualizerTableItem>({
columns={columns}
pagination={pagination}
sorting={sorting}
isExpandable={true}
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
isSelectable={false}
onTableChange={onTableChange}
data-test-subj={`dataVisualizerTable-${loading ? 'loading' : 'loaded'}`}
rowProps={(item) => ({

1
x-pack/plugins/data_visualizer/public/application/data_drift/data_drift_overview_table.tsx
View file

@ -305,7 +305,6 @@ export const DataDriftOverviewTable = ({
cellProps={getCellProps}
itemId="featureName"
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
isExpandable={true}
sorting={sorting}
onChange={onTableChange}
pagination={pagination}

2
x-pack/plugins/enterprise_search/public/applications/app_search/components/analytics/components/analytics_tables/analytics_table.tsx
View file

@ -59,8 +59,6 @@ export const AnalyticsTable: React.FC<Props> = ({ items, hasClicks, isSmall }) =
<EuiBasicTable
columns={[TERM_COLUMN, TAGS_COLUMN, ...COUNT_COLUMNS, ACTIONS_COLUMN] as Columns}
items={items}
responsive
hasActions
noItemsMessage={
<EuiEmptyPrompt
iconType="visLine"

1
x-pack/plugins/enterprise_search/public/applications/app_search/components/analytics/components/analytics_tables/query_clicks_table.tsx
View file

@ -57,7 +57,6 @@ export const QueryClicksTable: React.FC<Props> = ({ items }) => {
<EuiBasicTable
columns={[DOCUMENT_COLUMN, TAGS_LIST_COLUMN, CLICKS_COLUMN] as Columns}
items={items}
responsive
noItemsMessage={
<EuiEmptyPrompt
iconType="visLine"

2
x-pack/plugins/enterprise_search/public/applications/app_search/components/analytics/components/analytics_tables/recent_queries_table.tsx
View file

@ -57,8 +57,6 @@ export const RecentQueriesTable: React.FC<Props> = ({ items }) => {
[TERM_COLUMN, TIME_COLUMN, TAGS_LIST_COLUMN, RESULTS_COLUMN, ACTIONS_COLUMN] as Columns
}
items={items}
responsive
hasActions
noItemsMessage={
<EuiEmptyPrompt
iconType="visLine"

1
x-pack/plugins/enterprise_search/public/applications/app_search/components/api_logs/components/api_logs_table.tsx
View file

@ -108,7 +108,6 @@ export const ApiLogsTable: React.FC<Props> = ({ hasPagination }) => {
<EuiBasicTable
columns={columns}
items={apiLogs}
responsive
loading={dataLoading}
noItemsMessage={<EmptyState />}
{...paginationProps}

8
x-pack/plugins/enterprise_search/public/applications/app_search/components/crawler/components/domains_table.test.tsx
View file

@ -143,6 +143,8 @@ describe('DomainsTable', () => {
});
describe('when the user can manage/delete engines', () => {
const simulatedClickEvent = { persist: () => {} }; // Required for EUI action clicks. Can be removed if switching away from Enzyme to RTL
const getManageAction = () => getActionItems().at(0).dive().find(EuiButtonIcon);
const getDeleteAction = () => getActionItems().at(1).dive().find(EuiButtonIcon);
@ -159,7 +161,7 @@ describe('DomainsTable', () => {
it('sends the user to the engine overview on click', () => {
const { navigateToUrl } = mockKibanaValues;
getManageAction().simulate('click');
getManageAction().simulate('click', simulatedClickEvent);
expect(navigateToUrl).toHaveBeenCalledWith('/engines/some-engine/crawler/domains/1234');
});
@ -169,7 +171,7 @@ describe('DomainsTable', () => {
it('clicking the action and confirming deletes the domain', () => {
jest.spyOn(global, 'confirm').mockReturnValueOnce(true);
getDeleteAction().simulate('click');
getDeleteAction().simulate('click', simulatedClickEvent);
expect(actions.deleteDomain).toHaveBeenCalledWith(
expect.objectContaining({ id: '1234' })
@ -179,7 +181,7 @@ describe('DomainsTable', () => {
it('clicking the action and not confirming does not delete the engine', () => {
jest.spyOn(global, 'confirm').mockReturnValueOnce(false);
getDeleteAction().simulate('click');
getDeleteAction().simulate('click', simulatedClickEvent);
expect(actions.deleteDomain).not.toHaveBeenCalled();
});

2
x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/components/curations_table.tsx
View file

@ -138,8 +138,6 @@ export const CurationsTable: React.FC = () => {
<EuiBasicTable
columns={columns}
items={curations}
responsive
hasActions
loading={dataLoading}
pagination={{
...convertMetaToPagination(meta),

2
x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/components/suggestions_table.tsx
View file

@ -130,8 +130,6 @@ export const SuggestionsTable: React.FC = () => {
<EuiBasicTable
columns={columns}
items={suggestions}
responsive
hasActions
loading={dataLoading}
pagination={{
...convertMetaToPagination(meta),

1
x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/views/curations_history/components/ignored_queries_panel/ignored_queries_panel.tsx
View file

@ -114,7 +114,6 @@ export const IgnoredQueriesPanel: React.FC = () => {
itemId="query"
// @ts-expect-error - EuiBasicTable wants an array of objects, but will accept strings if coerced
columns={columns}
hasActions
pagination={{
...convertMetaToPagination(meta),
showPerPageOptions: false,

8
x-pack/plugins/enterprise_search/public/applications/app_search/components/engines/components/tables/test_helpers/shared_columns.tsx
View file

@ -22,6 +22,8 @@ export const runSharedColumnsTests = (
tableContent: string,
values: object = {}
) => {
const simulatedClickEvent = { persist: () => {} }; // Required for EUI action clicks. Can be removed if switching away from Enzyme to RTL
const getTableBody = () =>
wrapper.find(EuiBasicTable).dive().find('RenderWithEuiTheme').renderProp('children')();
@ -83,7 +85,7 @@ export const runSharedColumnsTests = (
it('sends the user to the engine overview on click', () => {
jest.spyOn(engineLinkHelpers, 'navigateToEngine');
const { navigateToEngine } = engineLinkHelpers;
getManageAction().simulate('click');
getManageAction().simulate('click', simulatedClickEvent);
expect(navigateToEngine).toHaveBeenCalledWith('test-engine');
});
@ -94,7 +96,7 @@ export const runSharedColumnsTests = (
it('clicking the action and confirming deletes the engine', () => {
jest.spyOn(global, 'confirm').mockReturnValueOnce(true);
getDeleteAction().simulate('click');
getDeleteAction().simulate('click', simulatedClickEvent);
expect(deleteEngine).toHaveBeenCalledWith(
expect.objectContaining({ name: 'test-engine' })
@ -103,7 +105,7 @@ export const runSharedColumnsTests = (
it('clicking the action and not confirming does not delete the engine', () => {
jest.spyOn(global, 'confirm').mockReturnValueOnce(false);
getDeleteAction().simulate('click');
getDeleteAction().simulate('click', simulatedClickEvent);
expect(deleteEngine).not.toHaveBeenCalled();
});

18
x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/non_text_fields_body.test.tsx
View file

@ -50,15 +50,15 @@ describe('NonTextFieldsBody', () => {
const tableRows = getTableRows(wrapper);
expect(tableRows.length).toBe(3);
expect(tableRows.at(0).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'bar'
);
expect(tableRows.at(1).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'foo'
);
expect(tableRows.at(2).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'zoo'
);
expect(
tableRows.at(0).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('bar');
expect(
tableRows.at(1).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('foo');
expect(
tableRows.at(2).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('zoo');
});
describe('the "raw" checkbox within each table row', () => {

2
x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/result_settings_table.tsx
View file

@ -28,7 +28,7 @@ export const ResultSettingsTable: React.FC = () => {
// TODO This table currently has mutiple theads, which is invalid html. We could change these subheaders to be EuiTableRow instead of EuiTableHeader
// to alleviate the issue.
return (
<EuiTable className="resultSettingsTable" responsive={false}>
<EuiTable className="resultSettingsTable" responsiveBreakpoint={false}>
<ColumnHeaders />
{!!Object.keys(textResultFields).length && (
<EuiTableBody>

18
x-pack/plugins/enterprise_search/public/applications/app_search/components/result_settings/result_settings_table/text_fields_body.test.tsx
View file

@ -65,15 +65,15 @@ describe('TextFieldsBody', () => {
const tableRows = getTableRows(wrapper);
expect(tableRows.length).toBe(3);
expect(tableRows.at(0).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'bar'
);
expect(tableRows.at(1).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'foo'
);
expect(tableRows.at(2).find('[data-test-subj="ResultSettingFieldName"]').dive().text()).toEqual(
'zoo'
);
expect(
tableRows.at(0).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('bar');
expect(
tableRows.at(1).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('foo');
expect(
tableRows.at(2).find('[data-test-subj="ResultSettingFieldName"]').render().text()
).toEqual('zoo');
});
describe('the "raw" checkbox within each table row', () => {

5
x-pack/plugins/enterprise_search/public/applications/applications/components/search_application/search_application_schema.tsx
View file

@ -145,7 +145,7 @@ const SchemaFieldDetails: React.FC<{ schemaField: SchemaField }> = ({ schemaFiel
css={{ '& .euiTable': { backgroundColor: 'transparent' } }}
columns={columns}
items={schemaField.indices}
responsive={false}
responsiveBreakpoint={false}
/>
</EuiFlexGroup>
</EuiPanel>
@ -451,8 +451,7 @@ export const SearchApplicationSchema: React.FC = () => {
loading={isLoadingSearchApplicationSchema}
itemId="name"
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
isExpandable
responsive={false}
responsiveBreakpoint={false}
/>
{totalConflictsHiddenByTypeFilters > 0 && (
<EuiCallOut

1
x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/crawler/crawler_domain_detail/extraction_rules/extraction_rules_table.tsx
View file

@ -243,7 +243,6 @@ export const ExtractionRulesTable: React.FC = () => {
)}
<EuiBasicTable
columns={columns}
isExpandable
itemId="id"
itemIdToExpandedRowMap={itemIdToExpandedRowMap}
items={extractionRules}

6
x-pack/plugins/enterprise_search/public/applications/enterprise_search_content/components/search_index/crawler/domain_management/domains_table.test.tsx
View file

@ -137,6 +137,8 @@ describe('DomainsTable', () => {
});
describe('actions column', () => {
const simulatedClickEvent = { persist: () => {} }; // Required for EUI action clicks. Can be removed if switching away from Enzyme to RTL
const getActions = () => getTableBody().find('ExpandedItemActions');
const getActionItems = () => getActions().first().dive().find('DefaultItemAction');
@ -157,7 +159,7 @@ describe('DomainsTable', () => {
it('sends the user to the engine overview on click', () => {
const { navigateToUrl } = mockKibanaValues;
getManageAction().simulate('click');
getManageAction().simulate('click', simulatedClickEvent);
expect(navigateToUrl).toHaveBeenCalledWith(
'/search_indices/index-name/domain_management/1234'
@ -167,7 +169,7 @@ describe('DomainsTable', () => {
describe('delete action', () => {
it('clicking the action and confirming deletes the domain', () => {
getDeleteAction().simulate('click');
getDeleteAction().simulate('click', simulatedClickEvent);
expect(actions.showModal).toHaveBeenCalled();
});

2
x-pack/plugins/enterprise_search/public/applications/shared/role_mapping/role_mappings_table.tsx
View file

@ -170,7 +170,7 @@ export const RoleMappingsTable: React.FC<Props> = ({
search={search}
pagination={pagination}
message={ROLE_MAPPINGS_NO_RESULTS_MESSAGE}
responsive={false}
responsiveBreakpoint={false}
/>
);
};

2
x-pack/plugins/enterprise_search/public/applications/workplace_search/components/shared/sources_table/sources_table.tsx
View file

@ -26,7 +26,7 @@ export const SourcesTable: React.FC<SourcesTableProps> = ({
onSearchableToggle,
}) => {
return (
<EuiTable responsive={false}>
<EuiTable responsiveBreakpoint={false}>
<EuiTableHeader>
<EuiTableHeaderCell>{SOURCE}</EuiTableHeaderCell>
<EuiTableHeaderCell>{STATUS_HEADER}</EuiTableHeaderCell>

2
x-pack/plugins/enterprise_search/public/applications/workplace_search/views/groups/components/group_source_prioritization.tsx
View file

@ -123,7 +123,7 @@ export const GroupSourcePrioritization: React.FC = () => {
);
const sourceTable = (
<EuiTable responsive={false} tableLayout="auto">
<EuiTable responsiveBreakpoint={false} tableLayout="auto">
<EuiTableHeader>
<EuiTableHeaderCell>{SOURCE_TABLE_HEADER}</EuiTableHeaderCell>
<EuiTableHeaderCell align="right">{PRIORITY_TABLE_HEADER}</EuiTableHeaderCell>

1
x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/details_page/components/package_policies/package_policies_table.tsx
View file

@ -335,7 +335,6 @@ export const PackagePoliciesTable: React.FunctionComponent<Props> = ({
},
],
}}
isSelectable={false}
/>
);
};

2
x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/list_page/index.tsx
View file

@ -279,7 +279,6 @@ export const AgentPolicyListPage: React.FunctionComponent<{}> = () => {
<EuiSpacer size="m" />
<EuiBasicTable<AgentPolicy>
loading={isLoading}
hasActions={true}
noItemsMessage={
isLoading ? (
<FormattedMessage
@ -308,7 +307,6 @@ export const AgentPolicyListPage: React.FunctionComponent<{}> = () => {
items={agentPolicyData ? agentPolicyData.items : []}
itemId="id"
columns={columns}
isSelectable={false}
pagination={{
pageIndex: pagination.currentPage - 1,
pageSize: pagination.pageSize,

2
x-pack/plugins/fleet/public/applications/fleet/sections/agents/agent_list_page/components/agent_list_table.tsx
View file

@ -321,7 +321,6 @@ export const AgentListTable: React.FC<Props> = (props: Props) => {
className="fleet__agentList__table"
data-test-subj="fleetAgentListTable"
loading={isLoading}
hasActions={true}
noItemsMessage={noItemsMessage}
items={
totalAgents
@ -338,7 +337,6 @@ export const AgentListTable: React.FC<Props> = (props: Props) => {
totalItemCount: totalAgents,
pageSizeOptions,
}}
isSelectable={true}
selection={
!authz.fleet.allAgents
? undefined

1
x-pack/plugins/fleet/public/applications/fleet/sections/agents/enrollment_token_list_page/index.tsx
View file

@ -275,7 +275,6 @@ export const EnrollmentTokenListPage: React.FunctionComponent<{}> = () => {
<EuiBasicTable<EnrollmentAPIKey>
data-test-subj="enrollmentTokenListTable"
loading={isLoading}
hasActions={true}
noItemsMessage={
isLoading ? (
<FormattedMessage

1
x-pack/plugins/fleet/public/applications/fleet/sections/agents/uninstall_token_list_page/index.tsx
View file

@ -215,7 +215,6 @@ export const UninstallTokenListPage = () => {
}}
onChange={handleTablePagination}
noItemsMessage={<NoItemsMessage isLoading={isLoading} />}
hasActions={true}
/>
<EuiSpacer size="xl" />

1
x-pack/plugins/fleet/public/applications/fleet/sections/data_stream/list_page/index.tsx
View file

@ -193,7 +193,6 @@ export const DataStreamListPage: React.FunctionComponent<{}> = () => {
return (
<EuiInMemoryTable
loading={isLoading}
hasActions={true}
tableLayout="auto"
message={
isLoading ? (

4
x-pack/plugins/fleet/public/applications/integrations/sections/epm/screens/detail/overview/markdown_renderers.tsx
View file

@ -56,9 +56,7 @@ export const markdownRenderers = (
refs: MutableRefObject<Map<string, HTMLDivElement | null>>
): TransformOptions['components'] => {
return {
table: ({ children }) => (
<EuiTable className="euiEuiTable euiTable--responsive">{children}</EuiTable>
),
table: ({ children }) => <EuiTable>{children}</EuiTable>,
tr: ({ children }) => <EuiTableRow>{children}</EuiTableRow>,
th: ({ children }) => <EuiTableHeaderCell>{children}</EuiTableHeaderCell>,
td: ({ children }) => <EuiTableRowCell>{children}</EuiTableRowCell>,

6
x-pack/plugins/index_lifecycle_management/__jest__/policy_table.test.tsx
View file

@ -307,11 +307,11 @@ describe('policy table', () => {
const policyName = findTestSubject(firstRow, 'policyTablePolicyNameLink').text();
expect(policyName).toBe(`${testPolicy.name}`);
const policyIndexTemplates = findTestSubject(firstRow, 'policy-indexTemplates').text();
expect(policyIndexTemplates).toBe(`Linked index templates${testPolicy.indexTemplates.length}`);
expect(policyIndexTemplates).toBe(`${testPolicy.indexTemplates.length}`);
const policyIndices = findTestSubject(firstRow, 'policy-indices').text();
expect(policyIndices).toBe(`Linked indices${testPolicy.indices.length}`);
expect(policyIndices).toBe(`${testPolicy.indices.length}`);
const policyModifiedDate = findTestSubject(firstRow, 'policy-modifiedDate').text();
expect(policyModifiedDate).toBe(`Modified date${testDateFormatted}`);
expect(policyModifiedDate).toBe(`${testDateFormatted}`);
});
test('opens a flyout with index templates', () => {
const rendered = mountWithIntl(component);

2
x-pack/plugins/index_management/__jest__/components/index_table.test.js
View file

@ -75,7 +75,7 @@ const status = (rendered, row = 0) => {
rendered.update();
return findTestSubject(rendered, 'indexTableCell-status')
.at(row)
.find('.euiTableCellContent')
.find('div.euiTableCellContent')
.text();
};

1
x-pack/plugins/index_management/public/application/components/component_templates/component_template_list/table.tsx
View file

@ -131,7 +131,6 @@ export const ComponentTable: FunctionComponent<Props> = ({
const tableProps: EuiInMemoryTableProps<ComponentTemplateListItem> = {
tableLayout: 'auto',
itemId: 'name',
isSelectable: true,
'data-test-subj': 'componentTemplatesTable',
sorting: { sort: { field: 'name', direction: 'asc' } },
selection: {

1
x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/field_parameters/relations_parameter.tsx
View file

@ -244,7 +244,6 @@ export const RelationsParameter = () => {
defaultMessage: 'No relationship defined',
}
)}
hasActions
/>
{/* Add relation button */}

1
x-pack/plugins/index_management/public/application/sections/home/data_stream_list/data_stream_table/data_stream_table.tsx
View file

@ -271,7 +271,6 @@ export const DataStreamTable: React.FunctionComponent<Props> = ({
columns={columns}
search={searchConfig}
sorting={sorting}
isSelectable={true}
selection={selectionConfig}
pagination={pagination}
rowProps={() => ({

1
x-pack/plugins/index_management/public/application/sections/home/enrich_policies_list/policies_table/policies_table.tsx
View file

@ -169,7 +169,6 @@ export const PoliciesTable: FunctionComponent<Props> = ({
search={search}
pagination={pagination}
sorting={true}
isSelectable={false}
/>
);
};

16
x-pack/plugins/index_management/public/application/sections/home/index_list/index_table/index_table.js
View file

@ -374,24 +374,11 @@ export class IndexTable extends Component {
return columnConfigs.map((columnConfig) => {
const { name } = index;
const { fieldName } = columnConfig;
if (fieldName === 'name') {
return (
<th
key={`${fieldName}-${name}`}
className="euiTableRowCell"
scope="row"
data-test-subj={`indexTableCell-${fieldName}`}
>
<div className={`euiTableCellContent indTable__cell--${fieldName}`}>
<span className="eui-textLeft">{this.buildRowCell(index, columnConfig)}</span>
</div>
</th>
);
}
return (
<EuiTableRowCell
key={`${fieldName}-${name}`}
truncateText={false}
setScopeRow={fieldName === 'name'}
data-test-subj={`indexTableCell-${fieldName}`}
className={'indTable__cell--' + fieldName}
header={fieldName}
@ -437,6 +424,7 @@ export class IndexTable extends Component {
data-test-subj="indexTableRow"
isSelected={this.isItemSelected(name)}
isSelectable
hasSelection
key={`${name}-row`}
>
<EuiTableRowCellCheckbox key={`checkbox-${name}`}>

1
x-pack/plugins/index_management/public/application/sections/home/template_list/legacy_templates/template_table/template_table.tsx
View file

@ -281,7 +281,6 @@ export const LegacyTemplateTable: React.FunctionComponent<Props> = ({
columns={columns}
search={searchConfig}
sorting={sorting}
isSelectable={true}
selection={selectionConfig}
pagination={pagination}
rowProps={() => ({

1
x-pack/plugins/index_management/public/application/sections/home/template_list/template_table/template_table.tsx
View file

@ -282,7 +282,6 @@ export const TemplateTable: React.FunctionComponent<Props> = ({
columns={columns}
search={searchConfig}
sorting={sorting}
isSelectable={true}
selection={selectionConfig}
pagination={pagination}
rowProps={() => ({

1
x-pack/plugins/ingest_pipelines/public/application/sections/pipelines_list/table.tsx
View file

@ -114,7 +114,6 @@ export const PipelineTable: FunctionComponent<Props> = ({
const tableProps: EuiInMemoryTableProps<Pipeline> = {
itemId: 'name',
isSelectable: true,
'data-test-subj': 'pipelinesTable',
sorting: { sort: { field: 'name', direction: 'asc' } },
selection: {

Some files were not shown because too many files have changed in this diff Show more