Bluesky app fork with some witchin' additions 💫
0
fork

Configure Feed

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

Memoize usePalette (#2201)

authored by

dan and committed by
GitHub
0e3218db b1f9454f

+38 -34
+38 -34
src/lib/hooks/usePalette.ts
··· 1 + import {useMemo} from 'react' 1 2 import {TextStyle, ViewStyle} from 'react-native' 2 3 import {useTheme, PaletteColorName, PaletteColor} from '../ThemeContext' 3 4 ··· 15 16 icon: TextStyle 16 17 } 17 18 export function usePalette(color: PaletteColorName): UsePaletteValue { 18 - const palette = useTheme().palette[color] 19 - return { 20 - colors: palette, 21 - view: { 22 - backgroundColor: palette.background, 23 - }, 24 - viewLight: { 25 - backgroundColor: palette.backgroundLight, 26 - }, 27 - btn: { 28 - backgroundColor: palette.backgroundLight, 29 - }, 30 - border: { 31 - borderColor: palette.border, 32 - }, 33 - borderDark: { 34 - borderColor: palette.borderDark, 35 - }, 36 - text: { 37 - color: palette.text, 38 - }, 39 - textLight: { 40 - color: palette.textLight, 41 - }, 42 - textInverted: { 43 - color: palette.textInverted, 44 - }, 45 - link: { 46 - color: palette.link, 47 - }, 48 - icon: { 49 - color: palette.icon, 50 - }, 51 - } 19 + const theme = useTheme() 20 + return useMemo(() => { 21 + const palette = theme.palette[color] 22 + return { 23 + colors: palette, 24 + view: { 25 + backgroundColor: palette.background, 26 + }, 27 + viewLight: { 28 + backgroundColor: palette.backgroundLight, 29 + }, 30 + btn: { 31 + backgroundColor: palette.backgroundLight, 32 + }, 33 + border: { 34 + borderColor: palette.border, 35 + }, 36 + borderDark: { 37 + borderColor: palette.borderDark, 38 + }, 39 + text: { 40 + color: palette.text, 41 + }, 42 + textLight: { 43 + color: palette.textLight, 44 + }, 45 + textInverted: { 46 + color: palette.textInverted, 47 + }, 48 + link: { 49 + color: palette.link, 50 + }, 51 + icon: { 52 + color: palette.icon, 53 + }, 54 + } 55 + }, [theme, color]) 52 56 }