[Log Explorer] Add flyout title customization (#170933)

## 📓 Summary

Closes #170391 

This work adds a new `title` parameter for the flyout customization and
sets the `Log details` title for the customized Log Explorer flyout.

<img width="1498" alt="Screenshot 2023-11-09 at 12 04 02"
src="ba6c136c-9e3c-4d9d-993d-121cd9be1f5e">

Co-authored-by: Marco Antonio Ghiani <marcoantonio.ghiani@elastic.co>

src/plugins/discover/public/components/discover_grid_flyout/discover_grid_flyout.test.tsx

@@ -231,6 +231,19 @@ describe('Discover flyout', function () {
   });
 
   describe('with applied customizations', () => {
+    describe('when title is customized', () => {
+      it('should display the passed string as title', async () => {
+        const customTitle = 'Custom flyout title';
+        mockFlyoutCustomization.title = customTitle;
+
+        const { component } = await mountComponent({});
+
+        const titleNode = findTestSubject(component, 'docTableRowDetailsTitle');
+
+        expect(titleNode.text()).toBe(customTitle);
+      });
+    });
+
     describe('when actions are customized', () => {
       it('should display actions added by getActionItems', async () => {
         mockFlyoutCustomization.actions = {

src/plugins/discover/public/components/discover_grid_flyout/discover_grid_flyout.tsx

@@ -186,6 +186,15 @@ export function DiscoverGridFlyout({
     renderDefaultContent()
   );
 
+  const defaultFlyoutTitle = isPlainRecord
+    ? i18n.translate('discover.grid.tableRow.textBasedDetailHeading', {
+        defaultMessage: 'Expanded row',
+      })
+    : i18n.translate('discover.grid.tableRow.detailHeading', {
+        defaultMessage: 'Expanded document',
+      });
+  const flyoutTitle = flyoutCustomization?.title ?? defaultFlyoutTitle;
+
   return (
     <EuiPortal>
       <EuiFlyout
@@ -201,15 +210,7 @@ export function DiscoverGridFlyout({
             className="unifiedDataTable__flyoutHeader"
             data-test-subj="docTableRowDetailsTitle"
           >
-            <h2>
-              {isPlainRecord
-                ? i18n.translate('discover.grid.tableRow.textBasedDetailHeading', {
-                    defaultMessage: 'Expanded row',
-                  })
-                : i18n.translate('discover.grid.tableRow.detailHeading', {
-                    defaultMessage: 'Expanded document',
-                  })}
-            </h2>
+            <h2>{flyoutTitle}</h2>
           </EuiTitle>
           <EuiSpacer size="s" />
           <EuiFlexGroup responsive={false} gutterSize="s" alignItems="center">

src/plugins/discover/public/customizations/customization_types/flyout_customization.ts

@@ -38,6 +38,7 @@ export interface FlyoutContentProps {
 
 export interface FlyoutCustomization {
   id: 'flyout';
+  title?: string;
   actions: {
     defaultActions?: FlyoutDefaultActions;
     getActionItems?: () => FlyoutActionItem[];

x-pack/plugins/log_explorer/public/customizations/log_explorer_profile.tsx

@@ -4,18 +4,19 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
+import React from 'react';
 import type { CoreStart } from '@kbn/core/public';
 import { CustomizationCallback, DiscoverStateContainer } from '@kbn/discover-plugin/public';
-import React from 'react';
-import { type BehaviorSubject, combineLatest, from, map, Subscription } from 'rxjs';
+import { i18n } from '@kbn/i18n';
 import useObservable from 'react-use/lib/useObservable';
-import { dynamic } from '../utils/dynamic';
-import { LogExplorerProfileStateService } from '../state_machines/log_explorer_profile';
+import { combineLatest, from, map, Subscription, type BehaviorSubject } from 'rxjs';
 import { LogExplorerStateContainer } from '../components/log_explorer';
-import { LogExplorerStartDeps } from '../types';
-import { useKibanaContextForPluginProvider } from '../utils/use_kibana';
 import { LogExplorerCustomizations } from '../components/log_explorer/types';
 import { LogExplorerCustomizationsProvider } from '../hooks/use_log_explorer_customizations';
+import { LogExplorerProfileStateService } from '../state_machines/log_explorer_profile';
+import { LogExplorerStartDeps } from '../types';
+import { dynamic } from '../utils/dynamic';
+import { useKibanaContextForPluginProvider } from '../utils/use_kibana';
 
 const LazyCustomDatasetFilters = dynamic(() => import('./custom_dataset_filters'));
 const LazyCustomDatasetSelector = dynamic(() => import('./custom_dataset_selector'));
@@ -119,6 +120,9 @@ export const createLogExplorerProfileCustomizations =
      */
     customizations.set({
       id: 'flyout',
+      title: i18n.translate('xpack.logExplorer.flyoutDetail.title', {
+        defaultMessage: 'Log details',
+      }),
       actions: {
         defaultActions: {
           viewSingleDocument: { disabled: true },