import { usePage } from '@inertiajs/react';
import { usePersonalizer } from '@/hooks/usePersonalizer';

export default function AppLogo({ company_logo }: { company_logo?: string }) {
    const { settings } = usePersonalizer();
    const { assets, company_settings } = usePage().props as any;

    const logoSrc = (company_settings?.company_logo_url as string | null)
        || settings.branding.default_logo
        || assets.logo_svg;

    return (
        <div className="h-10 w-32">
            <img
                src={logoSrc}
                alt="logo"
                className="h-full w-full rounded-lg"
                onError={(e) => { (e.target as HTMLImageElement).src = assets.logo_svg; }}
            />
        </div>
    );
}
export function AppLogoLight() {
    return (
        <div className="h-10 w-32">
            <img src="/assets/logo/logo-v2.svg" alt="Logo" className="h-full w-full" />
        </div>
    );
}