Next.js app showcasing WhyRating brand guidelines with interactive tabs for colors, typography, proportions, logos, voice, downloads, and AI context. Includes email templates (headers, signatures, CTAs) and presentation component. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import { createContext, useContext, useState, useEffect, ReactNode } from 'react';
|
|
import { BrandConfig, getBrandConfig, saveBrandConfig, resetBrandConfig, defaultBrandConfig } from './brand-config';
|
|
|
|
interface BrandContextType {
|
|
config: BrandConfig;
|
|
updateConfig: (updates: Partial<BrandConfig>) => void;
|
|
resetConfig: () => void;
|
|
isLoaded: boolean;
|
|
}
|
|
|
|
const BrandContext = createContext<BrandContextType | undefined>(undefined);
|
|
|
|
export function BrandProvider({ children }: { children: ReactNode }) {
|
|
const [config, setConfig] = useState<BrandConfig>(defaultBrandConfig);
|
|
const [isLoaded, setIsLoaded] = useState(false);
|
|
|
|
useEffect(() => {
|
|
setConfig(getBrandConfig());
|
|
setIsLoaded(true);
|
|
}, []);
|
|
|
|
const updateConfig = (updates: Partial<BrandConfig>) => {
|
|
const newConfig = saveBrandConfig(updates);
|
|
setConfig(newConfig);
|
|
};
|
|
|
|
const resetConfigHandler = () => {
|
|
const newConfig = resetBrandConfig();
|
|
setConfig(newConfig);
|
|
};
|
|
|
|
return (
|
|
<BrandContext.Provider value={{ config, updateConfig, resetConfig: resetConfigHandler, isLoaded }}>
|
|
{children}
|
|
</BrandContext.Provider>
|
|
);
|
|
}
|
|
|
|
export function useBrand() {
|
|
const context = useContext(BrandContext);
|
|
if (context === undefined) {
|
|
throw new Error('useBrand must be used within a BrandProvider');
|
|
}
|
|
return context;
|
|
}
|