+ )}
)
}
diff --git a/ordinis-admin-ui/src/components/layout/ThemeSwitch.tsx b/ordinis-admin-ui/src/components/layout/ThemeSwitch.tsx
index 65158cf..da8465d 100644
--- a/ordinis-admin-ui/src/components/layout/ThemeSwitch.tsx
+++ b/ordinis-admin-ui/src/components/layout/ThemeSwitch.tsx
@@ -1,37 +1,42 @@
import { useTranslation } from 'react-i18next'
-import { Monitor, Moon, Sun } from 'lucide-react'
import { useTheme, type ThemePreference } from '@/stores/ThemeProvider'
import { cn } from '@/lib/utils'
/**
- * Tri-state theme switch: Light / Dark / System.
+ * Theme switch per redesign prototype — 2-button segmented control с text
+ * labels "Earth | Dark". Filled accent-bg на active.
*
- *
Segmented control с тремя иконками. Активный — `--color-accent`
- * background + `--color-on-accent` foreground. Click меняет `preference`
- * в {@link ThemeProvider}, который пишет в localStorage и переключает
- * `data-theme` на html.
+ *
Прошлый tri-state (Light/Dark/System icons) был noise — "system" preference
+ * редко используется явно, мало кто понимает Monitor icon. Простой 2-button
+ * `Earth / Dark` toggle — точно повторяет prototype и улучшает discoverability.
*
- *
System icon показывает «follow OS» — auto-update при OS theme change.
+ *
Internally "Earth" maps на `light` preference (Earthy palette default).
+ * "System" preference больше не выставляется через UI; localStorage value
+ * остаётся валидным (ThemeProvider может read), но новые users получают
+ * explicit light/dark choice.
*/
export function ThemeSwitch() {
const { t } = useTranslation()
const { preference, setPreference } = useTheme()
- const items: { id: ThemePreference; label: string; icon: typeof Sun }[] = [
- { id: 'light', label: t('theme.light'), icon: Sun },
- { id: 'dark', label: t('theme.dark'), icon: Moon },
- { id: 'system', label: t('theme.system'), icon: Monitor },
+ // Treat 'system' как 'light' для UI — переключение всё равно flatten'ит
+ // preference на explicit choice.
+ const activeId: Exclude =
+ preference === 'dark' ? 'dark' : 'light'
+
+ const items: { id: Exclude; label: string }[] = [
+ { id: 'light', label: t('theme.earth', { defaultValue: 'Earth' }) },
+ { id: 'dark', label: t('theme.dark', { defaultValue: 'Dark' }) },
]
return (