BrandingContext.tsx

/**
 * BrandingContext — provides white-label branding settings app-wide.
 *
 * Wrap the app root (or AppLayout) with <BrandingProvider> to fetch branding
 * once and make it available via useBrandingContext() throughout the tree.
 *
 * Usage:
 *   // In App.tsx or a top-level layout:
 *   <BrandingProvider>
 *     <RouterContent />
 *   </BrandingProvider>
 *
 *   // In any component:
 *   const { branding } = useBrandingContext();
 */

import React, { createContext, useContext, ReactNode } from 'react';
import { useBranding, type BrandingSettings } from '../hooks/useBranding';

interface BrandingContextValue {
  branding: BrandingSettings;
  loading: boolean;
}

const BrandingContext = createContext<BrandingContextValue>({
  branding: {
    logo_url: '',
    primary_color: '#00A846',
    secondary_color: '#008036',
    favicon_url: '',
    custom_domain: '',
    app_name: 'Command Sovereignty',
    login_bg_url: '',
  },
  loading: true,
});

export function BrandingProvider({ children }: { children: ReactNode }) {
  const value = useBranding();
  return (
    <BrandingContext.Provider value={value}>
      {children}
    </BrandingContext.Provider>
  );
}

export function useBrandingContext(): BrandingContextValue {
  return useContext(BrandingContext);
}