[App Search] Added a History tab to the Automated Curation detail view #115090

JasonStoltz · 2021-10-14T19:36:27Z

Summary

Closes https://github.com/elastic/app-search-team/issues/1945

This adds a log stream to the history tab of the automated curations section.

If you want to test this, simply create an automated suggestion and then check out the History tab.

Checklist

Delete any items that are not applicable to this PR.

Any text added follows EUI's writing guidelines, uses sentence case text and includes i18n support
Unit or functional tests were updated or added to match the most common scenarios
Any UI touched in this PR is usable by keyboard only (learn more about keyboard accessibility)
Any UI touched in this PR does not create any new axe failures (run axe in browser: FF, Chrome)
This renders correctly on smaller devices using a responsive layout. (You can test this in your browser)
This was checked for cross-browser compatibility

For maintainers

This was checked for breaking API changes and was labeled appropriately

byronhulcher

I think the column names for the log stream need to be i18n-ized, but I don't want to hold up merging any longer than necessary so I'm approving for now 👍

byronhulcher · 2021-10-15T02:44:33Z

...s/enterprise_search/public/applications/app_search/components/curations/curation/history.tsx

+          {
+            type: 'field',
+            field: 'appsearch.search_relevance_suggestions.query',
+            header: 'Query',


Do these headers need to be i18n-ized?

They do! This PR is in draft right now, so I'm just waiting on the finalized list of columns to show.

This are all gone, using OOTB headers now: 81a0904

byronhulcher · 2021-10-15T02:45:43Z

...e_search/public/applications/app_search/components/curations/curation/automated_curation.tsx


 export const AutomatedCuration: React.FC = () => {
  const { curationId } = useParams<{ curationId: string }>();
  const logic = CurationLogic({ curationId });
  const { convertToManual } = useActions(logic);
  const { activeQuery, dataLoading, queries, curation } = useValues(logic);
+  const { engineName } = useValues(EngineLogic);
+  const [selectedPageTab, setSelectedPageTab] = useState(PROMOTED);

  // This tab group is meant to visually mirror the dynamic group of tags in the ManualCuration component


This comment can get removed now that this tab group is no longer static

byronhulcher · 2021-10-15T02:49:35Z

...rch/public/applications/app_search/components/curations/curation/automated_curation.test.tsx

+
+    expect(wrapper.find(PromotedDocuments)).toHaveLength(1);
+    expect(wrapper.find(OrganicDocuments)).toHaveLength(1);
+    expect(wrapper.find(History)).toHaveLength(0);


When I'm writing jest tests for React components, I try to avoid using events like clicks to modify the local state. In the manual_curation.test.tsx file you can see an example of how I'd write this kind of test

kibana/x-pack/plugins/enterprise_search/public/applications/app_search/components/curations/curation/manual_curation.test.tsx

Lines 65 to 101 in ad6340a

it('includes set of tabs in the page header', () => {

const wrapper = shallow(<ManualCuration />);

const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

tabs.at(0).simulate('click');

expect(actions.onSelectPageTab).toHaveBeenNthCalledWith(1, 'promoted');

tabs.at(1).simulate('click');

expect(actions.onSelectPageTab).toHaveBeenNthCalledWith(2, 'hidden');

});

it('contains a suggested documents callout when the selectedPageTab is ', () => {

const wrapper = shallow(<ManualCuration />);

expect(wrapper.find(SuggestedDocumentsCallout)).toHaveLength(1);

});

it('renders promoted documents when that tab is selected', () => {

setMockValues({ ...values, selectedPageTab: 'promoted' });

const wrapper = shallow(<ManualCuration />);

const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

expect(tabs.at(0).prop('isSelected')).toEqual(true);

expect(wrapper.find(PromotedDocuments)).toHaveLength(1);

});

it('renders hidden documents when that tab is selected', () => {

setMockValues({ ...values, selectedPageTab: 'hidden' });

const wrapper = shallow(<ManualCuration />);

const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

expect(tabs.at(1).prop('isSelected')).toEqual(true);

expect(wrapper.find(HiddenDocuments)).toHaveLength(1);

});

You don't have to change it here or how you do it in the future but wanted to present how I've been handling it

Hmm, I think it's a little different. You are using Kea, I'm using local state. Using local state, I think I have to use a click to modify the local state.

I think I have a way to mock useState, similar to how we mock useValues/useActions. I'll post in Slack

JasonStoltz · 2021-10-15T15:01:11Z

@byronhulcher This PR is finalized if you want to have a second look!

byronhulcher · 2021-10-15T17:47:20Z

...rch/public/applications/app_search/components/curations/curation/automated_curation.test.tsx

+
+    expect(wrapper.find(PromotedDocuments)).toHaveLength(1);
+    expect(wrapper.find(OrganicDocuments)).toHaveLength(1);
+    expect(wrapper.find(History)).toHaveLength(0);


I think I have a way to mock useState, similar to how we mock useValues/useActions. I'll post in Slack

JasonStoltz · 2021-10-18T14:05:30Z

@elasticmachine merge upstream

kibanamachine · 2021-10-18T16:20:15Z

💚 Build Succeeded

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
`enterpriseSearch`	1547	1550	+3

Async chunks

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

id	before	after	diff
`enterpriseSearch`	1.4MB	1.4MB	+1.3KB

Page load bundle

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

id	before	after	diff
`enterpriseSearch`	9.4KB	9.5KB	+189.0B

History

💔 Build #161488 failed 1bcbbf3
💚 Build #161177 succeeded ad6340a
💔 Build #161171 failed 4e210bd1d5e654427159d6962bf747fce99b3ed8
💔 Build #161149 failed 537cfc0

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

elastic#115090)

kibanamachine · 2021-10-18T16:23:10Z

💚 Backport successful

Status	Branch	Result
✅	7.x

This backport PR will be merged automatically after passing CI.

elastic#115090)

…4549) (#115650) * Handle deletes (#114545) * [App Search] Wired up organic results on Curation Suggestions view (#114717) * [App Search] Added a History tab to the Automated Curation detail view (#115090) * Check platinum license (#114549)

byronhulcher · 2021-10-20T01:41:57Z

Backported in #115650

JasonStoltz force-pushed the curation-history-2 branch from 537cfc0 to 4e210bd Compare October 14, 2021 20:29

JasonStoltz changed the title ~~history~~ [App Search] Added a History tab to the Automated Curation detail view Oct 14, 2021

JasonStoltz added v7.16.0 release_note:skip Skip the PR/issue when compiling release notes auto-backport Deprecated - use backport:version if exact versions are needed labels Oct 14, 2021

Added history to Automated Curations

ad6340a

JasonStoltz force-pushed the curation-history-2 branch from 4e210bd to ad6340a Compare October 14, 2021 20:47

byronhulcher approved these changes Oct 15, 2021

View reviewed changes

JasonStoltz added 2 commits October 15, 2021 10:55

Finalized fields

81a0904

PR feedback

1bcbbf3

JasonStoltz marked this pull request as ready for review October 15, 2021 15:00

JasonStoltz requested a review from a team October 15, 2021 15:00

JasonStoltz enabled auto-merge (squash) October 15, 2021 15:01

byronhulcher approved these changes Oct 15, 2021

View reviewed changes

Merge branch 'master' into curation-history-2

bf30197

JasonStoltz merged commit c2571c7 into elastic:master Oct 18, 2021

kibanamachine pushed a commit to kibanamachine/kibana that referenced this pull request Oct 18, 2021

[App Search] Added a History tab to the Automated Curation detail view (

07d6400

elastic#115090)

kibanamachine mentioned this pull request Oct 18, 2021

[7.x] [App Search] Added a History tab to the Automated Curation detail view (#115090) #115405

Closed

byronhulcher pushed a commit to JasonStoltz/kibana that referenced this pull request Oct 19, 2021

[App Search] Added a History tab to the Automated Curation detail view (

7d66193

elastic#115090)

byronhulcher mentioned this pull request Oct 20, 2021

[7.x] Automated Curation Backports (#114545) (#114717) (#115090) (#114549) #115650

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[App Search] Added a History tab to the Automated Curation detail view #115090

[App Search] Added a History tab to the Automated Curation detail view #115090

JasonStoltz commented Oct 14, 2021 •

edited

Loading

byronhulcher left a comment

byronhulcher Oct 15, 2021

JasonStoltz Oct 15, 2021

JasonStoltz Oct 15, 2021

byronhulcher Oct 15, 2021

JasonStoltz Oct 15, 2021

JasonStoltz Oct 15, 2021

byronhulcher Oct 15, 2021

JasonStoltz Oct 15, 2021

byronhulcher Oct 15, 2021

JasonStoltz commented Oct 15, 2021

byronhulcher Oct 15, 2021

JasonStoltz commented Oct 18, 2021

kibanamachine commented Oct 18, 2021

kibanamachine commented Oct 18, 2021

byronhulcher commented Oct 20, 2021

	it('includes set of tabs in the page header', () => {
	const wrapper = shallow(<ManualCuration />);

	const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

	tabs.at(0).simulate('click');
	expect(actions.onSelectPageTab).toHaveBeenNthCalledWith(1, 'promoted');

	tabs.at(1).simulate('click');
	expect(actions.onSelectPageTab).toHaveBeenNthCalledWith(2, 'hidden');
	});

	it('contains a suggested documents callout when the selectedPageTab is ', () => {
	const wrapper = shallow(<ManualCuration />);

	expect(wrapper.find(SuggestedDocumentsCallout)).toHaveLength(1);
	});

	it('renders promoted documents when that tab is selected', () => {
	setMockValues({ ...values, selectedPageTab: 'promoted' });
	const wrapper = shallow(<ManualCuration />);
	const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

	expect(tabs.at(0).prop('isSelected')).toEqual(true);

	expect(wrapper.find(PromotedDocuments)).toHaveLength(1);
	});

	it('renders hidden documents when that tab is selected', () => {
	setMockValues({ ...values, selectedPageTab: 'hidden' });
	const wrapper = shallow(<ManualCuration />);
	const tabs = getPageHeaderTabs(wrapper).find(EuiTab);

	expect(tabs.at(1).prop('isSelected')).toEqual(true);

	expect(wrapper.find(HiddenDocuments)).toHaveLength(1);
	});

[App Search] Added a History tab to the Automated Curation detail view #115090

[App Search] Added a History tab to the Automated Curation detail view #115090

Conversation

JasonStoltz commented Oct 14, 2021 • edited Loading

Summary

Checklist

For maintainers

byronhulcher left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

JasonStoltz commented Oct 15, 2021

Choose a reason for hiding this comment

JasonStoltz commented Oct 18, 2021

kibanamachine commented Oct 18, 2021

💚 Build Succeeded

Metrics [docs]

Module Count

Async chunks

Page load bundle

History

kibanamachine commented Oct 18, 2021

💚 Backport successful

byronhulcher commented Oct 20, 2021

JasonStoltz commented Oct 14, 2021 •

edited

Loading