Files
LingvAI/components/ColorModeToggler.tsx
David cf0b310918 Added hotkeys + updated dependencies & webpack5 + humanetech badge (#15)
* Added language & theme switch hotkeys

* Hotkeys testing

* Language switch when equal

* Shortcut keys changed

* Dependencies updated & upgraded to webpack5

* Added HumaneTech badge

* Disabled FLoC
2021-04-30 23:11:26 +02:00

25 lines
723 B
TypeScript

import { FC } from "react";
import { IconButton, useColorMode } from "@chakra-ui/react";
import { SunIcon, MoonIcon } from "@chakra-ui/icons";
import { useHotkeys } from "react-hotkeys-hook";
type Props = {
[key: string]: any
};
const ColorModeToggler: FC<Props> = (props) => {
const { colorMode, toggleColorMode } = useColorMode();
useHotkeys("ctrl+shift+l, command+shift+l", toggleColorMode, [toggleColorMode]);
return (
<IconButton
aria-label="Toggle color mode"
icon={colorMode === "light" ? <MoonIcon /> : <SunIcon />}
colorScheme="lingva"
onClick={toggleColorMode}
{...props}
/>
);
};
export default ColorModeToggler;