* 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> |
||
---|---|---|
.. | ||
common | ||
public | ||
kibana.json | ||
README.md | ||
tsconfig.json |
Example Reporting integration!
Use this example code to understand how to add a "Generate Report" button to a Kibana page. This simple example shows that the end-to-end functionality of generating a screenshot report of a page just requires you to render a React component that you import from the Reportinng plugin.
A "reportable" Kibana page is one that has an alternate version to show the data in a "screenshot-friendly" way. The alternate version can be reached at a variation of the page's URL that the App team builds.
A "screenshot-friendly" page has all interactive features turned off. These are typically notifications, popups, tooltips, controls, autocomplete libraries, etc.
Turning off these features keeps glitches out of the screenshot, and makes the server-side headless browser run faster and use less RAM.
The URL that Reporting captures is controlled by the application, is a part of a "jobParams" object that gets passed to the React component imported from Reporting. The job params give the app control over the end-resulting report:
- Layout
- Page dimensions
- DOM attributes to select where the visualization container(s) is/are. The App team must add the attributes to DOM elements in their app.
- DOM events that the page fires off and signals when the rendering is done. The App team must implement triggering the DOM events around rendering the data in their app.
- Export type definition
- Processes the jobParams into output data, which is stored in Elasticsearch in the Reporting system index.
- Export type definitions are registered with the Reporting plugin at setup time.
The existing export type definitions are PDF, PNG, and CSV. They should be enough for nearly any use case.
If the existing options are too limited for a future use case, the AppServices team can assist the App team to implement a custom export type definition of their own, and register it using the Reporting plugin API (documentation coming soon).