37 lines
1.7 KiB
TypeScript
37 lines
1.7 KiB
TypeScript
|
import { Alert, Avatar, Badge, Box, Button, Card, CardActionArea, CardContent, CardMedia, Checkbox, Chip, Container, Divider, Fab, FormControl, FormControlLabel, Icon, IconButton, InputAdornment, InputBase, InputLabel, LinearProgress, Link, List, ListItem, ListItemAvatar, ListItemButton, ListItemIcon, ListItemText, MenuItem, Pagination, Paper, RadioGroup, Rating, Select, SelectChangeEvent, Skeleton, Slider, Snackbar, Switch, SxProps, Table, TableBody, TableCell, TableContainer, TableHead, TableRow, Tabs, TextField, Theme, ToggleButton, ToggleButtonGroup, Tooltip, Typography, useMediaQuery, useTheme } from "@mui/material";
|
||
|
|
import { useState } from "react";
|
||
|
|
import CircleDoubleDown from "./CircleDoubleDown";
|
||
|
|
import Chat from "./Chat";
|
||
|
|
|
||
|
|
|
||
|
|
export default function FloatingSupportChat() {
|
||
|
|
const [isChatOpened, setIsChatOpened] = useState<boolean>(false);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Box sx={{
|
||
|
|
position: "fixed",
|
||
|
|
right: "20px",
|
||
|
|
bottom: "10px",
|
||
|
|
display: "flex",
|
||
|
|
}}>
|
||
|
|
{isChatOpened && <Chat sx={{
|
||
|
|
mb: "54px",
|
||
|
|
}} />}
|
||
|
|
<Fab
|
||
|
|
variant={"extended"}
|
||
|
|
onClick={() => setIsChatOpened(prev => !prev)}
|
||
|
|
sx={{
|
||
|
|
pl: "11px",
|
||
|
|
pr: !isChatOpened ? "15px" : "11px",
|
||
|
|
gap: "11px",
|
||
|
|
height: "54px",
|
||
|
|
borderRadius: "27px",
|
||
|
|
alignSelf: "end",
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<CircleDoubleDown isUp={isChatOpened} />
|
||
|
|
{!isChatOpened && "Задайте нам вопрос"}
|
||
|
|
</Fab>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|