From 0fa55664325e5b377acbd1c0edb3efde55d08c97 Mon Sep 17 00:00:00 2001
From: estifanos <estifanos.tria@gmail.com>
Date: Wed, 19 Aug 2026 10:22:00 +0000
Subject: [PATCH] UI fixes

---
 .../src/app/features/location/components/LocationTree.tsx     | 4 ++--
 libs/ui/src/lib/layout/AppSidebar.tsx                         | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/backoffice/src/app/features/location/components/LocationTree.tsx b/apps/backoffice/src/app/features/location/components/LocationTree.tsx
index 00231e39b..17e2ae7cc 100644
--- a/apps/backoffice/src/app/features/location/components/LocationTree.tsx
+++ b/apps/backoffice/src/app/features/location/components/LocationTree.tsx
@@ -11,7 +11,7 @@ import {
   Box,
   rem,
   Center,
-  useMantineColorScheme,
+  useComputedColorScheme,
 } from '@mantine/core';
 import {
   IconChevronRight,
@@ -58,7 +58,7 @@ function TreeNode({
   const isSelected = selectedId === location.id;
   const hasChildren =
     Array.isArray(location.children) && location.children.length > 0;
-  const { colorScheme } = useMantineColorScheme();
+  const colorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true });
   const hoverBg = colorScheme === 'dark'
     ? 'var(--mantine-color-dark-6)'
     : 'var(--mantine-color-gray-0)';
diff --git a/libs/ui/src/lib/layout/AppSidebar.tsx b/libs/ui/src/lib/layout/AppSidebar.tsx
index 5fe8f83f0..dc67f79f0 100644
--- a/libs/ui/src/lib/layout/AppSidebar.tsx
+++ b/libs/ui/src/lib/layout/AppSidebar.tsx
@@ -12,7 +12,7 @@ import {
   Tooltip,
   UnstyledButton,
   rem,
-  useMantineColorScheme,
+  useComputedColorScheme,
 } from '@mantine/core';
 import { useMediaQuery } from '@mantine/hooks';
 import {
@@ -285,7 +285,7 @@ export function AppSidebar({
   brandLogo,
 }: AppSidebarProps) {
   const { t } = useTranslation();
-  const { colorScheme } = useMantineColorScheme();
+  const colorScheme = useComputedColorScheme('light', { getInitialValueInEffect: true });
   // The icon-rail toggle is a desktop-only affordance (its button is
   // `visibleFrom="sm"`) — on mobile the sidebar renders in a full-width
   // drawer, so a `collapsed` state carried over from a prior desktop session