fix: add sac posts (#409)

Monday-Morning · Jan 30, 2023 · 23a1cbc · 23a1cbc
1 parent fc1975d
commit 23a1cbc
Show file tree

Hide file tree

Showing 5 changed files with 159 additions and 79 deletions.
diff --git a/client/src/components/guide/Options.js b/client/src/components/guide/Options.js
@@ -1,25 +1,22 @@
 import React from 'react';
+
+import Image from 'next/image';
 import Link from 'next/link';
 
-import makeStyles from '@mui/styles/makeStyles';
-import { Typography, Grid, Button } from '@mui/material';
 import DownloadIcon from '@mui/icons-material/Download';
-
-// placeholder
-import { OPTIONS } from '../../assets/placeholder/guide';
+import { Button, Grid, Typography } from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
 
 // images
 import icon1 from '../../assets/images/guide/optIcon1.png';
 import icon2 from '../../assets/images/guide/optIcon2.png';
-import icon3 from '../../assets/images/guide/optIcon3.png';
 import icon4 from '../../assets/images/guide/optIcon4.png';
-
-// components
-import SubCategories from '../widgets/SubCategory';
-
+// placeholder
+import { OPTIONS } from '../../assets/placeholder/guide';
 // theme
 import theme from '../../config/themes/light';
-import Image from 'next/image';
+// components
+import SubCategories from '../widgets/SubCategory';
 
 const Options = () => {
   const classes = useStyles(theme);

diff --git a/client/src/components/widgets/PostHolder.js b/client/src/components/widgets/PostHolder.js
@@ -1,11 +1,10 @@
 import React from 'react';
 
-import { Typography, Grid } from '@mui/material';
-import makeStyles from '@mui/styles/makeStyles';
-
 import { PhoneOutlined } from '@mui/icons-material';
+import { Grid, Typography } from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
 
-const PostHolders = () => {
+const PostHolders = ({ position, name, email, phone }) => {
   const classes = useStyles();
   return (
     <Grid
@@ -15,20 +14,24 @@ const PostHolders = () => {
       alignItems='flex-start'
     >
       <Typography variant='body2' className={classes.position}>
-        Second year
+        {position}
       </Typography>
-      <Typography variant='body2' className={classes.holderDetails}>
-        name: Anish Patro
+      <Typography variant='body2' className={classes.name}>
+        {name}
       </Typography>
       <Typography variant='body2' className={classes.holderDetails}>
-        Roll: 121CE0877
+        <strong>Email:-</strong> {email}
       </Typography>
-      <div className={classes.phoneDetails}>
-        <PhoneOutlined className={classes.phone} />
-        <Typography className={classes.number} variant='body2'>
-          9999999999
-        </Typography>
-      </div>
+      {phone ? (
+        <div className={classes.phoneDetails}>
+          <PhoneOutlined className={classes.phone} />
+          <Typography className={classes.number} variant='body2'>
+            {phone}
+          </Typography>
+        </div>
+      ) : (
+        <></>
+      )}
     </Grid>
   );
 };
@@ -39,16 +42,24 @@ const useStyles = makeStyles((theme) => ({
   position: {
     color: theme.palette.secondary.neutral80,
     fontFamily: 'Source Sans Pro',
-    fontSize: '16px',
+    fontSize: '20px',
     marginBottom: '5px',
     marginTop: '5px',
+    fontWeight: '600',
   },
   holderDetails: {
     fontFamily: theme.typography.fontFamily,
     fontSize: '20px',
     color: '#000',
     marginBottom: '5px',
   },
+  name: {
+    fontFamily: theme.typography.fontFamily,
+    fontSize: '20px',
+    color: '#000',
+    marginBottom: '5px',
+    fontWeight: '600',
+  },
   phoneDetails: {
     display: 'flex',
     flexDirection: 'row',

diff --git a/client/src/components/widgets/SacInfoNavbar.js b/client/src/components/widgets/SacInfoNavbar.js
@@ -1,72 +1,137 @@
 import React, { useState } from 'react';
+
 import {
   ButtonBase,
   Container,
   Typography,
   useMediaQuery,
 } from '@mui/material';
-import theme from '../../config/themes/light';
-
 import makeStyles from '@mui/styles/makeStyles';
+
+import theme from '../../config/themes/light';
+import PostHolders from './PostHolder';
 import SocietyCards from './SocietyCards';
 
 const STAGE = {
+  DSW: 'Dean SW',
+  SP: 'Sac President',
   SOB: 'SAC Office Bearers',
-  DNF: 'Dean’s Nominee for Fests',
-  DNS: 'Dean’s Nominee for societies',
-  FC: 'Fest Convenors',
+};
+
+const POSTS = {
+  FMS: [
+    {
+      position: 'Vice President',
+      name: 'Prof. Binod Bihari Sahu',
+      phone: '0661-2462782',
+      email: '[email protected]',
+    },
+    {
+      position: 'Vice President',
+      name: 'Dr. Balaji P.S.',
+      phone: '0661-2462528',
+      email: '[email protected]',
+    },
+  ],
+  LCS: [
+    {
+      position: 'Vice President',
+      name: 'Dr. Akshaya Kumar Rath',
+      phone: '0661-2462697',
+      email: '[email protected]',
+    },
+    {
+      position: 'Vice President',
+      name: 'Dr. Winny Routray',
+      phone: '',
+      email: '[email protected]',
+    },
+  ],
+  GSS: [
+    {
+      position: 'Vice President',
+      name: 'Prof. Ramesh Kumar Mohapatra',
+      phone: '0661-2462366',
+      email: '[email protected]',
+    },
+    {
+      position: 'Vice President',
+      name: 'Dr. Mayank Yadav',
+      phone: '',
+      email: '[email protected]',
+    },
+  ],
+  TS: [
+    {
+      position: 'Vice President',
+      name: 'Dr. Kaustav Chaudhury',
+      phone: '0661-2462535 ',
+      email: '[email protected]',
+    },
+    {
+      position: 'Vice President',
+      name: 'Dr. Prasun Chongder',
+      phone: '',
+      email: '[email protected]',
+    },
+  ],
 };
 
 const SacInfoNavbar = () => {
-  const [stage, setStage] = useState(STAGE.SOB);
+  const [stage, setStage] = useState(STAGE.DSW);
   const classes = useStyles();
   const matches = useMediaQuery(theme.breakpoints.down('md'));
 
   const renderTeam = () => {
     switch (stage) {
-      case STAGE.SOB:
+      case STAGE.DSW:
         return (
           <>
-            <SocietyCards society='Film and Music Society' />
-            <SocietyCards society='Literary and Cultural Society' />{' '}
-            <SocietyCards society='Games and Sports Society' />
-            <SocietyCards society='Technical Society' />{' '}
+            <PostHolders
+              position='Dean SW'
+              name='Prof. Sidhartha S. Jena'
+              email='[email protected]'
+            />
           </>
         );
-      case STAGE.DNF:
+      case STAGE.SP:
         return (
           <>
-            <SocietyCards society='Film and Music Society' />
-            <SocietyCards society='Literary and Cultural Society' />
-            <SocietyCards society='Games and Sports Society' />
-            <SocietyCards society='Technical Society' />{' '}
+            <PostHolders
+              position='Sac President'
+              name='Prof. Poonam Singh'
+              email='[email protected]'
+            />
           </>
         );
-      case STAGE.DNS:
-        return (
-          <>
-            <SocietyCards society='Film and Music Society' />
-            <SocietyCards society='Literary and Cultural Society' />{' '}
-            <SocietyCards society='Games and Sports Society' />
-            <SocietyCards society='Technical Society' />{' '}
-          </>
-        );
-      case STAGE.FC:
+      case STAGE.SOB:
         return (
           <>
-            <SocietyCards society='Film and Music Society' />
-            <SocietyCards society='Literary and Cultural Society' />{' '}
-            <SocietyCards society='Games and Sports Society' />
-            <SocietyCards society='Technical Society' />{' '}
+            <SocietyCards society='Film and Music Society' posts={POSTS.FMS} />
+            <SocietyCards
+              society='Literary and Cultural Society'
+              posts={POSTS.LCS}
+            />{' '}
+            <SocietyCards
+              society='Games and Sports Society'
+              posts={POSTS.GSS}
+            />
+            <SocietyCards society='Technical Society' posts={POSTS.TS} />{' '}
           </>
         );
       default:
         return (
           <>
-            <SocietyCards society='Film and Music Society' />
-            <SocietyCards society='Literary and Cultural Society' />{' '}
-            <SocietyCards society='Games and Sports Society' />
-            <SocietyCards society='Technical Society' />{' '}
+            <SocietyCards society='Film and Music Society' posts={POSTS.FMS} />
+            <SocietyCards
+              society='Literary and Cultural Society'
+              posts={POSTS.LCS}
+            />{' '}
+            <SocietyCards
+              society='Games and Sports Society'
+              posts={POSTS.GSS}
+            />
+            <SocietyCards society='Technical Society' posts={POSTS.TS} />{' '}
           </>
         );
     }

diff --git a/client/src/components/widgets/SocietyCards.js b/client/src/components/widgets/SocietyCards.js
@@ -1,19 +1,21 @@
 import React, { useState } from 'react';
 
 import clsx from 'clsx';
+
+import { ExpandMore } from '@mui/icons-material';
 import {
-  Typography,
   Card,
   CardActions,
-  IconButton,
-  Collapse,
   CardContent,
+  Collapse,
+  IconButton,
+  Typography,
 } from '@mui/material';
 import makeStyles from '@mui/styles/makeStyles';
-import { ExpandMore } from '@mui/icons-material';
-import PostHolders from '../widgets/PostHolder';
 
-const SocietyCards = ({ society }) => {
+import PostHolders from './PostHolder';
+
+const SocietyCards = ({ society, posts }) => {
   const classes = useStyles();
   const [expanded, setExpanded] = useState(false);
 
@@ -37,14 +39,19 @@ const SocietyCards = ({ society }) => {
           {society}
         </Typography>
       </CardActions>
-      {/* <Collapse in={expanded} timeout='auto' unmountOnExit>
+      <Collapse in={expanded} timeout='auto' unmountOnExit>
         <CardContent className={classes.hallDetails}>
-          <PostHolders />
-          <PostHolders />
-          <PostHolders />
-          <PostHolders />
+          {posts?.map(({ position, name, email, phone }) => (
+            <PostHolders
+              key={name}
+              position={position}
+              name={name}
+              email={email}
+              phone={phone}
+            />
+          ))}
         </CardContent>
-      </Collapse> */}
+      </Collapse>
     </Card>
   );
 };

diff --git a/client/src/screens/Sac.js b/client/src/screens/Sac.js
@@ -1,13 +1,13 @@
 import React from 'react';
-import { Container, Typography } from '@mui/material';
-import BackButton from '../components/shared/button/BackButton';
-import makeStyles from '@mui/styles/makeStyles';
 
 import Image from 'next/dist/client/image';
 
+import { Container, Typography } from '@mui/material';
+import makeStyles from '@mui/styles/makeStyles';
+
 // images
 import SACimagexs from '../assets/images/contact/sac2.png';
-
+import BackButton from '../components/shared/button/BackButton';
 // import
 import ClubInfoNavbar from '../components/widgets/ClubInfoNavbar';
 import SacInfoNavbar from '../components/widgets/SacInfoNavbar';
@@ -49,13 +49,13 @@ const SacAndClub = () => {
           </div>
         </div>
       </div>
-      {/* <div className={classes.hr}>
+      <div className={classes.hr}>
         <Typography variant='h2' className={classes.title}>
           SAC Info
         </Typography>
         <div className={classes.underline} />
-      </div> */}
-      {/* <SacInfoNavbar /> */}
+      </div>
+      <SacInfoNavbar />
       <div className={classes.hr}>
         <Typography variant='h2' className={classes.title}>
           Club Info