QRunIO/qqq-frontend-material-dashboard
2
0
Fork 0
mirror of https://github.com/Kingsrook/qqq-frontend-material-dashboard.git synced 2025-07-18 13:20:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

added branding as metadata, fixed problem where query string filter wasn't seeding properly,

Browse Source
This commit is contained in:
Tim Chamberlain
2022-09-06 18:15:48 -05:00
parent e376f4ae72
commit 5a5fa1f148
13 changed files with 180 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
src/qqq/components/Sidenav/index.tsx
View File

@ -35,32 +35,35 @@ import SidenavItem from "qqq/components/Sidenav/SidenavItem";
import SidenavList from "qqq/components/Sidenav/SidenavList";
import SidenavRoot from "qqq/components/Sidenav/SidenavRoot";
interface Props {
color?: "primary" | "secondary" | "info" | "success" | "warning" | "error" | "dark";
brand?: string;
brandName?: string;
routes: {
[key: string]:
| ReactNode
| string
| {
interface Props
{
color?: "primary" | "secondary" | "info" | "success" | "warning" | "error" | "dark";
icon?: string;
logo?: string;
companyName?: string;
routes: {
[key: string]:
| ReactNode
| string
| {
[key: string]:
| ReactNode
| string
| {
[key: string]: ReactNode | string;
}[];
[key: string]:
| ReactNode
| string
| {
[key: string]:
| ReactNode
| string
| {
[key: string]: ReactNode | string;
}[];
}[];
}[];
}[];
}[];
[key: string]: any;
}[];
[key: string]: any;
}
function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
function Sidenav({color, icon, logo, companyName, routes, ...rest}: Props): JSX.Element
{
const [openCollapse, setOpenCollapse] = useState<boolean | string>(false);
const [openNestedCollapse, setOpenNestedCollapse] = useState<boolean | string>(false);
@ -75,17 +78,17 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
const [, forceUpdate] = useReducer((x) => x + 1, 0);
let textColor:
| "primary"
| "secondary"
| "info"
| "success"
| "warning"
| "error"
| "dark"
| "white"
| "inherit"
| "text"
| "light" = "white";
| "primary"
| "secondary"
| "info"
| "success"
| "warning"
| "error"
| "dark"
| "white"
| "inherit"
| "text"
| "light" = "white";
if (transparentSidenav || (whiteSidenav && !darkMode))
{
@ -115,8 +118,8 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
}
/**
The event listener that's calling the handleMiniSidenav function when resizing the window.
*/
The event listener that's calling the handleMiniSidenav function when resizing the window.
*/
window.addEventListener("resize", handleMiniSidenav);
window.onload = () =>
{
@ -283,7 +286,7 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
key={key}
light={
(!darkMode && !whiteSidenav && !transparentSidenav) ||
(darkMode && !transparentSidenav && whiteSidenav)
(darkMode && !transparentSidenav && whiteSidenav)
}
/>
);
@ -314,10 +317,11 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
</MDTypography>
</MDBox>
<MDBox component={NavLink} to="/" display="flex" alignItems="center">
{brand && <MDBox component="img" src={brand} alt="Brand" width="100%" />}
{brandName && <MDBox width={!brandName && "100%"} sx={(theme: any) => sidenavLogoLabel(theme, {miniSidenav})}>
{!miniSidenav && logo && <MDBox component="img" src={logo} alt="Logo" width="100%" />}
{miniSidenav && icon && <MDBox component="img" src={icon} alt="Icon" width="160%" />}
{!miniSidenav && companyName && <MDBox width={!companyName && "100%"} sx={(theme: any) => sidenavLogoLabel(theme, {miniSidenav})}>
<MDTypography component="h6" variant="button" fontWeight="medium" color={textColor}>
{brandName}
{companyName}
</MDTypography>
</MDBox>
}
@ -326,7 +330,7 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
<Divider
light={
(!darkMode && !whiteSidenav && !transparentSidenav) ||
(darkMode && !transparentSidenav && whiteSidenav)
(darkMode && !transparentSidenav && whiteSidenav)
}
/>
<List>{renderRoutes}</List>
@ -338,8 +342,9 @@ function Sidenav({color, brand, brandName, routes, ...rest}: Props): JSX.Element
// Declaring default props for Sidenav
Sidenav.defaultProps = {
color: "info",
brand: "",
brandName: "",
icon: "",
logo: "",
companyName: "",
};
export default Sidenav;