2021-05-11 14:37:15 +00:00
|
|
|
import React, { useContext } from "react"
|
2021-04-23 00:18:06 +00:00
|
|
|
import Style from "./Logo.module.css"
|
2021-04-29 14:58:31 +00:00
|
|
|
import LogoDark from "../../media/LogoDark.png"
|
|
|
|
import LogoLight from "../../media/LogoLight.png"
|
|
|
|
import ContextTheme from "../../contexts/ContextTheme"
|
2021-04-23 00:18:06 +00:00
|
|
|
import classNames from "classnames"
|
2021-05-17 14:32:42 +00:00
|
|
|
import Localization from "../../Localization"
|
2021-04-21 13:37:12 +00:00
|
|
|
|
|
|
|
|
2021-04-23 00:18:06 +00:00
|
|
|
/**
|
|
|
|
* The N.E.S.T. logo.
|
|
|
|
*
|
|
|
|
* It loads a different image based on the currently selected theme.
|
|
|
|
*
|
|
|
|
* @param className - Additional class(es) to add to the image.
|
|
|
|
* @param props - Additional props to pass to the image.
|
|
|
|
* @returns {JSX.Element}
|
|
|
|
* @constructor
|
|
|
|
*/
|
|
|
|
export default function Logo({ className, ...props }) {
|
|
|
|
// I have no idea why IntelliJ is complaining about this line
|
|
|
|
// It's perfectly fine!
|
2021-05-11 14:37:15 +00:00
|
|
|
const { theme } = useContext(ContextTheme)
|
2021-04-21 13:37:12 +00:00
|
|
|
|
2021-05-11 14:37:15 +00:00
|
|
|
let logo
|
2021-04-21 13:37:12 +00:00
|
|
|
if(theme === "ThemeDark") {
|
|
|
|
logo = LogoDark
|
|
|
|
}
|
|
|
|
else if(theme === "ThemeLight") {
|
|
|
|
logo = LogoLight
|
|
|
|
}
|
|
|
|
else {
|
2021-04-25 15:22:52 +00:00
|
|
|
logo = "#"
|
2021-04-21 13:37:12 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
2021-05-17 14:32:42 +00:00
|
|
|
<img
|
|
|
|
src={logo}
|
|
|
|
className={classNames(Style.Logo, className)}
|
|
|
|
alt={Localization.appName}
|
|
|
|
title={Localization.appFullName}
|
|
|
|
{...props}
|
|
|
|
/>
|
2021-04-21 13:37:12 +00:00
|
|
|
)
|
|
|
|
}
|