@campxdev/shared 1.8.4 → 1.8.6

package/src/components/Layout/Header/AppsMenu.tsx

@@ -1,105 +1,105 @@
-import { Box, Menu, Typography } from '@mui/material'
-import Cookies from 'js-cookie'
-import { useState } from 'react'
-import { applications } from './applications'
-import { AppsIcon } from './icons'
-import {
-  StyledDescription,
-  StyledIconButton,
-  StyledMenuItem,
-  StyledMenuItemContainer,
-  StyledLink,
-  StyledImageBox,
-} from './styles'
-
-export const campxTenantKey = Cookies.get('campx_tenant')
-
-const AppsMenu = () => {
-  const [anchorEl, setAnchorEl] = useState<any>(null)
-  const open = Boolean(anchorEl)
-
-  const handleClick = (event) => {
-    setAnchorEl(event.currentTarget)
-  }
-
-  const handleClose = () => {
-    setAnchorEl(null)
-  }
-
-  return (
-    <>
-      <StyledIconButton onClick={handleClick}>
-        <AppsIcon />
-      </StyledIconButton>
-
-      <Menu
-        transitionDuration={150}
-        elevation={2}
-        id="basic-menu"
-        anchorEl={anchorEl}
-        open={open}
-        onClose={handleClose}
-        anchorOrigin={{
-          vertical: 'bottom',
-          horizontal: 'left',
-        }}
-        transformOrigin={{
-          vertical: 'top',
-          horizontal: 'left',
-        }}
-        TransitionProps={{
-          unmountOnExit: false,
-        }}
-        sx={{
-          '& .MuiPaper-root': {
-            left: '0 !important',
-            top: '64px !important',
-            '&>:last-child': {
-              paddingBottom: '0px',
-            },
-          },
-        }}
-      >
-        <Box sx={{ padding: '0.3rem 1rem' }}>
-          <Typography variant="body2">Switch to</Typography>
-        </Box>
-        <Box>
-          {applications.map((item, index) => (
-            <StyledLink
-              href={item.path + `/${campxTenantKey ?? ''}`}
-              key={index}
-            >
-              <StyledMenuItemContainer
-                key={index}
-                onClick={() => {
-                  window.location.href = item.path
-                  handleClose()
-                }}
-              >
-                <MenuItem data={item} />
-              </StyledMenuItemContainer>
-            </StyledLink>
-          ))}
-        </Box>
-      </Menu>
-    </>
-  )
-}
-
-export default AppsMenu
-
-const MenuItem = ({ data }) => {
-  return (
-    <StyledMenuItem>
-      <StyledImageBox>
-        <img src={data.icon} style={{ width: '20px', height: '20px' }} />
-      </StyledImageBox>
-      <Box>
-        <Typography variant="h1" sx={{ marginBottom: '7px' }}>
-          {data?.title}
-        </Typography>
-        <StyledDescription>{data?.description}</StyledDescription>
-      </Box>
-    </StyledMenuItem>
-  )
-}
+import { Box, Menu, Typography } from '@mui/material'
+import Cookies from 'js-cookie'
+import { useState } from 'react'
+import { applications } from './applications'
+import { AppsIcon } from './icons'
+import {
+  StyledDescription,
+  StyledIconButton,
+  StyledMenuItem,
+  StyledMenuItemContainer,
+  StyledLink,
+  StyledImageBox,
+} from './styles'
+
+export const campxTenantKey = Cookies.get('campx_tenant')
+
+const AppsMenu = () => {
+  const [anchorEl, setAnchorEl] = useState<any>(null)
+  const open = Boolean(anchorEl)
+
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget)
+  }
+
+  const handleClose = () => {
+    setAnchorEl(null)
+  }
+
+  return (
+    <>
+      <StyledIconButton onClick={handleClick}>
+        <AppsIcon />
+      </StyledIconButton>
+
+      <Menu
+        transitionDuration={150}
+        elevation={2}
+        id="basic-menu"
+        anchorEl={anchorEl}
+        open={open}
+        onClose={handleClose}
+        anchorOrigin={{
+          vertical: 'bottom',
+          horizontal: 'left',
+        }}
+        transformOrigin={{
+          vertical: 'top',
+          horizontal: 'left',
+        }}
+        TransitionProps={{
+          unmountOnExit: false,
+        }}
+        sx={{
+          '& .MuiPaper-root': {
+            left: '0 !important',
+            top: '64px !important',
+            '&>:last-child': {
+              paddingBottom: '0px',
+            },
+          },
+        }}
+      >
+        <Box sx={{ padding: '0.3rem 1rem' }}>
+          <Typography variant="body2">Switch to</Typography>
+        </Box>
+        <Box>
+          {applications.map((item, index) => (
+            <StyledLink
+              href={item.path + `/${campxTenantKey ?? ''}`}
+              key={index}
+            >
+              <StyledMenuItemContainer
+                key={index}
+                onClick={() => {
+                  window.location.href = item.path
+                  handleClose()
+                }}
+              >
+                <MenuItem data={item} />
+              </StyledMenuItemContainer>
+            </StyledLink>
+          ))}
+        </Box>
+      </Menu>
+    </>
+  )
+}
+
+export default AppsMenu
+
+const MenuItem = ({ data }) => {
+  return (
+    <StyledMenuItem>
+      <StyledImageBox>
+        <img src={data.icon} style={{ width: '20px', height: '20px' }} />
+      </StyledImageBox>
+      <Box>
+        <Typography variant="h1" sx={{ marginBottom: '7px' }}>
+          {data?.title}
+        </Typography>
+        <StyledDescription>{data?.description}</StyledDescription>
+      </Box>
+    </StyledMenuItem>
+  )
+}

package/src/components/Layout/Header/HeaderActions/CogWheelMenu.tsx

@@ -1,33 +1,33 @@
-import { SettingsOutlined } from '@mui/icons-material'
-import { IconButton } from '@mui/material'
-import { useHistory } from '../../../../hooks/useRouter'
-import DropDownButton from '../../../DropDownButton/DropDownButton'
-
-const CogWheelMenu = ({ menu }) => {
-  const history = useHistory()
-
-  return (
-    <DropDownButton
-      anchor={({ open }) => (
-        <IconButton color="secondary" onClick={open}>
-          <SettingsOutlined />
-        </IconButton>
-      )}
-      menu={menu?.map((item) => ({
-        label: item?.label,
-        onClick: () => {
-          history.push(item?.path)
-        },
-      }))}
-      menuProps={{
-        PaperProps: { sx: { top: '56px !important' } },
-        transformOrigin: {
-          horizontal: 'center',
-          vertical: 'top',
-        },
-      }}
-    />
-  )
-}
-
-export default CogWheelMenu
+import { SettingsOutlined } from '@mui/icons-material'
+import { IconButton } from '@mui/material'
+import { useHistory } from '../../../../hooks/useRouter'
+import DropDownButton from '../../../DropDownButton/DropDownButton'
+
+const CogWheelMenu = ({ menu }) => {
+  const history = useHistory()
+
+  return (
+    <DropDownButton
+      anchor={({ open }) => (
+        <IconButton color="secondary" onClick={open}>
+          <SettingsOutlined />
+        </IconButton>
+      )}
+      menu={menu?.map((item) => ({
+        label: item?.label,
+        onClick: () => {
+          history.push(item?.path)
+        },
+      }))}
+      menuProps={{
+        PaperProps: { sx: { top: '56px !important' } },
+        transformOrigin: {
+          horizontal: 'center',
+          vertical: 'top',
+        },
+      }}
+    />
+  )
+}
+
+export default CogWheelMenu

package/src/components/Layout/Header/HeaderActions/FreshDeskHelpButton.tsx

@@ -1,24 +1,24 @@
-import { HelpOutline } from '@mui/icons-material'
-import { Button } from '@mui/material'
-
-export default function FreshDeskHelpButton() {
-  const handleOpenFreshDeskWidget = () => {
-    try {
-      ;(window as any)?.openFreshDeskWidget()
-    } catch (error) {
-      // eslint-disable-next-line no-console
-      console.error('Error launching Freshdesk')
-    }
-  }
-  return (
-    <Button
-      variant="text"
-      color="secondary"
-      startIcon={<HelpOutline />}
-      onClick={handleOpenFreshDeskWidget}
-      sx={{ padding: '20px' }}
-    >
-      Help
-    </Button>
-  )
-}
+import { HelpOutline } from '@mui/icons-material'
+import { Button } from '@mui/material'
+
+export default function FreshDeskHelpButton() {
+  const handleOpenFreshDeskWidget = () => {
+    try {
+      ;(window as any)?.openFreshDeskWidget()
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.error('Error launching Freshdesk')
+    }
+  }
+  return (
+    <Button
+      variant="text"
+      color="secondary"
+      startIcon={<HelpOutline />}
+      onClick={handleOpenFreshDeskWidget}
+      sx={{ padding: '20px' }}
+    >
+      Help
+    </Button>
+  )
+}

package/src/components/Layout/Header/HeaderActions/HeaderActions.tsx

@@ -1,18 +1,18 @@
-import { Box } from '@mui/material'
-import UserBox from './UserBox'
-import CogWheelMenu from './CogWheelMenu'
-import FreshDeskHelpButton from './FreshDeskHelpButton'
-
-export default function HeaderActions({
-  cogWheelMenu,
-  fullName,
-  userBoxActions,
-}) {
-  return (
-    <>
-      <FreshDeskHelpButton />
-      {cogWheelMenu?.length ? <CogWheelMenu menu={cogWheelMenu} /> : null}
-      <UserBox fullName={fullName} actions={userBoxActions} />
-    </>
-  )
-}
+import { Box } from '@mui/material'
+import UserBox from './UserBox'
+import CogWheelMenu from './CogWheelMenu'
+import FreshDeskHelpButton from './FreshDeskHelpButton'
+
+export default function HeaderActions({
+  cogWheelMenu,
+  fullName,
+  userBoxActions,
+}) {
+  return (
+    <>
+      <FreshDeskHelpButton />
+      {cogWheelMenu?.length ? <CogWheelMenu menu={cogWheelMenu} /> : null}
+      <UserBox fullName={fullName} actions={userBoxActions} />
+    </>
+  )
+}

package/src/components/Layout/Header/HeaderActions/UserBox.tsx

@@ -1,56 +1,56 @@
-import { ExitToAppOutlined, HttpsOutlined } from '@mui/icons-material'
-import logout from '../../../../utils/logout'
-import ChangePassword from '../../../ChangePassword'
-import DropDownButton from '../../../DropDownButton/DropDownButton'
-import { IMenuItemProps } from '../../../DropDownButton/DropdownMenuItem'
-import { StyledAvatar } from '../styles'
-
-const getStartingLetters = (text: string) => {
-  if (!text) return ''
-  return text
-    .split(' ')
-    ?.map((w) => w[0])
-    ?.join('')
-}
-
-export default function UserBox({
-  fullName,
-  actions,
-  customActions = [],
-}: {
-  fullName: string
-  actions: IMenuItemProps[] | []
-  customActions?: IMenuItemProps[] | []
-}) {
-  return (
-    <DropDownButton
-      anchor={({ open }) => (
-        <StyledAvatar onClick={open}>
-          {getStartingLetters(fullName)}
-        </StyledAvatar>
-      )}
-      menu={
-        customActions?.length
-          ? customActions
-          : [
-              ...actions,
-              {
-                label: 'Change Password',
-                actionType: 'dialog',
-                icon: <HttpsOutlined />,
-                content: ({ close }) => <ChangePassword close={close} />,
-                contentTitle: 'Change Password',
-              },
-              {
-                label: 'Logout',
-                icon: <ExitToAppOutlined />,
-                onClick: logout,
-              },
-            ]
-      }
-      menuProps={{
-        PaperProps: { sx: { top: '56px !important' } },
-      }}
-    />
-  )
-}
+import { ExitToAppOutlined, HttpsOutlined } from '@mui/icons-material'
+import logout from '../../../../utils/logout'
+import ChangePassword from '../../../ChangePassword'
+import DropDownButton from '../../../DropDownButton/DropDownButton'
+import { IMenuItemProps } from '../../../DropDownButton/DropdownMenuItem'
+import { StyledAvatar } from '../styles'
+
+const getStartingLetters = (text: string) => {
+  if (!text) return ''
+  return text
+    .split(' ')
+    ?.map((w) => w[0])
+    ?.join('')
+}
+
+export default function UserBox({
+  fullName,
+  actions,
+  customActions = [],
+}: {
+  fullName: string
+  actions: IMenuItemProps[] | []
+  customActions?: IMenuItemProps[] | []
+}) {
+  return (
+    <DropDownButton
+      anchor={({ open }) => (
+        <StyledAvatar onClick={open}>
+          {getStartingLetters(fullName)}
+        </StyledAvatar>
+      )}
+      menu={
+        customActions?.length
+          ? customActions
+          : [
+              ...actions,
+              {
+                label: 'Change Password',
+                actionType: 'dialog',
+                icon: <HttpsOutlined />,
+                content: ({ close }) => <ChangePassword close={close} />,
+                contentTitle: 'Change Password',
+              },
+              {
+                label: 'Logout',
+                icon: <ExitToAppOutlined />,
+                onClick: logout,
+              },
+            ]
+      }
+      menuProps={{
+        PaperProps: { sx: { top: '56px !important' } },
+      }}
+    />
+  )
+}

package/src/components/Layout/Header/Notification.tsx

@@ -1,13 +1,13 @@
-import { IconButton } from '@mui/material'
-import { NotificationIcon } from './icons'
-
-function Notification() {
-  return (
-    <>
-      <IconButton>
-        <NotificationIcon />
-      </IconButton>
-    </>
-  )
-}
-export default Notification
+import { IconButton } from '@mui/material'
+import { NotificationIcon } from './icons'
+
+function Notification() {
+  return (
+    <>
+      <IconButton>
+        <NotificationIcon />
+      </IconButton>
+    </>
+  )
+}
+export default Notification