diff --git a/changelogs/fragments/8905.yml b/changelogs/fragments/8905.yml new file mode 100644 index 000000000000..a5327c0626d6 --- /dev/null +++ b/changelogs/fragments/8905.yml @@ -0,0 +1,2 @@ +fix: +- Fix toggle column action in the discover page ([#8905](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8905)) \ No newline at end of file diff --git a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx new file mode 100644 index 000000000000..cd0c8116142c --- /dev/null +++ b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.test.tsx @@ -0,0 +1,34 @@ +/* + * Copyright OpenSearch Contributors + * SPDX-License-Identifier: Apache-2.0 + */ + +import React from 'react'; +import { mount } from 'enzyme'; +import { DocViewerTab, DocViewerTabProps } from './doc_viewer_tab'; +import { DocViewRenderProps } from '../../doc_views/doc_views_types'; + +test('DocViewerTab updated when getting new renderProps', () => { + const MockComp = ({ columns }: DocViewRenderProps) => ( +
{columns![0]}
+ ); + + const mockProps: DocViewerTabProps = { + id: 1, + title: 'Test1', + component: MockComp, + renderProps: { + hit: { _id: '1' }, + columns: ['test1'], + }, + }; + + const wrapper = mount(); + + const div = wrapper.find({ 'data-test-subj': 'test-div' }); + expect(div.text()).toEqual('test1'); + + mockProps.renderProps = { hit: { _id: '1' }, columns: ['test2'] }; + wrapper.setProps(mockProps); + expect(div.text()).toEqual('test2'); +}); diff --git a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx index 6e7a5f1ac434..1f8492ef21f9 100644 --- a/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx +++ b/src/plugins/discover/public/application/components/doc_viewer/doc_viewer_tab.tsx @@ -65,6 +65,7 @@ export class DocViewerTab extends React.Component { shouldComponentUpdate(nextProps: Props, nextState: State) { return ( nextProps.renderProps.hit._id !== this.props.renderProps.hit._id || + nextProps.renderProps.columns !== this.props.renderProps.columns || nextProps.id !== this.props.id || nextState.hasError );