diff --git a/matrixgw_frontend/src/widgets/dashboard/BaseAuthenticatedPage.tsx b/matrixgw_frontend/src/widgets/dashboard/BaseAuthenticatedPage.tsx index ff3ee64..60ae762 100644 --- a/matrixgw_frontend/src/widgets/dashboard/BaseAuthenticatedPage.tsx +++ b/matrixgw_frontend/src/widgets/dashboard/BaseAuthenticatedPage.tsx @@ -11,7 +11,7 @@ export default function BaseAuthenticatedPage(): React.ReactElement { const theme = useTheme(); const [isDesktopNavigationExpanded, setIsDesktopNavigationExpanded] = - React.useState(true); + React.useState(false); const [isMobileNavigationExpanded, setIsMobileNavigationExpanded] = React.useState(false); diff --git a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebar.tsx b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebar.tsx index 7eee311..d1584a6 100644 --- a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebar.tsx +++ b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebar.tsx @@ -1,6 +1,5 @@ -import BarChartIcon from "@mui/icons-material/BarChart"; -import LayersIcon from "@mui/icons-material/Layers"; -import PersonIcon from "@mui/icons-material/Person"; +import { mdiBug, mdiForum, mdiKeyVariant, mdiLinkLock } from "@mdi/js"; +import Icon from "@mdi/react"; import Box from "@mui/material/Box"; import Drawer from "@mui/material/Drawer"; import List from "@mui/material/List"; @@ -9,7 +8,6 @@ import { useTheme } from "@mui/material/styles"; import type {} from "@mui/material/themeCssVarsAugmentation"; import useMediaQuery from "@mui/material/useMediaQuery"; import * as React from "react"; -import { useLocation } from "react-router"; import DashboardSidebarContext from "./DashboardSidebarContext"; import DashboardSidebarDividerItem from "./DashboardSidebarDividerItem"; import DashboardSidebarPageItem from "./DashboardSidebarPageItem"; @@ -38,7 +36,6 @@ export default function DashboardSidebar({ const isOverMdViewport = useMediaQuery(theme.breakpoints.up("md")); const [isFullyExpanded, setIsFullyExpanded] = React.useState(expanded); - const [isFullyCollapsed, setIsFullyCollapsed] = React.useState(!expanded); React.useEffect(() => { if (expanded) { @@ -54,20 +51,6 @@ export default function DashboardSidebar({ return () => {}; }, [expanded, theme.transitions.duration.enteringScreen]); - React.useEffect(() => { - if (!expanded) { - const drawerWidthTransitionTimeout = setTimeout(() => { - setIsFullyCollapsed(true); - }, theme.transitions.duration.leavingScreen); - - return () => clearTimeout(drawerWidthTransitionTimeout); - } - - setIsFullyCollapsed(false); - - return () => {}; - }, [expanded, theme.transitions.duration.leavingScreen]); - const mini = !disableCollapsibleSidebar && !expanded; const handleSetSidebarExpanded = React.useCallback( @@ -116,23 +99,25 @@ export default function DashboardSidebar({ }} > } - href="/employees" + title="Messages" + icon={} + href="/" /> } - href="/reports" + title="Matrix link" + icon={} + href="/matrixlink" /> } - href="/integrations" + title="API tokens" + icon={} + href="/tokens" + /> + } + href="/wsdebug" /> @@ -168,16 +153,9 @@ export default function DashboardSidebar({ onPageItemClick: handlePageItemClick, mini, fullyExpanded: isFullyExpanded, - fullyCollapsed: isFullyCollapsed, hasDrawerTransitions, }; - }, [ - handlePageItemClick, - mini, - isFullyExpanded, - isFullyCollapsed, - hasDrawerTransitions, - ]); + }, [handlePageItemClick, mini, isFullyExpanded, hasDrawerTransitions]); return ( diff --git a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarContext.tsx b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarContext.tsx index eb0dafd..751b63b 100644 --- a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarContext.tsx +++ b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarContext.tsx @@ -4,7 +4,6 @@ const DashboardSidebarContext = React.createContext<{ onPageItemClick: () => void; mini: boolean; fullyExpanded: boolean; - fullyCollapsed: boolean; hasDrawerTransitions: boolean; } | null>(null); diff --git a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarPageItem.tsx b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarPageItem.tsx index 75eb1b4..5d32561 100644 --- a/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarPageItem.tsx +++ b/matrixgw_frontend/src/widgets/dashboard/DashboardSidebarPageItem.tsx @@ -12,7 +12,6 @@ import DashboardSidebarContext from "./DashboardSidebarContext"; import { MINI_DRAWER_WIDTH } from "./constants"; export interface DashboardSidebarPageItemProps { - id: string; title: string; icon?: React.ReactNode; href: string; @@ -21,7 +20,6 @@ export interface DashboardSidebarPageItemProps { } export default function DashboardSidebarPageItem({ - id, title, icon, href, @@ -40,12 +38,6 @@ export default function DashboardSidebarPageItem({ fullyExpanded = true, } = sidebarContext; - const handleClick = React.useCallback(() => { - if (onPageItemClick) { - onPageItemClick(); - } - }, [onPageItemClick, id]); - const hasExternalHref = href ? href.startsWith("http://") || href.startsWith("https://") : false; @@ -56,7 +48,7 @@ export default function DashboardSidebarPageItem({ return ( - + {icon || mini ? (