mirror of
https://github.com/elastic/kibana.git
synced 2025-07-01 12:33:23 -04:00
98f73d674a
* Update all usages of EuiPageTemplate to EuiPageTemplate_Deprecated * EuiPageContent_Deprecated as EuiPageContent * EuiPageContentBody_Deprecated as EuiPageContentBody * EuiPageContentHeader_Deprecated as EuiPageContentHeader * EuiPageContentHeaderSection_Deprecated as EuiPageContentHeaderSection * EuiPageSideBar_Deprecated as EuiPageSideBar * EuiPageContent__Deprecated to EuiPageContent_Deprecated * Fix rogue semi-colons * WIP: NoDataConfigPage & NoDataPage converted to new template - `withSolutionNav` not yet handled * WIP: KibanaPageTemplateInner converted to use new template - Pushes existing `pageHeader` prompts onto created EuiPageTemplate.PageHeader - Uses `isEmptyState` to push `pageHeader` props to EuiPageTemplate.EmptyPrompt instead (if `children` are not supplied) * WIP: `withSolutionNav` now renders the sidebar content properly - Collapsing isn’t working (minWidth isn’t updating) * Fixing stickiness of sidebar * [Security] Fixed SecuritySolutionTemplateWrapper’s usage - Moved `bottomBar` to EuiPageTemplate.BottomBar (now contained in just the page contents) - Change EuiPanel children wrapper with EuiPageTemplate.Section * [O11y] Wrap `children` with EuiPageTemplate.Section * Fix getting_started usage * WIP: Fixing types * Removing `template` pass through * Set EUI to 63.0.0 * [CI] Auto-commit changed files from 'node scripts/eslint --no-cache --fix' * More import fixes * Sidebar component update * Expand `KibanaPageTemplate` to all namespaced EUI counterparts - Updated `docs/tutorials` mdx page - Fixed SolutionNav prop types * Updated the tutorial mdx page * [Stack Management] Updated app layout to new template - Some temporary props applied for BWC until all other pages can be converted - Converted `API Keys` page’s layout (and especially prompt usags) to new paradigm * Fix circular dep * Fix new circular dependency - copying and pasting types from KibanaPageTemplateProps, but ah well * [Security Solution] Remove `template` prop - no longer a prop on Kibana/EuiPageTemplate * [O11y] Allow customizing EuiPageTemplate.Section wrapper - converts pageBodyProps - fixes non-centered loading template * [Enterprise Search] Update page templates - fix layouts by auto-wrapping an EuiPageSection for padding, while adding a `customPageSections` prop for more custom sections/layouts - re-center 404 errors - update tests * Update KibanaPageTemplate tests * Update snapshots * Fix FTR test with removed EUI classNames * Fix FTR tests with changed kbn classNames * Update failing dashboard snapshots - drop shadow changed slightly in EUI * Fix failing Security Cypress test * [O11y] Fix Inventory page using deprecated CSS hooks * [O11y][Uptime] Fix missing bottom bars - Modifies ObservabilityPageTemplate to accept a `bottomBar` prop (a la the old EuiPageTemplate behavior) NOTE: This opinionated page layout structure is starting to feel like it could be potentially limiting / have all the same pitfalls the previous EuiPageTemplate did. If so, consider something closer to the Enterprise Search page template conversion (`customPageSections`). - Misc cleanup: Use `KibanaPageTemplate` over `EuiPageTemplate` * [O11y] Fix route template typing - Since theObservabilityPageTemplate is using the new Eui/KibanaPageTemplate, its child templates and types need to be updated accordingly * Fix broken minWidth behavior - was an EUI issue that required a patch release + update snapshots * [Security Solution] Type fixes, restore empty state - Fix empty state logic removed in a previous commit - bogarts KibanaPageTemplate's `isEmptyState` prop instead of using `template="noData"` - extend template wrappers to past ...rest to underlying Kibana/EuiPageTemplate + replace EuiPageTemplate with KibanaPageTemplate for consistency * Fix failing synthetics selector * Grab EUI v63.0.6 - for deprecation tags and section tag support * Fix Kibana Overview plugin layout - needs to use KibanaPageTemplate.Section to get padding back - use `bottomBorder` prop over horizontal rules - restore previous page color via panelled=false * Convert Home plugin to new KibanaPageTemplate - use KibanaPageTemplate.Section instead to preserve page width/paddings - use `bottomBorder` instead of `EuiHorizontalRule` - NOTE: This causes margins to decrease slightly from xxl to xl (largest padding available for EuiPageSection) - this can be restored by CSS overrides if desired - update CSS to preserve previous looks, + convert to logical properties * [O11y] Fix non-centered empty/loading states * [O11y] Restore subdued background on various empty state prompts * [O11y] Fix all instances of views that require a scrollable full-height child + restore comment for inventory view * [O11y][ux] Fix broken sidebar - The entire app was missing a wrapping EuiProvider, and as such breakpoint utils were not working, and the sidebar was missing + misc cleanup - remove unnecessary fragment - remove role="main" attr - now that EuiPageTemplate sets a `main` tag, they'll conflict - add isEmptyState to center loading component * [APM Cypress tests] harden flaky test * [APM Cypress tests] Fix failing Cypress test, again Co-authored-by: cchaos <caroline.horn@elastic.co> Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>
92 lines
3.2 KiB
TypeScript
92 lines
3.2 KiB
TypeScript
/*
|
|
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
|
* or more contributor license agreements. Licensed under the Elastic License
|
|
* 2.0 and the Server Side Public License, v 1; you may not use this file except
|
|
* in compliance with, at your election, the Elastic License 2.0 or the Server
|
|
* Side Public License, v 1.
|
|
*/
|
|
|
|
import React from 'react';
|
|
import ReactDOM from 'react-dom';
|
|
import { AppMountParameters } from '@kbn/core/public';
|
|
import {
|
|
EuiPage,
|
|
EuiPageBody,
|
|
EuiPageContent_Deprecated as EuiPageContent,
|
|
EuiText,
|
|
EuiHorizontalRule,
|
|
EuiPageContentHeader_Deprecated as EuiPageContentHeader,
|
|
EuiListGroup,
|
|
} from '@elastic/eui';
|
|
import { RandomNumberRouteExample } from './random_number_example';
|
|
import { RandomNumberBetweenRouteExample } from './random_number_between_example';
|
|
import { Services } from './services';
|
|
import { PostMessageRouteExample } from './post_message_example';
|
|
import { GetMessageRouteExample } from './get_message_example';
|
|
|
|
type Props = Services;
|
|
|
|
function RoutingExplorer({
|
|
fetchRandomNumber,
|
|
fetchRandomNumberBetween,
|
|
addSuccessToast,
|
|
postMessage,
|
|
getMessageById,
|
|
}: Props) {
|
|
return (
|
|
<EuiPage>
|
|
<EuiPageBody>
|
|
<EuiPageContent>
|
|
<EuiPageContentHeader>
|
|
<EuiText>
|
|
<h1>Routing examples</h1>
|
|
</EuiText>
|
|
</EuiPageContentHeader>
|
|
<EuiText>
|
|
<EuiListGroup
|
|
listItems={[
|
|
{
|
|
label: 'IRouter API docs',
|
|
href: 'https://github.com/elastic/kibana/blob/main/docs/development/core/server/kibana-plugin-core-server.irouter.md',
|
|
iconType: 'logoGithub',
|
|
target: '_blank',
|
|
size: 's',
|
|
},
|
|
{
|
|
label: 'HttpHandler (core.http.fetch) API docs',
|
|
href: 'https://github.com/elastic/kibana/blob/main/docs/development/core/public/kibana-plugin-core-public.httphandler.md',
|
|
iconType: 'logoGithub',
|
|
target: '_blank',
|
|
size: 's',
|
|
},
|
|
{
|
|
label: 'Conventions',
|
|
href: 'https://github.com/elastic/kibana/tree/main/STYLEGUIDE.mdx#api-endpoints',
|
|
iconType: 'logoGithub',
|
|
target: '_blank',
|
|
size: 's',
|
|
},
|
|
]}
|
|
/>
|
|
</EuiText>
|
|
<EuiHorizontalRule />
|
|
<RandomNumberRouteExample fetchRandomNumber={fetchRandomNumber} />
|
|
<EuiHorizontalRule />
|
|
<RandomNumberBetweenRouteExample fetchRandomNumberBetween={fetchRandomNumberBetween} />
|
|
|
|
<EuiHorizontalRule />
|
|
<PostMessageRouteExample addSuccessToast={addSuccessToast} postMessage={postMessage} />
|
|
|
|
<EuiHorizontalRule />
|
|
<GetMessageRouteExample getMessageById={getMessageById} />
|
|
</EuiPageContent>
|
|
</EuiPageBody>
|
|
</EuiPage>
|
|
);
|
|
}
|
|
|
|
export const renderApp = (props: Props, element: AppMountParameters['element']) => {
|
|
ReactDOM.render(<RoutingExplorer {...props} />, element);
|
|
|
|
return () => ReactDOM.unmountComponentAtNode(element);
|
|
};
|