31 lines
1.1 KiB
TypeScript
31 lines
1.1 KiB
TypeScript
import clsx from "clsx";
|
|
import { Link } from "react-router";
|
|
import { iconLight, iconDark } from "~/assets/brand/default";
|
|
import { useRootData } from "~/utils/data/useRootData";
|
|
import { Fragment } from "react";
|
|
|
|
interface Props {
|
|
className?: string;
|
|
size?: string;
|
|
fromConfig?: boolean;
|
|
}
|
|
|
|
export default function Icon({ className = "", size = "h-9", fromConfig = true }: Props) {
|
|
const { appConfiguration } = useRootData();
|
|
return (
|
|
<Link to="/" className={clsx(className, "flex")}>
|
|
{fromConfig && appConfiguration?.branding.icon ? (
|
|
<Fragment>
|
|
<img className={clsx(size, "hidden w-auto dark:block")} src={appConfiguration.branding.iconDarkMode ?? appConfiguration.branding.icon} alt="Icon" />
|
|
<img className={clsx(size, "w-auto dark:hidden")} src={appConfiguration.branding.icon} alt="Icon" />
|
|
</Fragment>
|
|
) : (
|
|
<Fragment>
|
|
<img className={clsx(size, "hidden w-auto dark:block")} src={iconDark} alt="Logo" />
|
|
<img className={clsx(size, "w-auto dark:hidden")} src={iconLight} alt="Logo" />
|
|
</Fragment>
|
|
)}
|
|
</Link>
|
|
);
|
|
}
|