Add unpublish feature

soof-golan · Oct 22, 2024 · b15a83b · b15a83b
1 parent b6b2236
commit b15a83b
Show file tree

Hide file tree

Showing 5 changed files with 50 additions and 10 deletions.
diff --git a/server/routes/room.py b/server/routes/room.py
@@ -51,6 +51,11 @@ class RoomId(BaseModel, TrpcMixin):
     id: uuid.UUID
 
 
+class RoomPublishRequest(BaseModel):
+    id: uuid.UUID
+    publish: bool
+
+
 @router.get("/room.readMany")
 @requires("authenticated", status_code=401)
 async def read_many(
@@ -310,15 +315,15 @@ async def room_update(
 async def publish(
     request: fastapi.Request,
     user: Annotated[User, Depends(authenticated_user)],
-    room: RoomId,
+    room: RoomPublishRequest,
     session: Annotated[AsyncSession, Depends(db_session)],
 ) -> TrpcResponse[RoomQuery]:
     async with session.begin():
         statement = (
             update(WaitingRoom)
             .where(WaitingRoom.id == str(room.id))
             .where(WaitingRoom.owner_id == user.id)
-            .values(published=True)
+            .values(published=room.publish)
             .returning(WaitingRoom)
         )
         result = (await session.execute(statement)).scalar_one()

diff --git a/website/components/WaitingRoomDashboardCard.tsx b/website/components/WaitingRoomDashboardCard.tsx
@@ -2,13 +2,15 @@ import Countdown from "./Countdown";
 import moment, { type Moment } from "moment";
 import { Link } from "../renderer/Link";
 import { useQuery } from "@tanstack/react-query";
+import { trpc } from "../utils/trpc";
 
 type WaitingRoomDashboardCardProps = {
   room: {
     id: string;
     title: string;
     opensAt: Moment;
     closesAt: Moment;
+    published: boolean;
   };
 };
 export default function WaitingRoomDashboardCard({
@@ -21,7 +23,7 @@ export default function WaitingRoomDashboardCard({
     : "closed";
 
   const headline = room.title || `Waiting Room ${room.id}`;
-
+  const utils = trpc.useUtils();
   const roomLiveQuery = useQuery<{
     urlReady: boolean;
   }>({
@@ -42,6 +44,18 @@ export default function WaitingRoomDashboardCard({
     },
   });
 
+  const publishApi = trpc.room.publish.useMutation({
+    mutationKey: ["room.publish", room.id],
+    networkMode: "online",
+    retry: false,
+    onSuccess: async () => {
+      await Promise.all([
+        utils.room.readUnique.invalidate({ id: room.id }),
+        utils.room.readMany.invalidate(),
+      ]);
+    },
+  });
+
   return (
     <div className="my-2 w-full overflow-hidden rounded-lg bg-white bg-opacity-80 shadow backdrop-blur-sm">
       <div className="flex items-center justify-between px-4 py-5 max-sm:flex-col sm:px-6">
@@ -55,14 +69,26 @@ export default function WaitingRoomDashboardCard({
             </button>
           </a>
           {roomLiveQuery.data.urlReady ? (
-            <Link href={`/room/${room.id}`}>
+            <>
+              <Link href={`/room/${room.id}`}>
+                <button
+                  className="mr-2 mt-2 rounded bg-indigo-500 px-4 py-2 text-white hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50"
+                  type="button"
+                >
+                  Open Waiting Room
+                </button>
+              </Link>
               <button
-                className="mr-2 mt-2 rounded bg-indigo-500 px-4 py-2 text-white hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50"
                 type="button"
+                disabled={!room.published}
+                onClick={() => {
+                  publishApi.mutate({ id: room.id, publish: false });
+                }}
+                className="mr-2 mt-2 rounded bg-red-500 px-4 py-2 text-white hover:bg-red-700 disabled:cursor-not-allowed disabled:opacity-50"
               >
-                Open Waiting Room
+                Unpublish
               </button>
-            </Link>
+            </>
           ) : (
             <a href={`/dashboard/editor/${room.id}`}>
               <button className="mr-2 mt-2 rounded bg-indigo-500 px-4 py-2 text-white hover:bg-indigo-700">

diff --git a/website/components/WaitingRoomEditor.tsx b/website/components/WaitingRoomEditor.tsx
@@ -470,7 +470,7 @@ export default function WaitingRoomEditor({ id }: WaitingRoomContentProps) {
                 type="button"
                 disabled={roomQuery.data.published || dirty}
                 onClick={() => {
-                  publishApi.mutate({ id });
+                  publishApi.mutate({ id, publish: true });
                 }}
                 className="mr-2 mt-2 rounded bg-indigo-500 px-4 py-2 text-white hover:bg-indigo-700 disabled:cursor-not-allowed disabled:opacity-50"
               >
@@ -487,7 +487,7 @@ export default function WaitingRoomEditor({ id }: WaitingRoomContentProps) {
                 ) : dirty ? (
                   <>Save before publishing</>
                 ) : (
-                  <>Publish (cannot be undone)</>
+                  <>Publish</>
                 )}
               </button>
             </div>

diff --git a/website/fakeServer/router.ts b/website/fakeServer/router.ts
@@ -15,6 +15,7 @@ import {
   RoomReadUniqueOutput,
   RoomStatsOutput,
   RoomParticipantsOutput,
+  roomPublishInputSchema,
 } from "../types/roomsProcedures";
 
 export const appRouter = router({
@@ -46,7 +47,7 @@ export const appRouter = router({
         return {} as RoomUpdateOutput;
       }),
     publish: protectedProcedure
-      .input(roomQueryInputSchema)
+      .input(roomPublishInputSchema)
       .mutation(async (): Promise<RoomUpdateOutput> => {
         return {} as RoomUpdateOutput;
       }),

diff --git a/website/types/roomsProcedures.ts b/website/types/roomsProcedures.ts
@@ -53,6 +53,12 @@ export const roomParticipantsOutputSchema = z.object({
 export const roomQueryInputSchema = z.object({
   id: z.string().uuid(),
 });
+
+export const roomPublishInputSchema = z.object({
+  id: z.string().uuid(),
+  publish: z.boolean(),
+});
+
 export const roomReadUniqueOutputSchema = roomQueryOutputSchema;
 
 export type RoomReadUniqueInput = z.infer<typeof roomQueryInputSchema>;
@@ -84,3 +90,5 @@ export type RoomStatsOutput = z.infer<typeof roomStatsOutputSchema>;
 export type RoomParticipantsOutput = z.infer<
   typeof roomParticipantsOutputSchema
 >;
+
+export type RoomPublishInput = z.infer<typeof roomPublishInputSchema>;