Added organizer navbar

Author: ashwinGokhale

backend/config/index.ts

@@ -1,4 +1,5 @@
-require('dotenv').config();
+// require('dotenv').config();
+require('dotenv').config({ path: '../../.env' });
 
 const env = process.env;
 

backend/utils/index.ts

@@ -77,10 +77,10 @@ export const uploadToStorage = async (
 	if (!file) return 'No image file';
 	else if (
 		folder === 'pictures' &&
-		!file.originalname.match(/\.(jpg|jpeg|png|gif)$/)
+		!file.originalname.match(/\.(jpg|jpeg|png|gif)$/i)
 	)
 		return `File: ${file.originalname} is an invalid image type`;
-	else if (folder === 'resume' && !file.originalname.match(/\.(png|PNG)$/))
+	else if (folder === 'resumes' && !file.originalname.match(/\.(pdf)$/i))
 		return `File: ${file.originalname} is an invalid image type`;
 
 	const fileName = `${folder}/${user.email.replace('@', '_')}`;
@@ -99,9 +99,14 @@ export const uploadToStorage = async (
 			reject('Something is wrong! Unable to upload at the moment.');
 		});
 
+		// blobStream.on('finish', () => {
+		// 	// The public URL can be used to directly access the file via HTTP.
+		// 	fileUpload.getMetadata().then(meta => resolve(meta['0'].mediaLink));
+		// });
+
 		blobStream.on('finish', () => {
 			// The public URL can be used to directly access the file via HTTP.
-			fileUpload.getMetadata().then(meta => resolve(meta['0'].mediaLink));
+			resolve(`https://storage.googleapis.com/purduehackers/${fileName}`);
 		});
 
 		blobStream.end(file.buffer);

frontend/src/components/App/index.js

@@ -71,7 +71,7 @@ class App extends Component {
 		const { token, user } = this.props;
 		return (
 			<React.Fragment>
-				<Navigation auth={!!token} id={user ? user._id : null} />
+				<Navigation auth={!!token} id={user ? user._id : null} user={user} />
 				<div className="pageWrap">
 					<FlashMessage />
 					<Switch>
@@ -166,5 +166,8 @@ const mapStateToProps = state => ({
 });
 
 export default withRouter(
-	connect(mapStateToProps, { storageChanged, clearFlashMessages, fetchProfile })(App)
+	connect(
+		mapStateToProps,
+		{ storageChanged, clearFlashMessages, fetchProfile }
+	)(App)
 );

frontend/src/components/Common/Navbar.js

@@ -1,18 +1,19 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Link } from 'react-router-dom';
-import { Nav, Navbar, NavItem } from 'react-bootstrap';
+import { Nav, Navbar, NavItem, NavDropdown, MenuItem } from 'react-bootstrap';
+import routes, { hasPermission } from '../../constants';
 
 const CommonNav = () => (
 	<React.Fragment>
-		<NavItem href="/members">Members</NavItem>
-		<NavItem href="/events">Events</NavItem>
-		<NavItem href="/calendar">Calendar</NavItem>
+		<NavItem href={routes.MEMBERS}>Members</NavItem>
+		<NavItem href={routes.EVENTS}>Events</NavItem>
+		<NavItem href={routes.CALENDAR}>Calendar</NavItem>
 	</React.Fragment>
 );
 
-const PHNavbar = ({ auth, id }) => (
-	<Navbar collapseOnSelect bsStyle="default" style={{ marginBottom: '10px' }}>
+const PHNavbar = ({ auth, id, user }) => (
+	<Navbar collapseOnSelect bsStyle="default" style={{ marginBottom: '10px', maxWidth: '100%' }}>
 		<Navbar.Header>
 			<Navbar.Brand>
 				<Link id="nav-brand" to="/">
@@ -26,19 +27,32 @@ const PHNavbar = ({ auth, id }) => (
 			<Nav pullRight>
 				{auth && id ? (
 					<React.Fragment>
-						<li>
+						<li role="presentation">
 							<Link to={`/member/${id}`}>Profile</Link>
 						</li>
 						<CommonNav />
-						<li>
-							<Link to="/logout">Logout</Link>
+						<NavDropdown title="Organizers" id="protected-nav-dropdown">
+							<style>{`.privateItem a {padding-top: 5px !important;}`}</style>
+							{hasPermission(user, 'permissions') && (
+								<MenuItem className="privateItem" href={routes.PERMISSIONS}>
+									Permissions
+								</MenuItem>
+							)}
+							{hasPermission(user, 'credentials') && (
+								<MenuItem className="privateItem" href={routes.CREDENTIALS}>
+									Credentials
+								</MenuItem>
+							)}
+						</NavDropdown>
+						<li role="presentation">
+							<Link to={routes.LOGOUT}>Logout</Link>
 						</li>
 					</React.Fragment>
 				) : (
 					<React.Fragment>
 						<CommonNav />
-						<NavItem href="/login">Login</NavItem>
-						<NavItem href="/signup">Join</NavItem>
+						<NavItem href={routes.LOGIN}>Login</NavItem>
+						<NavItem href={routes.SIGNUP}>Join</NavItem>
 					</React.Fragment>
 				)}
 			</Nav>

frontend/src/components/Signup/index.js

@@ -201,12 +201,11 @@ class SignUpPage extends Component {
 								</span>
 							</div>
 							<br />
-							<label htmlFor="gradYear">
+							<label htmlFor="graduationYear">
 								Year of Graduation *
 								<input
 									type="number"
-									name="gradYear"
-									id="gradYear"
+									id="graduationYear"
 									min="1869"
 									max={new Date().getFullYear() + 20}
 									placeholder="Graduation Year"
@@ -492,8 +491,11 @@ const mapStateToProps = state => ({
 	...state.sessionState
 });
 
-export default connect(mapStateToProps, {
-	flash: sendFlashMessage,
-	clear: clearFlashMessages,
-	signUp
-})(SignUpPage);
+export default connect(
+	mapStateToProps,
+	{
+		flash: sendFlashMessage,
+		clear: clearFlashMessages,
+		signUp
+	}
+)(SignUpPage);

frontend/src/index.css

@@ -16,7 +16,7 @@ body {
 /*------------ NAVBAR STYLING ----------------*/
 
 .container {
-	max-width: 55em;
+	max-width: 65em;
 }
 
 .navbar {
@@ -54,6 +54,7 @@ body {
 	font-family: MontserratLite, sans-serif !important;
 	color: #666;
 	font-size: 1.3em;
+	/* padding-top: 20px !important; */
 	padding-top: 20px !important;
 	-webkit-transition: color 300ms;
 	-moz-transition: color 300ms;