frontend client for gemstone. decentralised workplace app
2
fork

Configure Feed

Select the types of activity you want to include in your feed.

feat: better palette hook

serenity 9471a1fa fb7d3566

+21
+21
src/providers/ThemeProvider.tsx
··· 1 + import { useFacet } from "@/lib/facet"; 2 + import type { Facet } from "@/lib/facet/src/facet"; 3 + import type { FacetPalette } from "@/lib/facet/src/palette"; 1 4 import type { Enumify } from "@/lib/utils/types"; 2 5 import type { Dispatch, ReactNode, SetStateAction } from "react"; 3 6 import { createContext, useContext, useState } from "react"; ··· 13 16 interface ThemeContextValue { 14 17 colorMode: ColorMode; 15 18 setColorMode: Dispatch<SetStateAction<ColorMode>>; 19 + currentPalette: FacetPalette; 16 20 } 17 21 18 22 const ThemeContext = createContext<ThemeContextValue | null>(null); ··· 36 40 return setColorMode; 37 41 }; 38 42 43 + export const useCurrentPalette = () => { 44 + const { currentPalette } = useThemeProvider(); 45 + return currentPalette; 46 + }; 47 + 39 48 export const ThemeProvider = ({ children }: { children: ReactNode }) => { 40 49 const [colorMode, setColorMode] = useState<ColorMode>(ColorMode.DARK); 50 + const facet = useFacet(); 51 + const currentPalette = 52 + colorMode === "dark" 53 + ? facet.variants.obsidian 54 + : // TODO: temporary. will remove the null coalesce when pearl is defined. 55 + (facet.variants.pearl ?? facet.variants.obsidian); 56 + 57 + // TODO: remove nullability with obsidian and pearl palettes. 58 + // instead, these are provided as defaults and if we add more themes 59 + // in the future, they can just be tacked on. 60 + if (!currentPalette) throw new Error("Don't use light mode for now."); 41 61 42 62 const value: ThemeContextValue = { 43 63 colorMode, 44 64 setColorMode, 65 + currentPalette, 45 66 }; 46 67 return <ThemeContext value={value}>{children}</ThemeContext>; 47 68 };