CFE-6 init call widget and change directory dashboard component

src/components/dashboard/change-password/index.jsx

@@ -1,5 +1,5 @@
 import CenterLayout from "@/layouts/CenterLayout";
-import DashboardLayouts from "@/layouts/dashboardLayouts";
+import DashboardLayouts from "@/layouts/DashboardLayout";
 import {Button, Container, Paper, Stack, Typography,} from "@mui/material";
 import {Formik} from "formik";
 import * as Yup from "yup";

src/components/dashboard/edit-profile/index.jsx

@@ -1,6 +1,6 @@
 import StyledForm from "@/core/components/StyledForm";
 import CenterLayout from "@/layouts/CenterLayout";
-import DashboardLayouts from "@/layouts/dashboardLayouts";
+import DashboardLayouts from "@/layouts/DashboardLayout";
 import useUser from "@/lib/app/hooks/useUser";
 import {Box, Container, Grid, Paper, Stack, TextField, Typography,} from "@mui/material";
 import * as Yup from "yup";

src/components/dashboard/first/index.jsx

@@ -1,4 +1,4 @@
-import DashboardLayouts from "@/layouts/dashboardLayouts";
+import DashboardLayouts from "@/layouts/DashboardLayout";
 
 const DashboardFirstComponent = () => {
     return <DashboardLayouts></DashboardLayouts>;

src/components/layouts/Dashboard/CallWidget/CallWidgetButton.jsx

@@ -0,0 +1,13 @@
+import PermPhoneMsgIcon from '@mui/icons-material/PermPhoneMsg';
+import StyledFab from "@/core/components/StyledFab";
+
+const CallWidgetButton = ({setOpen}) => {
+    return (
+        <StyledFab color="primary" aria-label="open-dialog"
+                   onClick={() => setOpen(true)}>
+            <PermPhoneMsgIcon/>
+        </StyledFab>
+    )
+}
+
+export default CallWidgetButton

src/components/layouts/Dashboard/CallWidget/CallWidgetDialog/index.jsx

@@ -0,0 +1,24 @@
+import {Dialog} from "@mui/material";
+import {DialogTransition} from "@/core/components/DialogTransition";
+
+const CallWidgetDialog = ({open, setOpen}) => {
+
+    const handleClose = () => {
+        setOpen(false);
+    };
+
+    return (
+        <>
+            <Dialog
+                fullScreen
+                open={open}
+                onClose={handleClose}
+                TransitionComponent={DialogTransition}
+            >
+                
+            </Dialog>
+        </>
+    )
+}
+
+export default CallWidgetDialog

src/components/layouts/Dashboard/CallWidget/index.jsx

@@ -0,0 +1,15 @@
+import CallWidgetButton from "@/components/layouts/Dashboard/CallWidget/CallWidgetButton";
+import CallWidgetDialog from "@/components/layouts/Dashboard/CallWidget/CallWidgetDialog";
+import {useState} from "react";
+
+const CallWidget = () => {
+    const [open, setOpen] = useState(false)
+    return (
+        <>
+            <CallWidgetButton setOpen={setOpen}/>
+            <CallWidgetDialog open={open} setOpen={setOpen}/>
+        </>
+    )
+}
+
+export default CallWidget

src/components/layouts/Dashboard/Sidebar/SidebarDrawer.jsx

@@ -14,7 +14,7 @@ const SidebarDrawer = ({handleDrawerToggle}) => {
                         {t("app_short_name")}
                     </Typography>
                     <Typography variant="caption">
-                        {user.name} | {user.position}
+                        {user.full_name} | {user.position}
                     </Typography>
                 </Stack>
             </Toolbar>

src/components/layouts/Dashboard/Sidebar/SidebarList.jsx

@@ -18,7 +18,6 @@ function reducer(state, action) {
         case "SELECTED":
             return state.map((itemsArr) =>
                 itemsArr.map((item) => {
-                        console.log(item)
                         if (item.type === "page") {
                             if (action.route === item.route)
                                 return {...item, selected: true}

src/components/layouts/Dashboard/index.jsx

@@ -1,13 +1,13 @@
-import {useState} from "react";
-import FullPageLayout from "../FullPageLayout";
-import Header from "./header";
-import Sidebar from "./sidebar";
+import Header from "src/components/layouts/Dashboard/Header";
+import Sidebar from "src/components/layouts/Dashboard/Sidebar";
+import FullPageLayout from "@/layouts/FullPageLayout";
 import {Toolbar} from "@mui/material";
-import BreadCrumbs from "./breadcrumbs";
+import BreadCrumbs from "src/components/layouts/Dashboard/Breadcrumbs";
+import {useState} from "react";
 
 const drawerWidth = 240;
 
-const DashboardLayouts = (props) => {
+const Dashboard = (props) => {
     const {window} = props;
     const [mobileOpen, setMobileOpen] = useState(false);
     const container =
@@ -39,7 +39,7 @@ const DashboardLayouts = (props) => {
                 </FullPageLayout>
             </FullPageLayout>
         </FullPageLayout>
-    );
-};
+    )
+}
 
-export default DashboardLayouts;
+export default Dashboard

src/core/components/DialogTransition.jsx

@@ -0,0 +1,6 @@
+import {forwardRef} from "react";
+import {Slide} from "@mui/material";
+
+export const DialogTransition = forwardRef(function DialogTransition(props, ref) {
+    return <Slide direction="up" ref={ref} {...props}/>;
+});

src/core/components/StyledFab.jsx

@@ -0,0 +1,11 @@
+import {Fab, styled} from "@mui/material";
+
+const StyledFab = styled(Fab)`
+    position: absolute;
+    bottom: 16px;
+    /* @noflip */
+    left: 16px;
+    z-index: 1500;
+`;
+
+export default StyledFab;

src/layouts/DashboardLayout.jsx

@@ -0,0 +1,14 @@
+import CallWidget from "src/components/layouts/Dashboard/CallWidget";
+import Dashboard from "src/components/layouts/Dashboard";
+
+const DashboardLayouts = (props) => {
+
+    return (
+        <>
+            <Dashboard {...props}/>
+            <CallWidget/>
+        </>
+    );
+};
+
+export default DashboardLayouts;