Appwrite collection recovered

src/app/components/Sidebar.jsx

@@ -2,9 +2,9 @@
 import { useState, useEffect } from "react";
 import Link from "next/link";
 import { usePathname, useRouter } from "next/navigation";
-import { FileText } from "lucide-react";
+import { FileText, Moon, Sun } from "lucide-react";
+import { FaLock, FaChevronDown, FaChevronUp } from "react-icons/fa";
 import { useTheme } from "../context/ThemeContext";
-import { account } from "../lib/appwrite";
 
 const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
   const pathname = usePathname();
@@ -25,17 +25,10 @@ const Sidebar = ({ sidebarOpen, setSidebarOpen, isCollapsed }) => {
       setSidebarOpen(false);
     }
   };
-  const handleLogout = async () => {
+  const handleLogout = () => {
-    try {
+    localStorage.removeItem("token"); // or account.deleteSession("current") if using Appwrite
-      await account.deleteSession("current");
+    router.push("/signup");
-      localStorage.removeItem("token");
-      // Force a full page reload to reset all state
-      window.location.href = "/";
-    } catch (error) {
-      console.error("Logout failed:", error);
-    }
   };
-
   // ---------------logo handling in dark mode-----------------------
   // Create a separate LogoImage component for better error handling
   function LogoImage({ darkSrc, lightSrc, darkMode, className, alt }) {

src/app/components/TokenTable.jsx

@@ -101,11 +101,11 @@ export default function TokenTable({ statusFilter }) {
   return (
     <div className={`flex items-center justify-center min-h-[200px] ${darkMode ? 'bg-gray-900' : 'bg-white'}`}>
       <div className="text-center">
-          <div
+        <div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto ${
-            className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto ${darkMode === true ? "border-gray-100" : "border-blue-400"
+          darkMode === true ? 'border-gray-100' : 'border-gray-900'
-              }`}
+        }`}></div>
-          ></div>
+        <p className={`mt-4 text-lg font-semibold ${
-          <p className={`mt-4 text-lg font-semibold ${darkMode === true ? 'text-gray-100' : 'text-gray-900'
+          darkMode === true ? 'text-gray-100' : 'text-gray-900'
         }`}>
           Loading...
         </p>
@@ -115,9 +115,11 @@ export default function TokenTable({ statusFilter }) {
 }
 if (loading) return (
   <div className={`text-center py-10 ${darkMode ? 'bg-gray-900' : 'bg-white'}`}>
-      <div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 mx-auto ${darkMode ? 'border-gray-100' : 'border-blue-400'
+    <div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 mx-auto ${
+      darkMode ? 'border-gray-100' : 'border-gray-900'
     }`}></div>
-      <p className={`mt-4 text-lg font-semibold ${darkMode ? 'text-gray-100' : 'text-gray-900'
+    <p className={`mt-4 text-lg font-semibold ${
+      darkMode ? 'text-gray-100' : 'text-gray-900'
     }`}>
       Loading...
     </p>
@@ -135,7 +137,8 @@ export default function TokenTable({ statusFilter }) {
     <input
       type="text"
       placeholder="Search by token or name"
-        className={`mb-4 p-2 border rounded w-full max-w-sm transition-colors ${darkMode
+      className={`mb-4 p-2 border rounded w-full max-w-sm transition-colors ${
+        darkMode 
           ? 'bg-gray-800 border-gray-700 text-white placeholder-gray-400 focus:ring-blue-500 focus:border-blue-500' 
           : 'bg-white border-gray-300 placeholder-gray-500 focus:ring-blue-500 focus:border-blue-500'
       }`}
@@ -169,7 +172,8 @@ export default function TokenTable({ statusFilter }) {
                   <td className="p-3">{entry.patientName}</td>
                   <td className="p-3">
                     <span
-                        className={`px-2 py-1 rounded-full text-xs font-semibold ${entry.status === "done"
+                      className={`px-2 py-1 rounded-full text-xs font-semibold ${
+                        entry.status === "done"
                           ? darkMode 
                             ? "bg-green-900 text-green-100" 
                             : "bg-green-100 text-green-800"
@@ -190,7 +194,8 @@ export default function TokenTable({ statusFilter }) {
                       <>
                         <button
                           onClick={() => updateStatus(entry.$id, "done")}
-                            className={`border rounded-full px-2 py-1 text-xs transition-colors ${darkMode
+                          className={`border rounded-full px-2 py-1 text-xs transition-colors ${
+                            darkMode
                               ? 'border-green-400 text-green-400 hover:bg-green-900'
                               : 'border-green-600 text-green-600 hover:bg-green-50'
                           }`}
@@ -199,7 +204,8 @@ export default function TokenTable({ statusFilter }) {
                         </button>
                         <button
                           onClick={() => updateStatus(entry.$id, "missed")}
-                            className={`border rounded-full px-2 py-1 text-xs transition-colors ${darkMode
+                          className={`border rounded-full px-2 py-1 text-xs transition-colors ${
+                            darkMode
                               ? 'border-red-400 text-red-400 hover:bg-red-900'
                               : 'border-red-600 text-red-600 hover:bg-red-50'
                           }`}
@@ -215,12 +221,14 @@ export default function TokenTable({ statusFilter }) {
           </table>
         </div>
 
-          <div className={`flex justify-between items-center mt-4 p-2 rounded ${darkMode ? 'bg-gray-800' : 'bg-gray-100'
+        <div className={`flex justify-between items-center mt-4 p-2 rounded ${
+          darkMode ? 'bg-gray-800' : 'bg-gray-100'
         }`}>
           <button
             disabled={currentPage === 1}
             onClick={() => setCurrentPage((prev) => prev - 1)}
-              className={`px-3 py-1 border rounded disabled:opacity-50 transition-colors ${darkMode
+            className={`px-3 py-1 border rounded disabled:opacity-50 transition-colors ${
+              darkMode 
                 ? 'border-gray-600 hover:bg-gray-700 disabled:hover:bg-transparent' 
                 : 'border-gray-300 hover:bg-gray-200 disabled:hover:bg-transparent'
             }`}
@@ -233,7 +241,8 @@ export default function TokenTable({ statusFilter }) {
           <button
             disabled={currentPage === totalPages}
             onClick={() => setCurrentPage((prev) => prev + 1)}
-              className={`px-3 py-1 border rounded disabled:opacity-50 transition-colors ${darkMode
+            className={`px-3 py-1 border rounded disabled:opacity-50 transition-colors ${
+              darkMode 
                 ? 'border-gray-600 hover:bg-gray-700 disabled:hover:bg-transparent' 
                 : 'border-gray-300 hover:bg-gray-200 disabled:hover:bg-transparent'
             }`}

src/app/dashboard/page.js

@@ -1,6 +1,5 @@
-
+// src/app/dashboard/page.js
 "use client";
-
 import { useRouter } from "next/navigation";
 import { useAuth } from "../context/AuthContext";
 import { useEffect } from "react";
@@ -23,16 +22,12 @@ export default function DashboardPage() {
     return (
       <div className="flex items-center justify-center min-h-screen bg-white dark:bg-gray-900">
         <div className="text-center">
-          <div
+          <div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto ${
-            className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto ${
+            darkMode === true ? 'border-gray-100' : 'border-gray-900'
-              darkMode === true ? "border-gray-100" : "border-gray-900"
+          }`}></div>
-            }`}
+          <p className={`mt-4 text-lg font-semibold ${
-          ></div>
+            darkMode === true ? 'text-gray-100' : 'text-gray-900'
-          <p
+          }`}>
-            className={`mt-4 text-lg font-semibold ${
-              darkMode === true ? "text-gray-100" : "text-gray-900"
-            }`}
-          >
             Loading...
           </p>
         </div>
@@ -44,28 +39,12 @@ export default function DashboardPage() {
     return null;
   }
 
-  // Check if user is admin or staff to show entries table
-  const canViewEntries = userRole === "admin" || userRole === "staff";
-
   return (
-    <main
+    <main className={`min-h-screen transition-colors duration-300 ${
-      className={`min-h-screen transition-colors duration-300 ${
+      darkMode ? 'dark bg-gray-900' : 'bg-white'
-        darkMode ? "dark bg-gray-900" : "bg-white"
+    }`}>
-      }`}
-    >
       <div className="p-1">
-        {canViewEntries ? (
         <EntriesTable />
-        ) : (
-          <div className="text-center p-8">
-            <h2 className={`text-2xl font-semibold ${darkMode ? "text-white" : "text-gray-800"}`}>
-              Welcome to your Dashboard
-            </h2>
-            <p className={`mt-4 ${darkMode ? "text-gray-300" : "text-gray-600"}`}>
-              You don't have permission to view entries.
-            </p>
-          </div>
-        )}
       </div>
     </main>
   );

src/app/page.js

@@ -90,7 +90,7 @@ export default function AuthPage() {
         if (user) {
           localStorage.setItem("isLoggedIn", "true");
           setIsAuthenticated(true);
-          window.location.href = '/dashboard';
+          router.push("/dashboard");
         }
       }
     } catch (error) {

src/app/pages/MultiBooked/page.js

@@ -82,7 +82,7 @@ const createEntries = async () => {
     }
 
     setBookings(updatedBookings);
-    // alert(`${validBookings.length} tokens created successfully!`);
+    alert(`${validBookings.length} tokens created successfully!`);
   } catch (error) {
     console.error("Creation error:", error);
     setError(error.message);

src/app/pages/MultiBooking/page.js

@@ -1,126 +1,44 @@
-
 "use client";
-import { useState, useEffect } from "react";
+import { useState } from 'react';
-import { useRouter } from "next/navigation";
+import { useRouter } from 'next/navigation';
 import Header from "../../components/partials/header";
 import { useTheme } from "../../context/ThemeContext";
-import { databases, Query } from "../../lib/appwrite";
-import { DATABASE_ID, COLLECTION_ID } from "../../lib/api";
 
 export default function MultiBooking() {
   const { darkMode } = useTheme();
   const router = useRouter();
-
+  const [appointmentDate, setAppointmentDate] = useState(new Date().toISOString().split('T')[0]);
-  const [appointmentDate, setAppointmentDate] = useState(
-    new Date().toISOString().split("T")[0]
-  );
   const [patients, setPatients] = useState(
-    Array(5)
+    Array(5).fill().map((_, i) => ({ id: i+1, name: "" }))
-      .fill()
-      .map((_, i) => ({ id: i + 1, name: "" }))
   );
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
 
-  // Header related states - matching EntriesTable
-  const [entries, setEntries] = useState([]);
-  const [currentToken, setCurrentToken] = useState(null);
-  const [previousToken, setPreviousToken] = useState(null);
-  const [nextToken, setNextToken] = useState(null);
-  const [missedTokens, setMissedTokens] = useState("");
-  const [dataLoading, setDataLoading] = useState(true);
-
   const handleNameChange = (id, value) => {
-    setPatients(patients.map((p) => (p.id === id ? { ...p, name: value } : p)));
+    setPatients(patients.map(p => 
+      p.id === id ? { ...p, name: value } : p
+    ));
   };
 
-  // Get entries from database - similar to EntriesTable
-  const getEntries = async () => {
-    try {
-      const today = new Date().toISOString().split("T")[0];
-      const response = await databases.listDocuments(
-        DATABASE_ID,
-        COLLECTION_ID,
-        [Query.equal("date", today), Query.orderAsc("tokenNumber")],
-        100
-      );
-      return response.documents;
-    } catch (error) {
-      console.error("Fetch error:", error);
-      throw error;
-    }
-  };
-
-  // Update token information - same as EntriesTable
-  const updateTokenInfo = (entries) => {
-    if (entries.length === 0) {
-      setCurrentToken(null);
-      setPreviousToken(null);
-      setNextToken(null);
-      setMissedTokens("");
-      return;
-    }
-
-    const currentIndex = entries.findIndex(
-      (entry) => entry.status === "booked"
-    );
-    const current = currentIndex >= 0 ? entries[currentIndex] : null;
-
-    setCurrentToken(current?.tokenNumber || null);
-    setPreviousToken(
-      currentIndex > 0 ? entries[currentIndex - 1]?.tokenNumber : null
-    );
-    setNextToken(
-      currentIndex < entries.length - 1
-        ? entries[currentIndex + 1]?.tokenNumber
-        : null
-    );
-
-    const missed = entries
-      .filter((entry) => entry.status === "missed")
-      .map((entry) => entry.tokenNumber)
-      .join(", ");
-    setMissedTokens(missed || "None");
-  };
-
-  // Load token data - similar to EntriesTable
-  useEffect(() => {
-    const loadTokenData = async () => {
-      try {
-        setDataLoading(true);
-        const data = await getEntries();
-        setEntries(data);
-        updateTokenInfo(data);
-      } catch (err) {
-        console.error("Error loading token data:", err);
-      } finally {
-        setDataLoading(false);
-      }
-    };
-
-    loadTokenData();
-  }, []);
-
   const handleSubmit = async (e) => {
     e.preventDefault();
     setLoading(true);
     setError(null);
 
     try {
-      const validPatients = patients.filter((p) => p.name.trim() !== "");
+      // Filter out empty names and validate
+      const validPatients = patients.filter(p => p.name.trim() !== "");
       if (validPatients.length === 0) {
-        throw new Error("Please enter at least one patient name.");
+        throw new Error("Please enter at least one patient name");
       }
 
-      sessionStorage.setItem(
+      // Store in session to use in MultiBooked page
-        "multiBookingData",
+      sessionStorage.setItem('multiBookingData', JSON.stringify({
-        JSON.stringify({
         date: appointmentDate,
-          patients: validPatients,
+        patients: validPatients
-        })
+      }));
-      );
 
-      router.push("/pages/MultiBooked");
+      router.push('/pages/MultiBooked');
     } catch (error) {
       setError(error.message);
     } finally {
@@ -129,32 +47,23 @@ export default function MultiBooking() {
   };
 
   const addMorePatients = () => {
-    if (patients.length >= 20) return;
+    const newId = patients.length > 0 ? 
-    const newId =
+      Math.max(...patients.map(p => p.id)) + 1 : 1;
-      patients.length > 0 ? Math.max(...patients.map((p) => p.id)) + 1 : 1;
     setPatients([...patients, { id: newId, name: "" }]);
   };
 
   return (
-    <div
+    <div className={`flex h-screen overflow-hidden ${darkMode ? 'dark bg-gray-900' : 'bg-white'}`}>
-      className={`flex h-screen overflow-hidden ${
+      {/* Content Area */}
-        darkMode ? "dark bg-gray-900" : "bg-white"
-      }`}
-    >
       <div className="relative flex flex-1 flex-col overflow-x-hidden overflow-y-auto">
+        {/* Sticky Header */}
         <header className="sticky top-0 z-50 bg-white shadow-sm dark:bg-gray-800">
           <div className="flex items-center justify-between">
-            {/* Pass the same props to Header as in EntriesTable */}
+            <Header />
-            <Header
-              currentToken={currentToken}
-              previousToken={previousToken}
-              nextToken={nextToken}
-              missedTokens={missedTokens}
-              entries={entries}
-            />
           </div>
         </header>
 
+        {/* Main Content */}
         <main className="flex-1 overflow-y-auto scrollbar-hide">
           <div className="mx-auto max-w-[--breakpoint-2xl] p-4 md:p-6 pt-20">
             {error && (
@@ -164,30 +73,18 @@ export default function MultiBooking() {
             )}
 
             <div className="mb-6">
-              <h2
+              <h2 className={`text-2xl mb-2 ${darkMode ? 'text-white' : 'text-black'}`}>
-                className={`text-2xl mb-2 ${
-                  darkMode ? "text-white" : "text-black"
-                }`}
-              >
                 Staff Multi-Booking
               </h2>
               <div className="flex items-center">
-                <label
+                <label className={`mr-2 ${darkMode ? 'text-gray-300' : 'text-gray-700'}`}>
-                  className={`mr-2 ${
-                    darkMode ? "text-gray-300" : "text-gray-700"
-                  }`}
-                >
                   Date:
                 </label>
                 <input
                   type="date"
                   value={appointmentDate}
                   onChange={(e) => setAppointmentDate(e.target.value)}
-                  className={`p-1 border rounded ${
+                  className={`p-1 border rounded ${darkMode ? 'bg-gray-800 text-white border-gray-700' : 'bg-white'}`}
-                    darkMode
-                      ? "bg-gray-800 text-white border-gray-700"
-                      : "bg-white"
-                  }`}
                 />
               </div>
             </div>
@@ -196,40 +93,27 @@ export default function MultiBooking() {
               <div className="space-y-4 mb-6">
                 {patients.map((patient) => (
                   <div key={patient.id} className="flex items-center gap-3">
-                    <span
+                    <span className={`w-6 text-right ${darkMode ? 'text-gray-300' : 'text-gray-700'}`}>
-                      className={`w-6 text-right ${
-                        darkMode ? "text-gray-300" : "text-gray-700"
-                      }`}
-                    >
                       {patient.id}.
                     </span>
                     <input
                       type="text"
                       value={patient.name}
-                      onChange={(e) =>
+                      onChange={(e) => handleNameChange(patient.id, e.target.value)}
-                        handleNameChange(patient.id, e.target.value)
-                      }
                       placeholder="Patient name"
                       className={`flex-1 shadow-theme-xs h-11 rounded-lg border px-4 py-2.5 text-sm focus:outline-none focus:ring-2 ${
-                        darkMode
+                        darkMode ? 
-                          ? "bg-gray-800 border-gray-700 text-white placeholder-gray-500 focus:border-blue-800 focus:ring-blue-800/30"
+                        'bg-gray-800 border-gray-700 text-white placeholder-gray-500 focus:border-blue-800 focus:ring-blue-800/30' : 
-                          : "bg-white border-gray-300 text-gray-800 placeholder-gray-400 focus:border-blue-300 focus:ring-blue-500/10"
+                        'bg-white border-gray-300 text-gray-800 placeholder-gray-400 focus:border-blue-300 focus:ring-blue-500/10'
                       }`}
                     />
                     {patient.id > 5 && (
                       <button
                         type="button"
-                        onClick={() =>
+                        onClick={() => setPatients(patients.filter(p => p.id !== patient.id))}
-                          setPatients(
-                            patients.filter((p) => p.id !== patient.id)
-                          )
-                        }
                         className={`p-2 rounded-full ${
-                          darkMode
+                          darkMode ? 'text-red-400 hover:bg-gray-700' : 'text-red-500 hover:bg-gray-100'
-                            ? "text-red-400 hover:bg-gray-700"
-                            : "text-red-500 hover:bg-gray-100"
                         }`}
-                        title="Remove"
                       >
                         ✕
                       </button>
@@ -238,27 +122,20 @@ export default function MultiBooking() {
                 ))}
               </div>
 
-              <div className="flex flex-wrap gap-3 mb-6 items-center">
+              <div className="flex flex-wrap gap-3 mb-6">
                 <button
                   type="button"
                   onClick={addMorePatients}
-                  disabled={patients.length >= 20}
                   className={`px-4 py-2 rounded-lg text-sm font-medium ${
-                    darkMode
+                    darkMode ? 
-                      ? "bg-gray-700 text-white hover:bg-gray-600"
+                    'bg-gray-700 text-white hover:bg-gray-600' : 
-                      : "bg-gray-200 text-gray-700 hover:bg-gray-300"
+                    'bg-gray-200 text-gray-700 hover:bg-gray-300'
-                  } ${
-                    patients.length >= 20 ? "opacity-50 cursor-not-allowed" : ""
                   }`}
                 >
                   + Add More Patients
                 </button>
-                <div
+                <div className="text-sm text-gray-500 dark:text-gray-400 mt-1">
-                  className={`text-sm mt-1 ${
+                  {patients.length} patients entered
-                    darkMode ? "text-gray-400" : "text-gray-600"
-                  }`}
-                >
-                  {patients.length} / 20 patients entered
                 </div>
               </div>
 
@@ -267,20 +144,18 @@ export default function MultiBooking() {
                   type="submit"
                   disabled={loading}
                   className={`text-center rounded-lg px-5 py-3.5 text-sm font-medium text-white shadow-theme-xs transition w-full ${
-                    loading
+                    loading ? 'bg-blue-400 cursor-not-allowed' : 'bg-blue-700 hover:bg-blue-600'
-                      ? "bg-blue-400 cursor-not-allowed"
-                      : "bg-blue-700 hover:bg-blue-600"
                   }`}
                 >
-                  {loading ? "Processing..." : "Generate Tokens"}
+                  {loading ? 'Processing...' : 'Generate Tokens'}
                 </button>
                 <button
                   type="button"
-                  onClick={() => router.push("/entries")}
+                  onClick={() => router.push('/entries')}
                   className={`text-center rounded-lg px-5 py-3.5 text-sm font-medium shadow-theme-xs ring-1 ring-inset transition w-full ${
-                    darkMode
+                    darkMode ? 
-                      ? "bg-gray-800 text-gray-300 ring-gray-700 hover:bg-gray-700"
+                    'bg-gray-800 text-gray-300 ring-gray-700 hover:bg-gray-700' : 
-                      : "bg-white text-gray-700 ring-gray-300 hover:bg-gray-50"
+                    'bg-white text-gray-700 ring-gray-300 hover:bg-gray-50'
                   }`}
                 >
                   View All Entries
@@ -288,18 +163,11 @@ export default function MultiBooking() {
               </div>
             </form>
             
-            <div
+            <div className={`text-center mt-8 text-sm ${
-              className={`text-center mt-8 text-sm ${
+              darkMode ? 'text-gray-400' : 'text-gray-600'
-                darkMode ? "text-gray-400" : "text-gray-600"
+            }`}>
-              }`}
+              <p>Staff can book multiple tokens at once. All tokens will be assigned for the same date.</p>
-            >
+              <p className="mt-1">Minimum 1 patient required. Maximum 20 patients per batch.</p>
-              <p>
-                Staff can book multiple tokens at once. All tokens will be
-                assigned for the same date.
-              </p>
-              <p className="mt-1">
-                Minimum 1 patient required. Maximum 20 patients per batch.
-              </p>
             </div>
           </div>
         </main>

src/app/pages/ResetPasswordPage/page.js

@@ -17,24 +17,16 @@ export default function ResetPasswordPage() {
   const { darkMode, toggleDarkMode } = useTheme();
   const [email, setEmail] = useState("");
   const [loading, setLoading] = useState(false);
-  const [message, setMessage] = useState({ text: "", type: "" }); // type can be "success" or "error"
 
   const handleSubmit = async (e) => {
     e.preventDefault();
     setLoading(true);
-    setMessage({ text: "", type: "" });
     try {
       await account.createRecovery(email, "http://localhost:3000/reset-password");
-      setMessage({ 
+      alert("Password reset link sent to your email!");
-        text: "Password reset link sent to your email!", 
-        type: "success" 
-      });
     } catch (error) {
       console.error("Error:", error);
-      setMessage({ 
+      alert(`Failed to send reset link: ${error.message}`);
-        text: `Failed to send reset link: ${error.message}`, 
-        type: "error" 
-      });
     } finally {
       setLoading(false);
     }
@@ -61,15 +53,6 @@ export default function ResetPasswordPage() {
               <p className="text-sm text-gray-500 dark:text-gray-400">
                 Enter your email address linked to your account, and we&apos;ll send you a link to reset your password.
               </p>
-              {message.text && (
-                <div className={`mt-4 p-3 rounded-md ${
-                  message.type === "success" 
-                    ? "bg-green-100 text-green-700 dark:bg-green-900 dark:text-green-200" 
-                    : "bg-red-100 text-red-700 dark:bg-red-900 dark:text-red-200"
-                }`}>
-                  {message.text}
-                </div>
-              )}
               <form onSubmit={handleSubmit}>
                 <div className="space-y-5">
                   <div>

src/app/pages/SignInPage/page.js

@@ -87,7 +87,7 @@ export default function SignInPage() {
       {/* Left Side - Form */}
       <div className="w-full  flex flex-col justify-center p-6 sm:p-12 lg:p-16">
         <div className="w-full max-w-md mx-auto">
-          {/* <Link
+          <Link
             href="/dashboard"
             className="inline-flex items-center text-sm text-gray-500 transition-colors hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300 mb-10"
           >
@@ -108,7 +108,7 @@ export default function SignInPage() {
               />
             </svg>
             Back to dashboard
-          </Link> */}
+          </Link>
 
           <div className="mb-8">
             <h1 className="mb-2 text-2xl font-bold text-gray-800 dark:text-white/90 sm:text-3xl">

src/app/pages/SignUpPage/page.js

@@ -86,7 +86,7 @@ export default function SignUpPage() {
         {/* Form */}
         <div className="flex flex-col flex-1 w-full">
           <div className="w-full max-w-md pt-5 mx-auto sm:py-10">
-            {/* <Link
+            <Link
               href="/dashboard"
               className="inline-flex items-center text-sm text-gray-500 transition-colors hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300"
             >
@@ -107,7 +107,7 @@ export default function SignUpPage() {
                 />
               </svg>
               Back to dashboard
-            </Link> */}
+            </Link>
           </div>
           <div className="flex flex-col justify-center flex-1 w-full max-w-md mx-auto">
             <div className="mb-5 sm:mb-8">

src/app/pages/entries/EntriesTable.js

@@ -5,7 +5,6 @@ import { DATABASE_ID, COLLECTION_ID } from "../../lib/api";
 import Header from "../../components/partials/header";
 import { useTheme } from "../../context/ThemeContext";
 import { useAuth } from "../../context/AuthContext";
-import { FaSearch } from 'react-icons/fa';
 
 export default function EntriesTable() {
   const { userRole } = useAuth();
@@ -14,7 +13,7 @@ export default function EntriesTable() {
   const [filteredEntries, setFilteredEntries] = useState([]);
   const [searchQuery, setSearchQuery] = useState("");
   const [currentPage, setCurrentPage] = useState(1);
-  const [avgConsultTime, setAvgConsultTime] = useState(15);
+  const [avgConsultTime, setAvgConsultTime] = useState(15); // Default 15 mins
   const entriesPerPage = 20;
 
   const [currentToken, setCurrentToken] = useState(null);
@@ -24,21 +23,23 @@ export default function EntriesTable() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState(null);
 
+  // Calculate waiting time based on position in queue
   const calculateWaitTime = (tokenNumber) => {
-    const bookedEntries = entries.filter((e) => e.status === "booked");
+    const bookedEntries = entries.filter(e => e.status === "booked");
-    const position = bookedEntries.findIndex(
+    const position = bookedEntries.findIndex(e => e.tokenNumber === tokenNumber);
-      (e) => e.tokenNumber === tokenNumber
+    return position >= 0 ? (position * avgConsultTime) : 0;
-    );
-    return position >= 0 ? position * avgConsultTime : 0;
   };
 
   const getEntries = async () => {
     try {
-      const today = new Date().toISOString().split("T")[0];
+      const today = new Date().toISOString().split('T')[0];
       const response = await databases.listDocuments(
         DATABASE_ID,
         COLLECTION_ID,
-        [Query.equal("date", today), Query.orderAsc("tokenNumber")],
+        [
+          Query.equal('date', today),
+          Query.orderAsc('tokenNumber')
+        ],
         100
       );
       return response.documents;
@@ -62,9 +63,7 @@ export default function EntriesTable() {
 
     setCurrentToken(current?.tokenNumber || null);
     setPreviousToken(currentIndex > 0 ? entries[currentIndex - 1]?.tokenNumber : null);
-    setNextToken(
+    setNextToken(currentIndex < entries.length - 1 ? entries[currentIndex + 1]?.tokenNumber : null);
-      currentIndex < entries.length - 1 ? entries[currentIndex + 1]?.tokenNumber : null
-    );
 
     const missed = entries
       .filter((entry) => entry.status === "missed")
@@ -76,9 +75,12 @@ export default function EntriesTable() {
   const updateStatus = async (entryId, newStatus) => {
     try {
       setLoading(true);
-      await databases.updateDocument(DATABASE_ID, COLLECTION_ID, entryId, {
+      await databases.updateDocument(
-        status: newStatus,
+        DATABASE_ID,
-      });
+        COLLECTION_ID,
+        entryId,
+        { status: newStatus }
+      );
       const data = await getEntries();
       setEntries(data);
       setFilteredEntries(data);
@@ -92,13 +94,18 @@ export default function EntriesTable() {
   };
 
   useEffect(() => {
-    if (userRole === "patient") return;
+    if (userRole === "patient") return; // Don't load data if patient
+
     const loadData = async () => {
       try {
         const data = await getEntries();
         setEntries(data);
         setFilteredEntries(data);
         updateTokenInfo(data);
+
+        // Load settings (avg consultation time)
+        // const settings = await getSettings();
+        // setAvgConsultTime(settings?.avgConsultationTime || 15);
       } catch (err) {
         setError(err.message);
       } finally {
@@ -124,19 +131,17 @@ export default function EntriesTable() {
   const currentEntries = filteredEntries.slice(indexOfFirstEntry, indexOfLastEntry);
   const totalPages = Math.ceil(filteredEntries.length / entriesPerPage);
 
-  if (loading)
+  if (loading) return <div className="text-center mt-50">
-    return (
+    <div className={`animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto`}></div>
-      <div className="text-center mt-20">
+    <p className={`mt-4 text-lg font-semibold`}>Loading...</p>
-        <div className="animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-blue-500 mx-auto"></div>
+  </div>;
-        <p className="mt-4 text-lg font-semibold">Loading...</p>
-      </div>
-    );
 
   if (error) return <div className="p-4 text-red-500">Error: {error}</div>;
 
+  // Check user role and show permission message if patient
   if (userRole === "patient") {
     return (
-      <div className={`min-h-screen w-full ${darkMode ? "bg-gray-900 text-white" : "bg-white text-black"}`}>
+      <div className={`min-h-screen w-full ${darkMode ? 'bg-gray-900 text-white' : 'bg-white text-black'}`}>
         <div className="flex items-center justify-center h-screen">
           <div className="text-center">
             <h1 className="text-2xl font-bold mb-4">Access Denied</h1>
@@ -148,56 +153,24 @@ export default function EntriesTable() {
   }
 
   return (
-    <div className={`min-h-screen w-full ${darkMode ? "bg-gray-900 text-white" : "bg-white text-black"}`}>
+    <div className={`min-h-screen w-full ${darkMode ? 'bg-gray-900 text-white' : 'bg-white text-black'}`}>
       <div className="sticky top-0 z-10 bg-white shadow-md mb-4">
         <Header
           currentToken={currentToken}
           previousToken={previousToken}
           nextToken={nextToken}
           missedTokens={missedTokens}
-          entries={entries}
+          entries={entries} // Pass the entries data
         />
       </div>
-
-      <div className="p-4">
       <h1 className="text-2xl font-bold mb-4">Today&apos;s Entries</h1>
-       <div className={`
-  hidden md:flex items-center gap-[2px] 
-  border ${darkMode ? 'border-gray-600 bg-gray-800' : 'border-gray-300 bg-white'}
-  p-2 rounded-lg 
-  h-[45px] w-[300px] lg:w-[400px] ml-2 mb-6
-  transition-colors duration-300
-  focus-within:ring-2 focus-within:ring-blue-500 focus-within:ring-opacity-50
-  ${darkMode ? 'focus-within:border-gray-500' : 'focus-within:border-blue-500'}
-`}>
-  <div className="relative flex-1">
-    <FaSearch className={`
-      absolute left-3 top-1/2 transform -translate-y-1/2 
-      ${darkMode ? 'text-gray-400' : 'text-gray-500'}
-    `} />
       <input
         type="text"
         placeholder="Search by token or name"
-      className={`
+        className="mb-4 p-2 border rounded bg-white w-full max-w-sm"
-        w-full bg-transparent border-none 
-        pl-10 pr-10 py-2 
-        focus:outline-none 
-        ${darkMode ? 'text-gray-200 placeholder-gray-500' : 'text-gray-800 placeholder-gray-400'}
-        text-sm
-      `}
         value={searchQuery}
         onChange={(e) => setSearchQuery(e.target.value)}
       />
-  </div>
-  <div className={`
-    px-2 py-1 
-    ${darkMode ? 'bg-gray-700 text-gray-300' : 'bg-gray-100 text-gray-500'}
-    text-xs rounded-md 
-    font-mono
-  `}>
-    ⌘K
-  </div>
-</div>
 
       {filteredEntries.length === 0 ? (
         <div className="p-4">No entries found for today.</div>
@@ -208,7 +181,9 @@ export default function EntriesTable() {
               <tr>
                 <th className="p-3 text-left">Token</th>
                 <th className="p-3 text-left">Name</th>
+                {/* <th className="p-3 text-left">Booked By</th> */}
                 <th className="p-3 text-left">Status</th>
+                {/* <th className="p-3 text-left">Wait Time</th> */}
                 <th className="p-3 text-left">Actions</th>
               </tr>
             </thead>
@@ -216,23 +191,35 @@ export default function EntriesTable() {
               {currentEntries.map((entry) => (
                 <tr
                   key={entry.$id}
-                    className={`border ${darkMode ? "border-gray-700" : "border-gray-200"}`}
+                  className={`border ${darkMode ? 'border-gray-700' : 'border-gray-200'}`}
                 >
                   <td className="p-3 font-mono">{entry.tokenNumber}</td>
                   <td className="p-3">{entry.patientName}</td>
+                  {/* <td className="p-3">
+                    <span className={`text-xs px-2 py-1 rounded ${entry.bookedBy === 'staff' ?
+                      'bg-purple-100 text-purple-800' :
+                      'bg-blue-100 text-blue-800'
+                      }`}>
+                      {entry.bookedBy}
+                    </span>
+                  </td> */}
                   <td className="p-3">
                     <span
-                        className={`px-2 py-1 rounded-full text-xs font-semibold ${
+                      className={`px-2 py-1 rounded-full text-xs ${entry.status === "done"
-                          entry.status === "done"
                         ? "bg-green-100 text-green-800"
                         : entry.status === "booked"
                           ? "bg-yellow-100 text-yellow-800"
                           : "bg-red-100 text-red-800"
-                        }`}
+                        } font-semibold`}
                     >
                       {entry.status === "booked" ? "In-Queue" : entry.status}
                     </span>
                   </td>
+                  {/* <td className="p-3">
+                    {entry.status === "booked" ?
+                      `~${calculateWaitTime(entry.tokenNumber)} mins` :
+                      '-'}
+                  </td> */}
                   <td className="p-3 flex gap-2">
                     {entry.status === "booked" && (
                       <>
@@ -257,11 +244,8 @@ export default function EntriesTable() {
           </table>
 
           {/* Pagination */}
-            <div
+          <div className={`flex justify-between items-center mt-4 ${darkMode ? 'text-white' : 'text-gray-700'
-              className={`flex justify-between items-center mt-6 ${
+            }`}>
-                darkMode ? "text-white" : "text-gray-700"
-              }`}
-            >
             <button
               disabled={currentPage === 1}
               onClick={() => setCurrentPage((prev) => prev - 1)}
@@ -283,6 +267,5 @@ export default function EntriesTable() {
         </>
       )}
     </div>
-    </div>
   );
 }

src/app/signup/page.js

@@ -107,7 +107,7 @@ export default function SignUpPage() {
         {/* Left side - Form */}
         <div className="lg:w-1/2 w-full flex flex-col items-center justify-center p-4">
           <div className="w-full max-w-md">
-            {/* <div className="w-full max-w-md pt-5 mx-auto sm:py-10">
+            <div className="w-full max-w-md pt-5 mx-auto sm:py-10">
               <Link
                 href="/dashboard"
                 className="inline-flex items-center text-sm text-gray-500 transition-colors hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300"
@@ -130,7 +130,7 @@ export default function SignUpPage() {
                 </svg>
                 Back to dashboard
               </Link>
-            </div> */}
+            </div>
             
             <div className="mb-5 sm:mb-8">
               <h1 className="mb-2 font-semibold text-gray-800 text-title-sm dark:text-white/90 sm:text-title-md">