First Working version. I can add table

src/components/themecontroller/ThemeControllerApp.py

@@ -0,0 +1,17 @@
+import logging
+
+from fasthtml.fastapp import fast_app
+
+from components.themecontroller.constants import Routes
+from core.instance_manager import InstanceManager
+
+logger = logging.getLogger("ThemeControllerApp")
+
+theme_controller_app, rt = fast_app()
+
+
+@rt(Routes.ChangeTheme)
+def post(session, _id: str, theme: str):
+  logger.debug(f"Entering {Routes.ChangeTheme} with args {session=}, {theme=}")
+  instance = InstanceManager.get(session, _id)
+  instance.change_theme(theme)

src/components/themecontroller/components/ThemeContoller.py

@@ -0,0 +1,95 @@
+import logging
+import uuid
+
+from fasthtml.components import *
+from fasthtml.svg import *
+
+from components.themecontroller.constants import ROUTE_ROOT, Routes
+from components.themecontroller.settings import THEME_CONTROLLER_SETTINGS_ENTRY, ThemeControllerSettings
+from core.settings_management import SettingsManager
+
+logger = logging.getLogger("ThemeController")
+
+
+class ThemeController:
+  def __init__(self, session, settings_manager: SettingsManager, /, _id=None):
+    self._id = _id or uuid.uuid4().hex
+    self.session = session
+    self.settings_manager = settings_manager
+    
+    self.settings = self.settings_manager.get(session,
+                                              THEME_CONTROLLER_SETTINGS_ENTRY,
+                                              default=ThemeControllerSettings())
+  
+  def __ft__(self):
+    return Div(
+      Div(
+        Div(
+          Div(cls='bg-base-content size-1 rounded-full'),
+          Div(cls='bg-primary size-1 rounded-full'),
+          Div(cls='bg-secondary size-1 rounded-full'),
+          Div(cls='bg-accent size-1 rounded-full'),
+          cls='bg-base-100 border-base-content/10 grid shrink-0 grid-cols-2 gap-0.5 rounded-md border p-1'
+        ),
+        Svg(
+          Path(d='M1799 349l242 241-1017 1017L7 590l242-241 775 775 775-775z'),
+          width='12px',
+          height='12px',
+          viewbox='0 0 2048 2048',
+          cls='mt-px hidden h-2 w-2 fill-current opacity-60 sm:inline-block'
+        ),
+        tabindex='0',
+        role='button',
+        cls='btn m-1'
+      ),
+      Ul(
+        Li(
+          Input(type='radio', name='theme', aria_label='Default', value='default',
+                cls='theme-controller w-full btn btn-sm btn-block btn-ghost justify-start',
+                checked=self.settings.theme is None or self.settings.theme == 'default',
+                hx_post=f"{ROUTE_ROOT}{Routes.ChangeTheme}",
+                hx_vals=f'{{"_id": "{self._id}"}}',
+                )
+        ),
+        Li(
+          Input(type='radio', name='theme', aria_label='Dark', value='dark',
+                cls='theme-controller w-full btn btn-sm btn-block btn-ghost justify-start',
+                checked=self.settings.theme == 'dark',
+                hx_post=f"{ROUTE_ROOT}{Routes.ChangeTheme}",
+                hx_vals=f'{{"_id": "{self._id}"}}',
+                )
+        ),
+        Li(
+          Input(type='radio', name='theme', aria_label='Light', value='light',
+                cls='theme-controller w-full btn btn-sm btn-block btn-ghost justify-start',
+                checked=self.settings.theme == 'light',
+                hx_post=f"{ROUTE_ROOT}{Routes.ChangeTheme}",
+                hx_vals=f'{{"_id": "{self._id}"}}',
+                )
+        ),
+        Li(
+          Input(type='radio', name='theme', aria_label='Cupcake', value='cupcake',
+                cls='theme-controller w-full btn btn-sm btn-block btn-ghost justify-start',
+                checked=self.settings.theme == 'cupcake',
+                hx_post=f"{ROUTE_ROOT}{Routes.ChangeTheme}",
+                hx_vals=f'{{"_id": "{self._id}"}}',
+                )
+        ),
+        Li(
+          Input(type='radio', name='theme', aria_label='Lofi', value='lofi',
+                cls='theme-controller w-full btn btn-sm btn-block btn-ghost justify-start',
+                checked=self.settings.theme == 'lofi',
+                hx_post=f"{ROUTE_ROOT}{Routes.ChangeTheme}",
+                hx_vals=f'{{"_id": "{self._id}"}}',
+                )
+        ),
+        tabindex='0',
+        cls='dropdown-content bg-base-200 rounded-box z-1 shadow-2xl',
+      ),
+      cls='dropdown dropdown-end block'
+    )
+  
+  def change_theme(self, theme):
+    logger.debug(f"change_theme - Changing theme to '{theme}'.")
+    self.settings.theme = theme
+    self.settings_manager.put(self.session, THEME_CONTROLLER_SETTINGS_ENTRY, self.settings)

src/components/themecontroller/constants.py

@@ -0,0 +1,4 @@
+ROUTE_ROOT = "/settings"
+
+class Routes:
+  ChangeTheme = "/change_theme"  # request the filtering in the grid

src/components/themecontroller/settings.py

@@ -0,0 +1,12 @@
+import dataclasses
+
+from core.settings_objects import BaseSettingObj
+
+THEME_CONTROLLER_SETTINGS_ENTRY = "ThemeControllerSettings"
+
+
+@dataclasses.dataclass
+class ThemeControllerSettings(BaseSettingObj):
+  __ENTRY_NAME__ = THEME_CONTROLLER_SETTINGS_ENTRY
+  
+  theme: str = None