51 lines
1.6 KiB
React
51 lines
1.6 KiB
React
// Components
|
|
import { Stack, Typography } from "@mui/material";
|
|
import { ColContainer } from "../../../../../Components/StandardContainer";
|
|
import SmartToyIcon from "@mui/icons-material/SmartToy";
|
|
import Dot from "../../../../../Components/Dot";
|
|
// Utils
|
|
import { useTheme } from "@emotion/react";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
const MESSAGES = [
|
|
"I've checked the network status, and we're seeing excellent performance across all regions.",
|
|
"The network is stable and functioning optimally. All connections are active and stable.",
|
|
"I've reviewed the network status, and everything looks great. No issues detected.",
|
|
"The network is up and running smoothly. All connections are active and stable.",
|
|
"I've checked the network status, and everything is looking good. No issues detected.",
|
|
];
|
|
|
|
const ChatBot = ({ sx }) => {
|
|
const theme = useTheme();
|
|
const { t } = useTranslation();
|
|
return (
|
|
<ColContainer
|
|
backgroundColor={theme.palette.chatbot.background}
|
|
sx={{ ...sx }}
|
|
>
|
|
<Stack
|
|
direction="row"
|
|
alignItems="center"
|
|
gap={theme.spacing(4)}
|
|
>
|
|
<SmartToyIcon sx={{ color: theme.palette.chatbot.textAccent }} />
|
|
<Typography color={theme.palette.chatbot.textAccent}>Status Bot</Typography>
|
|
<Dot
|
|
color={theme.palette.chatbot.textAccent}
|
|
style={{ opacity: 0.4 }}
|
|
/>
|
|
<Typography
|
|
variant="body2"
|
|
color={theme.palette.chatbot.textAccent}
|
|
sx={{ opacity: 0.4 }}
|
|
>
|
|
{t("now")}
|
|
</Typography>
|
|
</Stack>
|
|
<Typography>{MESSAGES[Math.floor(Math.random() * MESSAGES.length)]}</Typography>
|
|
</ColContainer>
|
|
);
|
|
};
|
|
|
|
export default ChatBot;
|