diff --git a/components/Dashboard/Rooms.tsx b/components/Dashboard/Rooms.tsx index 24a2cae..baf33ef 100644 --- a/components/Dashboard/Rooms.tsx +++ b/components/Dashboard/Rooms.tsx @@ -26,6 +26,7 @@ import RoomCard from "../RoomCard"; import toast from "react-hot-toast"; import RoomTypeTag from "../RoomTypeTag"; import moment from "moment"; +import { getTime } from "../../helpers/dateTime"; enum RoomTypeFilter { team = "team", @@ -185,6 +186,20 @@ export default function DashboardRoom() { room.type == RoomType.scheduled && room.status == RoomStatus.empty ); + // sorting array of scheduled rooms + scheduled.sort(function (a, b) { + // Turn your strings into dates, and then subtract them + // to get a value that is either negative, positive, or zero. + if (!b.scheduledDateTime) { + return -1; + } + + return ( + getTime(a.scheduledDateTime.toDate()) - + getTime(b.scheduledDateTime.toDate()) + ); + }); + return ( <> diff --git a/components/RoomCard.tsx b/components/RoomCard.tsx index a14945c..2310bd7 100644 --- a/components/RoomCard.tsx +++ b/components/RoomCard.tsx @@ -1,5 +1,12 @@ import { BsThreeDots } from "react-icons/bs"; -import { FaBell, FaCalendarDay, FaClock, FaLink, FaPlus } from "react-icons/fa"; +import { + FaArchive, + FaBell, + FaCalendarDay, + FaClock, + FaLink, + FaPlus, +} from "react-icons/fa"; import { IoTimer } from "react-icons/io5"; import Room, { RoomStatus, RoomType } from "../models/room"; import RoomTypeTag from "./RoomTypeTag"; @@ -26,6 +33,8 @@ interface IRoomCardProps { const roomService = new RoomService(); const userService = new UserService(); +const today = new Date(); + export default function RoomCard(props: IRoomCardProps) { const { currUser } = useAuth(); const { teamUsersMap, user } = useTeamDashboardContext(); @@ -114,7 +123,7 @@ export default function RoomCard(props: IRoomCardProps) { return ( - + {allMembersInRoom.map((user, i) => { return ( @@ -223,9 +232,17 @@ export default function RoomCard(props: IRoomCardProps) { ); + // handle specifics for a scheduled room var dateTimeScheduled = null; + var isPastRoom = false; // signal user to archive this room if it's past if (props.room.type == RoomType.scheduled) { dateTimeScheduled = props.room.scheduledDateTime.toDate(); + + // check if the moment date scheduled is future or past + + if (moment(today).diff(moment(dateTimeScheduled)) > 0) { + isPastRoom = true; + } } function renderTopRightCardInfo() { @@ -234,7 +251,7 @@ export default function RoomCard(props: IRoomCardProps) { <> - + @@ -326,19 +343,34 @@ export default function RoomCard(props: IRoomCardProps) { {/* footer */} - + {membersInRoom()} + + {/* tell them to archive if it's past */} + {isPastRoom ? ( + + + + ) : ( + <> + )} + {isUserInRoom ? ( ) : ( diff --git a/helpers/dateTime.tsx b/helpers/dateTime.tsx index 7d4df49..9def876 100644 --- a/helpers/dateTime.tsx +++ b/helpers/dateTime.tsx @@ -13,3 +13,7 @@ export function generateGreetings(): string { return "Good morning"; } + +export function getTime(date?: Date) { + return date != null ? date.getTime() : 0; +}