[8.8] [Discover] Fix grid theme (#158231) (#158643)

# Backport

This will backport the following commits from `main` to `8.8`:
- [[Discover] Fix grid theme
(#158231)](https://github.com/elastic/kibana/pull/158231)

<!--- Backport version: 8.9.7 -->

### Questions ?
Please refer to the [Backport tool
documentation](https://github.com/sqren/backport)

<!--BACKPORT [{"author":{"name":"Julia
Rechkunova","email":"julia.rechkunova@elastic.co"},"sourceCommit":{"committedDate":"2023-05-30T05:31:25Z","message":"[Discover]
Fix grid theme (#158231)\n\nAddresses
https://github.com/elastic/kibana/issues/158201\r\n\r\n##
Summary\r\n\r\nThis PR fixes grid row selection in dark
mode.\r\n\r\nBefore:\r\n<img width=\"300\" alt=\"Screenshot 2023-05-23
at 09 53
11\"\r\nsrc=\"e447ebb5-ca75-4778-84a7-ec654aca3709\">\r\n\r\nAfter:\r\n<img
width=\"300\" alt=\"Screenshot 2023-05-23 at 09 52
44\"\r\nsrc=\"86f7ccd0-a306-426b-9fcb-91d9131a7da6\">\r\n\r\nFor
testing:\r\nEnable dark mode on User Profile
page.","sha":"e928b519f31c73e45305c1524430d978081ee0ea","branchLabelMapping":{"^v8.9.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["Feature:Discover","release_note:fix","Team:DataDiscovery","backport:prev-minor","v8.9.0"],"number":158231,"url":"https://github.com/elastic/kibana/pull/158231","mergeCommit":{"message":"[Discover]
Fix grid theme (#158231)\n\nAddresses
https://github.com/elastic/kibana/issues/158201\r\n\r\n##
Summary\r\n\r\nThis PR fixes grid row selection in dark
mode.\r\n\r\nBefore:\r\n<img width=\"300\" alt=\"Screenshot 2023-05-23
at 09 53
11\"\r\nsrc=\"e447ebb5-ca75-4778-84a7-ec654aca3709\">\r\n\r\nAfter:\r\n<img
width=\"300\" alt=\"Screenshot 2023-05-23 at 09 52
44\"\r\nsrc=\"86f7ccd0-a306-426b-9fcb-91d9131a7da6\">\r\n\r\nFor
testing:\r\nEnable dark mode on User Profile
page.","sha":"e928b519f31c73e45305c1524430d978081ee0ea"}},"sourceBranch":"main","suggestedTargetBranches":[],"targetPullRequestStates":[{"branch":"main","label":"v8.9.0","labelRegex":"^v8.9.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/158231","number":158231,"mergeCommit":{"message":"[Discover]
Fix grid theme (#158231)\n\nAddresses
https://github.com/elastic/kibana/issues/158201\r\n\r\n##
Summary\r\n\r\nThis PR fixes grid row selection in dark
mode.\r\n\r\nBefore:\r\n<img width=\"300\" alt=\"Screenshot 2023-05-23
at 09 53
11\"\r\nsrc=\"e447ebb5-ca75-4778-84a7-ec654aca3709\">\r\n\r\nAfter:\r\n<img
width=\"300\" alt=\"Screenshot 2023-05-23 at 09 52
44\"\r\nsrc=\"86f7ccd0-a306-426b-9fcb-91d9131a7da6\">\r\n\r\nFor
testing:\r\nEnable dark mode on User Profile
page.","sha":"e928b519f31c73e45305c1524430d978081ee0ea"}}]}] BACKPORT-->

Co-authored-by: Julia Rechkunova <julia.rechkunova@elastic.co>
This commit is contained in:
Kibana Machine 2023-05-30 02:42:41 -04:00 committed by GitHub
parent f97c2cc0cd
commit a1590a7eed
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -9,6 +9,8 @@
import React, { useCallback, useMemo, useState, useRef, useEffect } from 'react';
import classnames from 'classnames';
import { FormattedMessage } from '@kbn/i18n-react';
import { of } from 'rxjs';
import useObservable from 'react-use/lib/useObservable';
import './discover_grid.scss';
import {
EuiDataGridSorting,
@ -25,7 +27,7 @@ import type { DataView } from '@kbn/data-views-plugin/public';
import type { SortOrder } from '@kbn/saved-search-plugin/public';
import { Filter } from '@kbn/es-query';
import { FieldFormatsStart } from '@kbn/field-formats-plugin/public';
import { ToastsStart, IUiSettingsClient, HttpStart } from '@kbn/core/public';
import type { ToastsStart, IUiSettingsClient, HttpStart, CoreStart } from '@kbn/core/public';
import { DataViewFieldEditorStart } from '@kbn/data-view-field-editor-plugin/public';
import { DocViewFilterFn } from '../../services/doc_views/doc_views_types';
import { getSchemaDetectors } from './discover_grid_schema';
@ -52,6 +54,8 @@ import { useRowHeightsOptions } from '../../hooks/use_row_heights_options';
import { convertValueToString } from '../../utils/convert_value_to_string';
import { getRowsPerPageOptions, getDefaultRowsPerPage } from '../../utils/rows_per_page';
const themeDefault = { darkMode: false };
interface SortObj {
id: string;
direction: string;
@ -199,6 +203,7 @@ export interface DiscoverGridProps {
* Service dependencies
*/
services: {
core: CoreStart;
fieldFormats: FieldFormatsStart;
addBasePath: HttpStart['basePath']['prepend'];
uiSettings: IUiSettingsClient;
@ -249,6 +254,7 @@ export const DiscoverGrid = ({
services,
}: DiscoverGridProps) => {
const { fieldFormats, toastNotifications, dataViewFieldEditor, uiSettings } = services;
const { darkMode } = useObservable(services.core.theme?.theme$ ?? of(themeDefault), themeDefault);
const dataGridRef = useRef<EuiDataGridRefProps>(null);
const [selectedDocs, setSelectedDocs] = useState<string[]>([]);
const [isFilterActive, setIsFilterActive] = useState(false);
@ -571,7 +577,7 @@ export const DiscoverGrid = ({
rows: displayedRows,
onFilter,
dataView,
isDarkMode: services.uiSettings.get('theme:darkMode'),
isDarkMode: darkMode,
selectedDocs: usedSelectedDocs,
setSelectedDocs: (newSelectedDocs) => {
setSelectedDocs(newSelectedDocs);