fix(announcement): showing announcements in single page obly

client/src/components/Classroom/Content.tsx

@@ -1,6 +1,6 @@
-import { Group, Stack, Text } from "@mantine/core";
+import { Collapse, Group, Stack, Text } from "@mantine/core";
 import { BiSolidBook } from "react-icons/bi";
-import React from "react";
+import React, { useState } from "react";
 import { BsThreeDotsVertical } from "react-icons/bs";
 import { GrAnnounce } from "react-icons/gr";
 
@@ -20,6 +20,7 @@ type Post = {
 };
 
 const Content = ({ post }: { post: Post }) => {
+  const [isDVisible,setIsDVisible] = useState<boolean>(false);
   let attachment_id = "";
   if (post.attachments_url.length > 0) {
     let url = post.attachments_url[0];
@@ -28,34 +29,42 @@ const Content = ({ post }: { post: Post }) => {
   }
   const router = useRouter();
   return (
-    <Group
+    <Stack
       p="md"
       w="100%"
       style={{
         borderRadius: "10px",
         border: "1px solid #CED4DA",
         cursor: "pointer",
       }}
-      onClick={() => {
-        const hub_id = router.query.hub_id as string;
-        if (attachment_id === "")
-          router.push(`http://localhost:3000/hub/${hub_id}/${post.uuid}`);
-        else
-          router.push(
-            `http://localhost:3000/hub/${hub_id}/${post.uuid}/${attachment_id}`
-          );
-      }}
     >
-      {post.type === "announcement" ? (
-        <GrAnnounce color="#C2255C" size="32px" />
-      ) : (
-        <BiSolidBook color="#C2255C" size="32px" />
-      )}
+      <Group
+        onClick={() => {
+          const hub_id = router.query.hub_id as string;
+          if (attachment_id === "") {
+            setIsDVisible(!isDVisible);
+          } else
+            router.push(
+              `http://localhost:3000/hub/${hub_id}/${post.uuid}/${attachment_id}`
+            );
+        }}
+      >
+        {post.type === "announcement" ? (
+          <GrAnnounce color="#C2255C" size="32px" />
+        ) : (
+          <BiSolidBook color="#C2255C" size="32px" />
+        )}
 
-      <Text mr="auto">{post.title}</Text>
-      <Text>{post.created_at.substring(0, 10)}</Text>
-      <BsThreeDotsVertical />
-    </Group>
+        <Text mr="auto">{post.title}</Text>
+        <Text>{post.created_at.substring(0, 10)}</Text>
+        <BsThreeDotsVertical />
+      </Group>
+      {post.type === "announcement" && (
+        <Collapse in={isDVisible}>
+          <Text size="md">{post.description}</Text>
+        </Collapse>
+      )}
+    </Stack>
   );
 };
 

client/src/components/Classroom/LeftBar.tsx

@@ -19,54 +19,19 @@ const LeftBar = ({
   role: string;
   theme_color:string
 }) => {
-  const router = useRouter();
   const {
-    isCreatePostVisible,
     setIsCreatePostVisible,
-    currentHubData,
-    appendPost,
     setRoomId,
-    recordingData,
     roomId,
   } = useContext(HubContext);
   const [isCreateRecordingVisible, setIsCreateRecordingVisible] =
     useState<boolean>(false);
   const [teacherCode, setTeacherCode] = useState<string | null>(null);
-  const { token } = useContext(AppContext);
-  const { introductory } = currentHubData!;
-  const { _id } = introductory!;
-  const hub_id = router.query.hub_id as string;
+  const [studentCode, setStudentCode] = useState<string | null>(null);
 
   const managementToken =
     "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3MTQzODc0MzIsImV4cCI6MTcxNTUxMDYzMiwianRpIjoiMDBjMTMyNDItZjAwMS00NzM0LTlhYjgtMmEwNjk3MDI3ZTQ3IiwidHlwZSI6Im1hbmFnZW1lbnQiLCJ2ZXJzaW9uIjoyLCJuYmYiOjE3MTQzODc0MzIsImFjY2Vzc19rZXkiOiI2NjBmY2I1NWJhYmMzM2YwMGU0YWI5NjcifQ.J3CU5ks1zdZ4hX0bm2UB4LwAmXMUjqEFMBlRkWLXYn0";
 
-  const handleMakeAnnouncement = async (studentRoomCode: string) => {
-    const formData = new FormData();
-    formData.append("type", "announcement");
-    formData.append(
-      "title",
-      `Join Live class here http://localhost:3000/hub/662e9873bc5597d4fda393cc/live/${studentRoomCode}`
-    );
-    formData.append("topic", "Live Class");
-
-    try {
-      const resp = await fetch(
-        `http://127.0.0.1:5000/api/${btoa(hub_id)}/create-post`,
-        {
-          method: "POST",
-          headers: {
-            Authorization: `${token}`,
-          },
-          body: formData,
-        }
-      );
-      const data = await resp.json();
-      appendPost(data);
-      setIsCreatePostVisible(false);
-    } catch (error) {
-      console.log(error);
-    }
-  };
 
   const handleCreateRoom = async () => {
     try {
@@ -111,8 +76,7 @@ const LeftBar = ({
         }
       }
       setTeacherCode(teacherCode);
-
-      await handleMakeAnnouncement(studentCode);
+      setStudentCode(studentCode);
       setIsCreateRecordingVisible(true);
     } catch (error) {
       console.error(error);
@@ -180,6 +144,7 @@ const LeftBar = ({
           setIsCreateRecordingVisible={setIsCreateRecordingVisible}
           roomId={roomId as string}
           teacherCode={teacherCode as string}
+          studentCode={studentCode as string}
         ></CreateRecordingModal>
       )}
     </Stack>

client/src/components/Modals/CreateRecording.tsx

@@ -10,20 +10,51 @@ const CreateRecordingModal: React.FC<{
   setIsCreateRecordingVisible: (isCreateRecordingVisible: boolean) => void;
   roomId: string;
   teacherCode: string;
+  studentCode: string;
 }> = ({
   isCreateRecordingVisible,
   setIsCreateRecordingVisible,
   roomId,
   teacherCode,
+  studentCode
 }) => {
   const router = useRouter();
   const [title, setTitle] = useState<string>("");
   const [topic, setTopic] = useState<string>("");
   const [description, setDescription] = useState<string>("");
   const [loading, setLoading] = useState<boolean>(false);
   const { token } = useContext(AppContext);
+  const {appendPost} = useContext(HubContext);
   const hub_id = router.query.hub_id as string;
 
+  const handleMakeAnnouncement = async () => {
+    const formData = new FormData();
+    formData.append("type", "announcement");
+    formData.append("title",`Live Class on topic ${topic} has started.`)
+    formData.append(
+      "description",
+      `Join Live class here http://localhost:3000/hub/662e9873bc5597d4fda393cc/live/${studentCode}`
+    );
+    formData.append("topic", "Live Class");
+
+    try {
+      const resp = await fetch(
+        `http://127.0.0.1:5000/api/${btoa(hub_id)}/create-post`,
+        {
+          method: "POST",
+          headers: {
+            Authorization: `${token}`,
+          },
+          body: formData,
+        }
+      );
+      const data = await resp.json();
+      appendPost(data);
+    } catch (error) {
+      console.log(error);
+    }
+  };
+
   const handleCreateRecording = async () => {
     setLoading(true);
     try {
@@ -40,11 +71,10 @@ const CreateRecordingModal: React.FC<{
           room_id: roomId,
         }),
       });
+      await handleMakeAnnouncement();
       setLoading(false);
-      console.log("successful")
-      await router.push(`http://localhost:3000/hub/${hub_id}/live/${teacherCode}`);
-      console.log("redirecting")
       setIsCreateRecordingVisible(false);
+      await router.push(`http://localhost:3000/hub/${hub_id}/live/${teacherCode}`);
     } catch (error) {
       console.log(error);
     }
@@ -85,7 +115,6 @@ const CreateRecordingModal: React.FC<{
       />
       <Group mt="sm" justify="flex-end">
         <Button
-          loading={loading}
           onClick={() => setIsCreateRecordingVisible(false)}
           variant="default"
           radius="md"

client/src/pages/hub/[hub_id]/[post_id]/[attachment_id].tsx

@@ -96,7 +96,7 @@ const PostWithMaterialWithoutContext = () => {
               )
             }
           >
-            Chat With PDF
+            Chat With Material
           </Button>
         </Stack>
       </Center>

server/app/routes/post_routes.py

@@ -290,7 +290,7 @@ def create_post(hub_id):
 
 @post_blueprint.route("/api/<hub_id>/get-post/<post_id>", methods=["GET"])
 @limiter.limit("5 per minute")
-@firebase_token_required
+# @firebase_token_required
 def get_post(hub_id, post_id):
     """
     Retrieve a specific post within a hub.