import {
Box,
Button,
createStyles,
Group,
MediaQuery,
Navbar,
Stack,
Text,
ThemeIcon,
} from "@mantine/core";
import Link from "next/link";
import { Dispatch, SetStateAction } from "react";
import { TbAt, TbMail, TbShare, TbSocial, TbSquare } from "react-icons/tb";
import { FormattedMessage } from "react-intl";
const webroot = process.env.WEBROOT || "";
const categories = [
{ name: "General", icon: },
{ name: "Email", icon: },
{ name: "Share", icon: },
{ name: "SMTP", icon: },
{ name: "OAuth", icon: },
];
const useStyles = createStyles((theme) => ({
activeLink: {
backgroundColor: theme.fn.variant({
variant: "light",
color: theme.primaryColor,
}).background,
color: theme.fn.variant({ variant: "light", color: theme.primaryColor })
.color,
borderRadius: theme.radius.sm,
fontWeight: 600,
},
}));
const ConfigurationNavBar = ({
categoryId,
isMobileNavBarOpened,
setIsMobileNavBarOpened,
}: {
categoryId: string;
isMobileNavBarOpened: boolean;
setIsMobileNavBarOpened: Dispatch>;
}) => {
const { classes } = useStyles();
return (
{categories.map((category) => (
setIsMobileNavBarOpened(false)}
className={
categoryId == category.name.toLowerCase()
? classes.activeLink
: undefined
}
key={category.name}
href={`${webroot}/admin/config/${category.name.toLowerCase()}`}
>
{category.icon}
))}
);
};
export default ConfigurationNavBar;