@campxdev/shared 1.6.1 → 1.6.3

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

@@ -1,102 +1,102 @@
-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={3}
-        id="basic-menu"
-        anchorEl={anchorEl}
-        open={open}
-        onClose={handleClose}
-        anchorOrigin={{
-          vertical: 'bottom',
-          horizontal: 'left',
-        }}
-        transformOrigin={{
-          vertical: 'top',
-          horizontal: 'left',
-        }}
-        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={3}
+        id="basic-menu"
+        anchorEl={anchorEl}
+        open={open}
+        onClose={handleClose}
+        anchorOrigin={{
+          vertical: 'bottom',
+          horizontal: 'left',
+        }}
+        transformOrigin={{
+          vertical: 'top',
+          horizontal: 'left',
+        }}
+        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/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: '64px !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: '64px !important' } },
+        transformOrigin: {
+          horizontal: 'center',
+          vertical: 'top',
+        },
+      }}
+    />
+  )
+}
+
+export default CogWheelMenu

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

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

@@ -1,70 +1,61 @@
-import {
-  ConfirmationNumberOutlined,
-  ExitToAppOutlined,
-  HttpsOutlined,
-} from '@mui/icons-material'
-import ConfirmationNumberOutlinedIcon from '@mui/icons-material/ConfirmationNumberOutlined'
-import { ReactNode } from 'react'
-import logout from '../../../utils/logout'
-import ChangePassword from '../../ChangePassword'
-import DropDownButton from '../../DropDownButton/DropDownButton'
-import { IMenuItemProps } from '../../DropDownButton/DropdownMenuItem'
-import { DialogButton } from '../../ModalButtons'
-import MyTickets from '../Tickets/MyTickets'
-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,
-}: {
-  fullName: string
-  actions: IMenuItemProps[] | []
-}) {
-  return (
-    <>
-      <DropDownButton
-        anchor={({ open }) => (
-          <StyledAvatar onClick={open}>
-            {getStartingLetters(fullName)}
-          </StyledAvatar>
-        )}
-        menu={[
-          ...actions,
-          {
-            label: 'My Tickets',
-            actionType: 'dialog',
-            content: ({ close }) => <MyTickets close={close} />,
-            contentTitle: 'My Tickets',
-            icon: <ConfirmationNumberOutlined />,
-            dialogProps: {
-              maxWidth: 'xl',
-            },
-          },
-          {
-            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: '64px !important' } },
-        }}
-      />
-    </>
-  )
-}
+import {
+  ConfirmationNumberOutlined,
+  ExitToAppOutlined,
+  HttpsOutlined,
+} from '@mui/icons-material'
+import ConfirmationNumberOutlinedIcon from '@mui/icons-material/ConfirmationNumberOutlined'
+import { ReactNode } from 'react'
+import logout from '../../../utils/logout'
+import ChangePassword from '../../ChangePassword'
+import DropDownButton from '../../DropDownButton/DropDownButton'
+import { IMenuItemProps } from '../../DropDownButton/DropdownMenuItem'
+import { DialogButton } from '../../ModalButtons'
+import MyTickets from '../Tickets/MyTickets'
+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,
+}: {
+  fullName: string
+  actions: IMenuItemProps[] | []
+}) {
+  return (
+    <>
+      <DropDownButton
+        anchor={({ open }) => (
+          <StyledAvatar onClick={open}>
+            {getStartingLetters(fullName)}
+          </StyledAvatar>
+        )}
+        menu={[
+          ...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: '64px !important' } },
+        }}
+      />
+    </>
+  )
+}

package/src/components/Layout/Header/applications.ts

@@ -1,91 +1,91 @@
-import { isDevelopment } from '../../../constants'
-import {
-  campxSquareSmall,
-  examsSmall,
-  hostelSmall,
-  paySmall,
-  peopleSmall,
-  commuteSmall,
-} from './assets'
-
-const origins = {
-  ums: {
-    dev: 'https://ums.campx.dev',
-    prod: 'https://ums.campx.in',
-  },
-  payments: {
-    dev: 'https://payments.campx.dev',
-    prod: 'https://payments.campx.in',
-  },
-  exams: {
-    dev: 'https://exams.campx.dev',
-    prod: 'https://exams.campx.in',
-  },
-  people: {
-    dev: 'https://people.campx.dev',
-    prod: 'https://people.campx.in',
-  },
-  hostel: {
-    dev: 'https://hostel.campx.dev',
-    prod: 'https://hostel.campx.in',
-  },
-  commute: {
-    dev: 'https://commute.campx.dev',
-    prod: 'https://commute.campx.in',
-  },
-}
-
-export const applications = [
-  {
-    title: 'CollegeX',
-    path: isDevelopment ? origins.ums.dev : origins.ums.prod,
-    icon: campxSquareSmall,
-    key: 'ums',
-    description: 'Manage Complete Campus Activities',
-  },
-  {
-    title: 'ExamX',
-    key: 'exams',
-    path: isDevelopment ? origins.exams.dev : origins.exams.prod,
-    icon: examsSmall,
-    description: 'Manage all Examinations in the Campus',
-  },
-  {
-    title: 'PayX',
-    key: 'payments',
-    path: isDevelopment ? origins.payments.dev : origins.payments.prod,
-    icon: paySmall,
-    description: 'Manage Payments in the Campus',
-  },
-  {
-    title: 'HostelX',
-    key: 'hostel',
-    path: isDevelopment ? origins.hostel.dev : origins.hostel.prod,
-    icon: hostelSmall,
-    description: 'Manage Hostels in the Campus',
-  },
-  {
-    title: 'CommuteX',
-    key: 'commute',
-    path: isDevelopment ? origins.commute.dev : origins.commute.prod,
-    icon: commuteSmall,
-    description: 'Manage Commute in the Campus',
-  },
-  ...(isDevelopment
-    ? [
-        {
-          title: 'PeopleX',
-          key: 'people',
-          path: isDevelopment ? origins.people.dev : origins.people.prod,
-          icon: peopleSmall,
-          description: 'Manage People in the Campus',
-        },
-      ]
-    : []),
-  // {
-  // 	title: 'EnrollX',
-  // 	path: '/hostel',
-  // 	icon:  enrollHeaderLogo,
-  // 	// description: 'Manage Admissions in the Campus',
-  // },
-]
+import { isDevelopment } from '../../../constants'
+import {
+  campxSquareSmall,
+  examsSmall,
+  hostelSmall,
+  paySmall,
+  peopleSmall,
+  commuteSmall,
+} from './assets'
+
+const origins = {
+  ums: {
+    dev: 'https://ums.campx.dev',
+    prod: 'https://ums.campx.in',
+  },
+  payments: {
+    dev: 'https://payments.campx.dev',
+    prod: 'https://payments.campx.in',
+  },
+  exams: {
+    dev: 'https://exams.campx.dev',
+    prod: 'https://exams.campx.in',
+  },
+  people: {
+    dev: 'https://people.campx.dev',
+    prod: 'https://people.campx.in',
+  },
+  hostel: {
+    dev: 'https://hostel.campx.dev',
+    prod: 'https://hostel.campx.in',
+  },
+  commute: {
+    dev: 'https://commute.campx.dev',
+    prod: 'https://commute.campx.in',
+  },
+}
+
+export const applications = [
+  {
+    title: 'CollegeX',
+    path: isDevelopment ? origins.ums.dev : origins.ums.prod,
+    icon: campxSquareSmall,
+    key: 'ums',
+    description: 'Manage Complete Campus Activities',
+  },
+  {
+    title: 'ExamX',
+    key: 'exams',
+    path: isDevelopment ? origins.exams.dev : origins.exams.prod,
+    icon: examsSmall,
+    description: 'Manage all Examinations in the Campus',
+  },
+  {
+    title: 'PayX',
+    key: 'payments',
+    path: isDevelopment ? origins.payments.dev : origins.payments.prod,
+    icon: paySmall,
+    description: 'Manage Payments in the Campus',
+  },
+  {
+    title: 'HostelX',
+    key: 'hostel',
+    path: isDevelopment ? origins.hostel.dev : origins.hostel.prod,
+    icon: hostelSmall,
+    description: 'Manage Hostels in the Campus',
+  },
+  {
+    title: 'CommuteX',
+    key: 'commute',
+    path: isDevelopment ? origins.commute.dev : origins.commute.prod,
+    icon: commuteSmall,
+    description: 'Manage Commute in the Campus',
+  },
+  ...(isDevelopment
+    ? [
+        {
+          title: 'PeopleX',
+          key: 'people',
+          path: isDevelopment ? origins.people.dev : origins.people.prod,
+          icon: peopleSmall,
+          description: 'Manage People in the Campus',
+        },
+      ]
+    : []),
+  // {
+  // 	title: 'EnrollX',
+  // 	path: '/hostel',
+  // 	icon:  enrollHeaderLogo,
+  // 	// description: 'Manage Admissions in the Campus',
+  // },
+]

package/src/components/Layout/Header/assets/campx_square_small.svg

@@ -1,9 +1,9 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="35" height="35" viewBox="0 0 35 35">
-  <defs>
-    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
-      <stop offset="0" stop-color="#596e79"/>
-      <stop offset="1" stop-color="#7c909b"/>
-    </linearGradient>
-  </defs>
-  <path id="Subtraction_7" data-name="Subtraction 7" d="M-5678.321,8264.99h-13.18v-13.234h6.563v6.672h6.617v6.563Zm21.82,0h-13.18v-6.562h6.617v-6.672h6.563v13.234Zm0-21.875h-6.562v-6.562h-6.617v-6.562h13.18v13.125Zm-28.437,0h-6.562V8229.99h13.18v6.563h-6.617v6.563Z" transform="translate(5691.501 -8229.99)" fill="url(#linear-gradient)"/>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="35" height="35" viewBox="0 0 35 35">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#596e79"/>
+      <stop offset="1" stop-color="#7c909b"/>
+    </linearGradient>
+  </defs>
+  <path id="Subtraction_7" data-name="Subtraction 7" d="M-5678.321,8264.99h-13.18v-13.234h6.563v6.672h6.617v6.563Zm21.82,0h-13.18v-6.562h6.617v-6.672h6.563v13.234Zm0-21.875h-6.562v-6.562h-6.617v-6.562h13.18v13.125Zm-28.437,0h-6.562V8229.99h13.18v6.563h-6.617v6.563Z" transform="translate(5691.501 -8229.99)" fill="url(#linear-gradient)"/>
 </svg>

package/src/components/Layout/Header/assets/commutex.svg

@@ -1,14 +1,14 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="164.636" height="30" viewBox="0 0 164.636 30">
-  <defs>
-    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
-      <stop offset="0" stop-color="#6a2886"/>
-      <stop offset="1" stop-color="#8234a4"/>
-    </linearGradient>
-  </defs>
-  <g id="Group_4626" data-name="Group 4626" transform="translate(-154.491 -25)">
-    <text id="COMMUTEX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">COMMUTEX</tspan></text>
-    <g id="Group_4542" data-name="Group 4542" transform="translate(1.791 -224.981)">
-      <path id="Union_49" data-name="Union 49" d="M14.451,30l-3.59-4.941L7.271,30H.073L0,29.947,10.177,15.939H.007V14.064H10.226L3.657,5.031v0L0,0V0H7.312L10.9,4.941,14.492,0h7.2l.073.053L11.584,14.064H21.757v1.875H11.54l6.566,9.03v0L21.763,30v0Z" transform="translate(152.7 249.981)" fill="url(#linear-gradient)"/>
-    </g>
-  </g>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="164.636" height="30" viewBox="0 0 164.636 30">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#6a2886"/>
+      <stop offset="1" stop-color="#8234a4"/>
+    </linearGradient>
+  </defs>
+  <g id="Group_4626" data-name="Group 4626" transform="translate(-154.491 -25)">
+    <text id="COMMUTEX" transform="translate(186.127 47.5)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">COMMUTEX</tspan></text>
+    <g id="Group_4542" data-name="Group 4542" transform="translate(1.791 -224.981)">
+      <path id="Union_49" data-name="Union 49" d="M14.451,30l-3.59-4.941L7.271,30H.073L0,29.947,10.177,15.939H.007V14.064H10.226L3.657,5.031v0L0,0V0H7.312L10.9,4.941,14.492,0h7.2l.073.053L11.584,14.064H21.757v1.875H11.54l6.566,9.03v0L21.763,30v0Z" transform="translate(152.7 249.981)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>