fix: apparence settings is not correctly applied to the dom (#450)

**Describe the pull request**
This pull request addresses an issue where appearance settings are not
correctly applied to the DOM. The fix involves refining the process
through which these settings are propagated to the DOM, ensuring that
user-specified appearance configurations are accurately reflected. By
resolving this issue, we enhance the application's responsiveness to
user settings and improve the overall user experience.

**Checklist**

- [x] I have made the modifications or added tests related to my PR
- [x] I have run the tests and linters locally and they pass
- [x] I have added/updated the documentation for my RP

Author: 42atomys

web/ui/src/contexts/currentUser.tsx

@@ -124,13 +124,15 @@ export const MeProvider: React.FC<MeProviderProps> = ({
   // to avoid a flash of the default theme on page load
   // Move it to this hook to prevent duplicated provider with same behaviour.
   useEffect(() => {
-    if (me.me.settings && me.me.settings.theme === Theme.DARK) {
+    if (me.me.settings.theme === Theme.DARK) {
       document.documentElement.classList.add('dark', 'bg-slate-900');
     } else if (
-      (!me.me.settings || me.me.settings.theme === Theme.AUTO) &&
+      me.me.settings.theme === Theme.AUTO &&
       window.matchMedia('(prefers-color-scheme: dark)').matches
     ) {
       document.documentElement.classList.add('dark', 'bg-slate-900');
+    } else {
+      document.documentElement.classList.remove('dark', 'bg-slate-900');
     }
   }, [me]);
 

web/ui/src/pages/settings/apparence.tsx

@@ -59,7 +59,9 @@ const ApparenceSettingPage: NextPage<PageProps> = () => {
             <SelectInput
               className="flex-1"
               objects={Object.values(ClusterMapAvatarSize)}
-              selectedValue={settings.clusterMapAvatarSize}
+              selectedValue={
+                settings.clusterMapAvatarSize || ClusterMapAvatarSize.AUTO
+              }
               defaultValue={ClusterMapAvatarSize.AUTO}
               onChange={(value) =>
                 updateSettings({