'use client';

import { useEffect } from 'react';
import { useAppEnv } from '@/lib/env-store';

export function DynamicFavicon() {
  const { faviconUrl, appName } = useAppEnv();

  useEffect(() => {
    // Update favicon dynamically
    if (faviconUrl) {
      // Find or create favicon link elements
      let link = document.querySelector("link[rel*='icon']") as HTMLLinkElement | null;
      if (!link) {
        link = document.createElement('link');
        link.rel = 'icon';
        document.head.appendChild(link);
      }
      link.href = faviconUrl;
      link.type = 'image/png';
    }

    // Update page title if app name is customized
    if (appName && appName !== 'Needyfy') {
      document.title = `${appName} - Every Need, One Platform`;
    }
  }, [faviconUrl, appName]);

  return null;
}
