feat: show sign-in button when trying to access room booking without …

…session

src/components/room-booking/RoomBookingPage.tsx

@@ -1,6 +1,8 @@
+import { useMe } from "@/api/accounts/user.ts";
+import { SignInButton } from "@/components/common/SignInButton.tsx";
+import { BookingModal } from "@/components/room-booking/BookingModal.tsx";
 import { lazy, Suspense, useState } from "react";
 import type { Booking, Slot } from "./BookingTimeline.vue";
-import { BookingModal } from "@/components/room-booking/BookingModal.tsx";
 
 const BookingTimeline = lazy(
   () => import("@/components/room-booking/BookingTimeline.tsx"),
@@ -11,6 +13,20 @@ export function RoomBookingPage() {
   const [newBookingSlot, setNewBookingSlot] = useState<Slot>();
   const [bookingDetails, setBookingDetails] = useState<Booking>();
 
+  const { me } = useMe();
+
+  if (!me) {
+    return (
+      <>
+        <h2 className="my-4 text-3xl font-medium">Sign in to get access</h2>
+        <p className="mb-4 text-lg text-text-secondary/75">
+          Access convenient booking service with your Innopolis account.
+        </p>
+        <SignInButton />
+      </>
+    );
+  }
+
   return (
     <>
       <Suspense>