wcz-layout 6.2.0 → 6.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/components/Layout.js +1 -1
- package/dist/src/components/Layout.js.map +1 -1
- package/dist/src/components/layout/DevelopmentBanner.d.ts +1 -0
- package/dist/src/components/layout/DevelopmentBanner.js +14 -3
- package/dist/src/components/layout/DevelopmentBanner.js.map +1 -1
- package/dist/src/components/layout/TypographyWithIcon.js +2 -2
- package/dist/src/components/layout/TypographyWithIcon.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/components/Layout.tsx +1 -1
- package/src/components/layout/DevelopmentBanner.tsx +21 -9
- package/src/components/layout/TypographyWithIcon.tsx +2 -2
|
@@ -123,6 +123,6 @@ export const Layout = ({ routes, colors, appVersion, user, notifications, setNot
|
|
|
123
123
|
}, [title]);
|
|
124
124
|
const toggleNavigationDrawer = () => setLeftDrawerOpen(!leftDrawerOpen);
|
|
125
125
|
const hasNavigationRoutes = navigationRoutes.filter(route => route.showInMenu && !route.disabled).length > 1;
|
|
126
|
-
return (_jsxs(ThemeProvider, { theme: theme, children: [_jsxs(Box, { sx: { display: "flex", position: "sticky" }, children: [_jsx(CssBaseline, {}), _jsx(AppBar, { position: "fixed", open: leftDrawerOpen, children: _jsxs(Toolbar, { children: [_jsx(IconButton, { color: "inherit", onClick: toggleNavigationDrawer, edge: "start", sx: { marginRight: 2, ...((leftDrawerOpen || !hasNavigationRoutes) && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), environment !== "production" && _jsx(Chip, { sx: theme => ({ mr: 1, bgcolor: "secondary.main", color: theme.palette.primary.contrastText }), label: environment }), _jsx(NotificationMenu, { notifications: notifications, setNotifications: setNotifications }), _jsx(AccountMenu, { mode: mode, setMode: setMode, user: user })] }) }), _jsx(NavigationDrawer, { routes: navigationRoutes, appVersion: appVersion, open: leftDrawerOpen, setOpen: setLeftDrawerOpen, hasRoutes: hasNavigationRoutes }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), (route.authenticated === false || user.isLoggedIn) && !route.disabled ? children : _jsx(Unauthorized, {})] })] }), _jsx(DevelopmentBanner, { user: user }), (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
|
|
126
|
+
return (_jsxs(ThemeProvider, { theme: theme, children: [_jsxs(Box, { sx: { display: "flex", position: "sticky" }, children: [_jsx(CssBaseline, {}), _jsx(AppBar, { position: "fixed", open: leftDrawerOpen, children: _jsxs(Toolbar, { children: [_jsx(IconButton, { color: "inherit", onClick: toggleNavigationDrawer, edge: "start", sx: { marginRight: 2, ...((leftDrawerOpen || !hasNavigationRoutes) && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), environment !== "production" && _jsx(Chip, { sx: theme => ({ mr: 1, bgcolor: "secondary.main", color: theme.palette.primary.contrastText }), label: environment }), _jsx(NotificationMenu, { notifications: notifications, setNotifications: setNotifications }), _jsx(AccountMenu, { mode: mode, setMode: setMode, user: user })] }) }), _jsx(NavigationDrawer, { routes: navigationRoutes, appVersion: appVersion, open: leftDrawerOpen, setOpen: setLeftDrawerOpen, hasRoutes: hasNavigationRoutes }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), (route.authenticated === false || user.isLoggedIn) && !route.disabled ? children : _jsx(Unauthorized, {})] })] }), _jsx(DevelopmentBanner, { user: user, hasNavigationRoutes: hasNavigationRoutes }), (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
|
|
127
127
|
};
|
|
128
128
|
//# sourceMappingURL=Layout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Menu } from \"@mui/icons-material\";\r\nimport { Box, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, Theme, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { grey } from \"@mui/material/colors\";\r\nimport { csCZ, enUS } from \"@mui/material/locale\";\r\nimport { ThemeProvider, createTheme, styled } from \"@mui/material/styles\";\r\nimport { csCZ as dataGridCsCz, enUS as dataGridEnUs } from \"@mui/x-data-grid-premium/locales\";\r\nimport { csCZ as datePickersCsCz, enUS as datePickersEnUs } from \"@mui/x-date-pickers-pro/locales\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { Dispatch, SetStateAction, useEffect, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { matchPath, useLocation } from \"react-router-dom\";\r\nimport { LayoutPaletteColorOptions } from \"../models/LayoutPaletteColorOptions\";\r\nimport { LayoutRoute } from \"../models/LayoutRoute\";\r\nimport Notification from \"../models/Notification\";\r\nimport { User } from \"../models/User\";\r\nimport { environment } from \"../utils/Helpers\";\r\nimport { doLogin, initKeycloak, keycloak } from \"../utils/UserService\";\r\nimport { AccountMenu } from \"./layout/AccountMenu\";\r\nimport { DevelopmentBanner } from \"./layout/DevelopmentBanner\";\r\nimport { NavigationDrawer } from \"./layout/NavigationDrawer\";\r\nimport { NotificationMenu } from \"./layout/NotificationMenu\";\r\nimport { Unauthorized } from \"./layout/Unauthorized\";\r\nimport useLocalStorageState from \"use-local-storage-state\";\r\n\r\n//Drawer\r\nconst drawerWidth = 240;\r\nconst DrawerHeader = styled(\"div\")(({ theme }) => ({\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"flex-end\",\r\n padding: theme.spacing(0, 1),\r\n // necessary for content to be below app bar\r\n ...theme.mixins.toolbar,\r\n}));\r\n\r\n//AppBar\r\ninterface AppBarProps extends MuiAppBarProps {\r\n open?: boolean;\r\n}\r\n\r\nconst AppBar = styled(MuiAppBar, {\r\n shouldForwardProp: (prop) => prop !== \"open\",\r\n})<AppBarProps>(({ theme, open }) => ({\r\n zIndex: theme.zIndex.drawer + 1,\r\n transition: theme.transitions.create([\"width\", \"margin\"], {\r\n easing: theme.transitions.easing.sharp,\r\n duration: theme.transitions.duration.leavingScreen,\r\n }),\r\n ...(open && {\r\n marginLeft: drawerWidth,\r\n width: `calc(100% - ${drawerWidth}px)`,\r\n transition: theme.transitions.create([\"width\", \"margin\"], {\r\n easing: theme.transitions.easing.sharp,\r\n duration: theme.transitions.duration.enteringScreen,\r\n }),\r\n }),\r\n}));\r\n\r\nconst getAllRoutesWithPath = (routes: LayoutRoute[]): LayoutRoute[] => {\r\n let result: LayoutRoute[] = [];\r\n for (const route of routes) {\r\n if (route.path) {\r\n result.push(route);\r\n }\r\n if (route.children) {\r\n result = result.concat(getAllRoutesWithPath(route.children));\r\n }\r\n }\r\n return result;\r\n};\r\n\r\ninterface LayoutProps {\r\n routes: LayoutRoute[];\r\n appVersion: string;\r\n colors: LayoutPaletteColorOptions;\r\n children: React.ReactNode;\r\n user: User;\r\n notifications: Notification[] | undefined;\r\n setNotifications: Dispatch<SetStateAction<Notification[] | undefined>>;\r\n}\r\n\r\nexport const Layout: React.FC<LayoutProps> = ({ routes, colors, appVersion, user, notifications, setNotifications, children }) => {\r\n const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n const [mode, setMode] = useLocalStorageState<\"light\" | \"dark\" | \"system\">(\"mui-mode\", { defaultValue: \"system\" });\r\n const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n const { i18n } = useTranslation();\r\n const isFetching = !!useIsFetching();\r\n const isMutating = !!useIsMutating();\r\n const location = useLocation();\r\n const navigationRoutes = getAllRoutesWithPath(routes);\r\n const route = navigationRoutes.find(r => matchPath(r.path!, location.pathname))!;\r\n\r\n useEffect(() => {\r\n if (route.authenticated !== false && !user.isLoggedIn)\r\n initKeycloak();\r\n }, [route, user]);\r\n\r\n keycloak.onTokenExpired = async () => {\r\n try {\r\n await keycloak.updateToken(30);\r\n } catch {\r\n if (route.authenticated !== false) {\r\n await doLogin();\r\n }\r\n }\r\n };\r\n\r\n const theme: Theme = createTheme({\r\n palette: {\r\n mode: mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode,\r\n primary: colors.primary,\r\n secondary: colors.secondary,\r\n background: colors.background ?? {},\r\n },\r\n components: {\r\n MuiCssBaseline: {\r\n styleOverrides: (theme) => ({\r\n body: {\r\n \"&::-webkit-scrollbar, & *::-webkit-scrollbar\": {\r\n width: \"0.7em\",\r\n height: \"0.7em\",\r\n },\r\n \"&::-webkit-scrollbar-track, & *::-webkit-scrollbar-track\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[900] : grey[200],\r\n borderRadius: \"5px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[800] : grey[400],\r\n borderRadius: \"10px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb:hover, & *::-webkit-scrollbar-thumb:hover\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[700] : grey[500],\r\n },\r\n \"&::-webkit-scrollbar-corner, & *::-webkit-scrollbar-corner\": {\r\n backgroundColor: \"transparent\",\r\n },\r\n },\r\n }),\r\n },\r\n },\r\n },\r\n i18n.language === \"cs\" ? datePickersCsCz : datePickersEnUs,\r\n i18n.language === \"cs\" ? dataGridCsCz : dataGridEnUs,\r\n i18n.language === \"cs\" ? csCZ : enUS\r\n );\r\n\r\n const title = route.pageTitle ?? route.title;\r\n\r\n useEffect(() => {\r\n if (title) document.title = title;\r\n }, [title]);\r\n\r\n const toggleNavigationDrawer = () => setLeftDrawerOpen(!leftDrawerOpen);\r\n\r\n const hasNavigationRoutes: boolean = navigationRoutes.filter(route => route.showInMenu && !route.disabled).length > 1;\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <Box sx={{ display: \"flex\", position: \"sticky\" }}>\r\n <CssBaseline />\r\n <AppBar position=\"fixed\" open={leftDrawerOpen}>\r\n <Toolbar>\r\n <IconButton color=\"inherit\" onClick={toggleNavigationDrawer} edge=\"start\" sx={{ marginRight: 2, ...((leftDrawerOpen || !hasNavigationRoutes) && { display: \"none\" }) }} >\r\n <Menu />\r\n </IconButton>\r\n\r\n <Typography variant=\"h6\" noWrap component=\"div\" sx={{ flexGrow: 1 }}>{title}</Typography>\r\n\r\n {environment !== \"production\" && <Chip sx={theme => ({ mr: 1, bgcolor: \"secondary.main\", color: theme.palette.primary.contrastText })} label={environment} />}\r\n\r\n <NotificationMenu notifications={notifications} setNotifications={setNotifications} />\r\n <AccountMenu mode={mode} setMode={setMode} user={user} />\r\n </Toolbar>\r\n </AppBar>\r\n\r\n <NavigationDrawer routes={navigationRoutes} appVersion={appVersion} open={leftDrawerOpen} setOpen={setLeftDrawerOpen} hasRoutes={hasNavigationRoutes} />\r\n\r\n <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n <DrawerHeader />\r\n {(route.authenticated === false || user.isLoggedIn) && !route.disabled ? children : <Unauthorized />}\r\n </Box>\r\n </Box>\r\n\r\n <DevelopmentBanner user={user} />\r\n {(isFetching || isMutating) && <LinearProgress sx={{ position: \"fixed\", top: { xs: 56, sm: 64 }, left: 0, right: 0 }} />}\r\n </ThemeProvider>\r\n );\r\n};\r\n"]}
|
|
1
|
+
{"version":3,"file":"Layout.js","sourceRoot":"","sources":["../../../src/components/Layout.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Menu } from \"@mui/icons-material\";\r\nimport { Box, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, Theme, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { grey } from \"@mui/material/colors\";\r\nimport { csCZ, enUS } from \"@mui/material/locale\";\r\nimport { ThemeProvider, createTheme, styled } from \"@mui/material/styles\";\r\nimport { csCZ as dataGridCsCz, enUS as dataGridEnUs } from \"@mui/x-data-grid-premium/locales\";\r\nimport { csCZ as datePickersCsCz, enUS as datePickersEnUs } from \"@mui/x-date-pickers-pro/locales\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { Dispatch, SetStateAction, useEffect, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { matchPath, useLocation } from \"react-router-dom\";\r\nimport { LayoutPaletteColorOptions } from \"../models/LayoutPaletteColorOptions\";\r\nimport { LayoutRoute } from \"../models/LayoutRoute\";\r\nimport Notification from \"../models/Notification\";\r\nimport { User } from \"../models/User\";\r\nimport { environment } from \"../utils/Helpers\";\r\nimport { doLogin, initKeycloak, keycloak } from \"../utils/UserService\";\r\nimport { AccountMenu } from \"./layout/AccountMenu\";\r\nimport { DevelopmentBanner } from \"./layout/DevelopmentBanner\";\r\nimport { NavigationDrawer } from \"./layout/NavigationDrawer\";\r\nimport { NotificationMenu } from \"./layout/NotificationMenu\";\r\nimport { Unauthorized } from \"./layout/Unauthorized\";\r\nimport useLocalStorageState from \"use-local-storage-state\";\r\n\r\n//Drawer\r\nconst drawerWidth = 240;\r\nconst DrawerHeader = styled(\"div\")(({ theme }) => ({\r\n display: \"flex\",\r\n alignItems: \"center\",\r\n justifyContent: \"flex-end\",\r\n padding: theme.spacing(0, 1),\r\n // necessary for content to be below app bar\r\n ...theme.mixins.toolbar,\r\n}));\r\n\r\n//AppBar\r\ninterface AppBarProps extends MuiAppBarProps {\r\n open?: boolean;\r\n}\r\n\r\nconst AppBar = styled(MuiAppBar, {\r\n shouldForwardProp: (prop) => prop !== \"open\",\r\n})<AppBarProps>(({ theme, open }) => ({\r\n zIndex: theme.zIndex.drawer + 1,\r\n transition: theme.transitions.create([\"width\", \"margin\"], {\r\n easing: theme.transitions.easing.sharp,\r\n duration: theme.transitions.duration.leavingScreen,\r\n }),\r\n ...(open && {\r\n marginLeft: drawerWidth,\r\n width: `calc(100% - ${drawerWidth}px)`,\r\n transition: theme.transitions.create([\"width\", \"margin\"], {\r\n easing: theme.transitions.easing.sharp,\r\n duration: theme.transitions.duration.enteringScreen,\r\n }),\r\n }),\r\n}));\r\n\r\nconst getAllRoutesWithPath = (routes: LayoutRoute[]): LayoutRoute[] => {\r\n let result: LayoutRoute[] = [];\r\n for (const route of routes) {\r\n if (route.path) {\r\n result.push(route);\r\n }\r\n if (route.children) {\r\n result = result.concat(getAllRoutesWithPath(route.children));\r\n }\r\n }\r\n return result;\r\n};\r\n\r\ninterface LayoutProps {\r\n routes: LayoutRoute[];\r\n appVersion: string;\r\n colors: LayoutPaletteColorOptions;\r\n children: React.ReactNode;\r\n user: User;\r\n notifications: Notification[] | undefined;\r\n setNotifications: Dispatch<SetStateAction<Notification[] | undefined>>;\r\n}\r\n\r\nexport const Layout: React.FC<LayoutProps> = ({ routes, colors, appVersion, user, notifications, setNotifications, children }) => {\r\n const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n const [mode, setMode] = useLocalStorageState<\"light\" | \"dark\" | \"system\">(\"mui-mode\", { defaultValue: \"system\" });\r\n const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n const { i18n } = useTranslation();\r\n const isFetching = !!useIsFetching();\r\n const isMutating = !!useIsMutating();\r\n const location = useLocation();\r\n const navigationRoutes = getAllRoutesWithPath(routes);\r\n const route = navigationRoutes.find(r => matchPath(r.path!, location.pathname))!;\r\n\r\n useEffect(() => {\r\n if (route.authenticated !== false && !user.isLoggedIn)\r\n initKeycloak();\r\n }, [route, user]);\r\n\r\n keycloak.onTokenExpired = async () => {\r\n try {\r\n await keycloak.updateToken(30);\r\n } catch {\r\n if (route.authenticated !== false) {\r\n await doLogin();\r\n }\r\n }\r\n };\r\n\r\n const theme: Theme = createTheme({\r\n palette: {\r\n mode: mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode,\r\n primary: colors.primary,\r\n secondary: colors.secondary,\r\n background: colors.background ?? {},\r\n },\r\n components: {\r\n MuiCssBaseline: {\r\n styleOverrides: (theme) => ({\r\n body: {\r\n \"&::-webkit-scrollbar, & *::-webkit-scrollbar\": {\r\n width: \"0.7em\",\r\n height: \"0.7em\",\r\n },\r\n \"&::-webkit-scrollbar-track, & *::-webkit-scrollbar-track\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[900] : grey[200],\r\n borderRadius: \"5px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[800] : grey[400],\r\n borderRadius: \"10px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb:hover, & *::-webkit-scrollbar-thumb:hover\": {\r\n backgroundColor: theme.palette.mode === \"dark\" ? grey[700] : grey[500],\r\n },\r\n \"&::-webkit-scrollbar-corner, & *::-webkit-scrollbar-corner\": {\r\n backgroundColor: \"transparent\",\r\n },\r\n },\r\n }),\r\n },\r\n },\r\n },\r\n i18n.language === \"cs\" ? datePickersCsCz : datePickersEnUs,\r\n i18n.language === \"cs\" ? dataGridCsCz : dataGridEnUs,\r\n i18n.language === \"cs\" ? csCZ : enUS\r\n );\r\n\r\n const title = route.pageTitle ?? route.title;\r\n\r\n useEffect(() => {\r\n if (title) document.title = title;\r\n }, [title]);\r\n\r\n const toggleNavigationDrawer = () => setLeftDrawerOpen(!leftDrawerOpen);\r\n\r\n const hasNavigationRoutes: boolean = navigationRoutes.filter(route => route.showInMenu && !route.disabled).length > 1;\r\n\r\n return (\r\n <ThemeProvider theme={theme}>\r\n <Box sx={{ display: \"flex\", position: \"sticky\" }}>\r\n <CssBaseline />\r\n <AppBar position=\"fixed\" open={leftDrawerOpen}>\r\n <Toolbar>\r\n <IconButton color=\"inherit\" onClick={toggleNavigationDrawer} edge=\"start\" sx={{ marginRight: 2, ...((leftDrawerOpen || !hasNavigationRoutes) && { display: \"none\" }) }} >\r\n <Menu />\r\n </IconButton>\r\n\r\n <Typography variant=\"h6\" noWrap component=\"div\" sx={{ flexGrow: 1 }}>{title}</Typography>\r\n\r\n {environment !== \"production\" && <Chip sx={theme => ({ mr: 1, bgcolor: \"secondary.main\", color: theme.palette.primary.contrastText })} label={environment} />}\r\n\r\n <NotificationMenu notifications={notifications} setNotifications={setNotifications} />\r\n <AccountMenu mode={mode} setMode={setMode} user={user} />\r\n </Toolbar>\r\n </AppBar>\r\n\r\n <NavigationDrawer routes={navigationRoutes} appVersion={appVersion} open={leftDrawerOpen} setOpen={setLeftDrawerOpen} hasRoutes={hasNavigationRoutes} />\r\n\r\n <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n <DrawerHeader />\r\n {(route.authenticated === false || user.isLoggedIn) && !route.disabled ? children : <Unauthorized />}\r\n </Box>\r\n </Box>\r\n\r\n <DevelopmentBanner user={user} hasNavigationRoutes={hasNavigationRoutes} />\r\n {(isFetching || isMutating) && <LinearProgress sx={{ position: \"fixed\", top: { xs: 56, sm: 64 }, left: 0, right: 0 }} />}\r\n </ThemeProvider>\r\n );\r\n};\r\n"]}
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Close } from "@mui/icons-material";
|
|
3
|
-
import { Fade,
|
|
3
|
+
import { Fade, Grid2, IconButton, Paper, Typography } from "@mui/material";
|
|
4
4
|
import { useEffect, useState } from "react";
|
|
5
5
|
import { useTranslation } from "react-i18next";
|
|
6
6
|
import { environment } from "../../utils/Helpers";
|
|
7
7
|
import { hasRole } from "../../utils/UserService";
|
|
8
|
-
|
|
8
|
+
import { grey } from "@mui/material/colors";
|
|
9
|
+
export const DevelopmentBanner = ({ user, hasNavigationRoutes }) => {
|
|
9
10
|
const { t } = useTranslation();
|
|
10
11
|
const [bannerOpen, setBannerOpen] = useState(false);
|
|
11
12
|
useEffect(() => {
|
|
@@ -13,6 +14,16 @@ export const DevelopmentBanner = ({ user }) => {
|
|
|
13
14
|
setBannerOpen(true);
|
|
14
15
|
}, [user.isLoggedIn]);
|
|
15
16
|
const closeBanner = () => setBannerOpen(false);
|
|
16
|
-
return (_jsx(Fade, { appear: false, in: bannerOpen, children: _jsx(Paper, { square: true, variant: "outlined", tabIndex: -1, sx:
|
|
17
|
+
return (_jsx(Fade, { appear: false, in: bannerOpen, children: _jsx(Paper, { square: true, variant: "outlined", tabIndex: -1, sx: theme => ({
|
|
18
|
+
position: "fixed",
|
|
19
|
+
bottom: 0,
|
|
20
|
+
left: { xs: 0, sm: hasNavigationRoutes ? 68.7 : 0 },
|
|
21
|
+
right: 0,
|
|
22
|
+
m: 0,
|
|
23
|
+
p: 2,
|
|
24
|
+
borderWidth: 0,
|
|
25
|
+
borderTopWidth: 1,
|
|
26
|
+
bgcolor: theme.palette.mode === "dark" ? grey[900] : grey[100]
|
|
27
|
+
}), children: _jsxs(Grid2, { container: true, justifyContent: "space-between", alignItems: "center", children: [_jsxs(Grid2, { size: 10, children: [_jsx(Typography, { fontWeight: "bold", children: t("Layout.DevelopmentDialogTitle") }), _jsx(Typography, { variant: "body2", children: t("Layout.DevelopmentDialogContent") })] }), _jsx(Grid2, { size: 2, sx: { p: 1, textAlign: "right" }, children: _jsx(IconButton, { size: "small", onClick: closeBanner, children: _jsx(Close, {}) }) })] }) }) }));
|
|
17
28
|
};
|
|
18
29
|
//# sourceMappingURL=DevelopmentBanner.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DevelopmentBanner.js","sourceRoot":"","sources":["../../../../src/components/layout/DevelopmentBanner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,
|
|
1
|
+
{"version":3,"file":"DevelopmentBanner.js","sourceRoot":"","sources":["../../../../src/components/layout/DevelopmentBanner.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AAC5C,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAC3E,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,OAAO,EAAE,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAO5C,MAAM,CAAC,MAAM,iBAAiB,GAAqC,CAAC,EAAE,IAAI,EAAE,mBAAmB,EAAE,EAAE,EAAE;IACjG,MAAM,EAAE,CAAC,EAAE,GAAG,cAAc,EAAE,CAAC;IAC/B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IAE7D,SAAS,CAAC,GAAG,EAAE;QACX,IAAI,IAAI,CAAC,UAAU,IAAI,CAAC,OAAO,CAAC,CAAC,gBAAgB,CAAC,CAAC,IAAI,WAAW,KAAK,aAAa;YAChF,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5B,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;IAEtB,MAAM,WAAW,GAAG,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAE/C,OAAO,CACH,KAAC,IAAI,IAAC,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,UAAU,YAC/B,KAAC,KAAK,IAAC,MAAM,QAAC,OAAO,EAAC,UAAU,EAAC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;gBACzD,QAAQ,EAAE,OAAO;gBACjB,MAAM,EAAE,CAAC;gBACT,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,mBAAmB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;gBACnD,KAAK,EAAE,CAAC;gBACR,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,CAAC;gBACJ,WAAW,EAAE,CAAC;gBACd,cAAc,EAAE,CAAC;gBACjB,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;aACjE,CAAC,YACE,MAAC,KAAK,IAAC,SAAS,QAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,aAC/D,MAAC,KAAK,IAAC,IAAI,EAAE,EAAE,aACX,KAAC,UAAU,IAAC,UAAU,EAAC,MAAM,YAAE,CAAC,CAAC,+BAA+B,CAAC,GAAc,EAC/E,KAAC,UAAU,IAAC,OAAO,EAAC,OAAO,YAAE,CAAC,CAAC,iCAAiC,CAAC,GAAc,IAC3E,EAER,KAAC,KAAK,IAAC,IAAI,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,YAC5C,KAAC,UAAU,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,WAAW,YACzC,KAAC,KAAK,KAAG,GACA,GACT,IACJ,GACJ,GACL,CACV,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Close } from \"@mui/icons-material\";\r\nimport { Fade, Grid2, IconButton, Paper, Typography } from \"@mui/material\";\r\nimport { useEffect, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { User } from \"../../models/User\";\r\nimport { environment } from \"../../utils/Helpers\";\r\nimport { hasRole } from \"../../utils/UserService\";\r\nimport { grey } from \"@mui/material/colors\";\r\n\r\ninterface DevelopmentBannerProps {\r\n user: User;\r\n hasNavigationRoutes: boolean;\r\n}\r\n\r\nexport const DevelopmentBanner: React.FC<DevelopmentBannerProps> = ({ user, hasNavigationRoutes }) => {\r\n const { t } = useTranslation();\r\n const [bannerOpen, setBannerOpen] = useState<boolean>(false);\r\n\r\n useEffect(() => {\r\n if (user.isLoggedIn && !hasRole([\"wcz-developers\"]) && environment === \"development\")\r\n setBannerOpen(true);\r\n }, [user.isLoggedIn]);\r\n\r\n const closeBanner = () => setBannerOpen(false);\r\n\r\n return (\r\n <Fade appear={false} in={bannerOpen}>\r\n <Paper square variant=\"outlined\" tabIndex={-1} sx={theme => ({\r\n position: \"fixed\",\r\n bottom: 0,\r\n left: { xs: 0, sm: hasNavigationRoutes ? 68.7 : 0 },\r\n right: 0,\r\n m: 0,\r\n p: 2,\r\n borderWidth: 0,\r\n borderTopWidth: 1,\r\n bgcolor: theme.palette.mode === \"dark\" ? grey[900] : grey[100]\r\n })}>\r\n <Grid2 container justifyContent=\"space-between\" alignItems=\"center\">\r\n <Grid2 size={10}>\r\n <Typography fontWeight=\"bold\">{t(\"Layout.DevelopmentDialogTitle\")}</Typography>\r\n <Typography variant=\"body2\">{t(\"Layout.DevelopmentDialogContent\")}</Typography>\r\n </Grid2>\r\n\r\n <Grid2 size={2} sx={{ p: 1, textAlign: \"right\" }}>\r\n <IconButton size=\"small\" onClick={closeBanner}>\r\n <Close />\r\n </IconButton>\r\n </Grid2>\r\n </Grid2>\r\n </Paper>\r\n </Fade>\r\n );\r\n};"]}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Stack, Typography } from "@mui/material";
|
|
3
3
|
const stackSxProps = [
|
|
4
|
-
"margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "m", "mt", "mr", "mb", "ml",
|
|
5
|
-
"padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "p", "pt", "pr", "pb", "pl",
|
|
4
|
+
"margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "m", "mt", "mr", "mb", "ml", "mx", "my",
|
|
5
|
+
"padding", "paddingTop", "paddingRight", "paddingBottom", "paddingLeft", "p", "pt", "pr", "pb", "pl", "px", "py",
|
|
6
6
|
"flexGrow", "flexShrink", "flexBasis", "flexDirection", "alignItems", "justifyContent",
|
|
7
7
|
"position", "zIndex", "top", "right", "bottom", "left",
|
|
8
8
|
"gridGap", "gridColumnGap", "gridRowGap", "gridColumn", "gridRow", "gridAutoFlow",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TypographyWithIcon.js","sourceRoot":"","sources":["../../../../src/components/layout/TypographyWithIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAkB,UAAU,EAAmB,MAAM,eAAe,CAAC;AAEnF,MAAM,YAAY,GAAG;IACjB,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI;
|
|
1
|
+
{"version":3,"file":"TypographyWithIcon.js","sourceRoot":"","sources":["../../../../src/components/layout/TypographyWithIcon.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,KAAK,EAAkB,UAAU,EAAmB,MAAM,eAAe,CAAC;AAEnF,MAAM,YAAY,GAAG;IACjB,QAAQ,EAAE,WAAW,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI;IAC3G,SAAS,EAAE,YAAY,EAAE,cAAc,EAAE,eAAe,EAAE,aAAa,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI;IAChH,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,gBAAgB;IACtF,UAAU,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM;IACtD,SAAS,EAAE,eAAe,EAAE,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,cAAc;IACjF,KAAK,EAAE,WAAW,EAAE,QAAQ;CAC/B,CAAC;AAOF,MAAM,CAAC,MAAM,kBAAkB,GAAsC,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,YAAY,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IAClI,MAAM,MAAM,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC;IAEzB,MAAM,WAAW,GAAG,YAAY,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;QAClD,IAAI,MAAM,IAAK,MAAc,CAAC,IAAI,CAAC,EAAE,CAAC;YACjC,GAAW,CAAC,IAAI,CAAC,GAAI,MAAc,CAAC,IAAI,CAAC,CAAC;YAC3C,OAAQ,MAAc,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC;QACD,OAAO,GAAG,CAAC;IACf,CAAC,EAAE,EAAoB,CAAC,CAAC;IAEzB,OAAO,CACH,MAAC,KAAK,IAAC,SAAS,EAAC,KAAK,EAAC,UAAU,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,WAAW,EAAE,EAAE,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,aACjG,SAAS,IAAI,SAAS,EACvB,KAAC,UAAU,OAAK,KAAK,EAAE,EAAE,EAAE,MAAM,YAAG,QAAQ,GAAc,EACzD,OAAO,IAAI,OAAO,IACf,CACX,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { Stack, SxProps, Theme, Typography, TypographyProps } from \"@mui/material\";\r\n\r\nconst stackSxProps = [\r\n \"margin\", \"marginTop\", \"marginRight\", \"marginBottom\", \"marginLeft\", \"m\", \"mt\", \"mr\", \"mb\", \"ml\", \"mx\", \"my\",\r\n \"padding\", \"paddingTop\", \"paddingRight\", \"paddingBottom\", \"paddingLeft\", \"p\", \"pt\", \"pr\", \"pb\", \"pl\", \"px\", \"py\",\r\n \"flexGrow\", \"flexShrink\", \"flexBasis\", \"flexDirection\", \"alignItems\", \"justifyContent\",\r\n \"position\", \"zIndex\", \"top\", \"right\", \"bottom\", \"left\",\r\n \"gridGap\", \"gridColumnGap\", \"gridRowGap\", \"gridColumn\", \"gridRow\", \"gridAutoFlow\",\r\n \"gap\", \"columnGap\", \"rowGap\"\r\n];\r\n\r\ninterface TypographyWithIconProps extends TypographyProps {\r\n startIcon?: React.ReactNode;\r\n endIcon?: React.ReactNode;\r\n}\r\n\r\nexport const TypographyWithIcon: React.FC<TypographyWithIconProps> = ({ startIcon, endIcon, children, sx, gutterBottom, ...props }) => {\r\n const sxCopy = { ...sx };\r\n\r\n const stackStyles = stackSxProps.reduce((acc, curr) => {\r\n if (sxCopy && (sxCopy as any)[curr]) {\r\n (acc as any)[curr] = (sxCopy as any)[curr];\r\n delete (sxCopy as any)[curr];\r\n }\r\n return acc;\r\n }, {} as SxProps<Theme>);\r\n\r\n return (\r\n <Stack direction=\"row\" alignItems=\"center\" gap={1} sx={stackStyles} mb={gutterBottom ? 0.7 : undefined}>\r\n {startIcon && startIcon}\r\n <Typography {...props} sx={sxCopy}>{children}</Typography>\r\n {endIcon && endIcon}\r\n </Stack>\r\n );\r\n};"]}
|