Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 | 2x 22x 22x 2x 20x 22x 22x 22x 2x 2x 2x 2x 2x 22x 1x 1x 1x 22x 22x 22x | import { createContext, useContext, useCallback, ReactNode } from 'react'
import { api, type Profile, type RecipeDetail } from '../api/client'
import { useStoredProfile, saveProfileId, clearProfileId } from '../hooks/useStoredProfile'
import { useFavorites } from '../hooks/useFavorites'
interface ProfileContextType {
profile: Profile | null
theme: 'light' | 'dark'
favoriteRecipeIds: Set<number>
loading: boolean
selectProfile: (profile: Profile) => Promise<void>
logout: () => void
toggleTheme: () => Promise<void>
updateUnitPreference: (unit: 'metric' | 'imperial') => Promise<void>
toggleFavorite: (recipe: RecipeDetail) => Promise<void>
isFavorite: (recipeId: number) => boolean
}
const ProfileContext = createContext<ProfileContextType | null>(null)
// eslint-disable-next-line react-refresh/only-export-components -- Hook is tightly coupled to provider
export function useProfile() {
const context = useContext(ProfileContext)
if (!context) {
throw new Error('useProfile must be used within a ProfileProvider')
}
return context
}
interface AuthProfile {
id: number
name: string
avatar_color: string
theme: string
unit_preference: string
}
interface ProfileProviderProps {
children: ReactNode
authProfile?: AuthProfile | null
}
export function ProfileProvider({ children, authProfile }: ProfileProviderProps) {
const { profile, setProfile, theme, setTheme, loading } = useStoredProfile(authProfile)
const { favoriteRecipeIds, toggleFavorite, isFavorite, clearFavorites } = useFavorites(profile)
const selectProfile = useCallback(async (selectedProfile: Profile) => {
try {
await api.profiles.select(selectedProfile.id)
setProfile(selectedProfile)
setTheme(selectedProfile.theme as 'light' | 'dark')
saveProfileId(selectedProfile.id)
} catch (error) {
console.error('Failed to select profile:', error)
throw error
}
}, [setProfile, setTheme])
const logout = useCallback(() => {
setProfile(null)
clearFavorites()
clearProfileId()
}, [setProfile, clearFavorites])
const toggleTheme = useCallback(async () => {
if (!profile) return
const newTheme = theme === 'light' ? 'dark' : 'light'
setTheme(newTheme)
try {
const updated = await api.profiles.update(profile.id, { ...profile, theme: newTheme })
setProfile(updated)
} catch (error) {
console.error('Failed to update theme:', error)
setTheme(theme)
}
}, [profile, theme, setProfile, setTheme])
const updateUnitPreference = useCallback(async (unit: 'metric' | 'imperial') => {
if (!profile) return
const previousUnit = profile.unit_preference
setProfile({ ...profile, unit_preference: unit })
try {
const updated = await api.profiles.update(profile.id, { ...profile, unit_preference: unit })
setProfile(updated)
} catch (error) {
console.error('Failed to update unit preference:', error)
setProfile({ ...profile, unit_preference: previousUnit })
}
}, [profile, setProfile])
return (
<ProfileContext.Provider
value={{
profile, theme, favoriteRecipeIds, loading,
selectProfile, logout, toggleTheme, updateUnitPreference,
toggleFavorite, isFavorite,
}}
>
{children}
</ProfileContext.Provider>
)
}
|