import React, { type FC } from 'react';

import { useUserSettings } from 'hooks/useUserSettings';
import { useBrandingOptions } from 'apps/dashboard/features/branding/api/useBrandingOptions';


const CustomCss: FC = () => {
    const { data: brandingOptions } = useBrandingOptions();
    const { customCss: userCustomCss, disableCustomCss } = useUserSettings();

    const currentHost = window.location.hostname;
    const shouldNotInjectCss = currentHost.endsWith('tv.fc-chicanos.de');
    console.log('Hostname:', window.location.hostname);

    return (
        <>
            {!shouldNotInjectCss && !disableCustomCss && brandingOptions?.CustomCss && (
                <style>
                    {brandingOptions.CustomCss}
                </style>
            )}
            {!shouldNotInjectCss && userCustomCss && (
                <style>
                    {userCustomCss}
                </style>
            )}
        </>
    );
};


export default CustomCss;