kibana

mirror of https://github.com/elastic/kibana.git synced 2025-04-22 08:49:27 -04:00

History

Tim Sullivan 704e080c93 Integrate Event-Based Telemetry in KibanaErrorBoundary (#169895 ) ## Summary Part of https://github.com/elastic/kibana-team/issues/646 Depends on https://github.com/elastic/kibana/pull/169324 Implements telemetry for fatal errors caught by KibanaErrorBoundary in: - `packages/core/application/core-application-browser-internal/src/ui/app_router.tsx` - `packages/kbn-shared-ux-utility/src/with_suspense.tsx` [] - `packages/react/kibana_context/render/render_provider.tsx` [] - `src/plugins/management/public/components/management_app/management_router.tsx` - `x-pack/plugins/observability_shared/public/components/page_template/page_template.tsx` - `x-pack/plugins/security_solution/public/app/app.tsx` [*] The changes made to these allowed the `analytics` dependency to be provided optionally, to avoid a breaking API change for maintainers. ## Logging screenshot You can trigger a fatal error in the new error boundary component in most places in Kibana by adding a TypeError to a React component: `<p>{breakHere()}</p>` <img width="1586" alt="fatal error telemetry console log" src="`97f973ac`-bb25-41f2-bfe2-547a23f2f450"> ## Telemetry work info Dashboard: <img width="1382" alt="image" src="`4fe5353a`-61ba-405a-ac18-0dd6a044c182"> Discover: <img width="1331" alt="image" src="`2161b552`-c441-4b7c-adef-25896147c08a"> ### Checklist - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios --------- Co-authored-by: kibanamachine <42973632+kibanamachine@users.noreply.github.com>		2023-11-03 12:55:00 -07:00
..
assets
common
render	Integrate Event-Based Telemetry in KibanaErrorBoundary (#169895 )	2023-11-03 12:55:00 -07:00
root	Integrate Event-Based Telemetry in KibanaErrorBoundary (#169895 )	2023-11-03 12:55:00 -07:00
styled	[regression] Fix Storybooks after #161914 (#162757 )	2023-07-31 10:51:28 -04:00
theme	[regression] Handle deprecated KibanaThemeProvider uses to include KibanaRenderContextProvider (#163103 )	2023-08-04 09:11:31 -07:00
README.mdx

README.mdx

---
id: react/context
slug: /react/context
title: React Contexts in Kibana
description: Kibana uses React Context to manage several global states.  This is a collection of packages supporting those states.
tags: ['shared-ux', 'react', 'context']
date: 2023-07-25
---

## Description

Kibana uses React Context to manage several global states.  Those states have been divided into several reusable components in relevant packages.

![Architecture Diagram](./assets/diagram.png)

- `KibanaRootContextProvider` - A root context provider for Kibana.  This is the top level context provider that wraps the entire application.  It is responsible for initializing all of the other contexts and providing them to the application.
- `KibanaRenderContextProvider` - A render context provider for Kibana.  This context is designed to be used with ad-hoc renders of React components, (usually with `ReactDOM.render`).
- `KibanaThemeContextProvider` - A theme context provider for Kibana.  A corollary to EUI's `EuiThemeProvider`, it uses Kibana services to ensure the EUI Theme is customized correctly.

## Deprecated Context Providers

- `KibanaStyledComponentsThemeProvider` - A styled components theme provider for Kibana.  This package is supplied for compatibility with legacy code, but should not be used in new code.