Skip to content

Commit f4a68cb

Browse files
richard-feng07richard-feng07
committed
#3872 Created the guest page sidebar
1 parent 776faf4 commit f4a68cb

3 files changed

Lines changed: 127 additions & 42 deletions

File tree

‎src/frontend/src/app/AppAuthenticated.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ const AppAuthenticated: React.FC<AppAuthenticatedProps> = ({ userId, userRole })
7070

7171
return userSettingsData.slackId || isGuest(userRole) ? (
7272
<AppContextUser>
73-
{!onGuestHomePage && (
73+
{
7474
<>
7575
<Box
7676
onMouseEnter={() => {
@@ -108,12 +108,12 @@ const AppAuthenticated: React.FC<AppAuthenticatedProps> = ({ userId, userRole })
108108
setMoveContent={setMoveContent}
109109
/>
110110
</>
111-
)}
111+
}
112112
<Box display={'flex'}>
113-
<HiddenContentMargin open={!onGuestHomePage && moveContent} variant="permanent" />
113+
<HiddenContentMargin open={moveContent} variant="permanent" />
114114
<Container
115115
maxWidth={false}
116-
sx={{ width: !onGuestHomePage && moveContent ? 'calc(100vw - 220px)' : `calc(100vw - 30px)` }}
116+
sx={{ width: onGuestHomePage && moveContent ? 'calc(100vw - 220px)' : `calc(100vw - 30px)` }}
117117
>
118118
<Switch>
119119
<Route path={routes.PROJECTS} component={Projects} />

‎src/frontend/src/layouts/Sidebar/Sidebar.tsx‎

Lines changed: 105 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,20 @@
44
*/
55

66
import { routes } from '../../utils/routes';
7+
import { Route } from 'react-router-dom';
8+
import TeamSpecificPage from '../../pages/TeamsPage/TeamSpecificPage';
79
import { LinkItem } from '../../utils/types';
810
import styles from '../../stylesheets/layouts/sidebar/sidebar.module.css';
911
import { Typography, Box, IconButton, Divider } from '@mui/material';
1012
import HomeIcon from '@mui/icons-material/Home';
1113
import AlignHorizontalLeftIcon from '@mui/icons-material/AlignHorizontalLeft';
14+
import RateReviewIcon from '@mui/icons-material/RateReview';
15+
import DashboardIcon from '@mui/icons-material/Dashboard';
16+
import ConstructionIcon from '@mui/icons-material/Construction';
17+
import BoltIcon from '@mui/icons-material/Bolt';
18+
import CodeIcon from '@mui/icons-material/Code';
19+
import VolunteerActivismIcon from '@mui/icons-material/VolunteerActivism';
20+
import BusinessCenterIcon from '@mui/icons-material/BusinessCenter';
1221
import FolderIcon from '@mui/icons-material/Folder';
1322
import SyncAltIcon from '@mui/icons-material/SyncAlt';
1423
import GroupIcon from '@mui/icons-material/Group';
@@ -19,15 +28,16 @@ import NavPageLink from './NavPageLink';
1928
import NERDrawer from '../../components/NERDrawer';
2029
import NavUserMenu from '../PageTitle/NavUserMenu';
2130
import DrawerHeader from '../../components/DrawerHeader';
22-
import { Cached, ChevronLeft, ChevronRight } from '@mui/icons-material';
31+
import { Cached, ChevronLeft, ChevronRight, NotListedLocation } from '@mui/icons-material';
2332
import { useHomePageContext } from '../../app/HomePageContext';
2433
import { isGuest } from 'shared';
34+
import { getAllTeams } from '../../apis/teams.api';
2535
import BarChartIcon from '@mui/icons-material/BarChart';
2636
import { useCurrentUser } from '../../hooks/users.hooks';
2737
import QueryStatsIcon from '@mui/icons-material/QueryStats';
2838
import CurrencyExchangeIcon from '@mui/icons-material/CurrencyExchange';
2939
import ShoppingCartIcon from '@mui/icons-material/ShoppingCart';
30-
import { useState } from 'react';
40+
import { useState, useEffect } from 'react';
3141

3242
interface SidebarProps {
3343
drawerOpen: boolean;
@@ -40,29 +50,70 @@ const Sidebar = ({ drawerOpen, setDrawerOpen, moveContent, setMoveContent }: Sid
4050
const [openSubmenu, setOpenSubmenu] = useState<string | null>(null);
4151
const { onPNMHomePage, onOnboardingHomePage } = useHomePageContext();
4252
const user = useCurrentUser();
53+
const { onGuestHomePage } = useHomePageContext();
54+
const [allTeams, setAllTeams] = useState<LinkItem[]>([]);
4355

56+
getAllTeams().then((response) => {
57+
setAllTeams(
58+
response.data.map((team) => ({
59+
name: team.teamName,
60+
icon: undefined,
61+
route: routes.TEAMS + '/' + team.teamId
62+
}))
63+
);
64+
});
65+
66+
// Now allTeams will update when data arrives
4467
const memberLinkItems: LinkItem[] = [
4568
{
4669
name: 'Home',
4770
icon: <HomeIcon />,
48-
route: routes.HOME
71+
route: onGuestHomePage ? routes.HOME_GUEST : routes.HOME
4972
},
50-
{
73+
!onGuestHomePage && {
5174
name: 'Gantt',
5275
icon: <AlignHorizontalLeftIcon />,
5376
route: routes.GANTT
5477
},
55-
{
56-
name: 'Projects',
57-
icon: <FolderIcon />,
58-
route: routes.PROJECTS
59-
},
60-
{
78+
!onGuestHomePage
79+
? {
80+
name: 'Projects',
81+
icon: <FolderIcon />,
82+
route: routes.PROJECTS
83+
}
84+
: {
85+
name: 'Project Management',
86+
icon: <DashboardIcon />,
87+
route: routes.PROJECTS,
88+
subItems: [
89+
{
90+
name: 'Gantt',
91+
icon: <AlignHorizontalLeftIcon />,
92+
route: routes.GANTT
93+
},
94+
{
95+
name: 'Projects',
96+
icon: <FolderIcon />,
97+
route: routes.PROJECTS
98+
},
99+
{
100+
name: 'Change Requests',
101+
icon: <SyncAltIcon />,
102+
route: routes.CHANGE_REQUESTS
103+
},
104+
{
105+
name: 'Design Review',
106+
icon: <RateReviewIcon />,
107+
route: routes.DESIGN_REVIEW_BY_ID
108+
}
109+
]
110+
},
111+
!onGuestHomePage && {
61112
name: 'Change Requests',
62113
icon: <SyncAltIcon />,
63114
route: routes.CHANGE_REQUESTS
64115
},
65-
{
116+
!onGuestHomePage && {
66117
name: 'Finance',
67118
icon: <AttachMoneyIcon />,
68119
route: routes.FINANCE,
@@ -84,29 +135,63 @@ const Sidebar = ({ drawerOpen, setDrawerOpen, moveContent, setMoveContent }: Sid
84135
}
85136
]
86137
},
87-
{
88-
name: 'Teams',
89-
icon: <GroupIcon />,
90-
route: routes.TEAMS
91-
},
92-
{
138+
!onGuestHomePage
139+
? {
140+
name: 'Teams',
141+
icon: <GroupIcon />,
142+
route: routes.TEAMS
143+
}
144+
: {
145+
name: 'Divisions',
146+
icon: <GroupIcon />,
147+
route: routes.TEAMS,
148+
subItems: allTeams
149+
// subItems: [
150+
// {
151+
// name: 'Mechanical',
152+
// icon: <ConstructionIcon />,
153+
// route: routes.FINANCE_DASHBOARD
154+
// },
155+
// {
156+
// name: 'Electrical',
157+
// icon: <BoltIcon />,
158+
// route: routes.REIMBURSEMENT_REQUESTS
159+
// },
160+
// {
161+
// name: 'Software',
162+
// icon: <CodeIcon />,
163+
// route: routes.CALENDAR
164+
// },
165+
// {
166+
// name: 'Business',
167+
// icon: <BusinessCenterIcon />,
168+
// route: routes.FINANCE_DASHBOARD
169+
// }
170+
// ]
171+
},
172+
!onGuestHomePage && {
93173
name: 'Calendar',
94174
icon: <CalendarTodayIcon />,
95175
route: routes.CALENDAR
96176
},
97-
{
177+
!onGuestHomePage && {
98178
name: 'Retrospective',
99179
icon: <Cached />,
100180
route: routes.RETROSPECTIVE
101181
},
182+
onGuestHomePage && {
183+
name: 'Sponsors',
184+
icon: <VolunteerActivismIcon />,
185+
route: routes.RETROSPECTIVE
186+
},
102187
{
103188
name: 'Info',
104189
icon: <QuestionMarkIcon />,
105190
route: routes.INFO
106191
}
107-
];
192+
].filter(Boolean) as LinkItem[];
108193

109-
if (!isGuest(user.role)) {
194+
if (!isGuest(user.role) && !onGuestHomePage) {
110195
memberLinkItems.splice(6, 0, {
111196
name: 'Statistics',
112197
icon: <BarChartIcon />,

‎src/frontend/src/pages/HomePage/IntroGuestHomePage.tsx‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -22,18 +22,18 @@ const IntroGuestHomePage = () => {
2222
} = useCurrentOrganization();
2323
const { setCurrentHomePage } = useHomePageContext();
2424

25-
const {
26-
data: applyInterestImageUrl,
27-
isLoading: applyImageLoading,
28-
isError: applyImageIsError,
29-
error: applyImageError
30-
} = useGetImageUrl(organization?.applyInterestImageId ?? null);
31-
const {
32-
data: exploreGuestImageUrl,
33-
isLoading: exploreImageLoading,
34-
isError: exploreImageIsError,
35-
error: exploreImageError
36-
} = useGetImageUrl(organization?.exploreAsGuestImageId ?? null);
25+
// const {
26+
// data: applyInterestImageUrl,
27+
// isLoading: applyImageLoading,
28+
// isError: applyImageIsError,
29+
// error: applyImageError
30+
// } = useGetImageUrl(organization?.applyInterestImageId ?? null);
31+
// const {
32+
// data: exploreGuestImageUrl,
33+
// isLoading: exploreImageLoading,
34+
// isError: exploreImageIsError,
35+
// error: exploreImageError
36+
// } = useGetImageUrl(organization?.exploreAsGuestImageId ?? null);
3737

3838
useEffect(() => {
3939
setCurrentHomePage('guest');
@@ -42,11 +42,11 @@ const IntroGuestHomePage = () => {
4242
if (organizationIsError) {
4343
return <ErrorPage message={organizationError.message} />;
4444
}
45-
if (applyImageIsError) return <ErrorPage message={applyImageError.message} />;
46-
if (exploreImageIsError) return <ErrorPage message={exploreImageError.message} />;
45+
// if (applyImageIsError) return <ErrorPage message={applyImageError.message} />;
46+
// if (exploreImageIsError) return <ErrorPage message={exploreImageError.message} />;
4747

48-
if (!organization || organizationIsLoading || applyImageLoading || exploreImageLoading) return <LoadingIndicator />;
49-
if (!applyInterestImageUrl || !exploreGuestImageUrl) return <LoadingIndicator />;
48+
// if (!organization || organizationIsLoading || applyImageLoading || exploreImageLoading) return <LoadingIndicator />;
49+
// if (!applyInterestImageUrl || !exploreGuestImageUrl) return <LoadingIndicator />;
5050

5151
return (
5252
<PageLayout title="Home" hidePageTitle>
@@ -66,13 +66,13 @@ const IntroGuestHomePage = () => {
6666
<Box sx={{ display: 'flex', gap: 5 }}>
6767
<ImageWithButton
6868
title="Interested in applying"
69-
imageSrc={applyInterestImageUrl}
69+
imageSrc={''}
7070
buttonText="Learn More"
7171
onClick={() => history.push(routes.HOME_PNM)}
7272
/>
7373
<ImageWithButton
7474
title="Explore Our Work as a Guest"
75-
imageSrc={exploreGuestImageUrl}
75+
imageSrc={''}
7676
buttonText="FinishLine"
7777
onClick={() => history.push(routes.HOME_MEMBER)}
7878
/>

0 commit comments

Comments
 (0)