From bf180f833442b93364fd82d3bb68e24ed86f6e01 Mon Sep 17 00:00:00 2001 From: Arjun Patel Date: Tue, 18 Jan 2022 16:24:20 -0800 Subject: [PATCH] setting up basics of the links --- components/Dashboard/Announcements.tsx | 98 ++++++++++++++- components/Dashboard/Links.tsx | 147 ++++++++++++++++++++++- components/Dashboard/Rooms.tsx | 2 +- components/Dashboard/TeamVoiceLine.tsx | 2 +- components/LinkCard.tsx | 63 ++++++++++ components/Modals/CreateOrUpdateLink.tsx | 41 +++++++ models/attachment.ts | 8 -- models/link.ts | 30 +++++ pages/teams/[teamid].tsx | 13 +- 9 files changed, 390 insertions(+), 14 deletions(-) create mode 100644 components/LinkCard.tsx create mode 100644 components/Modals/CreateOrUpdateLink.tsx delete mode 100644 models/attachment.ts create mode 100644 models/link.ts diff --git a/components/Dashboard/Announcements.tsx b/components/Dashboard/Announcements.tsx index f2d9961..636ec03 100644 --- a/components/Dashboard/Announcements.tsx +++ b/components/Dashboard/Announcements.tsx @@ -1,3 +1,99 @@ +import { FaAngleDown, FaCheck, FaMicrophoneAlt, FaPlay } from "react-icons/fa"; +import { UserStatus } from "../../models/user"; + +import Image from "next/image"; + export default function Announcements() { - return this is the announcements; + return ( +
+ + + + ANNOUNCEMENTS + + + + updates, pep talks, blockers, reminders + + + + {/* tab pane */} + + + Active + + + + Resolved + + + + + TODAY + + + + + + +
+ {/* adriana's announcement */} + + + + + profile + + + + Adriana + 5 minutes ago + + blockers + + + + + {/* arjun's announcement */} + + + + + profile + + + + Arjun + 30 minutes ago + + engineering + + + + + +
+
+ ); } diff --git a/components/Dashboard/Links.tsx b/components/Dashboard/Links.tsx index 43c76ff..c4070c9 100644 --- a/components/Dashboard/Links.tsx +++ b/components/Dashboard/Links.tsx @@ -1,3 +1,148 @@ +import { BsThreeDots } from "react-icons/bs"; +import { + FaAngleDown, + FaArchive, + FaAtlassian, + FaCode, + FaCopy, + FaExternalLinkAlt, + FaFilePdf, + FaLink, + FaPlus, +} from "react-icons/fa"; + +import Image from "next/image"; +import { Dropdown, Menu, Radio, Tooltip } from "antd"; +import { + ShowModalType, + useKeyboardContext, +} from "../../contexts/keyboardContext"; +import CreateOrUpdateLink from "../Modals/CreateOrUpdateLink"; +import { useState } from "react"; +import LinkCard from "../LinkCard"; + export default function Links() { - return this is the links; + const { handleModalType } = useKeyboardContext(); + + const TimePeriodFilterMenu = ( + + + Past 24 Hours (Coming Soon) + + + This Month (Coming Soon) + + + ); + + const [selectedTabPane, setSelectedTabPane] = useState( + LinkTypeFilter.me + ); + + return ( +
+ {/* header row */} + + {/* modal */} + + + + + + LINKS + {/* */} + + + + links: jira tickets, drive files/folders, powerpoints... + + + + {/* tab pane */} + {/* + + Team + + + + Personal + + + + Favorites + + */} + + + + Week + + + + + + + + + + + +
+ setSelectedTabPane(e.target.value)} + > + + {LinkTypeFilter.me}{" "} + {/* + {meRooms.length > 0 ? meRooms.length : ""} + */} + + + {LinkTypeFilter.team}{" "} + {/* {teamRooms.length} */} + + + + {LinkTypeFilter.favorites}{" "} + {/* + {liveRooms.length > 0 ? liveRooms.length : ""} + */} + + + + {LinkTypeFilter.archived}{" "} + {/* + {archivedRooms.length > 0 ? archivedRooms.length : ""} + */} + + +
+ + {/* table of links */} +
+ {/* pdf example */} + +
+
+ ); +} + +enum LinkTypeFilter { + team = "team", + me = "me", + favorites = "favorites", + archived = "archived", } diff --git a/components/Dashboard/Rooms.tsx b/components/Dashboard/Rooms.tsx index bcb697a..27bd559 100644 --- a/components/Dashboard/Rooms.tsx +++ b/components/Dashboard/Rooms.tsx @@ -130,7 +130,7 @@ export default function DashboardRoom() { Past 24 Hours (Coming Soon) - This Month(Coming Soon) + This Month (Coming Soon) ); diff --git a/components/Dashboard/TeamVoiceLine.tsx b/components/Dashboard/TeamVoiceLine.tsx index a2ba97e..daadccf 100644 --- a/components/Dashboard/TeamVoiceLine.tsx +++ b/components/Dashboard/TeamVoiceLine.tsx @@ -208,7 +208,7 @@ export default function TeamVoiceLine() { } return ( -
+
TEAM diff --git a/components/LinkCard.tsx b/components/LinkCard.tsx new file mode 100644 index 0000000..5e5b5b1 --- /dev/null +++ b/components/LinkCard.tsx @@ -0,0 +1,63 @@ +import { FaArchive, FaExternalLinkAlt, FaFilePdf } from "react-icons/fa"; +import Link from "../models/link"; +import Image from "next/image"; +import { BsThreeDots } from "react-icons/bs"; + +export default function LinkCard(props: { link?: Link }) { + return ( + + {/* attmnt header */} + + + + + report.pdf + + + {"asdfaSdfasdfsadfsdf"} + + + + {/* attachment actions */} + + + + + + {/* attmnt footer */} + + + + + profile + + + + + Adriana + + 5 minutes ago + + + + + + + ); +} + +function RenderFileIcon(props) { + return ; +} diff --git a/components/Modals/CreateOrUpdateLink.tsx b/components/Modals/CreateOrUpdateLink.tsx new file mode 100644 index 0000000..75d1607 --- /dev/null +++ b/components/Modals/CreateOrUpdateLink.tsx @@ -0,0 +1,41 @@ +import Modal from "antd/lib/modal/Modal"; +import { useState } from "react"; +import { + ShowModalType, + useKeyboardContext, +} from "../../contexts/keyboardContext"; + +export default function CreateOrUpdateLink() { + const { handleModalType, showModalType } = useKeyboardContext(); + + function closeModal() { + handleModalType(ShowModalType.na); + } + + const [link, setLink] = useState(""); + + return ( + +
+ + Link + + Please make sure this is valid for others to access. + + + setLink(e.target.value)} + /> + +
+ + ); +} diff --git a/models/attachment.ts b/models/attachment.ts deleted file mode 100644 index 89d03e2..0000000 --- a/models/attachment.ts +++ /dev/null @@ -1,8 +0,0 @@ -export default class Attachment { - id: string; - name: string; - description: string; - link: string; - - constructor() {} -} diff --git a/models/link.ts b/models/link.ts new file mode 100644 index 0000000..b35d0df --- /dev/null +++ b/models/link.ts @@ -0,0 +1,30 @@ +import { Timestamp } from "firebase/firestore"; + +export default class Link { + id: string; + name: string; + description: string; + link: string; //url for file + + state: AttachmentState = AttachmentState.active; + + isLoomScreenshare: boolean = false; + + teamId: string; + // if it's not a teamAttachment, then have a list of members who it's for + + createdByUserId: string; + createdDate: Timestamp; + + constructor(id: string, name: string, description: string) {} +} + +export enum AttachmentState { + active = "active", + archived = "archived", +} + +export enum AttachmentType { + link = "link", + screenshare = "", +} diff --git a/pages/teams/[teamid].tsx b/pages/teams/[teamid].tsx index 5a2bbfd..76e0979 100644 --- a/pages/teams/[teamid].tsx +++ b/pages/teams/[teamid].tsx @@ -17,6 +17,8 @@ import { TeamMemberStatus } from "../../models/teamMember"; import { UserStatus } from "../../models/user"; import TeamService from "../../services/teamService"; import UserService from "../../services/userService"; +import Announcements from "../../components/Dashboard/Announcements"; +import Links from "../../components/Dashboard/Links"; // User has switched back to the tab const onFocus = () => { @@ -83,9 +85,16 @@ function TeamDashboard() {
- +
+ + +
- +
+ + + +
);