add KibanaThemeProvider support for kibana-app-services

src/plugins/dashboard/public/application/listing/dashboard_listing.tsx

@@ -297,6 +297,7 @@ export const DashboardListing = ({
         listingLimit,
         tableColumns,
       }}
+      theme={core.theme}
     >
       <DashboardUnsavedListing
         redirectTo={redirectTo}

src/plugins/data/public/actions/apply_filter_action.ts

@@ -9,7 +9,7 @@
 import { i18n } from '@kbn/i18n';
 import { toMountPoint } from '../../../kibana_react/public';
 import { Action, createAction, IncompatibleActionError } from '../../../ui_actions/public';
-import { getOverlays, getIndexPatterns } from '../services';
+import { getOverlays, getTheme, getIndexPatterns } from '../services';
 import { applyFiltersPopover } from '../ui/apply_filters';
 import { Filter, FilterManager, TimefilterContract, esFilters } from '..';
 
@@ -77,7 +77,8 @@ export function createFilterAction(
                   overlay.close();
                   resolve(filterSelection);
                 }
-              )
+              ),
+              { theme$: getTheme().theme$ }
             ),
             {
               'data-test-subj': 'test',

src/plugins/data/public/plugin.ts

@@ -26,6 +26,7 @@ import {
   setNotifications,
   setOverlays,
   setSearchService,
+  setTheme,
   setUiSettings,
 } from './services';
 import { createSearchBar } from './ui/search_bar/create_search_bar';
@@ -82,6 +83,7 @@ export class DataPublicPlugin
     const startServices = createStartServicesGetter(core.getStartServices);
 
     this.usageCollection = usageCollection;
+    setTheme(core.theme);
 
     const searchService = this.searchService.setup(core, {
       bfetch,

src/plugins/data/public/search/fetch/handle_response.tsx

@@ -12,7 +12,7 @@ import { EuiSpacer } from '@elastic/eui';
 import { IKibanaSearchResponse } from 'src/plugins/data/common';
 import { ShardFailureOpenModalButton } from '../../ui/shard_failure_modal';
 import { toMountPoint } from '../../../../kibana_react/public';
-import { getNotifications } from '../../services';
+import { getNotifications, getTheme } from '../../services';
 import type { SearchRequest } from '..';
 
 export function handleResponse(request: SearchRequest, response: IKibanaSearchResponse) {
@@ -46,7 +46,8 @@ export function handleResponse(request: SearchRequest, response: IKibanaSearchRe
         {description}
         <EuiSpacer size="s" />
         <ShardFailureOpenModalButton request={request.body} response={rawResponse} title={title} />
-      </>
+      </>,
+      { theme$: getTheme().theme$ }
     );
 
     getNotifications().toasts.addWarning({ title, text });

src/plugins/data/public/search/search_interceptor/search_interceptor.ts

@@ -51,6 +51,7 @@ import { ISessionService, SearchSessionState } from '../session';
 import { SearchResponseCache } from './search_response_cache';
 import { createRequestHash } from './utils';
 import { SearchAbortController } from './search_abort_controller';
+import { getTheme } from '../../services';
 
 export interface SearchInterceptorDeps {
   bfetch: BfetchPublicSetup;
@@ -377,7 +378,7 @@ export class SearchInterceptor {
   private showTimeoutErrorToast = (e: SearchTimeoutError, sessionId?: string) => {
     this.deps.toasts.addDanger({
       title: 'Timed out',
-      text: toMountPoint(e.getErrorMessage(this.application)),
+      text: toMountPoint(e.getErrorMessage(this.application), { theme$: getTheme().theme$ }),
     });
   };
 
@@ -392,7 +393,9 @@ export class SearchInterceptor {
     this.deps.toasts.addWarning(
       {
         title: 'Your search session is still running',
-        text: toMountPoint(SearchSessionIncompleteWarning(this.docLinks)),
+        text: toMountPoint(SearchSessionIncompleteWarning(this.docLinks), {
+          theme$: getTheme().theme$,
+        }),
       },
       {
         toastLifeTimeMs: 60000,
@@ -423,14 +426,14 @@ export class SearchInterceptor {
         title: i18n.translate('data.search.esErrorTitle', {
           defaultMessage: 'Cannot retrieve search results',
         }),
-        text: toMountPoint(e.getErrorMessage(this.application)),
+        text: toMountPoint(e.getErrorMessage(this.application), { theme$: getTheme().theme$ }),
       });
     } else if (e.constructor.name === 'HttpFetchError') {
       this.deps.toasts.addDanger({
         title: i18n.translate('data.search.httpErrorTitle', {
           defaultMessage: 'Cannot retrieve your data',
         }),
-        text: toMountPoint(getHttpError(e.message)),
+        text: toMountPoint(getHttpError(e.message), { theme$: getTheme().theme$ }),
       });
     } else {
       this.deps.toasts.addError(e, {

src/plugins/data/public/services.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { NotificationsStart, CoreStart } from 'src/core/public';
+import { NotificationsStart, CoreStart, ThemeServiceStart } from 'src/core/public';
 import { createGetterSetter } from '../../kibana_utils/public';
 import { IndexPatternsContract } from './data_views';
 import { DataPublicPluginStart } from './types';
@@ -24,3 +24,5 @@ export const [getIndexPatterns, setIndexPatterns] =
 
 export const [getSearchService, setSearchService] =
   createGetterSetter<DataPublicPluginStart['search']>('Search');
+
+export const [getTheme, setTheme] = createGetterSetter<ThemeServiceStart>('Theme');

src/plugins/data/public/ui/query_string_input/query_string_input.tsx

@@ -39,6 +39,7 @@ import type { PersistedLog } from '../../query';
 import type { SuggestionsListSize } from '../typeahead/suggestions_component';
 import { SuggestionsComponent } from '..';
 import { KIBANA_USER_QUERY_LANGUAGE_KEY, getFieldSubtypeNested } from '../../../common';
+import { getTheme } from '../../services';
 
 export interface QueryStringInputProps {
   indexPatterns: Array<IIndexPattern | string>;
@@ -475,7 +476,8 @@ export default class QueryStringInputUI extends Component<Props, State> {
                   </EuiButton>
                 </EuiFlexItem>
               </EuiFlexGroup>
-            </div>
+            </div>,
+            { theme$: getTheme().theme$ }
           ),
         });
       }

src/plugins/data/public/ui/shard_failure_modal/shard_failure_open_modal_button.tsx

@@ -11,7 +11,7 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import { EuiButton, EuiTextAlign } from '@elastic/eui';
 import type * as estypes from '@elastic/elasticsearch/lib/api/typesWithBodyKey';
 
-import { getOverlays } from '../../services';
+import { getOverlays, getTheme } from '../../services';
 import { toMountPoint } from '../../../../kibana_react/public';
 import { ShardFailureModal } from './shard_failure_modal';
 import { ShardFailureRequest } from './shard_failure_types';
@@ -38,7 +38,8 @@ export default function ShardFailureOpenModalButton({
           response={response}
           title={title}
           onClose={() => modal.close()}
-        />
+        />,
+        { theme$: getTheme().theme$ }
       ),
       {
         className: 'shardFailureModal',

src/plugins/data_view_editor/public/open_editor.tsx

@@ -79,7 +79,8 @@ export const getEditorOpener =
                 requireTimestampField={requireTimestampField}
               />
             </I18nProvider>
-          </KibanaReactContextProvider>
+          </KibanaReactContextProvider>,
+          { theme$: core.theme.theme$ }
         ),
         {
           hideCloseButton: true,

src/plugins/data_view_field_editor/public/open_delete_modal.tsx

@@ -75,7 +75,8 @@ export const getFieldDeleteModalOpener =
             fieldsToDelete={fieldsToDelete}
             closeModal={closeModal}
             confirmDelete={onConfirmDelete}
-          />
+          />,
+          { theme$: core.theme.theme$ }
         )
       );
 

src/plugins/data_view_field_editor/public/open_editor.tsx

@@ -128,7 +128,8 @@ export const getFieldEditorOpener =
               fieldFormats={fieldFormats}
               uiSettings={uiSettings}
             />
-          </KibanaReactContextProvider>
+          </KibanaReactContextProvider>,
+          { theme$: core.theme.theme$ }
         ),
         {
           className: euiFlyoutClassname,

src/plugins/data_view_management/public/components/edit_index_pattern/indexed_fields_table/components/table/table.tsx

@@ -32,6 +32,7 @@ import { toMountPoint } from '../../../../../../../kibana_react/public';
 
 import { IIndexPattern } from '../../../../../../../data/public';
 import { IndexedFieldItem } from '../../types';
+import { getTheme } from '../../../../../';
 
 // localized labels
 const additionalInfoAriaLabel = i18n.translate(
@@ -322,7 +323,8 @@ const getConflictBtn = (
           },
           fieldName,
           conflictDescriptions,
-        })
+        }),
+        { theme$: getTheme().theme$ }
       )
     );
   };

src/plugins/data_view_management/public/index.ts

@@ -17,10 +17,13 @@
  * in the setup/start interfaces in `plugin.ts`. The remaining items exported here are
  * either types, or static code.
  */
-import { PluginInitializerContext } from 'src/core/public';
+import { PluginInitializerContext, ThemeServiceStart } from 'src/core/public';
+import { createGetterSetter } from '../../kibana_utils/public';
 import { IndexPatternManagementPlugin } from './plugin';
 export type { IndexPatternManagementSetup, IndexPatternManagementStart } from './plugin';
 
 export function plugin(initializerContext: PluginInitializerContext) {
   return new IndexPatternManagementPlugin(initializerContext);
 }
+
+export const [getTheme, setTheme] = createGetterSetter<ThemeServiceStart>('Theme');

src/plugins/data_view_management/public/management_app/mount_management_section.tsx

@@ -14,7 +14,7 @@ import { i18n } from '@kbn/i18n';
 import { I18nProvider } from '@kbn/i18n-react';
 import { StartServicesAccessor } from 'src/core/public';
 
-import { KibanaContextProvider } from '../../../kibana_react/public';
+import { KibanaContextProvider, KibanaThemeProvider } from '../../../kibana_react/public';
 import { ManagementAppMountParams } from '../../../management/public';
 import {
   IndexPatternTableWithRouter,
@@ -67,25 +67,27 @@ export async function mountManagementSection(
 
   ReactDOM.render(
     <KibanaContextProvider services={deps}>
-      <I18nProvider>
-        <Router history={params.history}>
-          <Switch>
-            <Route path={['/create']}>
-              <IndexPatternTableWithRouter canSave={canSave} showCreateDialog={true} />
-            </Route>
-            <Route path={['/dataView/:id/field/:fieldName', '/dataView/:id/create-field/']}>
-              <CreateEditFieldContainer />
-            </Route>
-            <Route path={['/dataView/:id']}>
-              <EditIndexPatternContainer />
-            </Route>
-            <Redirect path={'/patterns*'} to={'dataView*'} />
-            <Route path={['/']}>
-              <IndexPatternTableWithRouter canSave={canSave} />
-            </Route>
-          </Switch>
-        </Router>
-      </I18nProvider>
+      <KibanaThemeProvider theme$={params.theme$}>
+        <I18nProvider>
+          <Router history={params.history}>
+            <Switch>
+              <Route path={['/create']}>
+                <IndexPatternTableWithRouter canSave={canSave} showCreateDialog={true} />
+              </Route>
+              <Route path={['/dataView/:id/field/:fieldName', '/dataView/:id/create-field/']}>
+                <CreateEditFieldContainer />
+              </Route>
+              <Route path={['/dataView/:id']}>
+                <EditIndexPatternContainer />
+              </Route>
+              <Redirect path={'/patterns*'} to={'dataView*'} />
+              <Route path={['/']}>
+                <IndexPatternTableWithRouter canSave={canSave} />
+              </Route>
+            </Switch>
+          </Router>
+        </I18nProvider>
+      </KibanaThemeProvider>
     </KibanaContextProvider>,
     params.element
   );

src/plugins/data_view_management/public/plugin.ts

@@ -14,6 +14,7 @@ import { UrlForwardingSetup } from '../../url_forwarding/public';
 import { ManagementSetup } from '../../management/public';
 import { IndexPatternFieldEditorStart } from '../../data_view_field_editor/public';
 import { DataViewEditorStart } from '../../data_view_editor/public';
+import { setTheme } from '.';
 
 export interface IndexPatternManagementSetupDependencies {
   management: ManagementSetup;
@@ -54,6 +55,7 @@ export class IndexPatternManagementPlugin
     { management, urlForwarding }: IndexPatternManagementSetupDependencies
   ) {
     const kibanaSection = management.sections.section.kibana;
+    setTheme(core.theme);
 
     if (!kibanaSection) {
       throw new Error('`kibana` management section not found.');