Merge pull request #49 from CPSC319-Winter-term-2/home

Home

src/components/home/Meeting.tsx

@@ -1,17 +1,31 @@
 import ListItemButton from "@mui/material/ListItemButton";
 import ListItemText from "@mui/material/ListItemText";
+import DetailedMeeting from "../../api-bodies/DetailedMeeting";
+import Grid from "@mui/material/Grid";
+import { useAppDispatch } from "../../redux/hooks";
+import { open } from "../../redux/slices/meetingDetailsOpenSlice";
 
 interface Props {
+  meeting: DetailedMeeting;
+  meetingClass: string;
   meetingName: string;
   meetingTime: string;
   meetingMembers: string
 }
 
 function Meeting(props: Props) {
+  const dispatch = useAppDispatch();
+
   return (
-    <ListItemButton component="a" href="#" className="row meeting">
+    <ListItemButton component="a" onClick={() => dispatch(open(props.meeting))} className={"row meeting " + props.meetingClass}>
+      <Grid container>
+        <Grid item sm={9}>
           <ListItemText primary={props.meetingName} secondary={props.meetingMembers} />
+        </Grid>
+        <Grid item sm={3}>
           <ListItemText primary={props.meetingTime} />
+        </Grid>
+      </Grid>
     </ListItemButton>
   );
 }

src/components/home/MeetingsPanel.tsx

@@ -36,6 +36,8 @@ const MeetingsPanel: React.FC = () => {
     setInterval(() => setCurrentDate(new Date()), 1000);
   }, []);
 
+  let i = 1;
+
   return (
     <div className="meetings-panel">
       <div className="row panel-label">
@@ -60,8 +62,12 @@ const MeetingsPanel: React.FC = () => {
           const currentDatemil = currentDate.getTime();
 
           if (currentDatemil >= startDatemil && currentDatemil <= endDatemil) {
+            let lastMeetingClass = meetings.length == i ? " lastMeeting" : "";
+            i += 1;
             return (
               <Meeting 
+                meeting={meeting}
+                meetingClass={"meeting-" + (i - 1) + lastMeetingClass}
                 meetingName={meeting.topic} 
                 meetingTime={formatTimeFromDate(startDate) + " - " + formatTimeFromDate(endDate)} 
                 meetingMembers={meetingMembers.map((userLite) => (" " + userLite.name + " ")).toString()} 

src/components/home/ShortCuts.tsx

@@ -34,19 +34,9 @@ const ShortCuts: React.FC<Props> = ({ users }: Props) => {
             <PeopleIcon className="icon" />
           </Button>
           <Typography className="mylabel" sx={{ ml: 1 }}>
-            New Meeting
+            Schedule Meeting
           </Typography>
         </Grid>
-        <Grid item sm={6}>
-          <Button className="tile">
-            <AddIcon className="icon" />
-          </Button>
-          <Typography className="mylabel" sx={{ ml: 1 }}>
-            Join
-          </Typography>
-        </Grid>
-      </Grid>
-      <Grid className="row-2" container spacing={1}>
         <Grid item sm={6}>
           <Button className="tile" onClick={handleClickOpen}>
             <PhoneEnabledIcon className="icon" />
@@ -61,6 +51,16 @@ const ShortCuts: React.FC<Props> = ({ users }: Props) => {
             Call Group
           </Typography>
         </Grid>
+      </Grid>
+      {/* <Grid className="row-2" container spacing={1}>
+        <Grid item sm={6}>
+          <Button className="tile">
+            <AddIcon className="icon" />
+          </Button>
+          <Typography className="mylabel" sx={{ ml: 1 }}>
+            Join
+          </Typography>
+        </Grid>
         <Grid item sm={6}>
           <Button className="tile">
             <CircleIcon className="icon" />
@@ -69,7 +69,7 @@ const ShortCuts: React.FC<Props> = ({ users }: Props) => {
             Recordings
           </Typography>
         </Grid>
-      </Grid>
+      </Grid> */}
     </div>
   );
 };

src/style/App.css

@@ -33,10 +33,6 @@ a {
   padding-bottom: 2%;
 }
 
-.main-home .meetings-panel .meetingEntries::-webkit-scrollbar {
-  display: none;
-}
-
 .main-home .meetings-panel .meeting {
   background-color: #D3D3D3;
   text-align: center;
@@ -44,8 +40,12 @@ a {
   line-height: 2;
 }
 
+.main-home .meetings-panel .lastMeeting {
+  margin-bottom: 10%;
+}
+
 .main-home .short-cuts .row-1 {
-  margin-top: 30vh;
+  margin-top: 40vh;
 }
 
 .main-home .short-cuts .row-2 {

src/style/App.css.map

@@ -1,6 +1,6 @@
 {
     "version": 3,
-    "mappings": "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",
+    "mappings": "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",
     "sources": [
         "App.sass",
         "_variables.sass",

src/style/modules/_mainHome.sass

@@ -33,9 +33,12 @@
             text-align: center
             margin-top: 15px
             line-height: 2
+        .lastMeeting
+            margin-bottom: 10%
     .short-cuts
         .row-1
-            margin-top: 30vh
+            // margin-top: 30vh
+            margin-top: 40vh
         .row-2
             margin-top: 5vh
         .mylabel