wcz-layout 5.11.2 → 5.13.0

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.
Files changed (53) hide show
  1. package/dist/src/components/Layout.d.ts +4 -3
  2. package/dist/src/components/Layout.js +31 -8
  3. package/dist/src/components/Layout.js.map +1 -1
  4. package/dist/src/components/layout/AccountMenu.d.ts +0 -2
  5. package/dist/src/components/layout/AccountMenu.js +19 -21
  6. package/dist/src/components/layout/AccountMenu.js.map +1 -1
  7. package/dist/src/contexts/LayoutContext.d.ts +2 -0
  8. package/dist/src/contexts/LayoutContext.js +7 -28
  9. package/dist/src/contexts/LayoutContext.js.map +1 -1
  10. package/dist/src/contexts/UserContext.d.ts +21 -0
  11. package/dist/src/contexts/UserContext.js +34 -0
  12. package/dist/src/contexts/UserContext.js.map +1 -0
  13. package/dist/src/hooks/UseUser.d.ts +5 -0
  14. package/dist/src/hooks/UseUser.js +34 -0
  15. package/dist/src/hooks/UseUser.js.map +1 -0
  16. package/dist/src/index.d.ts +1 -1
  17. package/dist/src/index.js +1 -1
  18. package/dist/src/index.js.map +1 -1
  19. package/dist/src/models/User.d.ts +8 -12
  20. package/dist/src/models/User.js.map +1 -1
  21. package/dist/src/utils/Auth.d.ts +12 -0
  22. package/dist/src/utils/Auth.js +47 -0
  23. package/dist/src/utils/Auth.js.map +1 -0
  24. package/dist/src/utils/Fetches.d.ts +5 -5
  25. package/dist/src/utils/Fetches.js +14 -14
  26. package/dist/src/utils/Fetches.js.map +1 -1
  27. package/dist/src/utils/Helpers.d.ts +3 -1
  28. package/dist/src/utils/Helpers.js +10 -1
  29. package/dist/src/utils/Helpers.js.map +1 -1
  30. package/dist/src/utils/UseUser.d.ts +2 -2
  31. package/dist/src/utils/UseUser.js +10 -20
  32. package/dist/src/utils/UseUser.js.map +1 -1
  33. package/dist/tsconfig.tsbuildinfo +1 -1
  34. package/package.json +5 -3
  35. package/src/components/Layout.tsx +39 -12
  36. package/src/components/layout/AccountMenu.tsx +29 -38
  37. package/src/contexts/LayoutContext.tsx +20 -42
  38. package/src/contexts/UserContext.tsx +62 -0
  39. package/src/hooks/UseUser.tsx +40 -0
  40. package/src/index.ts +1 -1
  41. package/src/models/User.ts +6 -10
  42. package/src/utils/Auth.ts +56 -0
  43. package/src/utils/Fetches.ts +14 -14
  44. package/src/utils/Helpers.ts +9 -2
  45. package/src/utils/UseUser.tsx +12 -23
  46. package/dist/src/models/KeycloakExtendedConfig.d.ts +0 -11
  47. package/dist/src/models/KeycloakExtendedConfig.js +0 -2
  48. package/dist/src/models/KeycloakExtendedConfig.js.map +0 -1
  49. package/dist/src/utils/UserService.d.ts +0 -8
  50. package/dist/src/utils/UserService.js +0 -87
  51. package/dist/src/utils/UserService.js.map +0 -1
  52. package/src/models/KeycloakExtendedConfig.ts +0 -12
  53. package/src/utils/UserService.ts +0 -109
@@ -1,6 +1,7 @@
1
1
  import React from "react";
2
2
  import { LeftDrawerItem } from "../models/LeftDrawerItem";
3
- import { ExtendedUser } from "../models/User";
3
+ import { User } from "../models/User";
4
+ import SnackbarModel from "../models/SnackbarModel";
4
5
  interface LayoutProps {
5
6
  title: string;
6
7
  appVersion: string;
@@ -9,8 +10,8 @@ interface LayoutProps {
9
10
  secondaryColor: string;
10
11
  backgroundColor?: string;
11
12
  children: React.ReactNode;
12
- user: ExtendedUser;
13
- initialized: boolean;
13
+ user: User;
14
+ setSnackbar: (snackbar: SnackbarModel) => void;
14
15
  }
15
16
  export default function Layout(props: LayoutProps): import("react/jsx-runtime").JSX.Element;
16
17
  export {};
@@ -1,22 +1,25 @@
1
1
  var _a;
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { useIsAuthenticated, useMsal } from "@azure/msal-react";
3
4
  import { Menu, Warning } from "@mui/icons-material";
4
5
  import { Box, Button, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, Toolbar, Typography, useMediaQuery } from "@mui/material";
6
+ import { grey } from "@mui/material/colors";
5
7
  import { csCZ, enUS } from "@mui/material/locale";
6
8
  import { ThemeProvider, createTheme, styled } from "@mui/material/styles";
7
9
  import { useIsFetching, useIsMutating } from "@tanstack/react-query";
8
10
  import { useCallback, useEffect, useMemo, useState } from "react";
9
11
  import { useTranslation } from "react-i18next";
10
12
  import { useLocation } from "react-router-dom";
11
- import { isDevelopment } from "../utils/Helpers";
13
+ import { hasRole } from "../utils/Auth";
12
14
  import { persistStorage } from "../utils/PersistStorage";
13
- import { hasRole } from "../utils/UserService";
14
15
  import { Dialog } from "./Dialog";
15
16
  import { TypographyWithIcon } from "./TypographyWithIcon";
16
17
  import CenteredBox from "./common/CenteredBox";
17
18
  import AccountMenu from "./layout/AccountMenu";
18
19
  import LeftDrawer from "./layout/LeftDrawer";
19
- import { grey } from "@mui/material/colors";
20
+ import { InteractionStatus } from "@azure/msal-browser";
21
+ import { queryClient } from "../contexts/LayoutContext";
22
+ import { environment } from "../utils/Helpers";
20
23
  //Mode
21
24
  const storedMode = (_a = persistStorage.get("mode")) !== null && _a !== void 0 ? _a : "system";
22
25
  //Drawer
@@ -47,7 +50,7 @@ const AppBar = styled(MuiAppBar, {
47
50
  }),
48
51
  }));
49
52
  export default function Layout(props) {
50
- const { primaryColor, secondaryColor, backgroundColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;
53
+ const { primaryColor, secondaryColor, backgroundColor, title, appVersion, leftDrawerItems, user, setSnackbar, children } = props;
51
54
  const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
52
55
  const [mode, setMode] = useState(storedMode);
53
56
  const [leftDrawerOpen, setLeftDrawerOpen] = useState(false);
@@ -57,6 +60,26 @@ export default function Layout(props) {
57
60
  const isMutating = !!useIsMutating();
58
61
  const location = useLocation();
59
62
  const { t, i18n } = useTranslation();
63
+ const { instance, inProgress } = useMsal();
64
+ const isAuthenticated = useIsAuthenticated();
65
+ useEffect(() => {
66
+ if (!isAuthenticated && inProgress === InteractionStatus.None)
67
+ instance.loginRedirect({ scopes: [], redirectUri: "/" });
68
+ }, [isAuthenticated, inProgress]);
69
+ useEffect(() => setQueryClientDefaultOptions(), [isAuthenticated]);
70
+ const setQueryClientDefaultOptions = () => {
71
+ queryClient.setDefaultOptions({
72
+ queries: {
73
+ enabled: isAuthenticated,
74
+ refetchOnWindowFocus: false,
75
+ onError: message => setSnackbar({ message: String(message), severity: "error" }),
76
+ retry: 1
77
+ },
78
+ mutations: {
79
+ onError: message => setSnackbar({ message: String(message), severity: "error" }),
80
+ }
81
+ });
82
+ };
60
83
  const palleteMode = useMemo(() => mode === "system" ? prefersDarkMode ? "dark" : "light" : mode, [mode, prefersDarkMode]);
61
84
  const theme = createTheme({
62
85
  palette: {
@@ -92,7 +115,7 @@ export default function Layout(props) {
92
115
  },
93
116
  },
94
117
  }, i18n.language === "cs" ? csCZ : enUS);
95
- useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);
118
+ useEffect(() => handleUnauthorized(), [location.pathname, isAuthenticated, leftDrawerItems]);
96
119
  const handleUnauthorized = () => {
97
120
  const activePage = leftDrawerItems.find(i => i.path === location.pathname);
98
121
  if (activePage === null || activePage === void 0 ? void 0 : activePage.hidden)
@@ -100,12 +123,12 @@ export default function Layout(props) {
100
123
  return setAuthorized(true);
101
124
  };
102
125
  useEffect(() => {
103
- if (user.loggedIn && !hasRole(["wcz-developers"]) && isDevelopment)
126
+ if (isAuthenticated && !hasRole(user, ["wcz-developers"]) && (environment === "dev" || environment === "qas"))
104
127
  toggleDevelopmentDialogOpen();
105
- }, [user.loggedIn]);
128
+ }, [isAuthenticated]);
106
129
  const toggleDevelopmentDialogOpen = useCallback(() => setDevelopmentDialogOpen(!developmentDialogOpen), [developmentDialogOpen]);
107
130
  const developmentDialog = (_jsx(Dialog, { open: developmentDialogOpen, onClose: toggleDevelopmentDialogOpen, title: _jsx(TypographyWithIcon, { variant: "h6", startIcon: _jsx(Warning, {}), children: t("Layout.DevelopmentDialogTitle") }), color: "warning", disableAutoClose: true, actions: [_jsx(Button, { color: "warning", onClick: toggleDevelopmentDialogOpen, children: t("Close") }, "close")], children: t("Layout.DevelopmentDialogContent") }));
108
131
  const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);
109
- 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: toggleDrawerOpen, edge: "start", sx: { marginRight: 2, ...(leftDrawerOpen && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), isDevelopment && _jsx(Chip, { variant: "outlined", sx: theme => ({ mr: 1.5, color: theme.palette.primary.contrastText }), label: "Development" }), _jsx(AccountMenu, { mode: mode, setMode: setMode, user: user })] }) }), _jsx(LeftDrawer, { appVersion: appVersion, items: leftDrawerItems, drawerOpen: leftDrawerOpen, setDrawerOpen: setLeftDrawerOpen }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), authorized ? children : _jsx(CenteredBox, { label: t("Layout.Unauthorized") })] })] }), developmentDialog, (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
132
+ 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: toggleDrawerOpen, edge: "start", sx: { marginRight: 2, ...(leftDrawerOpen && { display: "none" }) }, children: _jsx(Menu, {}) }), _jsx(Typography, { variant: "h6", noWrap: true, component: "div", sx: { flexGrow: 1 }, children: title }), environment !== "prd" && _jsx(Chip, { variant: "outlined", sx: theme => ({ mr: 1.5, color: theme.palette.primary.contrastText }), label: environment }), _jsx(AccountMenu, { mode: mode, setMode: setMode })] }) }), _jsx(LeftDrawer, { appVersion: appVersion, items: leftDrawerItems, drawerOpen: leftDrawerOpen, setDrawerOpen: setLeftDrawerOpen }), _jsxs(Box, { component: "main", sx: { flex: 1, overflow: "auto" }, children: [_jsx(DrawerHeader, {}), authorized ? children : _jsx(CenteredBox, { label: t("Layout.Unauthorized") })] })] }), developmentDialog, (isFetching || isMutating) && _jsx(LinearProgress, { sx: { position: "fixed", top: { xs: 56, sm: 64 }, left: 0, right: 0 } })] }));
110
133
  }
111
134
  //# 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, Warning } from \"@mui/icons-material\";\r\nimport { Box, Button, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, PaletteMode, Theme, Toolbar, Typography, useMediaQuery } from \"@mui/material\";\r\nimport { csCZ, enUS } from \"@mui/material/locale\";\r\nimport { ThemeProvider, createTheme, styled } from \"@mui/material/styles\";\r\nimport { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport { ExtendedUser } from \"../models/User\";\r\nimport { isDevelopment } from \"../utils/Helpers\";\r\nimport { persistStorage } from \"../utils/PersistStorage\";\r\nimport { hasRole } from \"../utils/UserService\";\r\nimport { Dialog } from \"./Dialog\";\r\nimport { TypographyWithIcon } from \"./TypographyWithIcon\";\r\nimport CenteredBox from \"./common/CenteredBox\";\r\nimport AccountMenu from \"./layout/AccountMenu\";\r\nimport LeftDrawer from \"./layout/LeftDrawer\";\r\nimport { grey } from \"@mui/material/colors\";\r\n\r\n//Mode\r\nconst storedMode = persistStorage.get(\"mode\") as PaletteMode ?? \"system\";\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\n//Layout\r\ninterface LayoutProps {\r\n title: string,\r\n appVersion: string,\r\n leftDrawerItems: LeftDrawerItem[],\r\n primaryColor: string,\r\n secondaryColor: string,\r\n backgroundColor?: string,\r\n children: React.ReactNode,\r\n user: ExtendedUser,\r\n initialized: boolean\r\n}\r\n\r\nexport default function Layout(props: LayoutProps) {\r\n const { primaryColor, secondaryColor, backgroundColor, title, appVersion, leftDrawerItems, user, initialized, children } = props;\r\n const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n const [mode, setMode] = useState<PaletteMode | \"system\">(storedMode);\r\n const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n const [authorized, setAuthorized] = useState<boolean>(true);\r\n const [developmentDialogOpen, setDevelopmentDialogOpen] = useState<boolean>(false);\r\n const isFetching = !!useIsFetching();\r\n const isMutating = !!useIsMutating();\r\n const location = useLocation();\r\n const { t, i18n } = useTranslation();\r\n\r\n const palleteMode = useMemo(() => mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode, [mode, prefersDarkMode]);\r\n\r\n const theme: Theme = createTheme({\r\n palette: {\r\n mode: palleteMode,\r\n primary: { main: primaryColor },\r\n secondary: { main: secondaryColor },\r\n background: (backgroundColor && palleteMode === \"light\") ? { default: backgroundColor, paper: backgroundColor } : {}\r\n },\r\n components: {\r\n MuiCssBaseline: {\r\n styleOverrides: {\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: palleteMode === \"dark\" ? grey[900] : grey[200],\r\n borderRadius: \"5px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb\": {\r\n backgroundColor: palleteMode === \"dark\" ? grey[800] : grey[400],\r\n borderRadius: \"10px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb:hover, & *::-webkit-scrollbar-thumb:hover\": {\r\n backgroundColor: palleteMode === \"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 }, i18n.language === \"cs\" ? csCZ : enUS);\r\n\r\n useEffect(() => handleUnauthorized(), [location.pathname, initialized, leftDrawerItems]);\r\n\r\n const handleUnauthorized = () => {\r\n const activePage: LeftDrawerItem | undefined = leftDrawerItems.find(i => i.path === location.pathname);\r\n if (activePage?.hidden)\r\n return setAuthorized(false);\r\n\r\n return setAuthorized(true);\r\n };\r\n\r\n useEffect(() => {\r\n if (user.loggedIn && !hasRole([\"wcz-developers\"]) && isDevelopment)\r\n toggleDevelopmentDialogOpen();\r\n }, [user.loggedIn]);\r\n\r\n const toggleDevelopmentDialogOpen = useCallback(() => setDevelopmentDialogOpen(!developmentDialogOpen), [developmentDialogOpen]);\r\n\r\n const developmentDialog = (\r\n <Dialog\r\n open={developmentDialogOpen}\r\n onClose={toggleDevelopmentDialogOpen}\r\n title={<TypographyWithIcon variant=\"h6\" startIcon={<Warning />}>{t(\"Layout.DevelopmentDialogTitle\")}</TypographyWithIcon>}\r\n color=\"warning\"\r\n disableAutoClose\r\n actions={[<Button key=\"close\" color=\"warning\" onClick={toggleDevelopmentDialogOpen}>{t(\"Close\")}</Button>]}\r\n >\r\n {t(\"Layout.DevelopmentDialogContent\")}\r\n </Dialog>\r\n );\r\n\r\n const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);\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={toggleDrawerOpen} edge=\"start\" sx={{ marginRight: 2, ...(leftDrawerOpen && { 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 {isDevelopment && <Chip variant=\"outlined\" sx={theme => ({ mr: 1.5, color: theme.palette.primary.contrastText })} label=\"Development\" />}\r\n\r\n <AccountMenu mode={mode} setMode={setMode} user={user} />\r\n </Toolbar>\r\n </AppBar>\r\n\r\n <LeftDrawer appVersion={appVersion} items={leftDrawerItems} drawerOpen={leftDrawerOpen} setDrawerOpen={setLeftDrawerOpen} />\r\n\r\n <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n <DrawerHeader />\r\n {authorized ? children : <CenteredBox label={t(\"Layout.Unauthorized\")!} />}\r\n </Box>\r\n </Box>\r\n\r\n {developmentDialog}\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 { useIsAuthenticated, useMsal } from \"@azure/msal-react\";\r\nimport { Menu, Warning } from \"@mui/icons-material\";\r\nimport { Box, Button, Chip, CssBaseline, IconButton, LinearProgress, AppBar as MuiAppBar, AppBarProps as MuiAppBarProps, PaletteMode, 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 { useIsFetching, useIsMutating } from \"@tanstack/react-query\";\r\nimport React, { useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport { User } from \"../models/User\";\r\nimport { hasRole } from \"../utils/Auth\";\r\nimport { persistStorage } from \"../utils/PersistStorage\";\r\nimport { Dialog } from \"./Dialog\";\r\nimport { TypographyWithIcon } from \"./TypographyWithIcon\";\r\nimport CenteredBox from \"./common/CenteredBox\";\r\nimport AccountMenu from \"./layout/AccountMenu\";\r\nimport LeftDrawer from \"./layout/LeftDrawer\";\r\nimport { InteractionStatus } from \"@azure/msal-browser\";\r\nimport { queryClient } from \"../contexts/LayoutContext\";\r\nimport SnackbarModel from \"../models/SnackbarModel\";\r\nimport { environment } from \"../utils/Helpers\";\r\n\r\n//Mode\r\nconst storedMode = persistStorage.get(\"mode\") as PaletteMode ?? \"system\";\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\n//Layout\r\ninterface LayoutProps {\r\n title: string,\r\n appVersion: string,\r\n leftDrawerItems: LeftDrawerItem[],\r\n primaryColor: string,\r\n secondaryColor: string,\r\n backgroundColor?: string,\r\n children: React.ReactNode,\r\n user: User,\r\n setSnackbar: (snackbar: SnackbarModel) => void;\r\n}\r\n\r\nexport default function Layout(props: LayoutProps) {\r\n const { primaryColor, secondaryColor, backgroundColor, title, appVersion, leftDrawerItems, user, setSnackbar, children } = props;\r\n const prefersDarkMode: boolean = useMediaQuery(\"(prefers-color-scheme: dark)\");\r\n const [mode, setMode] = useState<PaletteMode | \"system\">(storedMode);\r\n const [leftDrawerOpen, setLeftDrawerOpen] = useState<boolean>(false);\r\n const [authorized, setAuthorized] = useState<boolean>(true);\r\n const [developmentDialogOpen, setDevelopmentDialogOpen] = useState<boolean>(false);\r\n const isFetching = !!useIsFetching();\r\n const isMutating = !!useIsMutating();\r\n const location = useLocation();\r\n const { t, i18n } = useTranslation();\r\n const { instance, inProgress } = useMsal();\r\n const isAuthenticated = useIsAuthenticated();\r\n\r\n useEffect(() => {\r\n if (!isAuthenticated && inProgress === InteractionStatus.None)\r\n instance.loginRedirect({ scopes: [], redirectUri: \"/\" });\r\n }, [isAuthenticated, inProgress]);\r\n\r\n useEffect(() => setQueryClientDefaultOptions(), [isAuthenticated]);\r\n \r\n const setQueryClientDefaultOptions = () => {\r\n queryClient.setDefaultOptions({\r\n queries: {\r\n enabled: isAuthenticated,\r\n refetchOnWindowFocus: false,\r\n onError: message => setSnackbar({ message: String(message), severity: \"error\" }),\r\n retry: 1\r\n },\r\n mutations: {\r\n onError: message => setSnackbar({ message: String(message), severity: \"error\" }),\r\n }\r\n });\r\n };\r\n\r\n const palleteMode = useMemo(() => mode === \"system\" ? prefersDarkMode ? \"dark\" : \"light\" : mode, [mode, prefersDarkMode]);\r\n\r\n const theme: Theme = createTheme({\r\n palette: {\r\n mode: palleteMode,\r\n primary: { main: primaryColor },\r\n secondary: { main: secondaryColor },\r\n background: (backgroundColor && palleteMode === \"light\") ? { default: backgroundColor, paper: backgroundColor } : {}\r\n },\r\n components: {\r\n MuiCssBaseline: {\r\n styleOverrides: {\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: palleteMode === \"dark\" ? grey[900] : grey[200],\r\n borderRadius: \"5px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb, & *::-webkit-scrollbar-thumb\": {\r\n backgroundColor: palleteMode === \"dark\" ? grey[800] : grey[400],\r\n borderRadius: \"10px\",\r\n },\r\n \"&::-webkit-scrollbar-thumb:hover, & *::-webkit-scrollbar-thumb:hover\": {\r\n backgroundColor: palleteMode === \"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 }, i18n.language === \"cs\" ? csCZ : enUS);\r\n\r\n useEffect(() => handleUnauthorized(), [location.pathname, isAuthenticated, leftDrawerItems]);\r\n\r\n const handleUnauthorized = () => {\r\n const activePage: LeftDrawerItem | undefined = leftDrawerItems.find(i => i.path === location.pathname);\r\n if (activePage?.hidden)\r\n return setAuthorized(false);\r\n\r\n return setAuthorized(true);\r\n };\r\n\r\n useEffect(() => {\r\n if (isAuthenticated && !hasRole(user, [\"wcz-developers\"]) && (environment === \"dev\" || environment === \"qas\"))\r\n toggleDevelopmentDialogOpen();\r\n }, [isAuthenticated]);\r\n\r\n const toggleDevelopmentDialogOpen = useCallback(() => setDevelopmentDialogOpen(!developmentDialogOpen), [developmentDialogOpen]);\r\n\r\n const developmentDialog = (\r\n <Dialog\r\n open={developmentDialogOpen}\r\n onClose={toggleDevelopmentDialogOpen}\r\n title={<TypographyWithIcon variant=\"h6\" startIcon={<Warning />}>{t(\"Layout.DevelopmentDialogTitle\")}</TypographyWithIcon>}\r\n color=\"warning\"\r\n disableAutoClose\r\n actions={[<Button key=\"close\" color=\"warning\" onClick={toggleDevelopmentDialogOpen}>{t(\"Close\")}</Button>]}\r\n >\r\n {t(\"Layout.DevelopmentDialogContent\")}\r\n </Dialog>\r\n );\r\n\r\n const toggleDrawerOpen = useCallback(() => setLeftDrawerOpen(!leftDrawerOpen), [leftDrawerOpen]);\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={toggleDrawerOpen} edge=\"start\" sx={{ marginRight: 2, ...(leftDrawerOpen && { 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 !== \"prd\" && <Chip variant=\"outlined\" sx={theme => ({ mr: 1.5, color: theme.palette.primary.contrastText })} label={environment} />}\r\n\r\n <AccountMenu mode={mode} setMode={setMode} />\r\n </Toolbar>\r\n </AppBar>\r\n\r\n <LeftDrawer appVersion={appVersion} items={leftDrawerItems} drawerOpen={leftDrawerOpen} setDrawerOpen={setLeftDrawerOpen} />\r\n\r\n <Box component=\"main\" sx={{ flex: 1, overflow: \"auto\" }}>\r\n <DrawerHeader />\r\n {authorized ? children : <CenteredBox label={t(\"Layout.Unauthorized\")!} />}\r\n </Box>\r\n </Box>\r\n\r\n {developmentDialog}\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,9 +1,7 @@
1
1
  import { PaletteMode } from "@mui/material";
2
- import { ExtendedUser } from "../../models/User";
3
2
  interface AccountMenuProps {
4
3
  mode: PaletteMode | "system";
5
4
  setMode: (mode: PaletteMode | "system") => void;
6
- user: ExtendedUser;
7
5
  }
8
6
  export default function AccountMenu(props: AccountMenuProps): import("react/jsx-runtime").JSX.Element;
9
7
  export {};
@@ -1,18 +1,24 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useIsAuthenticated, useMsal } from "@azure/msal-react";
2
3
  import { AccountCircle, ArrowBack, Brightness4, ChevronRight, DarkMode, LightMode, Login, Logout, SettingsBrightness, Translate } from "@mui/icons-material";
3
- import { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu, Typography } from "@mui/material";
4
- import { grey } from "@mui/material/colors";
5
- import { Fragment, useCallback, useRef, useState } from "react";
4
+ import { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu } from "@mui/material";
5
+ import { useQuery, useQueryClient } from "@tanstack/react-query";
6
+ import { Fragment, useCallback, useState } from "react";
6
7
  import { useTranslation } from "react-i18next";
8
+ import { graphQueries } from "../../hooks/UseUser";
7
9
  import { persistStorage } from "../../utils/PersistStorage";
8
10
  const drawerWidth = 240;
9
11
  export default function AccountMenu(props) {
10
- const { mode, setMode, user } = props;
12
+ const { mode, setMode } = props;
11
13
  const [anchorEl, setAnchorEl] = useState(null);
12
14
  const [tab, setTab] = useState("settings");
13
15
  const open = Boolean(anchorEl);
14
- const accountButtonElement = useRef(null);
15
16
  const { t, i18n } = useTranslation();
17
+ const { instance } = useMsal();
18
+ const isAuthenticated = useIsAuthenticated();
19
+ const queryClient = useQueryClient();
20
+ const { data: userPhoto } = useQuery({ ...graphQueries.sessionUserPhoto(), enabled: isAuthenticated });
21
+ const { data: userDetail } = useQuery({ ...graphQueries.sessionUserDetail(), enabled: open && isAuthenticated });
16
22
  const changeLanguage = useCallback((newLanguage) => () => {
17
23
  i18n.changeLanguage(newLanguage)
18
24
  .finally(() => closeMenu());
@@ -22,29 +28,21 @@ export default function AccountMenu(props) {
22
28
  closeMenu();
23
29
  persistStorage.set("mode", newMode);
24
30
  }, []);
25
- const getNameInitials = () => {
26
- const splittedName = user.name.split(" ");
27
- return `${splittedName[0][0]}${splittedName.length > 1 ? splittedName[1][0] : ""}`;
28
- };
29
31
  const openMenu = useCallback((e) => setAnchorEl(e.currentTarget), []);
30
32
  const closeMenu = useCallback(() => { setAnchorEl(null); setTimeout(() => setTab("settings"), 300); }, []);
31
- const login = useCallback(() => {
32
- user.login()
33
- .catch(console.error);
34
- }, []);
35
- const logout = useCallback(() => {
36
- user.logout()
37
- .catch(console.error);
38
- }, []);
33
+ const login = () => instance.loginRedirect();
34
+ const logout = () => instance.logoutRedirect({
35
+ postLogoutRedirectUri: "/",
36
+ });
39
37
  const changeTab = useCallback((newTab) => () => setTab(newTab), []);
40
38
  const settings = (_jsxs(List, { component: "nav", subheader: _jsx(ListSubheader, { sx: { backgroundColor: "transparent" }, children: t("Layout.Settings") }), children: [_jsxs(ListItemButton, { onClick: changeTab("theme"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Brightness4, {}) }), _jsx(ListItemText, { primary: t("Layout.Appearance"), secondary: t(`Layout.${mode.charAt(0).toUpperCase() + mode.slice(1)}`) }), _jsx(ChevronRight, {})] }), _jsxs(ListItemButton, { onClick: changeTab("language"), sx: { py: 0.3 }, children: [_jsx(ListItemIcon, { children: _jsx(Translate, {}) }), _jsx(ListItemText, { primary: t("Layout.Language"), secondary: i18n.resolvedLanguage === "en" ? "English" : "Čeština" }), _jsx(ChevronRight, {})] })] }));
41
39
  const theme = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Appearance")] }), children: [_jsxs(ListItemButton, { onClick: changeMode("light"), disabled: mode === "light", children: [_jsx(ListItemIcon, { children: _jsx(LightMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Light") })] }), _jsxs(ListItemButton, { onClick: changeMode("dark"), disabled: mode === "dark", children: [_jsx(ListItemIcon, { children: _jsx(DarkMode, {}) }), _jsx(ListItemText, { primary: t("Layout.Dark") })] }), _jsxs(ListItemButton, { onClick: changeMode("system"), disabled: mode === "system", children: [_jsx(ListItemIcon, { children: _jsx(SettingsBrightness, {}) }), _jsx(ListItemText, { primary: t("Layout.System") })] })] }));
42
40
  const language = (_jsxs(List, { subheader: _jsxs(ListSubheader, { onClick: changeTab("settings"), sx: { backgroundColor: "transparent", display: "flex", alignItems: "center", px: 1, cursor: "pointer" }, children: [_jsx(IconButton, { size: "small", sx: { mr: 0.5 }, children: _jsx(ArrowBack, { fontSize: "small" }) }), " ", t("Layout.Language")] }), children: [_jsx(ListItemButton, { onClick: changeLanguage("en"), disabled: i18n.resolvedLanguage === "en", children: _jsx(ListItemText, { primary: "English" }) }), _jsx(ListItemButton, { onClick: changeLanguage("cs"), disabled: i18n.resolvedLanguage === "cs", children: _jsx(ListItemText, { primary: "\u010Ce\u0161tina" }) })] }));
43
- return (_jsxs(Fragment, { children: [_jsx(IconButton, { color: "inherit", onClick: openMenu, edge: "end", ref: accountButtonElement, children: user.name ?
44
- _jsx(Avatar, { sx: { bgcolor: "white", color: grey[800], width: 32, height: 32, }, children: _jsx(Typography, { variant: "subtitle2", sx: { fontWeight: "bold", lineHeight: 0 }, children: getNameInitials() }) })
41
+ return (_jsxs(Fragment, { children: [_jsx(IconButton, { size: "small", edge: "end", onClick: openMenu, onMouseEnter: () => queryClient.prefetchQuery(graphQueries.sessionUserDetail()), children: userPhoto ?
42
+ _jsx(Avatar, { src: userPhoto, sx: { width: { xs: 32, sm: 40 }, height: { xs: 32, sm: 40 } } })
45
43
  :
46
- _jsx(AccountCircle, {}) }), _jsx(Menu, { anchorEl: anchorEl, open: open, onClose: closeMenu, children: _jsxs(Box, { sx: { width: drawerWidth }, role: "presentation", children: [_jsx(List, { "aria-labelledby": "account-menu", children: user.name ?
47
- _jsxs(Fragment, { children: [_jsx(ListItem, { children: _jsx(ListItemText, { primary: user.name, secondary: _jsxs("span", { children: [_jsx("span", { children: user.id }), _jsx("br", {}), _jsx("span", { children: user.department })] }) }) }), _jsxs(ListItemButton, { onClick: logout, children: [_jsx(ListItemIcon, { children: _jsx(Logout, { color: "error" }) }), _jsx(ListItemText, { primary: t("Layout.Logout") })] })] })
44
+ _jsx(AccountCircle, { sx: { width: { xs: 32, sm: 40 }, height: { xs: 32, sm: 40 } } }) }), _jsx(Menu, { anchorEl: anchorEl, open: open, onClose: closeMenu, children: _jsxs(Box, { sx: { width: drawerWidth }, role: "presentation", children: [_jsx(List, { "aria-labelledby": "account-menu", disablePadding: true, children: userDetail ?
45
+ _jsxs(Fragment, { children: [_jsx(ListItem, { children: _jsx(ListItemText, { primary: userDetail.displayName.split("/")[0], secondary: userDetail.jobTitle }) }), _jsxs(ListItemButton, { onClick: logout, children: [_jsx(ListItemIcon, { children: _jsx(Logout, { color: "error" }) }), _jsx(ListItemText, { primary: t("Layout.Logout") })] })] })
48
46
  :
49
47
  _jsxs(ListItemButton, { onClick: login, children: [_jsx(ListItemIcon, { children: _jsx(Login, { color: "success" }) }), _jsx(ListItemText, { primary: t("Layout.LogIn") })] }) }), tab === "settings" && settings, tab === "theme" && theme, tab === "language" && language] }) })] }));
50
48
  }
@@ -1 +1 @@
1
- {"version":3,"file":"AccountMenu.js","sourceRoot":"","sources":["../../../../src/components/layout/AccountMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AccountCircle, ArrowBack, Brightness4, ChevronRight, DarkMode, LightMode, Login, Logout, SettingsBrightness, Translate } from \"@mui/icons-material\";\r\nimport { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu, PaletteMode, Typography } from \"@mui/material\";\r\nimport { grey } from \"@mui/material/colors\";\r\nimport { Fragment, useCallback, useRef, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { ExtendedUser } from \"../../models/User\";\r\nimport { persistStorage } from \"../../utils/PersistStorage\";\r\n\r\nconst drawerWidth = 240;\r\ntype TabType = \"settings\" | \"theme\" | \"language\";\r\n\r\ninterface AccountMenuProps {\r\n mode: PaletteMode | \"system\",\r\n setMode: (mode: PaletteMode | \"system\") => void,\r\n user: ExtendedUser\r\n}\r\n\r\nexport default function AccountMenu(props: AccountMenuProps) {\r\n const { mode, setMode, user } = props;\r\n const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\r\n const [tab, setTab] = useState<TabType>(\"settings\");\r\n const open = Boolean(anchorEl);\r\n const accountButtonElement = useRef<HTMLButtonElement>(null);\r\n const { t, i18n } = useTranslation();\r\n\r\n const changeLanguage = useCallback((newLanguage: \"en\" | \"cs\") => () => {\r\n i18n.changeLanguage(newLanguage)\r\n .finally(() => closeMenu());\r\n }, []);\r\n\r\n const changeMode = useCallback((newMode: PaletteMode | \"system\") => () => {\r\n setMode(newMode);\r\n closeMenu();\r\n persistStorage.set(\"mode\", newMode);\r\n }, []);\r\n\r\n const getNameInitials = (): string => {\r\n const splittedName: string[] = user.name.split(\" \");\r\n return `${splittedName[0][0]}${splittedName.length > 1 ? splittedName[1][0] : \"\"}`;\r\n };\r\n\r\n const openMenu = useCallback((e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => setAnchorEl(e.currentTarget), []);\r\n const closeMenu = useCallback(() => { setAnchorEl(null); setTimeout(() => setTab(\"settings\"), 300); }, []);\r\n\r\n const login = useCallback(() => {\r\n user.login()\r\n .catch(console.error);\r\n }, []);\r\n\r\n const logout = useCallback(() => {\r\n user.logout()\r\n .catch(console.error);\r\n }, []);\r\n\r\n const changeTab = useCallback((newTab: TabType) => () => setTab(newTab), []);\r\n\r\n const settings = (\r\n <List component=\"nav\" subheader={<ListSubheader sx={{ backgroundColor: \"transparent\" }}>{t(\"Layout.Settings\")}</ListSubheader>}>\r\n <ListItemButton onClick={changeTab(\"theme\")} sx={{ py: 0.3 }}>\r\n <ListItemIcon>\r\n <Brightness4 />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Appearance\")} secondary={t(`Layout.${mode.charAt(0).toUpperCase() + mode.slice(1)}`)} />\r\n <ChevronRight />\r\n </ListItemButton>\r\n\r\n <ListItemButton onClick={changeTab(\"language\")} sx={{ py: 0.3 }}>\r\n <ListItemIcon>\r\n <Translate />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Language\")} secondary={i18n.resolvedLanguage === \"en\" ? \"English\" : \"Čeština\"} />\r\n <ChevronRight />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n const theme = (\r\n <List subheader={\r\n <ListSubheader onClick={changeTab(\"settings\")} sx={{ backgroundColor: \"transparent\", display: \"flex\", alignItems: \"center\", px: 1, cursor: \"pointer\" }}>\r\n <IconButton size=\"small\" sx={{ mr: 0.5 }}>\r\n <ArrowBack fontSize=\"small\" />\r\n </IconButton> {t(\"Layout.Appearance\")}\r\n </ListSubheader>\r\n }>\r\n <ListItemButton onClick={changeMode(\"light\")} disabled={mode === \"light\"}>\r\n <ListItemIcon>\r\n <LightMode />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Light\")} />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeMode(\"dark\")} disabled={mode === \"dark\"}>\r\n <ListItemIcon>\r\n <DarkMode />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Dark\")} />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeMode(\"system\")} disabled={mode === \"system\"}>\r\n <ListItemIcon>\r\n <SettingsBrightness />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.System\")} />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n const language = (\r\n <List subheader={\r\n <ListSubheader onClick={changeTab(\"settings\")} sx={{ backgroundColor: \"transparent\", display: \"flex\", alignItems: \"center\", px: 1, cursor: \"pointer\" }}>\r\n <IconButton size=\"small\" sx={{ mr: 0.5 }}>\r\n <ArrowBack fontSize=\"small\" />\r\n </IconButton> {t(\"Layout.Language\")}\r\n </ListSubheader>\r\n }>\r\n <ListItemButton onClick={changeLanguage(\"en\")} disabled={i18n.resolvedLanguage === \"en\"}>\r\n <ListItemText primary=\"English\" />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeLanguage(\"cs\")} disabled={i18n.resolvedLanguage === \"cs\"}>\r\n <ListItemText primary=\"Čeština\" />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n return (\r\n <Fragment>\r\n <IconButton color=\"inherit\" onClick={openMenu} edge=\"end\" ref={accountButtonElement}>\r\n {user.name ?\r\n <Avatar sx={{ bgcolor: \"white\", color: grey[800], width: 32, height: 32, }}>\r\n <Typography variant=\"subtitle2\" sx={{ fontWeight: \"bold\", lineHeight: 0 }}>\r\n {getNameInitials()}\r\n </Typography>\r\n </Avatar>\r\n :\r\n <AccountCircle />\r\n }\r\n </IconButton>\r\n\r\n <Menu anchorEl={anchorEl} open={open} onClose={closeMenu}>\r\n <Box sx={{ width: drawerWidth }} role=\"presentation\">\r\n <List aria-labelledby=\"account-menu\">\r\n {user.name ?\r\n <Fragment>\r\n <ListItem>\r\n <ListItemText primary={user.name} secondary={\r\n <span>\r\n <span>{user.id}</span>\r\n <br />\r\n <span>{user.department}</span>\r\n </span>\r\n } />\r\n </ListItem>\r\n\r\n <ListItemButton onClick={logout}>\r\n <ListItemIcon><Logout color=\"error\" /></ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Logout\")} />\r\n </ListItemButton>\r\n </Fragment>\r\n :\r\n <ListItemButton onClick={login}>\r\n <ListItemIcon><Login color=\"success\" /></ListItemIcon>\r\n <ListItemText primary={t(\"Layout.LogIn\")} />\r\n </ListItemButton>\r\n }\r\n </List>\r\n\r\n {tab === \"settings\" && settings}\r\n {tab === \"theme\" && theme}\r\n {tab === \"language\" && language}\r\n </Box>\r\n </Menu>\r\n </Fragment>\r\n );\r\n}"]}
1
+ {"version":3,"file":"AccountMenu.js","sourceRoot":"","sources":["../../../../src/components/layout/AccountMenu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useIsAuthenticated, useMsal } from \"@azure/msal-react\";\r\nimport { AccountCircle, ArrowBack, Brightness4, ChevronRight, DarkMode, LightMode, Login, Logout, SettingsBrightness, Translate } from \"@mui/icons-material\";\r\nimport { Avatar, Box, IconButton, List, ListItem, ListItemButton, ListItemIcon, ListItemText, ListSubheader, Menu, PaletteMode } from \"@mui/material\";\r\nimport { useQuery, useQueryClient } from \"@tanstack/react-query\";\r\nimport { Fragment, useCallback, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { graphQueries } from \"../../hooks/UseUser\";\r\nimport { persistStorage } from \"../../utils/PersistStorage\";\r\n\r\nconst drawerWidth = 240;\r\ntype TabType = \"settings\" | \"theme\" | \"language\";\r\n\r\ninterface AccountMenuProps {\r\n mode: PaletteMode | \"system\",\r\n setMode: (mode: PaletteMode | \"system\") => void,\r\n}\r\n\r\nexport default function AccountMenu(props: AccountMenuProps) {\r\n const { mode, setMode } = props;\r\n const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\r\n const [tab, setTab] = useState<TabType>(\"settings\");\r\n const open = Boolean(anchorEl);\r\n const { t, i18n } = useTranslation();\r\n const { instance } = useMsal();\r\n const isAuthenticated = useIsAuthenticated();\r\n const queryClient = useQueryClient();\r\n\r\n const { data: userPhoto } = useQuery({ ...graphQueries.sessionUserPhoto(), enabled: isAuthenticated });\r\n const { data: userDetail } = useQuery({ ...graphQueries.sessionUserDetail(), enabled: open && isAuthenticated });\r\n\r\n\r\n const changeLanguage = useCallback((newLanguage: \"en\" | \"cs\") => () => {\r\n i18n.changeLanguage(newLanguage)\r\n .finally(() => closeMenu());\r\n }, []);\r\n\r\n const changeMode = useCallback((newMode: PaletteMode | \"system\") => () => {\r\n setMode(newMode);\r\n closeMenu();\r\n persistStorage.set(\"mode\", newMode);\r\n }, []);\r\n\r\n const openMenu = useCallback((e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => setAnchorEl(e.currentTarget), []);\r\n const closeMenu = useCallback(() => { setAnchorEl(null); setTimeout(() => setTab(\"settings\"), 300); }, []);\r\n\r\n const login = () => instance.loginRedirect();\r\n const logout = () => instance.logoutRedirect({\r\n postLogoutRedirectUri: \"/\",\r\n });\r\n\r\n const changeTab = useCallback((newTab: TabType) => () => setTab(newTab), []);\r\n\r\n const settings = (\r\n <List component=\"nav\" subheader={<ListSubheader sx={{ backgroundColor: \"transparent\" }}>{t(\"Layout.Settings\")}</ListSubheader>}>\r\n <ListItemButton onClick={changeTab(\"theme\")} sx={{ py: 0.3 }}>\r\n <ListItemIcon>\r\n <Brightness4 />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Appearance\")} secondary={t(`Layout.${mode.charAt(0).toUpperCase() + mode.slice(1)}`)} />\r\n <ChevronRight />\r\n </ListItemButton>\r\n\r\n <ListItemButton onClick={changeTab(\"language\")} sx={{ py: 0.3 }}>\r\n <ListItemIcon>\r\n <Translate />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Language\")} secondary={i18n.resolvedLanguage === \"en\" ? \"English\" : \"Čeština\"} />\r\n <ChevronRight />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n const theme = (\r\n <List subheader={\r\n <ListSubheader onClick={changeTab(\"settings\")} sx={{ backgroundColor: \"transparent\", display: \"flex\", alignItems: \"center\", px: 1, cursor: \"pointer\" }}>\r\n <IconButton size=\"small\" sx={{ mr: 0.5 }}>\r\n <ArrowBack fontSize=\"small\" />\r\n </IconButton> {t(\"Layout.Appearance\")}\r\n </ListSubheader>\r\n }>\r\n <ListItemButton onClick={changeMode(\"light\")} disabled={mode === \"light\"}>\r\n <ListItemIcon>\r\n <LightMode />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Light\")} />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeMode(\"dark\")} disabled={mode === \"dark\"}>\r\n <ListItemIcon>\r\n <DarkMode />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Dark\")} />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeMode(\"system\")} disabled={mode === \"system\"}>\r\n <ListItemIcon>\r\n <SettingsBrightness />\r\n </ListItemIcon>\r\n <ListItemText primary={t(\"Layout.System\")} />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n const language = (\r\n <List subheader={\r\n <ListSubheader onClick={changeTab(\"settings\")} sx={{ backgroundColor: \"transparent\", display: \"flex\", alignItems: \"center\", px: 1, cursor: \"pointer\" }}>\r\n <IconButton size=\"small\" sx={{ mr: 0.5 }}>\r\n <ArrowBack fontSize=\"small\" />\r\n </IconButton> {t(\"Layout.Language\")}\r\n </ListSubheader>\r\n }>\r\n <ListItemButton onClick={changeLanguage(\"en\")} disabled={i18n.resolvedLanguage === \"en\"}>\r\n <ListItemText primary=\"English\" />\r\n </ListItemButton>\r\n <ListItemButton onClick={changeLanguage(\"cs\")} disabled={i18n.resolvedLanguage === \"cs\"}>\r\n <ListItemText primary=\"Čeština\" />\r\n </ListItemButton>\r\n </List>\r\n );\r\n\r\n return (\r\n <Fragment>\r\n <IconButton\r\n size=\"small\"\r\n edge=\"end\"\r\n onClick={openMenu}\r\n onMouseEnter={() => queryClient.prefetchQuery(graphQueries.sessionUserDetail())}\r\n >\r\n {userPhoto ?\r\n <Avatar src={userPhoto} sx={{ width: { xs: 32, sm: 40 }, height: { xs: 32, sm: 40 } }} />\r\n :\r\n <AccountCircle sx={{ width: { xs: 32, sm: 40 }, height: { xs: 32, sm: 40 } }} />\r\n }\r\n </IconButton>\r\n\r\n <Menu anchorEl={anchorEl} open={open} onClose={closeMenu}>\r\n <Box sx={{ width: drawerWidth }} role=\"presentation\">\r\n <List aria-labelledby=\"account-menu\" disablePadding>\r\n {userDetail ?\r\n <Fragment>\r\n <ListItem>\r\n <ListItemText primary={userDetail.displayName.split(\"/\")[0]} secondary={userDetail.jobTitle} />\r\n </ListItem>\r\n\r\n <ListItemButton onClick={logout}>\r\n <ListItemIcon><Logout color=\"error\" /></ListItemIcon>\r\n <ListItemText primary={t(\"Layout.Logout\")} />\r\n </ListItemButton>\r\n </Fragment>\r\n :\r\n <ListItemButton onClick={login}>\r\n <ListItemIcon><Login color=\"success\" /></ListItemIcon>\r\n <ListItemText primary={t(\"Layout.LogIn\")} />\r\n </ListItemButton>\r\n }\r\n </List>\r\n\r\n {tab === \"settings\" && settings}\r\n {tab === \"theme\" && theme}\r\n {tab === \"language\" && language}\r\n </Box>\r\n </Menu>\r\n </Fragment>\r\n );\r\n}"]}
@@ -1,3 +1,4 @@
1
+ import { QueryClient } from "@tanstack/react-query";
1
2
  import { i18n, TFunction } from "i18next";
2
3
  import { ReactNode } from "react";
3
4
  import { LeftDrawerItem } from "../models/LeftDrawerItem";
@@ -11,6 +12,7 @@ interface LayoutContextInterface {
11
12
  i18n: i18n;
12
13
  }
13
14
  export declare const LayoutContext: import("react").Context<LayoutContextInterface>;
15
+ export declare const queryClient: QueryClient;
14
16
  declare module "moment" {
15
17
  interface Moment {
16
18
  formatDate(): string;
@@ -1,23 +1,20 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { MsalProvider } from "@azure/msal-react";
2
3
  import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
3
4
  import i18next from "i18next";
4
5
  import LanguageDetector from "i18next-browser-languagedetector";
5
6
  import I18NextHttpBackend from "i18next-http-backend";
6
7
  import moment from "moment";
7
- import { createContext, useCallback, useEffect, useMemo, useState } from "react";
8
+ import { createContext, useCallback, useMemo, useState } from "react";
8
9
  import { initReactI18next, useTranslation } from "react-i18next";
9
- import CenteredBox from "../components/common/CenteredBox";
10
10
  import Layout from "../components/Layout";
11
11
  import { LayoutSnackbar } from "../components/LayoutSnackbar";
12
- import { persistStorage } from "../utils/PersistStorage";
13
- import { initKeycloak } from "../utils/UserService";
14
- import { useUser } from "../utils/UseUser";
12
+ import { pca } from "../utils/Auth";
15
13
  import { SnackbarProvider } from "./SnackbarContext";
14
+ import { UserProvider } from "./UserContext";
16
15
  export const LayoutContext = createContext({});
17
- //User
18
- initKeycloak();
19
16
  //QueryClient
20
- const queryClient = new QueryClient({ defaultOptions: { queries: { enabled: false } } });
17
+ export const queryClient = new QueryClient({ defaultOptions: { queries: { enabled: false } } });
21
18
  //Localization
22
19
  i18next
23
20
  .use(initReactI18next)
@@ -38,31 +35,13 @@ moment.fn.formatDateTime = function () {
38
35
  export function LayoutProvider(props) {
39
36
  const [title, setTitle] = useState(props.title);
40
37
  const [snackbar, setSnackbar] = useState({});
41
- const [initialized, setInitialized] = useState(false);
42
38
  const { t, i18n } = useTranslation();
43
- const user = useUser();
44
- useEffect(() => setQueryClientDefaultOptions(), [user.loggedIn]);
45
- const setQueryClientDefaultOptions = () => {
46
- const storedKeycloak = persistStorage.getObject("keycloak");
47
- const enabled = storedKeycloak ? (storedKeycloak.autoLogin && user.loggedIn) || !storedKeycloak.autoLogin : false;
48
- setInitialized(enabled);
49
- queryClient.setDefaultOptions({
50
- queries: {
51
- enabled: enabled,
52
- refetchOnWindowFocus: false,
53
- onError: message => setSnackbar({ message: String(message), severity: "error" }),
54
- retry: 1
55
- },
56
- mutations: {
57
- onError: message => setSnackbar({ message: String(message), severity: "error" }),
58
- }
59
- });
60
- };
39
+ const [user, setUser] = useState({});
61
40
  const changeTitle = useCallback((newTitle) => {
62
41
  document.title = newTitle;
63
42
  setTitle(newTitle);
64
43
  }, []);
65
44
  const providerValue = useMemo(() => ({ changeTitle: changeTitle, snackbar: setSnackbar, user: user, t: t, i18n: i18n }), [changeTitle, setSnackbar, user, t, i18n]);
66
- return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(LayoutContext.Provider, { value: providerValue, children: _jsx(Layout, { title: title, appVersion: props.appVersion, primaryColor: props.primaryColor, secondaryColor: props.secondaryColor, backgroundColor: props.backgroundColor, leftDrawerItems: props.leftDrawerItems, user: user, initialized: initialized, children: _jsxs(SnackbarProvider, { snackbar: snackbar, setSnackbar: setSnackbar, children: [initialized ? props.children : _jsx(CenteredBox, { circularProgress: true }), _jsx(LayoutSnackbar, {})] }) }) }) }));
45
+ return (_jsx(MsalProvider, { instance: pca, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(UserProvider, { setUser: setUser, children: _jsx(LayoutContext.Provider, { value: providerValue, children: _jsx(Layout, { title: title, appVersion: props.appVersion, primaryColor: props.primaryColor, secondaryColor: props.secondaryColor, backgroundColor: props.backgroundColor, leftDrawerItems: props.leftDrawerItems, user: user, setSnackbar: setSnackbar, children: _jsxs(SnackbarProvider, { snackbar: snackbar, setSnackbar: setSnackbar, children: [props.children, _jsx(LayoutSnackbar, {})] }) }) }) }) }) }));
67
46
  }
68
47
  //# sourceMappingURL=LayoutContext.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"LayoutContext.js","sourceRoot":"","sources":["../../../src/contexts/LayoutContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import { QueryClient, QueryClientProvider } from \"@tanstack/react-query\";\r\nimport i18next, { i18n, TFunction } from \"i18next\";\r\nimport LanguageDetector from \"i18next-browser-languagedetector\";\r\nimport I18NextHttpBackend from \"i18next-http-backend\";\r\nimport moment from \"moment\";\r\nimport { createContext, ReactNode, useCallback, useEffect, useMemo, useState } from \"react\";\r\nimport { initReactI18next, useTranslation } from \"react-i18next\";\r\nimport CenteredBox from \"../components/common/CenteredBox\";\r\nimport Layout from \"../components/Layout\";\r\nimport { LayoutSnackbar } from \"../components/LayoutSnackbar\";\r\nimport KeycloakExtendedConfig from \"../models/KeycloakExtendedConfig\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport SnackbarModel from \"../models/SnackbarModel\";\r\nimport { User } from \"../models/User\";\r\nimport { persistStorage } from \"../utils/PersistStorage\";\r\nimport { initKeycloak } from \"../utils/UserService\";\r\nimport { useUser } from \"../utils/UseUser\";\r\nimport { SnackbarProvider } from \"./SnackbarContext\";\r\n\r\ninterface LayoutContextInterface {\r\n changeTitle: (title: string) => void,\r\n snackbar: (snackbar: SnackbarModel) => void,\r\n user: User,\r\n t: TFunction<\"translation\", undefined>,\r\n i18n: i18n\r\n}\r\n\r\nexport const LayoutContext = createContext({} as LayoutContextInterface);\r\n\r\n//User\r\ninitKeycloak();\r\n\r\n//QueryClient\r\nconst queryClient = new QueryClient({ defaultOptions: { queries: { enabled: false } } });\r\n\r\n//Localization\r\ni18next\r\n .use(initReactI18next)\r\n .use(LanguageDetector)\r\n .use(I18NextHttpBackend)\r\n .init({ fallbackLng: \"en\" });\r\n\r\nmoment.defaultFormat = \"YYYY-MM-DDTHH:mm:ss\";\r\n\r\ndeclare module \"moment\" {\r\n interface Moment {\r\n formatDate(): string;\r\n formatDateTime(): string;\r\n }\r\n}\r\n\r\nmoment.fn.formatDate = function (): string {\r\n if (!this.isValid()) return \"\";\r\n return this.format(\"YYYY-MM-DD\");\r\n};\r\n\r\nmoment.fn.formatDateTime = function (): string {\r\n if (!this.isValid()) return \"\";\r\n return this.format(\"YYYY-MM-DD HH:mm\");\r\n};\r\n\r\ninterface LayoutProviderProps {\r\n title: string,\r\n appVersion: string,\r\n leftDrawerItems: LeftDrawerItem[],\r\n primaryColor: string,\r\n secondaryColor: string,\r\n backgroundColor?: string,\r\n children: ReactNode\r\n}\r\n\r\nexport function LayoutProvider(props: LayoutProviderProps) {\r\n const [title, setTitle] = useState<string>(props.title);\r\n const [snackbar, setSnackbar] = useState<SnackbarModel>({} as SnackbarModel);\r\n const [initialized, setInitialized] = useState<boolean>(false);\r\n const { t, i18n } = useTranslation();\r\n const user = useUser();\r\n\r\n useEffect(() => setQueryClientDefaultOptions(), [user.loggedIn]);\r\n\r\n const setQueryClientDefaultOptions = () => {\r\n const storedKeycloak: KeycloakExtendedConfig | null = persistStorage.getObject<KeycloakExtendedConfig>(\"keycloak\");\r\n const enabled = storedKeycloak ? (storedKeycloak.autoLogin && user.loggedIn) || !storedKeycloak.autoLogin : false;\r\n setInitialized(enabled);\r\n\r\n queryClient.setDefaultOptions({\r\n queries: {\r\n enabled: enabled,\r\n refetchOnWindowFocus: false,\r\n onError: message => setSnackbar({ message: String(message), severity: \"error\" }),\r\n retry: 1\r\n },\r\n mutations: {\r\n onError: message => setSnackbar({ message: String(message), severity: \"error\" }),\r\n }\r\n });\r\n };\r\n\r\n const changeTitle = useCallback((newTitle: string) => {\r\n document.title = newTitle;\r\n setTitle(newTitle);\r\n }, []);\r\n\r\n const providerValue: LayoutContextInterface = useMemo(() => ({ changeTitle: changeTitle, snackbar: setSnackbar, user: user, t: t, i18n: i18n }), [changeTitle, setSnackbar, user, t, i18n]);\r\n\r\n return (\r\n <QueryClientProvider client={queryClient}>\r\n <LayoutContext.Provider value={providerValue}>\r\n <Layout title={title} appVersion={props.appVersion} primaryColor={props.primaryColor} secondaryColor={props.secondaryColor} backgroundColor={props.backgroundColor} leftDrawerItems={props.leftDrawerItems} user={user} initialized={initialized}>\r\n <SnackbarProvider snackbar={snackbar} setSnackbar={setSnackbar}>\r\n {initialized ? props.children : <CenteredBox circularProgress />}\r\n <LayoutSnackbar />\r\n </SnackbarProvider>\r\n </Layout>\r\n </LayoutContext.Provider>\r\n </QueryClientProvider>\r\n );\r\n}"]}
1
+ {"version":3,"file":"LayoutContext.js","sourceRoot":"","sources":["../../../src/contexts/LayoutContext.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MsalProvider } from \"@azure/msal-react\";\r\nimport { QueryClient, QueryClientProvider } from \"@tanstack/react-query\";\r\nimport i18next, { i18n, TFunction } from \"i18next\";\r\nimport LanguageDetector from \"i18next-browser-languagedetector\";\r\nimport I18NextHttpBackend from \"i18next-http-backend\";\r\nimport moment from \"moment\";\r\nimport { createContext, ReactNode, useCallback, useMemo, useState } from \"react\";\r\nimport { initReactI18next, useTranslation } from \"react-i18next\";\r\nimport Layout from \"../components/Layout\";\r\nimport { LayoutSnackbar } from \"../components/LayoutSnackbar\";\r\nimport { LeftDrawerItem } from \"../models/LeftDrawerItem\";\r\nimport SnackbarModel from \"../models/SnackbarModel\";\r\nimport { User } from \"../models/User\";\r\nimport { pca } from \"../utils/Auth\";\r\nimport { SnackbarProvider } from \"./SnackbarContext\";\r\nimport { UserProvider } from \"./UserContext\";\r\n\r\ninterface LayoutContextInterface {\r\n changeTitle: (title: string) => void,\r\n snackbar: (snackbar: SnackbarModel) => void,\r\n user: User,\r\n t: TFunction<\"translation\", undefined>,\r\n i18n: i18n\r\n}\r\n\r\nexport const LayoutContext = createContext({} as LayoutContextInterface);\r\n\r\n//QueryClient\r\nexport const queryClient = new QueryClient({ defaultOptions: { queries: { enabled: false } } });\r\n\r\n//Localization\r\ni18next\r\n .use(initReactI18next)\r\n .use(LanguageDetector)\r\n .use(I18NextHttpBackend)\r\n .init({ fallbackLng: \"en\" });\r\n\r\nmoment.defaultFormat = \"YYYY-MM-DDTHH:mm:ss\";\r\n\r\ndeclare module \"moment\" {\r\n interface Moment {\r\n formatDate(): string;\r\n formatDateTime(): string;\r\n }\r\n}\r\n\r\nmoment.fn.formatDate = function (): string {\r\n if (!this.isValid()) return \"\";\r\n return this.format(\"YYYY-MM-DD\");\r\n};\r\n\r\nmoment.fn.formatDateTime = function (): string {\r\n if (!this.isValid()) return \"\";\r\n return this.format(\"YYYY-MM-DD HH:mm\");\r\n};\r\n\r\ninterface LayoutProviderProps {\r\n title: string,\r\n appVersion: string,\r\n leftDrawerItems: LeftDrawerItem[],\r\n primaryColor: string,\r\n secondaryColor: string,\r\n backgroundColor?: string,\r\n children: ReactNode\r\n}\r\n\r\nexport function LayoutProvider(props: LayoutProviderProps) {\r\n const [title, setTitle] = useState<string>(props.title);\r\n const [snackbar, setSnackbar] = useState<SnackbarModel>({} as SnackbarModel);\r\n const { t, i18n } = useTranslation();\r\n const [user, setUser] = useState<User>({} as User);\r\n\r\n const changeTitle = useCallback((newTitle: string) => {\r\n document.title = newTitle;\r\n setTitle(newTitle);\r\n }, []);\r\n\r\n const providerValue: LayoutContextInterface = useMemo(() => ({ changeTitle: changeTitle, snackbar: setSnackbar, user: user, t: t, i18n: i18n }), [changeTitle, setSnackbar, user, t, i18n]);\r\n\r\n return (\r\n <MsalProvider instance={pca}>\r\n <QueryClientProvider client={queryClient}>\r\n <UserProvider setUser={setUser}>\r\n <LayoutContext.Provider value={providerValue}>\r\n <Layout title={title} appVersion={props.appVersion} primaryColor={props.primaryColor} secondaryColor={props.secondaryColor} backgroundColor={props.backgroundColor} leftDrawerItems={props.leftDrawerItems} user={user} setSnackbar={setSnackbar}>\r\n <SnackbarProvider snackbar={snackbar} setSnackbar={setSnackbar}>\r\n {props.children}\r\n <LayoutSnackbar />\r\n </SnackbarProvider>\r\n </Layout>\r\n </LayoutContext.Provider>\r\n </UserProvider>\r\n </QueryClientProvider>\r\n </MsalProvider>\r\n );\r\n}"]}
@@ -0,0 +1,21 @@
1
+ import { Dispatch, SetStateAction } from "react";
2
+ import { User } from "../models/User";
3
+ export declare const USER_DATA_FETCHED_EVENT = "userDataFetched";
4
+ export interface UserDataFetchedEvent {
5
+ user: Partial<User>;
6
+ }
7
+ export interface MicrosoftIdTokenPayload {
8
+ sub: string;
9
+ name: string;
10
+ mail: string;
11
+ groups?: Array<string>;
12
+ }
13
+ export declare function decodeJwt<T>(token: string): T;
14
+ export interface UserProviderProps {
15
+ setUser: Dispatch<SetStateAction<User>>;
16
+ children?: React.ReactNode;
17
+ }
18
+ export declare const UserProvider: ({ children, setUser }: UserProviderProps) => import("react/jsx-runtime").JSX.Element;
19
+ export interface UserContextValue {
20
+ }
21
+ export declare const UserContext: import("react").Context<null>;
@@ -0,0 +1,34 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { createContext, useEffect } from "react";
3
+ import { pca } from "../utils/Auth";
4
+ export const USER_DATA_FETCHED_EVENT = "userDataFetched";
5
+ export function decodeJwt(token) {
6
+ const base64Payload = token.split(".")[1];
7
+ const base64 = base64Payload.replace(/-/g, "+").replace(/_/g, "/");
8
+ const padding = base64.length % 4 === 0 ? "" : "=".repeat(4 - (base64.length % 4));
9
+ const payload = decodeURIComponent(atob(base64 + padding)
10
+ .split("")
11
+ .map((c) => "%" + ("00" + c.charCodeAt(0).toString(16)).slice(-2))
12
+ .join(""));
13
+ return JSON.parse(payload);
14
+ }
15
+ export const UserProvider = ({ children, setUser }) => {
16
+ const account = pca.getActiveAccount();
17
+ useEffect(() => {
18
+ var _a;
19
+ if (account === null || account === void 0 ? void 0 : account.idToken) {
20
+ const idTokenPayload = decodeJwt(account.idToken);
21
+ const userData = {
22
+ id: idTokenPayload.sub,
23
+ name: idTokenPayload.name.split("/")[0],
24
+ email: idTokenPayload.mail,
25
+ groups: (_a = idTokenPayload.groups) !== null && _a !== void 0 ? _a : [],
26
+ };
27
+ setUser(userData);
28
+ window.dispatchEvent(new CustomEvent(USER_DATA_FETCHED_EVENT, { detail: { user: userData } }));
29
+ }
30
+ }, [account === null || account === void 0 ? void 0 : account.idToken]);
31
+ return (_jsx(UserContext.Provider, { value: null, children: children }));
32
+ };
33
+ export const UserContext = createContext(null);
34
+ //# sourceMappingURL=UserContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UserContext.js","sourceRoot":"","sources":["../../../src/contexts/UserContext.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAA4B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE3E,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAEpC,MAAM,CAAC,MAAM,uBAAuB,GAAG,iBAAiB,CAAC;AAazD,MAAM,UAAU,SAAS,CAAI,KAAa;IACtC,MAAM,aAAa,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC;IAC1C,MAAM,MAAM,GAAG,aAAa,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,OAAO,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;IACnE,MAAM,OAAO,GAAG,MAAM,CAAC,MAAM,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;IACnF,MAAM,OAAO,GAAG,kBAAkB,CAC9B,IAAI,CAAC,MAAM,GAAG,OAAO,CAAC;SACjB,KAAK,CAAC,EAAE,CAAC;SACT,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;SACjE,IAAI,CAAC,EAAE,CAAC,CAChB,CAAC;IACF,OAAO,IAAI,CAAC,KAAK,CAAC,OAAO,CAAM,CAAC;AACpC,CAAC;AAOD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAAE,QAAQ,EAAE,OAAO,EAAqB,EAAE,EAAE;IACrE,MAAM,OAAO,GAAG,GAAG,CAAC,gBAAgB,EAAE,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;;QACX,IAAI,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,EAAE,CAAC;YACnB,MAAM,cAAc,GAAG,SAAS,CAA0B,OAAO,CAAC,OAAO,CAAC,CAAC;YAC3E,MAAM,QAAQ,GAAS;gBACnB,EAAE,EAAE,cAAc,CAAC,GAAG;gBACtB,IAAI,EAAE,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;gBACvC,KAAK,EAAE,cAAc,CAAC,IAAI;gBAC1B,MAAM,EAAE,MAAA,cAAc,CAAC,MAAM,mCAAI,EAAE;aACtC,CAAC;YACF,OAAO,CAAC,QAAQ,CAAC,CAAC;YAClB,MAAM,CAAC,aAAa,CAAC,IAAI,WAAW,CAAuB,uBAAuB,EAAE,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,CAAC,CAAC,CAAC;QACzH,CAAC;IACL,CAAC,EAAE,CAAC,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,OAAO,CAAC,CAAC,CAAC;IAEvB,OAAO,CACH,KAAC,WAAW,CAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,YAC5B,QAAQ,GACU,CAC1B,CAAC;AACN,CAAC,CAAC;AAIF,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC","sourcesContent":["import { createContext, Dispatch, SetStateAction, useEffect } from \"react\";\r\nimport { User } from \"../models/User\";\r\nimport { pca } from \"../utils/Auth\";\r\n\r\nexport const USER_DATA_FETCHED_EVENT = \"userDataFetched\";\r\n\r\nexport interface UserDataFetchedEvent {\r\n user: Partial<User>;\r\n}\r\n\r\nexport interface MicrosoftIdTokenPayload {\r\n sub: string;\r\n name: string;\r\n mail: string;\r\n groups?: Array<string>;\r\n}\r\n\r\nexport function decodeJwt<T>(token: string): T {\r\n const base64Payload = token.split(\".\")[1];\r\n const base64 = base64Payload.replace(/-/g, \"+\").replace(/_/g, \"/\");\r\n const padding = base64.length % 4 === 0 ? \"\" : \"=\".repeat(4 - (base64.length % 4));\r\n const payload = decodeURIComponent(\r\n atob(base64 + padding)\r\n .split(\"\")\r\n .map((c) => \"%\" + (\"00\" + c.charCodeAt(0).toString(16)).slice(-2))\r\n .join(\"\")\r\n );\r\n return JSON.parse(payload) as T;\r\n}\r\n\r\nexport interface UserProviderProps {\r\n setUser: Dispatch<SetStateAction<User>>;\r\n children?: React.ReactNode;\r\n}\r\n\r\nexport const UserProvider = ({ children, setUser }: UserProviderProps) => {\r\n const account = pca.getActiveAccount();\r\n\r\n useEffect(() => {\r\n if (account?.idToken) {\r\n const idTokenPayload = decodeJwt<MicrosoftIdTokenPayload>(account.idToken);\r\n const userData: User = {\r\n id: idTokenPayload.sub,\r\n name: idTokenPayload.name.split(\"/\")[0],\r\n email: idTokenPayload.mail,\r\n groups: idTokenPayload.groups ?? [],\r\n };\r\n setUser(userData);\r\n window.dispatchEvent(new CustomEvent<UserDataFetchedEvent>(USER_DATA_FETCHED_EVENT, { detail: { user: userData } }));\r\n }\r\n }, [account?.idToken]);\r\n\r\n return (\r\n <UserContext.Provider value={null}>\r\n {children}\r\n </UserContext.Provider>\r\n );\r\n};\r\n\r\nexport interface UserContextValue { }\r\n\r\nexport const UserContext = createContext(null);"]}
@@ -0,0 +1,5 @@
1
+ import { GraphUser } from "../models/User";
2
+ export declare const graphQueries: {
3
+ sessionUserDetail: () => import("@tanstack/react-query").WithRequired<import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UndefinedInitialDataOptions<GraphUser, unknown, GraphUser, string[]>, "suspense" | "useErrorBoundary" | "getPreviousPageParam" | "getNextPageParam">, "queryKey">;
4
+ sessionUserPhoto: () => import("@tanstack/react-query").WithRequired<import("@tanstack/react-query").OmitKeyof<import("@tanstack/react-query").UndefinedInitialDataOptions<Blob, unknown, string, string[]>, "suspense" | "useErrorBoundary" | "getPreviousPageParam" | "getNextPageParam">, "queryKey">;
5
+ };
@@ -0,0 +1,34 @@
1
+ import { queryOptions } from "@tanstack/react-query";
2
+ import axios from "axios";
3
+ import { getAccessToken } from "../utils/Auth";
4
+ const QUERY_KEY = "user";
5
+ const api = axios.create({
6
+ baseURL: "https://graph.microsoft.com/v1.0/",
7
+ });
8
+ api.interceptors.request.use(async (config) => {
9
+ config.headers.Authorization = `Bearer ${await getAccessToken(["User.Read"])}`;
10
+ return config;
11
+ });
12
+ export const graphQueries = {
13
+ sessionUserDetail: () => queryOptions({
14
+ queryKey: [QUERY_KEY, "me"],
15
+ queryFn: async () => await api.request({
16
+ method: "GET",
17
+ url: "/me?$select=displayName,jobTitle",
18
+ }).then(response => response.data),
19
+ staleTime: Infinity,
20
+ cacheTime: Infinity,
21
+ }),
22
+ sessionUserPhoto: () => queryOptions({
23
+ queryKey: [QUERY_KEY, "me", "photo"],
24
+ queryFn: async () => await api.request({
25
+ method: "GET",
26
+ url: "/me/photo/$value",
27
+ responseType: "blob",
28
+ }).then(response => response.data),
29
+ staleTime: Infinity,
30
+ cacheTime: Infinity,
31
+ select: data => URL.createObjectURL(data),
32
+ }),
33
+ };
34
+ //# sourceMappingURL=UseUser.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"UseUser.js","sourceRoot":"","sources":["../../../src/hooks/UseUser.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,SAAS,GAAG,MAAM,CAAC;AAEzB,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAC;IACrB,OAAO,EAAE,mCAAmC;CAC/C,CAAC,CAAC;AAEH,GAAG,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,EAAE,EAAE;IAC1C,MAAM,CAAC,OAAO,CAAC,aAAa,GAAG,UAAU,MAAM,cAAc,CAAC,CAAC,WAAW,CAAC,CAAC,EAAE,CAAC;IAC/E,OAAO,MAAM,CAAC;AAClB,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,YAAY,GAAG;IACxB,iBAAiB,EAAE,GAAG,EAAE,CACpB,YAAY,CAAC;QACT,QAAQ,EAAE,CAAC,SAAS,EAAE,IAAI,CAAC;QAC3B,OAAO,EAAE,KAAK,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,OAAO,CAAY;YAC9C,MAAM,EAAE,KAAK;YACb,GAAG,EAAE,kCAAkC;SAC1C,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;QAClC,SAAS,EAAE,QAAQ;QACnB,SAAS,EAAE,QAAQ;KACtB,CAAC;IACN,gBAAgB,EAAE,GAAG,EAAE,CACnB,YAAY,CAAC;QACT,QAAQ,EAAE,CAAC,SAAS,EAAE,IAAI,EAAE,OAAO,CAAC;QACpC,OAAO,EAAE,KAAK,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,OAAO,CAAO;YACzC,MAAM,EAAE,KAAK;YACb,GAAG,EAAE,kBAAkB;YACvB,YAAY,EAAE,MAAM;SACvB,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC;QAClC,SAAS,EAAE,QAAQ;QACnB,SAAS,EAAE,QAAQ;QACnB,MAAM,EAAE,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC;KAC5C,CAAC;CACT,CAAC","sourcesContent":["import { queryOptions } from \"@tanstack/react-query\";\r\nimport axios from \"axios\";\r\nimport { GraphUser } from \"../models/User\";\r\nimport { getAccessToken } from \"../utils/Auth\";\r\n\r\nconst QUERY_KEY = \"user\";\r\n\r\nconst api = axios.create({\r\n baseURL: \"https://graph.microsoft.com/v1.0/\",\r\n});\r\n\r\napi.interceptors.request.use(async (config) => {\r\n config.headers.Authorization = `Bearer ${await getAccessToken([\"User.Read\"])}`;\r\n return config;\r\n});\r\n\r\nexport const graphQueries = {\r\n sessionUserDetail: () =>\r\n queryOptions({\r\n queryKey: [QUERY_KEY, \"me\"],\r\n queryFn: async () => await api.request<GraphUser>({\r\n method: \"GET\",\r\n url: \"/me?$select=displayName,jobTitle\",\r\n }).then(response => response.data),\r\n staleTime: Infinity,\r\n cacheTime: Infinity,\r\n }),\r\n sessionUserPhoto: () =>\r\n queryOptions({\r\n queryKey: [QUERY_KEY, \"me\", \"photo\"],\r\n queryFn: async () => await api.request<Blob>({\r\n method: \"GET\",\r\n url: \"/me/photo/$value\",\r\n responseType: \"blob\",\r\n }).then(response => response.data),\r\n staleTime: Infinity,\r\n cacheTime: Infinity,\r\n select: data => URL.createObjectURL(data),\r\n }),\r\n};"]}