import { useThemeConfig } from '@/components/Layout/ThemeProvider';
import { ButtonBase, SxProps } from '@mui/material';
import { Link } from 'react-router-dom';

type LogoProps = {
  isIcon: boolean;
  sx: SxProps;
  to: string;
  logoIcon: React.ReactNode;
  logoMain: React.ReactNode;
};
function Logo({ isIcon, sx, to, logoIcon, logoMain }: LogoProps) {
  const { appDefaultPath } = useThemeConfig();
  return (
    <ButtonBase disableRipple component={Link} to={!to ? appDefaultPath : to} sx={sx}>
      {isIcon ? logoIcon : logoMain}
    </ButtonBase>
  );
}

export { Logo };
export type { LogoProps };