@campxdev/shared 0.3.19 → 0.4.1

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 (19) hide show
  1. package/package.json +1 -1
  2. package/src/components/ChangePassword.tsx +26 -8
  3. package/src/components/Layout/Header/AppHeader.tsx +98 -104
  4. package/src/components/Layout/Header/AppsMenu.tsx +18 -11
  5. package/src/components/Layout/Header/applications.tsx +68 -54
  6. package/src/components/Layout/Header/assets/CampxHeader.svg +14 -0
  7. package/src/components/Layout/Header/assets/campx.png +0 -0
  8. package/src/components/Layout/Header/assets/campx.svg +29 -0
  9. package/src/components/Layout/Header/assets/enrollxHeader.svg +14 -0
  10. package/src/components/Layout/Header/assets/examxHeader.svg +17 -0
  11. package/src/components/Layout/Header/assets/hostelxHeader.svg +18 -0
  12. package/src/components/Layout/Header/assets/index.ts +24 -6
  13. package/src/components/Layout/Header/assets/newexamx.png +0 -0
  14. package/src/components/Layout/Header/assets/newpayx.png +0 -0
  15. package/src/components/Layout/Header/assets/payxHeader.svg +21 -0
  16. package/src/components/Layout/Header/assets/peoplexHeader.svg +14 -0
  17. package/src/components/Layout/Header/styles.tsx +14 -7
  18. package/src/components/SideNav.tsx +1 -0
  19. package/src/hooks/useAuth.ts +72 -67
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@campxdev/shared",
3
- "version": "0.3.19",
3
+ "version": "0.4.1",
4
4
  "main": "./exports.ts",
5
5
  "scripts": {
6
6
  "start": "react-scripts start",
package/src/components/ChangePassword.tsx CHANGED
@@ -9,6 +9,7 @@ import {
9
9
  styled,
10
10
  Typography,
11
11
  } from "@mui/material";
12
+ import { isDevelopment } from "../constants/isDevelopment";
12
13
  import CloseIcon from "@mui/icons-material/Close";
13
14
  import { Visibility, VisibilityOff } from "@mui/icons-material";
14
15
  import React, { useState } from "react";
@@ -36,17 +37,34 @@ function ChangePassword(props: DialogProps) {
36
37
  confirmPassword: false,
37
38
  });
38
39
  const [isLoading, setIsLoading] = useState(false);
39
- const { handleSubmit, control } = useForm();
40
+ const { handleSubmit, control, reset } = useForm();
40
41
  const onSubmit = async (formData) => {
41
42
  setIsLoading(true);
42
- try {
43
- await axios.post("/auth/change-password", formData);
44
- toast.success("Password Changed Successfully");
43
+ const { oldPassword, newPassword, confirmPassword } = formData;
44
+ if (newPassword === confirmPassword) {
45
+ try {
46
+ await axios.post(
47
+ isDevelopment
48
+ ? "https://auth-api.campx.dev/auth/change-password"
49
+ : "https://auth-api.campx.in/auth/change-password",
50
+ {
51
+ oldPassword,
52
+ newPassword,
53
+ }
54
+ );
55
+ toast.success("Password Changed Successfully");
56
+ setIsLoading(false);
57
+ reset();
58
+ handleClose();
59
+ } catch (error) {
60
+ axiosErrorToast(error);
61
+ setIsLoading(false);
62
+ reset();
63
+ handleClose();
64
+ }
65
+ } else {
66
+ toast.error("New Password, Confirm Password must be same");
45
67
  setIsLoading(false);
46
- handleClose();
47
- } catch (error) {
48
- axiosErrorToast(error);
49
- handleClose();
50
68
  }
51
69
  };
52
70
 
package/src/components/Layout/Header/AppHeader.tsx CHANGED
@@ -1,119 +1,113 @@
1
- import { Box, styled, Typography } from "@mui/material";
2
- import { ReactNode } from "react";
3
- import { Link } from "react-router-dom";
4
- import { campxLogoPrimary } from "../../../assets/images";
5
- import { isDevelopment } from "../../../constants/isDevelopment";
6
- import { applications } from "./applications";
7
- import AppsMenu from "./AppsMenu";
8
- import { collegex, enrollx, examx, payx, peoplex } from "./assets";
9
- import CogWheelMenu from "./CogWheelMenu";
10
- import FreshDeskHelpButton from "./FreshDeskHelpButton";
11
- import Notification from "./Notification";
12
- import { StyledHeader, StyledImageWrapper } from "./styles";
13
- import UserBox from "./UserBox";
1
+ import {Box, styled, Typography} from '@mui/material'
2
+ import {ReactNode} from 'react'
3
+ import {Link} from 'react-router-dom'
4
+ import {isDevelopment} from '../../../constants/isDevelopment'
5
+ import {applications} from './applications'
6
+ import AppsMenu from './AppsMenu'
7
+ import {collegex, enrollx, examx, payx, peoplex} from './assets'
8
+ import CogWheelMenu from './CogWheelMenu'
9
+ import FreshDeskHelpButton from './FreshDeskHelpButton'
10
+ import Notification from './Notification'
11
+ import {StyledHeader, StyledImageWrapper} from './styles'
12
+ import UserBox from './UserBox'
14
13
 
15
14
  const StyledLogosWrapper = styled(Box)(() => ({
16
- display: "flex",
17
- alignItems: "center",
18
- gap: "10px",
19
- padding: "10px",
20
- transition: "background ease 0.3s",
21
- borderRadius: "5px",
22
- "&:hover": {
23
- background: "rgba(0, 0, 0, 0.05)",
24
- },
25
- }));
15
+ display: 'flex',
16
+ alignItems: 'center',
17
+ gap: '10px',
18
+ padding: '10px',
19
+ transition: 'background ease 0.3s',
20
+ borderRadius: '5px',
21
+ '&:hover': {
22
+ background: 'rgba(0, 0, 0, 0.05)',
23
+ },
24
+ }))
26
25
 
27
26
  const StyledLink = styled(Link)(() => ({
28
- textDecoration: "none",
29
- }));
27
+ textDecoration: 'none',
28
+ }))
30
29
 
31
30
  const imageMap = {
32
- ums: collegex,
33
- enroll: enrollx,
34
- exams: examx,
35
- payments: payx,
36
- peoplex: peoplex,
37
- campx: campxLogoPrimary,
38
- };
31
+ ums: collegex,
32
+ enroll: enrollx,
33
+ exams: examx,
34
+ payments: payx,
35
+ peoplex: peoplex,
36
+ campx: collegex,
37
+ }
39
38
 
40
39
  interface AppHeaderProps {
41
- clientLogo: string;
42
- username: string;
43
- profileIcon: string;
44
- permissions?: any;
45
- userBoxActions: {
46
- label: ReactNode;
47
- icon?: ReactNode;
48
- onClick: any;
49
- }[];
50
- cogWheelMenu?: { label: string; path: string }[];
40
+ clientLogo: string
41
+ username: string
42
+ profileIcon: string
43
+ permissions?: any
44
+ userBoxActions: {
45
+ label: ReactNode
46
+ icon?: ReactNode
47
+ onClick: any
48
+ }[]
49
+ cogWheelMenu?: {label: string; path: string}[]
51
50
  }
52
51
 
53
52
  export default function AppHeader({
54
- clientLogo = imageMap.campx,
55
- username,
56
- profileIcon,
57
- permissions,
58
- userBoxActions = [],
59
- cogWheelMenu = [],
53
+ clientLogo = imageMap.campx,
54
+ username,
55
+ profileIcon,
56
+ permissions,
57
+ userBoxActions = [],
58
+ cogWheelMenu = [],
60
59
  }: AppHeaderProps) {
61
- return (
62
- <StyledHeader>
63
- <Box sx={{ display: "flex", alignItems: "center", gap: "10px" }}>
64
- <AppsMenu />
65
- <AppLogo clientLogo={clientLogo} />
66
- </Box>
67
- <Box className="actions">
68
- <FreshDeskHelpButton />
69
- <Notification />
70
- {cogWheelMenu?.length ? <CogWheelMenu menu={cogWheelMenu} /> : null}
71
- <UserBox
72
- username={username}
73
- profileIcon={profileIcon}
74
- actions={userBoxActions}
75
- />
76
- </Box>
77
- </StyledHeader>
78
- );
60
+ return (
61
+ <StyledHeader>
62
+ <Box sx={{display: 'flex', alignItems: 'center', gap: '10px'}}>
63
+ <AppsMenu />
64
+ <AppLogo clientLogo={clientLogo} />
65
+ </Box>
66
+ <Box className='actions'>
67
+ <FreshDeskHelpButton />
68
+ {/* <Notification /> */}
69
+ {cogWheelMenu?.length ? <CogWheelMenu menu={cogWheelMenu} /> : null}
70
+ <UserBox
71
+ username={username}
72
+ profileIcon={profileIcon}
73
+ actions={userBoxActions}
74
+ />
75
+ </Box>
76
+ </StyledHeader>
77
+ )
79
78
  }
80
79
 
81
- const AppLogo = ({ clientLogo }) => {
82
- const originSubdomain =
83
- window.location.host.split(".")?.slice(-3)[0] ?? "ums";
84
- const currentApp =
85
- applications.find((item) => item.key === originSubdomain)?.key ?? "campx";
80
+ const AppLogo = ({clientLogo}) => {
81
+ const originSubdomain = window.location.host.split('.')?.slice(-3)[0] ?? 'ums'
82
+ const currentApp =
83
+ applications.find((item) => item.key === originSubdomain)?.key ?? 'campx'
86
84
 
87
- return (
88
- <StyledLink to={"/"}>
89
- <StyledLogosWrapper>
90
- <StyledImageWrapper>
91
- {isDevelopment ? (
92
- <img src={imageMap.campx} />
93
- ) : (
94
- <img src={imageMap[currentApp]} />
95
- )}
96
- </StyledImageWrapper>
97
- <Box
98
- sx={{
99
- height: "26px",
100
- width: "2px",
101
- background: "gray",
102
- }}
103
- ></Box>
104
- <StyledImageWrapper>
105
- {isDevelopment ? (
106
- <Typography variant="h1">Developer</Typography>
107
- ) : (
108
- <img
109
- src={clientLogo}
110
- onError={(e: any) => {
111
- e.target.src = imageMap.campx;
112
- }}
113
- />
114
- )}
115
- </StyledImageWrapper>
116
- </StyledLogosWrapper>
117
- </StyledLink>
118
- );
119
- };
85
+ return (
86
+ <StyledLink to={'/'}>
87
+ <StyledLogosWrapper>
88
+ <StyledImageWrapper>
89
+ <img src={imageMap[currentApp]} />
90
+ </StyledImageWrapper>
91
+ <Box
92
+ sx={{
93
+ height: '26px',
94
+ width: '2px',
95
+ background: 'gray',
96
+ }}
97
+ ></Box>
98
+ <StyledImageWrapper>
99
+ {isDevelopment ? (
100
+ <Typography variant='h1'>Developer</Typography>
101
+ ) : (
102
+ <img
103
+ src={clientLogo}
104
+ onError={(e: any) => {
105
+ e.target.src = imageMap.campx
106
+ }}
107
+ />
108
+ )}
109
+ </StyledImageWrapper>
110
+ </StyledLogosWrapper>
111
+ </StyledLink>
112
+ )
113
+ }
package/src/components/Layout/Header/AppsMenu.tsx CHANGED
@@ -7,6 +7,7 @@ import {
7
7
  StyledIconButton,
8
8
  StyledMenuItem,
9
9
  StyledMenuItemContainer,
10
+ StyledLink,
10
11
  } from './styles'
11
12
 
12
13
  const AppsMenu = () => {
@@ -54,15 +55,17 @@ const AppsMenu = () => {
54
55
  </Box>
55
56
  <Box>
56
57
  {applications.map((item, index) => (
57
- <StyledMenuItemContainer
58
- key={index}
59
- onClick={() => {
60
- window.location.href = item.path
61
- handleClose()
62
- }}
63
- >
64
- <MenuItem data={item} />
65
- </StyledMenuItemContainer>
58
+ <StyledLink href={item.path}>
59
+ <StyledMenuItemContainer
60
+ key={index}
61
+ onClick={() => {
62
+ window.location.href = item.path
63
+ handleClose()
64
+ }}
65
+ >
66
+ <MenuItem data={item} />
67
+ </StyledMenuItemContainer>
68
+ </StyledLink>
66
69
  ))}
67
70
  </Box>
68
71
  </Menu>
@@ -75,9 +78,13 @@ export default AppsMenu
75
78
  const MenuItem = ({data}) => {
76
79
  return (
77
80
  <StyledMenuItem>
78
- <Box height={'20px'}>{data.icon}</Box>
79
81
  <Box>
80
- <Typography variant='h1'>{data?.title}</Typography>
82
+ <img src={data.icon} style={{width: '28px', height: '28px'}} />
83
+ </Box>
84
+ <Box>
85
+ <Typography variant='h1' sx={{marginBottom: '7px'}}>
86
+ {data?.title}
87
+ </Typography>
81
88
  <StyledDescription>{data?.description}</StyledDescription>
82
89
  </Box>
83
90
  </StyledMenuItem>
package/src/components/Layout/Header/applications.tsx CHANGED
@@ -1,60 +1,74 @@
1
- import GiteTwoToneIcon from '@mui/icons-material/GiteTwoTone'
2
- import SchoolRoundedIcon from '@mui/icons-material/SchoolRounded'
3
- import AssignmentRoundedIcon from '@mui/icons-material/AssignmentRounded'
4
- import AccountBalanceWalletRoundedIcon from '@mui/icons-material/AccountBalanceWalletRounded'
5
- import PersonRoundedIcon from '@mui/icons-material/PersonRounded'
1
+ import GiteTwoToneIcon from "@mui/icons-material/GiteTwoTone";
2
+ import SchoolRoundedIcon from "@mui/icons-material/SchoolRounded";
3
+ import AssignmentRoundedIcon from "@mui/icons-material/AssignmentRounded";
4
+ import AccountBalanceWalletRoundedIcon from "@mui/icons-material/AccountBalanceWalletRounded";
5
+ import PersonRoundedIcon from "@mui/icons-material/PersonRounded";
6
+ import {
7
+ campxHeaderlogo,
8
+ enrollHeaderLogo,
9
+ hostelHeaderLogo,
10
+ payHeaderLogo,
11
+ examHeaderLogo,
12
+ peopleHeaderLogo,
13
+ } from "./assets";
6
14
 
7
15
  const isDev =
8
- process.env.NODE_ENV === 'development' ||
9
- window.location.origin.split('.').slice(-2).join('.') === 'campx.dev'
16
+ process.env.NODE_ENV === "development" ||
17
+ window.location.origin.split(".").slice(-2).join(".") === "campx.dev";
10
18
 
11
19
  const origins = {
12
- ums: {
13
- dev: 'https://ums.campx.dev',
14
- prod: 'https://ums.campx.in',
15
- },
16
- payments: {
17
- dev: 'https://payments.campx.dev',
18
- prod: 'https://payments.campx.in',
19
- },
20
- exams: {
21
- dev: 'https://exams.campx.dev',
22
- prod: 'https://exams.campx.in',
23
- },
24
- }
20
+ ums: {
21
+ dev: "https://ums.campx.dev",
22
+ prod: "https://ums.campx.in",
23
+ },
24
+ payments: {
25
+ dev: "https://payments.campx.dev",
26
+ prod: "https://payments.campx.in",
27
+ },
28
+ exams: {
29
+ dev: "https://exams.campx.dev",
30
+ prod: "https://exams.campx.in",
31
+ },
32
+ };
25
33
 
26
34
  export const applications = [
27
- {
28
- title: 'CollegeX',
29
- path: isDev ? origins.ums.dev : origins.ums.prod,
30
- icon: <SchoolRoundedIcon />,
31
- key: 'ums',
32
- // description: 'Pack my box with five dozens liquor jugs',
33
- },
34
- {
35
- title: 'ExamX',
36
- key: 'exams',
37
- path: isDev ? origins.exams.dev : origins.exams.prod,
38
- icon: <AssignmentRoundedIcon />,
39
- // description: 'Pack my box with five dozens liquor jugs',
40
- },
41
- {
42
- title: 'PayX',
43
- key: 'payments',
44
- path: isDev ? origins.payments.dev : origins.payments.prod,
45
- icon: <AccountBalanceWalletRoundedIcon />,
46
- // description: 'Pack my box with five dozens liquor jugs',
47
- },
48
- // {
49
- // title: 'PeopleX',
50
- // path: '/people',
51
- // icon: <PersonRoundedIcon />,
52
- // // description: 'Pack my box with five dozens liquor jugs',
53
- // },
54
- // {
55
- // title: 'HostelX',
56
- // path: '/hostel',
57
- // icon: <GiteTwoToneIcon />,
58
- // // description: 'Pack my box with five dozens liquor jugs',
59
- // },
60
- ]
35
+ {
36
+ title: "CollegeX",
37
+ path: isDev ? origins.ums.dev : origins.ums.prod,
38
+ icon: campxHeaderlogo,
39
+ key: "ums",
40
+ description: "Manage Complete Campus Activities",
41
+ },
42
+ {
43
+ title: "ExamX",
44
+ key: "exams",
45
+ path: isDev ? origins.exams.dev : origins.exams.prod,
46
+ icon: examHeaderLogo,
47
+ description: "Manage all Examinations in the Campus",
48
+ },
49
+ {
50
+ title: "PayX",
51
+ key: "payments",
52
+ path: isDev ? origins.payments.dev : origins.payments.prod,
53
+ icon: payHeaderLogo,
54
+ description: "Manage Online Payments in the Campus",
55
+ },
56
+ // {
57
+ // title: 'PeopleX',
58
+ // path: '/people',
59
+ // icon: peopleHeaderLogo,
60
+ // // description: 'Manage People in the Campus',
61
+ // },
62
+ // {
63
+ // title: 'HostelX',
64
+ // path: '/hostel',
65
+ // icon: hostelHeaderLogo,
66
+ // // description: 'Manage Hostels in the Campus',
67
+ // },
68
+ // {
69
+ // title: 'EnrollX',
70
+ // path: '/hostel',
71
+ // icon: enrollHeaderLogo,
72
+ // // description: 'Manage Admissions in the Campus',
73
+ // },
74
+ ];
package/src/components/Layout/Header/assets/CampxHeader.svg ADDED
@@ -0,0 +1,14 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#596e79"/>
5
+ <stop offset="1" stop-color="#7c909b"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4497" data-name="Group 4497" transform="translate(-325 -234.99)">
9
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
10
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
11
+ </g>
12
+ <path id="Subtraction_37" data-name="Subtraction 37" d="M22.857,22.857H0V0H22.857V22.856ZM4.571,4.571V18.286H18.285V4.571Z" transform="translate(333.571 243.563)" fill="url(#linear-gradient)"/>
13
+ </g>
14
+ </svg>
package/src/components/Layout/Header/assets/campx.svg ADDED
@@ -0,0 +1,29 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="231" height="35" viewBox="0 0 231 35">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#596e79"/>
5
+ <stop offset="1" stop-color="#7c909b"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4457" data-name="Group 4457" transform="translate(-110 -27.5)">
9
+ <text id="CAMPX_SQUARE" data-name="CAMPX SQUARE" transform="translate(157 53)" font-size="22" font-family="Nexa-XBold, Nexa" font-weight="700"><tspan x="0" y="0">CAMPX SQUARE</tspan></text>
10
+ <g id="Group_4467" data-name="Group 4467">
11
+ <g id="Rectangle_8974" data-name="Rectangle 8974" transform="translate(115 27.5)" fill="#fff" stroke="#fff" stroke-width="1">
12
+ <rect width="25" height="2" stroke="none"/>
13
+ <rect x="0.5" y="0.5" width="24" height="1" fill="none"/>
14
+ </g>
15
+ <g id="Rectangle_8975" data-name="Rectangle 8975" transform="translate(115 60.5)" fill="#fff" stroke="#fff" stroke-width="1">
16
+ <rect width="25" height="2" stroke="none"/>
17
+ <rect x="0.5" y="0.5" width="24" height="1" fill="none"/>
18
+ </g>
19
+ </g>
20
+ <g id="Group_4468" data-name="Group 4468" transform="translate(-215 -207.49)">
21
+ <g id="Group_4487" data-name="Group 4487" transform="translate(325 234.99)">
22
+ <g id="Group_4480" data-name="Group 4480">
23
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M35,35H30V34h4V1H30V0H5V1H1V34H5v1H0V0H35V35Z" fill="#121212"/>
24
+ </g>
25
+ </g>
26
+ <path id="Subtraction_37" data-name="Subtraction 37" d="M20,20H0V0H20V20ZM4,4V16H16V4Z" transform="translate(332.5 242.491)" fill="url(#linear-gradient)"/>
27
+ </g>
28
+ </g>
29
+ </svg>
package/src/components/Layout/Header/assets/enrollxHeader.svg ADDED
@@ -0,0 +1,14 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#007ab1"/>
5
+ <stop offset="1" stop-color="#149ecd"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4502" data-name="Group 4502" transform="translate(-325 -234.99)">
9
+ <path id="Union_6" data-name="Union 6" d="M0,22.857H0v0l2.771-3.813v0L8.3,11.429h5.456l.056.04L5.542,22.857Zm10.238-4.581,4.975-6.848h5.456l.055.04-4.946,6.807Zm10.431-6.848h0Zm0,0H15.213L10.23,4.571h5.541l4.953,6.817Zm-12.364,0L2.772,3.813h0L0,0V0H5.542l8.274,11.388-.056.04ZM12.452,0h0ZM12.452,0ZM6.909,0h0V0H12.45l0,0H6.909ZM0,0H0Z" transform="translate(334.695 243.514)" fill="url(#linear-gradient)"/>
10
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
11
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
12
+ </g>
13
+ </g>
14
+ </svg>
package/src/components/Layout/Header/assets/examxHeader.svg ADDED
@@ -0,0 +1,17 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#d86b00"/>
5
+ <stop offset="1" stop-color="#ed9035"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4499" data-name="Group 4499" transform="translate(-325 -234.99)">
9
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
10
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
11
+ <g id="Group_4477" data-name="Group 4477" transform="translate(8.906 8.571)">
12
+ <path id="Subtraction_34" data-name="Subtraction 34" d="M22.187,22.857H16.645v0L0,22.857v0l2.77-3.813h0L8.3,11.429,2.772,3.813v0L0,0V0H22.186V0L19.417,3.815v0l-5.533,7.615,5.533,7.615h0l2.771,3.813v0ZM11.094,15.215l-2.323,3.2,4.643,0-2.32-3.2ZM8.771,4.44l2.323,3.2,2.32-3.2-4.643,0Z" fill="url(#linear-gradient)"/>
13
+ <rect id="Rectangle_4307" data-name="Rectangle 4307" width="0.264" height="9.567" transform="translate(10.962 6.647)" fill="#fff"/>
14
+ </g>
15
+ </g>
16
+ </g>
17
+ </svg>
package/src/components/Layout/Header/assets/hostelxHeader.svg ADDED
@@ -0,0 +1,18 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#25009f"/>
5
+ <stop offset="1" stop-color="#573dab"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4501" data-name="Group 4501" transform="translate(-325 -234.99)">
9
+ <g id="Group_4479" data-name="Group 4479" transform="translate(330.082 244.583)">
10
+ <path id="Subtraction_9" data-name="Subtraction 9" d="M5.128,10.574H0L2.563,7.045h0L7.63.075l2.51,3.454h0l.053.073L5.128,10.574ZM12.757.073h0L12.7,0h.028l.051.037-.026.036Z" transform="translate(7.29 9.998)" fill="url(#linear-gradient)"/>
11
+ <path id="Union_18" data-name="Union 18" d="M24.708,20.571,19.642,13.6l0,0-2.564-3.527h0l-.026-.036h0l-.5-.694h.007L14.934,7.109l-2.517,3.465h-.024L9.928,13.965l-4.8,6.606H0l2.563-3.528h0L7.63,10.073l.012.016L9.853,7.045h0L14.919.075l.025.034.015-.021,7.592,10.449-.005,0,4.725,6.5h0l2.563,3.528H24.708ZM9.768,0H9.9L9.832.09ZM20.047.073,19.994,0h.028l.052.037-.026.036Z" transform="translate(0)" fill="url(#linear-gradient)"/>
12
+ <path id="Subtraction_10" data-name="Subtraction 10" d="M12.732,10.574H7.684L2.628,3.616,5.191.088l7.592,10.449-.051.037ZM.064.09h0L0,0V0H.129L.064.089Z" transform="translate(9.768 9.998)" fill="url(#linear-gradient)"/>
13
+ </g>
14
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
15
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
16
+ </g>
17
+ </g>
18
+ </svg>
package/src/components/Layout/Header/assets/index.ts CHANGED
@@ -1,7 +1,25 @@
1
- const collegex = require('./collegex.png')
2
- const enrollx = require('./enrollx.png')
3
- const examx = require('./examx.png')
4
- const payx = require('./payx.png')
5
- const peoplex = require('./peoplex.png')
1
+ import collegex from "./campx.png";
2
+ const enrollx = require("./enrollx.png");
3
+ import examx from "./newexamx.png";
4
+ import payx from "./newpayx.png";
5
+ const peoplex = require("./peoplex.png");
6
+ import campxHeaderlogo from "./CampxHeader.svg";
7
+ import examHeaderLogo from "./examxHeader.svg";
8
+ import peopleHeaderLogo from "./peoplexHeader.svg";
9
+ import payHeaderLogo from "./payxHeader.svg";
10
+ import enrollHeaderLogo from "./enrollxHeader.svg";
11
+ import hostelHeaderLogo from "./hostelxHeader.svg";
6
12
 
7
- export {collegex, enrollx, examx, payx, peoplex}
13
+ export {
14
+ collegex,
15
+ enrollx,
16
+ examx,
17
+ payx,
18
+ peoplex,
19
+ campxHeaderlogo,
20
+ examHeaderLogo,
21
+ peopleHeaderLogo,
22
+ payHeaderLogo,
23
+ enrollHeaderLogo,
24
+ hostelHeaderLogo,
25
+ };
package/src/components/Layout/Header/assets/payxHeader.svg ADDED
@@ -0,0 +1,21 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.222" y1="1" x2="0.787" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#88b053"/>
5
+ <stop offset="1" stop-color="#50840b"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4498" data-name="Group 4498" transform="translate(-325 -234.99)">
9
+ <g id="Group_4464" data-name="Group 4464" transform="translate(336.956 243.562)">
10
+ <g id="Group_4461" data-name="Group 4461" transform="translate(0)">
11
+ <g id="Group_4460" data-name="Group 4460" transform="translate(0 0)">
12
+ <path id="Subtraction_8" data-name="Subtraction 8" d="M5.723,11.749,14.229.041,14.172,0H8.564L2.875,7.829v0L.026,11.747v0h5.7Z" transform="translate(1.858 11.108)" fill="url(#linear-gradient)"/>
13
+ <path id="Subtraction_8-2" data-name="Subtraction 8" d="M8.532,0,.026,11.707l.057.041H5.692L11.38,3.92v0L14.229,0V0h-5.7Z" transform="translate(-0.026 0)" fill="url(#linear-gradient)"/>
14
+ </g>
15
+ </g>
16
+ </g>
17
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
18
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
19
+ </g>
20
+ </g>
21
+ </svg>
package/src/components/Layout/Header/assets/peoplexHeader.svg ADDED
@@ -0,0 +1,14 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="40" viewBox="0 0 40 40">
2
+ <defs>
3
+ <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
4
+ <stop offset="0" stop-color="#d0002b"/>
5
+ <stop offset="1" stop-color="#ea4a6b"/>
6
+ </linearGradient>
7
+ </defs>
8
+ <g id="Group_4500" data-name="Group 4500" transform="translate(-325 -234.99)">
9
+ <path id="Union_5" data-name="Union 5" d="M23.169,22.857,19.574,17.91l-.669.921L21.792,22.8l-.073.053H8.659v0l2.926-4.027-.667-.919L7.322,22.857H0l0,0,3.66-5.038,0,0,7.232-9.955.036.049.022-.03,4.293,5.909,4.307-5.928.036.049.022-.03L30.45,22.8l-.074.053ZM12.2,7.761v0h.183l-.093.128ZM3.63,7.887l-.091-.126,0,0h.183l-.093.128Zm23.243-.024-.076-.1h.04l.074.053-.037.05h0Zm-8.657,0-.076-.1h.04l.073.053-.037.05h0ZM16.574,2.881a2.881,2.881,0,1,1,2.881,2.881A2.881,2.881,0,0,1,16.574,2.881Zm-8.564,0a2.881,2.881,0,1,1,2.881,2.881A2.881,2.881,0,0,1,8.01,2.881Z" transform="translate(329.775 243.534)" fill="url(#linear-gradient)"/>
10
+ <g id="Group_4480" data-name="Group 4480" transform="translate(325 234.99)">
11
+ <path id="Subtraction_36" data-name="Subtraction 36" d="M40,40H34.286V38.857h4.571V1.143H34.286V0H5.714V1.143H1.143V38.857H5.714V40H0V0H40V40Z" fill="#121212"/>
12
+ </g>
13
+ </g>
14
+ </svg>
package/src/components/Layout/Header/styles.tsx CHANGED
@@ -1,15 +1,17 @@
1
1
  import {
2
+ alpha,
2
3
  AppBar,
3
4
  Box,
4
5
  IconButton,
5
6
  ListItemText,
6
7
  styled,
7
8
  Typography,
9
+ Link,
8
10
  } from '@mui/material'
9
11
 
10
12
  export const StyledImageWrapper = styled('div')`
11
13
  width: auto;
12
- height: 20px;
14
+ height: 24px;
13
15
  & img {
14
16
  width: 100%;
15
17
  height: 100%;
@@ -63,23 +65,27 @@ export const StyledIconButton = styled(IconButton)({
63
65
  borderRadius: '0px',
64
66
  })
65
67
 
68
+ export const StyledLink = styled(Link)({
69
+ textDecoration: 'none',
70
+ })
71
+
66
72
  export const StyledDescription = styled(Typography)(({theme}) => ({
67
- fontSize: '15px',
68
- fontWeight: 500,
69
- color: theme?.palette?.secondary?.main,
73
+ fontSize: '12px',
74
+ fontWeight: 600,
75
+ color: alpha(theme?.palette?.secondary?.lighter, 0.5),
70
76
  }))
71
77
 
72
78
  export const StyledMenuItem = styled(Box)({
73
79
  height: '64px',
74
- width: '360px',
75
- padding: '20px',
80
+ width: '380px',
81
+ padding: '40px 20px',
76
82
  transition: 'background ease 0.3s',
77
83
  '&:hover': {
78
84
  background: 'rgba(0, 0, 0, 0.03)',
79
85
  },
80
86
  display: 'flex',
81
87
  alignItems: 'center',
82
- gap: '10px',
88
+ gap: '20px',
83
89
  })
84
90
 
85
91
  export const StyledMenuItemContainer = styled(Box)(({theme}) => ({
@@ -88,4 +94,5 @@ export const StyledMenuItemContainer = styled(Box)(({theme}) => ({
88
94
  '&:last-of-type': {
89
95
  border: 'none',
90
96
  },
97
+ padding: '8px 0px',
91
98
  }))
package/src/components/SideNav.tsx CHANGED
@@ -37,6 +37,7 @@ const RenderMenuItem = ({ menuItem }) => {
37
37
  const permissions = PermissionsStore.useState((s) => s).permissions;
38
38
 
39
39
  const validateDropdownAccess = () => {
40
+ if (accessIfNoKey && !permissions) return true;
40
41
  let arr = [];
41
42
 
42
43
  for (let i = 0; i < children.length; i++) {
package/src/hooks/useAuth.ts CHANGED
@@ -1,77 +1,82 @@
1
- import {useEffect, useState} from 'react'
2
- import {toast} from 'react-toastify'
3
- import axios from '../config/axios'
4
- import {isDevelopment} from '../constants'
5
- import {useLoginForm} from '../contexts/LoginFormProvider'
6
- import {PermissionsStore} from '../permissions'
7
- import {AssetsStore, UserStore} from '../shared-state'
1
+ import { useEffect, useState } from "react";
2
+ import { useQuery } from "react-query";
3
+ import { toast } from "react-toastify";
4
+ import axios from "../config/axios";
5
+ import { isDevelopment } from "../constants";
6
+ import { useLoginForm } from "../contexts/LoginFormProvider";
7
+ import { PermissionsStore } from "../permissions";
8
+ import { AssetsStore, UserStore } from "../shared-state";
8
9
 
9
- const url = window.location.origin
10
+ const url = window.location.origin;
10
11
 
11
12
  function useAuth(): {
12
- loading: boolean
13
- data: {
14
- user?: any
15
- roles?: any
16
- username?: any
17
- permissions?: any
18
- assets?: {
19
- logo: string
20
- logo_square: string
21
- }
22
- }
13
+ loading: boolean;
14
+ data: {
15
+ user?: any;
16
+ roles?: any;
17
+ username?: any;
18
+ permissions?: any;
19
+ assets?: {
20
+ logo: string;
21
+ logo_square: string;
22
+ };
23
+ };
23
24
  } {
24
- const {openLoginForm} = useLoginForm()
25
- const [loading, setLoading] = useState<boolean>(false)
26
- const [data, setData] = useState(null)
25
+ const { openLoginForm } = useLoginForm();
26
+ const [loading, setLoading] = useState<boolean>(false);
27
+ const [data, setData] = useState(null);
28
+ const [payLogo, setPayLogo] = useState(null);
29
+ const appInit = async () => {
30
+ setLoading(true);
27
31
 
28
- const appInit = async () => {
29
- setLoading(true)
30
- axios
31
- .get('/auth/my-permissions')
32
- .then((res) => {
33
- setLoading(false)
34
- setData(res.data)
35
- UserStore.update((s) => {
36
- s.username = res.data?.username
37
- s.user = res.data?.user
38
- s.roles = res.data?.roles
39
- })
32
+ axios
33
+ .get("/auth/my-permissions")
34
+ .then((res) => {
35
+ console.log(res.data);
36
+ setLoading(false);
37
+ setData(res.data);
38
+ UserStore.update((s) => {
39
+ s.username = res.data?.username;
40
+ s.user = res.data?.user;
41
+ s.roles = res.data?.roles;
42
+ });
40
43
 
41
- PermissionsStore.update((s) => {
42
- s.permissions = {
43
- ...res.data?.permissions,
44
- can_settings_view: 1,
45
- can_dashboard_view: 1,
46
- can_individual_pages_view: 1,
47
- } as any
48
- })
49
- AssetsStore.update((s) => {
50
- s.logo = res.data?.assets.logo
51
- s.logo_square = res.data?.assets.logo_square
52
- })
53
- })
54
- .catch((err) => {
55
- setLoading(false)
56
- if (err.response.status !== 401) {
57
- toast.error('Server Error')
58
- }
59
- if (isDevelopment) {
60
- openLoginForm()
61
- } else {
62
- window.location.replace(`https://www.id.campx.in/?redirect_to=${url}`)
63
- }
64
- })
65
- }
44
+ PermissionsStore.update((s) => {
45
+ s.permissions = {
46
+ ...res.data?.permissions,
47
+ can_settings_view: 1,
48
+ can_dashboard_view: 1,
49
+ can_individual_pages_view: 1,
50
+ } as any;
51
+ });
52
+ AssetsStore.update((s) => {
53
+ s.logo = res.data?.assets.logo;
54
+ s.logo_square = res.data?.assets.logo_square;
55
+ });
56
+ })
57
+ .catch((err) => {
58
+ setLoading(false);
59
+ if (err.response.status !== 401) {
60
+ toast.error("Server Error");
61
+ }
62
+ if (isDevelopment) {
63
+ openLoginForm();
64
+ } else {
65
+ window.location.replace(
66
+ `https://www.id.campx.in/?redirect_to=${url}`
67
+ );
68
+ }
69
+ });
70
+ };
66
71
 
67
- useEffect(() => {
68
- appInit()
69
- }, [])
72
+ useEffect(() => {
73
+ appInit();
74
+ }, []);
70
75
 
71
- return {
72
- loading: loading || !data?.permissions,
73
- data,
74
- }
76
+ return {
77
+ loading: loading || !data?.permissions,
78
+ data,
79
+ };
75
80
  }
76
81
 
77
- export default useAuth
82
+ export default useAuth;