28 lines
847 B
TypeScript
28 lines
847 B
TypeScript
import { Select } from '@pikku/mantine/core'
|
|
import { m } from '@/i18n/messages'
|
|
import { useLocale } from '@/i18n/config'
|
|
import { themeList } from '@project/mantine-themes'
|
|
import { usePreferences } from '@/contexts/preferences'
|
|
|
|
// A single theme per app. Themes are normally chosen from the Fabric console
|
|
// (which live-injects into the iframe); this picker only appears when more than
|
|
// one theme ships, and is hidden otherwise.
|
|
export function ThemeSelector() {
|
|
useLocale()
|
|
const { themeId, setThemeId } = usePreferences()
|
|
|
|
if (themeList.length <= 1) return null
|
|
|
|
return (
|
|
<Select
|
|
aria-label={m.preferences__theme()}
|
|
data={themeList.map((t) => ({ value: t.id, label: t.name }))}
|
|
value={themeId}
|
|
onChange={(v) => v && setThemeId(v)}
|
|
size="xs"
|
|
w={110}
|
|
allowDeselect={false}
|
|
/>
|
|
)
|
|
}
|