diff --git a/src/plugins/discover/public/application/components/discover_grid/discover_grid_flyout.tsx b/src/plugins/discover/public/application/components/discover_grid/discover_grid_flyout.tsx
index f31399793c0d..389412789104 100644
--- a/src/plugins/discover/public/application/components/discover_grid/discover_grid_flyout.tsx
+++ b/src/plugins/discover/public/application/components/discover_grid/discover_grid_flyout.tsx
@@ -178,15 +178,29 @@ export function DiscoverGridFlyout({
indexPattern={indexPattern}
filter={(mapping, value, mode) => {
onFilter(mapping, value, mode);
- onClose();
+ services.toastNotifications.addSuccess(
+ i18n.translate('discover.grid.flyout.toastFilterAdded', {
+ defaultMessage: `Filter was added`,
+ })
+ );
}}
onRemoveColumn={(columnName: string) => {
onRemoveColumn(columnName);
- onClose();
+ services.toastNotifications.addSuccess(
+ i18n.translate('discover.grid.flyout.toastColumnRemoved', {
+ defaultMessage: `Column '{columnName}' was removed`,
+ values: { columnName },
+ })
+ );
}}
onAddColumn={(columnName: string) => {
onAddColumn(columnName);
- onClose();
+ services.toastNotifications.addSuccess(
+ i18n.translate('discover.grid.flyout.toastColumnAdded', {
+ defaultMessage: `Column '{columnName}' was added`,
+ values: { columnName },
+ })
+ );
}}
/>
diff --git a/src/plugins/discover/public/application/components/table/table.test.tsx b/src/plugins/discover/public/application/components/table/table.test.tsx
index 8997c1d13a47..7539f29c1ec9 100644
--- a/src/plugins/discover/public/application/components/table/table.test.tsx
+++ b/src/plugins/discover/public/application/components/table/table.test.tsx
@@ -155,7 +155,7 @@ describe('DocViewTable at Discover', () => {
const elementExist = check[element];
if (typeof elementExist === 'boolean') {
- const btn = findTestSubject(rowComponent, element);
+ const btn = findTestSubject(rowComponent, element, '^=');
it(`renders ${element} for '${check._property}' correctly`, () => {
const disabled = btn.length ? btn.props().disabled : true;
diff --git a/src/plugins/discover/public/application/components/table/table_row.tsx b/src/plugins/discover/public/application/components/table/table_row.tsx
index 5c6ae49770bc..e8977fda8576 100644
--- a/src/plugins/discover/public/application/components/table/table_row.tsx
+++ b/src/plugins/discover/public/application/components/table/table_row.tsx
@@ -65,7 +65,11 @@ export function DocViewTableRow({
onClick={() => onFilter(fieldMapping, valueRaw, '-')}
/>
{typeof onToggleColumn === 'function' && (
-
+
)}
void;
+ fieldname: string;
}
-export function DocViewTableRowBtnToggleColumn({ onClick, active, disabled = false }: Props) {
+export function DocViewTableRowBtnToggleColumn({
+ onClick,
+ active,
+ disabled = false,
+ fieldname = '',
+}: Props) {
if (disabled) {
return (
diff --git a/test/functional/apps/discover/_data_grid_doc_table.ts b/test/functional/apps/discover/_data_grid_doc_table.ts
index 5499f0250eb7..f8406f4c8a8a 100644
--- a/test/functional/apps/discover/_data_grid_doc_table.ts
+++ b/test/functional/apps/discover/_data_grid_doc_table.ts
@@ -22,6 +22,7 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
defaultIndex: 'logstash-*',
'doc_table:legacy': false,
};
+ const testSubjects = getService('testSubjects');
describe('discover data grid doc table', function describeIndexTests() {
before(async function () {
@@ -102,6 +103,31 @@ export default function ({ getService, getPageObjects }: FtrProviderContext) {
await dataGrid.closeFlyout();
});
});
+
+ it('should show allow adding columns from the detail panel', async function () {
+ await retry.try(async function () {
+ await dataGrid.clickRowToggle({ isAnchorRow: false, rowIndex: rowToInspect - 1 });
+
+ // add columns
+ const fields = ['_id', '_index', 'agent'];
+ for (const field of fields) {
+ await testSubjects.click(`toggleColumnButton_${field}`);
+ }
+
+ const headerWithFields = await dataGrid.getHeaderFields();
+ expect(headerWithFields.join(' ')).to.contain(fields.join(' '));
+
+ // remove columns
+ for (const field of fields) {
+ await testSubjects.click(`toggleColumnButton_${field}`);
+ }
+
+ const headerWithoutFields = await dataGrid.getHeaderFields();
+ expect(headerWithoutFields.join(' ')).not.to.contain(fields.join(' '));
+
+ await dataGrid.closeFlyout();
+ });
+ });
});
describe('add and remove columns', function () {