Added a SuggestionsTable to Curations view #113123
Conversation
JasonStoltz
added
v7.16.0
release_note:skip
|
@elasticmachine merge upstream |
| }} | ||
| onChange={handlePageChange(onPaginate)} | ||
| /> | ||
| <DataPanel |
There was a problem hiding this comment.
I'm using DataPanel for both this new table AND I've updated the curations table to use it as well.
It seems to match exactly what the designs call for and it keep our code consistent.
|
|
||
| return ( | ||
| <DataPanel | ||
| icon={<LightbulbIcon />} |
There was a problem hiding this comment.
The lightbulb Icon is not yet part of EUI. For that reason, I created a new component ( thanks to @daveyholler ), and added a new optional icon property to DataPanel that takes an element (as opposed to the existing option that just takes an iconType property).
| // TODO wire up this data | ||
| const items: CurationSuggestion[] = [ | ||
| { | ||
| query: 'foo', | ||
| updated_at: '2021-07-08T14:35:50Z', | ||
| promoted: ['1', '2'], | ||
| }, | ||
| ]; | ||
| const meta = { | ||
| page: { | ||
| current: 1, | ||
| size: 10, | ||
| total_results: 100, | ||
| total_pages: 10, | ||
| }, | ||
| }; | ||
| const totalSuggestions = meta.page.total_results; | ||
| // TODO | ||
| // @ts-ignore | ||
| const onPaginate = (...params) => { | ||
| // eslint-disable-next-line no-console | ||
| console.log('paging...'); | ||
| // eslint-disable-next-line no-console | ||
| console.log(params); | ||
| }; | ||
| const isLoading = false; |
There was a problem hiding this comment.
This entire section is what will be wired up in a subsequent PR.
| ) : ( | ||
| <EmptyState /> | ||
| // TODO | ||
| const shouldShowSuggestions = true; |
There was a problem hiding this comment.
This will be wired up in a subsequent PR
| @@ -30,6 +30,7 @@ interface Props { | |||
| titleSize?: EuiTitleProps['size']; | |||
| subtitle?: React.ReactNode; | |||
| iconType?: EuiIconProps['type']; | |||
| icon?: React.ReactElement; | |||
There was a problem hiding this comment.
I don’t think you actually need to add an icon prop to DataPanel . The type property of an EuiIcon component already accepts a ReactElement, for instance here we’re already using that functionality to pass a custom SVG icon into a DataPanel.
There was a problem hiding this comment.
Oh nice! I had no idea, I appreciate that. I will make the change.
💚 Build SucceededMetrics [docs]Module Count
Async chunks
History
To update your PR or re-run it, just comment with: |
💚 Backport successful
This backport PR will be merged automatically after passing CI. |
Summary
This PR implements the Suggestions Table view only. It is not wired up. I will wire it up in a subsequent PR.
Checklist
For maintainers