Merge pull request 'Refactor authentication handling on booking page by removing automatic login dialog and updating user prompts. Enhance user experience with toast notifications for login requirements and streamline form field accessibility for unauthenticated users.' (#58) from feat/booking-panel into master

Reviewed-on: http://35.207.46.142/ATTUNE-HEART-THERAPY/website/pulls/58

app/(pages)/book-now/page.tsx

@@ -104,14 +104,6 @@ export default function BookNowPage() {
   const [showSignupDialog, setShowSignupDialog] = useState(false);
   const [loginPrefillEmail, setLoginPrefillEmail] = useState<string | undefined>(undefined);
 
-  // Require authentication before accessing booking page
-  useEffect(() => {
-    if (!isAuthenticated) {
-      // Show login dialog immediately if not authenticated
-      setShowLoginDialog(true);
-    }
-  }, [isAuthenticated]);
-
   // Helper function to convert day name to day number (0-6)
   const getDayNumber = (dayName: string): number => {
     const dayMap: Record<string, number> = {
@@ -237,7 +229,8 @@ export default function BookNowPage() {
     
     // Check if user is authenticated
     if (!isAuthenticated) {
-      // Open login dialog if not authenticated
+      // Show alert and open login dialog if not authenticated
+      toast.error("Please log in or sign up to book an appointment");
       setShowLoginDialog(true);
       return;
     }
@@ -666,13 +659,6 @@ export default function BookNowPage() {
                           <p className={`text-sm ${isDark ? 'text-red-200' : 'text-red-800'}`}>{error}</p>
                         </div>
                       )}
-                      {!isAuthenticated && (
-                        <div className={`mb-6 p-4 rounded-lg border ${isDark ? 'bg-yellow-900/20 border-yellow-800' : 'bg-yellow-50 border-yellow-200'}`}>
-                          <p className={`text-sm ${isDark ? 'text-yellow-200' : 'text-yellow-800'}`}>
-                            Please log in to book an appointment. The login dialog should appear automatically.
-                          </p>
-                        </div>
-                      )}
                       <form onSubmit={handleSubmit} className="space-y-6">
                   {/* Personal Information Section */}
                   <div className="space-y-4">
@@ -699,7 +685,6 @@ export default function BookNowPage() {
                           }
                           maxLength={100}
                           required
-                          disabled={!isAuthenticated}
                           className={`h-11 ${isDark ? 'bg-gray-700 border-gray-600 text-white placeholder:text-gray-400' : 'bg-white border-gray-300 text-gray-900 placeholder:text-gray-500'}`}
                         />
                       </div>
@@ -721,7 +706,6 @@ export default function BookNowPage() {
                           }
                           maxLength={100}
                           required
-                          disabled={!isAuthenticated}
                           className={`h-11 ${isDark ? 'bg-gray-700 border-gray-600 text-white placeholder:text-gray-400' : 'bg-white border-gray-300 text-gray-900 placeholder:text-gray-500'}`}
                         />
                       </div>
@@ -743,7 +727,6 @@ export default function BookNowPage() {
                         onChange={(e) => handleChange("email", e.target.value)}
                         maxLength={100}
                         required
-                        disabled={!isAuthenticated}
                         className={`h-11 ${isDark ? 'bg-gray-700 border-gray-600 text-white placeholder:text-gray-400' : 'bg-white border-gray-300 text-gray-900 placeholder:text-gray-500'}`}
                       />
                     </div>
@@ -764,7 +747,6 @@ export default function BookNowPage() {
                         onChange={(e) => handleChange("phone", e.target.value)}
                         maxLength={100}
                         required
-                        disabled={!isAuthenticated}
                         className={`h-11 ${isDark ? 'bg-gray-700 border-gray-600 text-white placeholder:text-gray-400' : 'bg-white border-gray-300 text-gray-900 placeholder:text-gray-500'}`}
                       />
                     </div>
@@ -839,14 +821,9 @@ export default function BookNowPage() {
                                             onClick={(e) => {
                                               e.preventDefault();
                                               e.stopPropagation();
-                                              if (!isAuthenticated) {
-                                                setShowLoginDialog(true);
-                                                return;
-                                              }
                                               // Pass the specific day and time slot for this button
                                               handleSlotToggle(currentDay, normalizedTimeSlot);
                                             }}
-                                            disabled={!isAuthenticated}
                                             aria-pressed={isSelected}
                                             className={`flex items-center gap-2 cursor-pointer px-4 py-2 rounded-lg border-2 transition-all focus:outline-none focus:ring-2 focus:ring-rose-500 ${
                                               isSelected
@@ -891,7 +868,6 @@ export default function BookNowPage() {
                       value={formData.message}
                       onChange={(e) => handleChange("message", e.target.value)}
                       maxLength={100}
-                      disabled={!isAuthenticated}
                       className={`w-full rounded-md border px-3 py-2 text-sm shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-rose-500 focus-visible:border-rose-500 disabled:cursor-not-allowed disabled:opacity-50 ${isDark ? 'border-gray-600 bg-gray-700 text-white placeholder:text-gray-400 focus-visible:ring-rose-400 focus-visible:border-rose-400' : 'border-gray-300 bg-white text-gray-900 placeholder:text-gray-500'}`}
                     />
                   </div>
@@ -901,7 +877,7 @@ export default function BookNowPage() {
                     <Button
                       type="submit"
                       size="lg"
-                      disabled={!isAuthenticated || isCreating || availableDaysOfWeek.length === 0 || formData.selectedSlots.length === 0}
+                      disabled={isCreating || availableDaysOfWeek.length === 0 || formData.selectedSlots.length === 0}
                       className="w-full bg-gradient-to-r from-rose-500 to-pink-600 hover:from-rose-600 hover:to-pink-700 text-white shadow-lg hover:shadow-xl transition-all h-12 text-base font-semibold disabled:opacity-50 disabled:cursor-not-allowed"
                     >
                       {isCreating ? (
@@ -946,12 +922,6 @@ export default function BookNowPage() {
       <LoginDialog
         open={showLoginDialog}
         onOpenChange={(open) => {
-          // Prevent closing if user is not authenticated (force login)
-          if (!open && !isAuthenticated) {
-            // Redirect to home if they try to close without logging in
-            router.push("/");
-            return;
-          }
           setShowLoginDialog(open);
           if (!open) {
             setLoginPrefillEmail(undefined);