627119bb22
- Consolidated and reordered imports in various files for better readability and maintainability. - Removed unused imports and ensured consistent import styles. - Enhanced the structure of components by grouping related imports together. - Updated the layout and organization of hooks to streamline functionality. - Improved the overall code quality by following best practices in import management.
32 lines
787 B
TypeScript
32 lines
787 B
TypeScript
import { Button, ButtonGroup } from "@mui/material";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
type ThemeValue = IVergeConfig["theme_mode"];
|
|
|
|
interface Props {
|
|
value?: ThemeValue;
|
|
onChange?: (value: ThemeValue) => void;
|
|
}
|
|
|
|
export const ThemeModeSwitch = (props: Props) => {
|
|
const { value, onChange } = props;
|
|
const { t } = useTranslation();
|
|
|
|
const modes = ["light", "dark", "system"] as const;
|
|
|
|
return (
|
|
<ButtonGroup size="small" sx={{ my: "4px" }}>
|
|
{modes.map((mode) => (
|
|
<Button
|
|
key={mode}
|
|
variant={mode === value ? "contained" : "outlined"}
|
|
onClick={() => onChange?.(mode)}
|
|
sx={{ textTransform: "capitalize" }}
|
|
>
|
|
{t(`theme.${mode}`)}
|
|
</Button>
|
|
))}
|
|
</ButtonGroup>
|
|
);
|
|
};
|