@campxdev/shared 0.5.21 → 0.5.22

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

@@ -1,87 +1,87 @@
-import {isDevelopment} from '../../../constants'
+import { isDevelopment } from '../../../constants'
 import {
-	campxSquareSmall,
-	examsSmall,
-	hostelSmall,
-	paySmall,
-	peopleSmall,
+  campxSquareSmall,
+  examsSmall,
+  hostelSmall,
+  paySmall,
+  peopleSmall,
 } 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',
-	},
+  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 Online Payments in the Campus',
-	},
-	...(isDevelopment
-		? [
-				{
-					title: 'PeopleX',
-					path: isDevelopment ? origins.people.dev : origins.people.prod,
-					icon: peopleSmall,
-					description: 'Manage People in the Campus',
-				},
-				{
-					title: 'HostelX',
-					path: isDevelopment ? origins.hostel.dev : origins.hostel.prod,
-					icon: hostelSmall,
-					description: 'Manage Hostels in the Campus',
-				},
-				{
-					title: 'CommuteX',
-					path: isDevelopment ? origins.commute.dev : origins.commute.prod,
-					icon: hostelSmall,
-					description: 'Manage Commute in the Campus',
-				},
-		  ]
-		: []),
-	// {
-	// 	title: 'EnrollX',
-	// 	path: '/hostel',
-	// 	icon:  enrollHeaderLogo,
-	// 	// description: 'Manage Admissions in the Campus',
-	// },
+  {
+    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 Online Payments in the Campus',
+  },
+  ...(isDevelopment
+    ? [
+        {
+          title: 'PeopleX',
+          path: isDevelopment ? origins.people.dev : origins.people.prod,
+          icon: peopleSmall,
+          description: 'Manage People in the Campus',
+        },
+        {
+          title: 'HostelX',
+          path: isDevelopment ? origins.hostel.dev : origins.hostel.prod,
+          icon: hostelSmall,
+          description: 'Manage Hostels in the Campus',
+        },
+        {
+          title: 'CommuteX',
+          path: isDevelopment ? origins.commute.dev : origins.commute.prod,
+          icon: hostelSmall,
+          description: 'Manage Commute in the Campus',
+        },
+      ]
+    : []),
+  // {
+  // 	title: 'EnrollX',
+  // 	path: '/hostel',
+  // 	icon:  enrollHeaderLogo,
+  // 	// description: 'Manage Admissions in the Campus',
+  // },
 ]

package/src/components/Layout/Header/assets/index.ts

@@ -10,14 +10,14 @@ import peopleSmall from './people_small.svg'
 import hostelSmall from './hostel_small.svg'
 
 export {
-	collegex,
-	enrollx,
-	examx,
-	payx,
-	peoplex,
-	campxSquareSmall,
-	examsSmall,
-	paySmall,
-	peopleSmall,
-	hostelSmall,
+  collegex,
+  enrollx,
+  examx,
+  payx,
+  peoplex,
+  campxSquareSmall,
+  examsSmall,
+  paySmall,
+  peopleSmall,
+  hostelSmall,
 }

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

@@ -1,98 +1,98 @@
 import {
-	alpha,
-	AppBar,
-	Box,
-	IconButton,
-	ListItemText,
-	styled,
-	Typography,
-	Link,
+  alpha,
+  AppBar,
+  Box,
+  IconButton,
+  ListItemText,
+  styled,
+  Typography,
+  Link,
 } from '@mui/material'
 
 export const StyledImageWrapper = styled('div')`
-	width: auto;
-	height: 24px;
-	& img {
-		width: 100%;
-		height: 100%;
-		object-fit: contain;
-	}
+  width: auto;
+  height: 24px;
+  & img {
+    width: 100%;
+    height: 100%;
+    object-fit: contain;
+  }
 `
 
-export const StyledItemText = styled(ListItemText)(({theme}) => ({
-	color: theme.palette.text.primary,
-	transition: '0.2s ease',
+export const StyledItemText = styled(ListItemText)(({ theme }) => ({
+  color: theme.palette.text.primary,
+  transition: '0.2s ease',
 }))
 
-export const StyledAppBar = styled(AppBar)(({theme}) => ({
-	backgroundColor: 'white',
-	boxShadow: '0px 8px 28px rgb(136,136,136, 0.3)',
+export const StyledAppBar = styled(AppBar)(({ theme }) => ({
+  backgroundColor: 'white',
+  boxShadow: '0px 8px 28px rgb(136,136,136, 0.3)',
 }))
 
-export const StyledHeader = styled(Box)(({theme}) => ({
-	boxShadow: '0px 2px 10px #0000001a',
-	backgroundColor: 'white',
-	display: 'flex',
-	alignItems: 'center',
-	justifyContent: 'space-between',
-	'& .actions': {
-		marginRight: '10px',
-		display: 'flex',
-		alignItems: 'center',
-		gap: '14px',
-	},
+export const StyledHeader = styled(Box)(({ theme }) => ({
+  boxShadow: '0px 2px 10px #0000001a',
+  backgroundColor: 'white',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'space-between',
+  '& .actions': {
+    marginRight: '10px',
+    display: 'flex',
+    alignItems: 'center',
+    gap: '14px',
+  },
 }))
 
-export const StyledUser = styled(Box)(({theme}) => ({
-	cursor: 'pointer',
-	borderRadius: '5px',
-	transition: 'background 0.2s ease',
-	padding: '5px 16px',
-	display: 'flex',
-	alignItems: 'center',
-	gap: '8px',
-	'&:hover': {
-		background: theme.palette.secondary.light,
-	},
+export const StyledUser = styled(Box)(({ theme }) => ({
+  cursor: 'pointer',
+  borderRadius: '5px',
+  transition: 'background 0.2s ease',
+  padding: '5px 16px',
+  display: 'flex',
+  alignItems: 'center',
+  gap: '8px',
+  '&:hover': {
+    background: theme.palette.secondary.light,
+  },
 }))
 
 export const StyledIconButton = styled(IconButton)({
-	padding: '20px',
-	backgroundColor: 'black',
-	display: 'flex',
-	alignItems: 'center',
-	justifyContent: 'center',
-	borderRadius: '0px',
+  padding: '20px',
+  backgroundColor: 'black',
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center',
+  borderRadius: '0px',
 })
 
 export const StyledLink = styled(Link)({
-	textDecoration: 'none',
+  textDecoration: 'none',
 })
 
-export const StyledDescription = styled(Typography)(({theme}) => ({
-	fontSize: '12px',
-	fontWeight: 600,
-	color: alpha(theme?.palette?.secondary?.lighter, 0.5),
+export const StyledDescription = styled(Typography)(({ theme }) => ({
+  fontSize: '12px',
+  fontWeight: 600,
+  color: alpha(theme?.palette?.secondary?.lighter, 0.5),
 }))
 
 export const StyledMenuItem = styled(Box)({
-	height: '64px',
-	width: '380px',
-	padding: '40px 20px',
-	transition: 'background ease 0.3s',
-	'&:hover': {
-		background: 'rgba(0, 0, 0, 0.03)',
-	},
-	display: 'flex',
-	alignItems: 'center',
-	gap: '20px',
+  height: '64px',
+  width: '380px',
+  padding: '40px 20px',
+  transition: 'background ease 0.3s',
+  '&:hover': {
+    background: 'rgba(0, 0, 0, 0.03)',
+  },
+  display: 'flex',
+  alignItems: 'center',
+  gap: '20px',
 })
 
-export const StyledMenuItemContainer = styled(Box)(({theme}) => ({
-	cursor: 'pointer',
-	borderBottom: `1px solid ${theme?.palette?.secondary?.lighter}`,
-	'&:last-of-type': {
-		border: 'none',
-	},
-	padding: '8px 0px',
+export const StyledMenuItemContainer = styled(Box)(({ theme }) => ({
+  cursor: 'pointer',
+  borderBottom: `1px solid ${theme?.palette?.secondary?.lighter}`,
+  '&:last-of-type': {
+    border: 'none',
+  },
+  padding: '8px 0px',
 }))

package/src/components/LayoutWrapper.tsx

@@ -1,12 +1,12 @@
 import {
   StyledLeftNavContainer,
   StyledMainContentContainer,
-} from "../layouts/Components/styles";
-import SideNav from "./SideNav";
+} from '../layouts/Components/styles'
+import SideNav from './SideNav'
 interface Props {
-  children?: React.ReactNode;
-  menu: any[];
-  sideMenuHeader?: React.ReactNode;
+  children?: React.ReactNode
+  menu: any[]
+  sideMenuHeader?: React.ReactNode
 }
 
 export default function LayoutWrapper({
@@ -21,5 +21,5 @@ export default function LayoutWrapper({
       </StyledLeftNavContainer>
       <StyledMainContentContainer>{children}</StyledMainContentContainer>
     </>
-  );
+  )
 }

package/src/components/LinearProgress.tsx

@@ -1,19 +1,19 @@
 import {
-	BoxProps,
-	styled,
-	Box,
-	LinearProgress as MuiLinearProgress,
+  BoxProps,
+  styled,
+  Box,
+  LinearProgress as MuiLinearProgress,
 } from '@mui/material'
 
 export const LinearProgress = styled((props: BoxProps) => (
-	<Box {...props}>
-		<MuiLinearProgress color={'inherit'} sx={{height: '4px'}} />
-	</Box>
-))(({theme}) => ({
-	width: '100%',
-	position: 'fixed',
-	top: 0,
-	left: 0,
-	zIndex: 400,
-	color: theme.palette.primary.main,
+  <Box {...props}>
+    <MuiLinearProgress color={'inherit'} sx={{ height: '4px' }} />
+  </Box>
+))(({ theme }) => ({
+  width: '100%',
+  position: 'fixed',
+  top: 0,
+  left: 0,
+  zIndex: 400,
+  color: theme.palette.primary.main,
 }))

package/src/components/ListItemButton.tsx

@@ -1,94 +1,94 @@
-import {ChevronRight} from '@mui/icons-material'
+import { ChevronRight } from '@mui/icons-material'
 import {
-	Box,
-	ListItemButton as MuiListItemButton,
-	ListItemButtonProps,
-	ListItemIcon,
-	ListItemText,
-	styled,
+  Box,
+  ListItemButton as MuiListItemButton,
+  ListItemButtonProps,
+  ListItemIcon,
+  ListItemText,
+  styled,
 } from '@mui/material'
-import {ReactNode} from 'react'
+import { ReactNode } from 'react'
 
 interface Props extends ListItemButtonProps {
-	hasChildren?: boolean
-	isActive?: boolean
-	label: String
-	icon?: any
+  hasChildren?: boolean
+  isActive?: boolean
+  label: String
+  icon?: any
 }
 
 export const ListItemButton = ({
-	isActive,
-	hasChildren,
-	onClick,
-	label,
-	icon: Icon,
+  isActive,
+  hasChildren,
+  onClick,
+  label,
+  icon: Icon,
 }: Props) => {
-	return (
-		<StyledListItemButton isActive={isActive} onClick={onClick}>
-			{Icon ? (
-				<ListItemIcon>{<Icon />}</ListItemIcon>
-			) : (
-				<Box minWidth={16}></Box>
-			)}
-			<ListItemText primary={label} />
-		</StyledListItemButton>
-	)
+  return (
+    <StyledListItemButton isActive={isActive} onClick={onClick}>
+      {Icon ? (
+        <ListItemIcon>{<Icon />}</ListItemIcon>
+      ) : (
+        <Box minWidth={16}></Box>
+      )}
+      <ListItemText primary={label} />
+    </StyledListItemButton>
+  )
 }
 
-export const StyledChevronIcon = styled(ChevronRight)<{open: boolean}>(
-	({theme, open}) => ({
-		transform: open ? 'rotate(90deg)' : 'rotate(0deg)',
-		transition: 'transform 0.2s ease-in-out',
-	})
+export const StyledChevronIcon = styled(ChevronRight)<{ open: boolean }>(
+  ({ theme, open }) => ({
+    transform: open ? 'rotate(90deg)' : 'rotate(0deg)',
+    transition: 'transform 0.2s ease-in-out',
+  }),
 )
 
 export const StyledListItemButton = styled(MuiListItemButton)<{
-	isActive: boolean
-	children: ReactNode
-	dropDown?: boolean
-}>(({theme, isActive, dropDown = false}) => ({
-	gap: '10px',
-	fontWeight: 'bold',
-	backgroundColor: isActive && '#1d1d1d',
-	'&:hover': {
-		backgroundColor: isActive && '#1d1d1d',
-	},
-	'&:after': {
-		content: '""',
-		position: 'absolute',
-		height: '100%',
-		left: 0,
-		top: 0,
-		width: isActive ? '5px' : 0,
-		opacity: isActive ? (dropDown ? 0 : 1) : 0,
-		transition: theme.transitions.create(['opacity', 'width']),
-		background: theme.palette.common.yellow,
-		borderTopRightRadius: '3px',
-		borderBottomRightRadius: '3px',
-	},
-	'&.MuiButton-endIcon, &.MuiButton-startIcon': {
-		transition: theme.transitions.create(['color']),
+  isActive: boolean
+  children: ReactNode
+  dropDown?: boolean
+}>(({ theme, isActive, dropDown = false }) => ({
+  gap: '10px',
+  fontWeight: 'bold',
+  backgroundColor: isActive && '#1d1d1d',
+  '&:hover': {
+    backgroundColor: isActive && '#1d1d1d',
+  },
+  '&:after': {
+    content: '""',
+    position: 'absolute',
+    height: '100%',
+    left: 0,
+    top: 0,
+    width: isActive ? '5px' : 0,
+    opacity: isActive ? (dropDown ? 0 : 1) : 0,
+    transition: theme.transitions.create(['opacity', 'width']),
+    background: theme.palette.common.yellow,
+    borderTopRightRadius: '3px',
+    borderBottomRightRadius: '3px',
+  },
+  '&.MuiButton-endIcon, &.MuiButton-startIcon': {
+    transition: theme.transitions.create(['color']),
 
-		'&.MuiSvgIcon-root': {
-			fontSize: 'inherit',
-			transition: 'none',
-		},
-	},
-	'& .MuiSvgIcon-root': {
-		fontSize: theme.typography.pxToRem(20),
-		marginRight: theme.spacing(1),
-		// color: isActive
-		//   ? theme.sidebar.menuItemColorActive
-		//   : theme.sidebar.menuItemIconColor,
-	},
-	'& .MuiTypography-root': {
-		color: theme.palette.common.white,
-	},
-	'& svg': {
-		color: theme.palette.common.white,
-	},
-	'& .MuiListItemIcon-root': {
-		minWidth: 0,
-		maxWidth: '1rem',
-	},
+    '&.MuiSvgIcon-root': {
+      fontSize: 'inherit',
+      transition: 'none',
+    },
+  },
+  '& .MuiSvgIcon-root': {
+    fontSize: theme.typography.pxToRem(20),
+    marginRight: theme.spacing(1),
+    // color: isActive
+    //   ? theme.sidebar.menuItemColorActive
+    //   : theme.sidebar.menuItemIconColor,
+  },
+  '& .MuiTypography-root': {
+    color: theme.palette.common.white,
+  },
+  '& svg': {
+    color: theme.palette.common.white,
+  },
+  '& .MuiListItemIcon-root': {
+    minWidth: 0,
+    maxWidth: '1rem',
+  },
 }))