Skip to content

Commit

Permalink
Remove deprecated EUI components in kibana_react (#166225)
Browse files Browse the repository at this point in the history
## Summary

Closes #161422

In this PR:

- [x] Removes `KibanaPageTemplate` utilities from `kibana_react`
- [x] Migrates remaining users of `KibanaPageTemplate` from
`kibana_react` to the one from `@kbn/shared-ux-page-kibana-template`
- [x]
`src/plugins/home/public/application/components/tutorial_directory.js`
- [x]
`src/plugins/home/public/application/components/tutorial/tutorial.js`
  - [x] `x-pack/plugins/osquery/public/components/empty_state.tsx`

## Visual Changes

Below are the main visual differences this PR introduces.

Sample data page before:

<img width="1419" alt="Screenshot 2023-09-13 at 12 12 11"
src="https://github.com/elastic/kibana/assets/82822460/cbad5bd2-9c51-486c-a48d-ac44a80cdbf7">

Sample data page now:

<img width="1456" alt="Screenshot 2023-09-13 at 12 12 18"
src="https://github.com/elastic/kibana/assets/82822460/4118db78-89e8-41ed-a3d3-51a221dde857">

Tutorials page before:

<img width="1402" alt="Screenshot 2023-09-13 at 13 09 58"
src="https://github.com/elastic/kibana/assets/82822460/b51af548-211a-4a59-9143-b82f2ff55678">

Tutorials page now:

<img width="1439" alt="Screenshot 2023-09-13 at 13 10 04"
src="https://github.com/elastic/kibana/assets/82822460/f71590a3-7c3d-4f60-a460-47aacdfcbf09">

---------

Co-authored-by: kibanamachine <[email protected]>
  • Loading branch information
vadimkibana and kibanamachine authored Sep 25, 2023
1 parent a712426 commit dfcf60a
Show file tree
Hide file tree
Showing 21 changed files with 157 additions and 1,092 deletions.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
Expand Up @@ -68,7 +68,8 @@ export const KibanaPageTemplateInner: FC<Props> = ({
// the following props can be removed to allow the template to auto-handle
// the fixed header and banner heights.
offset={0}
minHeight={0}
minHeight={header ? 'calc(100vh - var(--euiFixedHeadersOffset, 0))' : 0}
grow={header ? false : undefined}
{...rest}
>
{sideBar}
Expand Down

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ import * as StatusCheckStates from './status_check_states';
import { injectI18n, FormattedMessage } from '@kbn/i18n-react';
import { i18n } from '@kbn/i18n';
import { getServices } from '../../kibana_services';
import { KibanaPageTemplate } from '@kbn/kibana-react-plugin/public';
import { KibanaPageTemplate } from '@kbn/shared-ux-page-kibana-template';

const INSTRUCTIONS_TYPE = {
ELASTIC_CLOUD: 'elasticCloud',
Expand Down Expand Up @@ -360,7 +360,7 @@ class TutorialUi extends React.Component {
render() {
let content;
if (this.state.notFound) {
content = (
return (
<KibanaPageTemplate
isEmptyState={true}
pageHeader={{
Expand Down Expand Up @@ -435,7 +435,11 @@ class TutorialUi extends React.Component {
);
}

return <KibanaPageTemplate template="empty">{content}</KibanaPageTemplate>;
return (
<KibanaPageTemplate template="empty">
<KibanaPageTemplate.Section>{content}</KibanaPageTemplate.Section>
</KibanaPageTemplate>
);
}
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import { SampleDataTab } from '@kbn/home-sample-data-tab';
import { i18n } from '@kbn/i18n';
import { Synopsis } from './synopsis';
import { getServices } from '../kibana_services';
import { KibanaPageTemplate } from '@kbn/kibana-react-plugin/public';
import { KibanaPageTemplate } from '@kbn/shared-ux-page-kibana-template';
import { getTutorials } from '../load_tutorials';

const SAMPLE_DATA_TAB_ID = 'sampleData';
Expand Down Expand Up @@ -257,7 +257,7 @@ class TutorialDirectoryUi extends React.Component {
rightSideItems: headerLinks ? [headerLinks] : [],
}}
>
{this.renderTabContent()}
<KibanaPageTemplate.Section>{this.renderTabContent()}</KibanaPageTemplate.Section>
</KibanaPageTemplate>
);
}
Expand Down
4 changes: 0 additions & 4 deletions src/plugins/kibana_react/public/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -54,17 +54,13 @@ export { POSITIONS, WEIGHTS, TOOLBAR_BUTTON_SIZES, ToolbarButton } from './toolb
export { reactRouterNavigate, reactRouterOnClickHandler } from './react_router_navigate';

export type {
KibanaPageTemplateProps,
NoDataPageActions,
NoDataPageActionsProps,
NoDataPageProps,
ElasticAgentCardProps,
} from './page_template';
export {
KibanaPageTemplate,
KibanaPageTemplateSolutionNavAvatar,
NO_DATA_PAGE_MAX_WIDTH,
NO_DATA_PAGE_TEMPLATE_PROPS,
NO_DATA_RECOMMENDED,
NoDataPage,
ElasticAgentCard,
Expand Down
Loading

0 comments on commit dfcf60a

Please sign in to comment.