From 002861aeadf62f469929e33989f5065aa652b738 Mon Sep 17 00:00:00 2001
From: Marta Bondyra <marta.bondyra@elastic.co>
Date: Fri, 25 Oct 2024 13:50:21 +0200
Subject: [PATCH] advanced setting tutorial

---
 dev_docs/tutorials/advanced_settings.mdx | 19 ++++++-------------
 1 file changed, 6 insertions(+), 13 deletions(-)

diff --git a/dev_docs/tutorials/advanced_settings.mdx b/dev_docs/tutorials/advanced_settings.mdx
index b14d98ceb0b59..7c684e1c75c1c 100644
--- a/dev_docs/tutorials/advanced_settings.mdx
+++ b/dev_docs/tutorials/advanced_settings.mdx
@@ -53,26 +53,23 @@ On the client, the `uiSettings` service is accessible directly from `core` and t
 The following is a basic example for using the `uiSettings` service:
 
 **src/plugins/charts/public/plugin.ts**
+
 ```ts
 import { Plugin, CoreSetup } from '@kbn/core/public';
-import { ExpressionsSetup } from '../../expressions/public';
+import { ExpressionsSetup } from '@kbn/expressions-plugin/public';
 import { palette, systemPalette } from '../common';
 
-import { ThemeService, LegacyColorsService } from './services';
+import { ThemeService } from './services';
 import { PaletteService } from './services/palettes/service';
 import { ActiveCursor } from './services/active_cursor';
 
-export type Theme = Omit<ThemeService, 'init'>;
-export type Color = Omit<LegacyColorsService, 'init'>;
-
 interface SetupDependencies {
   expressions: ExpressionsSetup;
 }
 
 /** @public */
 export interface ChartsPluginSetup {
-  legacyColors: Color;
-  theme: Theme;
+  theme: Omit<ThemeService, 'init'>;
   palettes: ReturnType<PaletteService['setup']>;
 }
 
@@ -84,7 +81,6 @@ export type ChartsPluginStart = ChartsPluginSetup & {
 /** @public */
 export class ChartsPlugin implements Plugin<ChartsPluginSetup, ChartsPluginStart> {
   private readonly themeService = new ThemeService();
-  private readonly legacyColorsService = new LegacyColorsService();
   private readonly paletteService = new PaletteService();
   private readonly activeCursor = new ActiveCursor();
 
@@ -93,14 +89,12 @@ export class ChartsPlugin implements Plugin<ChartsPluginSetup, ChartsPluginStart
   public setup(core: CoreSetup, dependencies: SetupDependencies): ChartsPluginSetup {
     dependencies.expressions.registerFunction(palette);
     dependencies.expressions.registerFunction(systemPalette);
-    this.themeService.init(core.uiSettings);
-    this.legacyColorsService.init(core.uiSettings);
-    this.palettes = this.paletteService.setup(this.legacyColorsService);
+    this.themeService.init(core.theme);
+    this.palettes = this.paletteService.setup();
 
     this.activeCursor.setup();
 
     return {
-      legacyColors: this.legacyColorsService,
       theme: this.themeService,
       palettes: this.palettes,
     };
@@ -108,7 +102,6 @@ export class ChartsPlugin implements Plugin<ChartsPluginSetup, ChartsPluginStart
 
   public start(): ChartsPluginStart {
     return {
-      legacyColors: this.legacyColorsService,
       theme: this.themeService,
       palettes: this.palettes!,
       activeCursor: this.activeCursor,