Added authentication forms and routes

2025-10-27 22:19:34 +01:00
parent e12e4389b6
commit b21161a273
27 changed files with 3336 additions and 337 deletions
--- a/src/myfasthtml/auth/pages/RegisterPage.py
+++ b/src/myfasthtml/auth/pages/RegisterPage.py
@@ -0,0 +1,125 @@
+from fasthtml.components import *
+
+
+class RegisterPage:
+  def __init__(self, error_message: str = None):
+    self.error_message = error_message
+  
+  def register_page(self, error_message: str):
+    self.error_message = error_message
+    return self.__ft__()
+  
+  def __ft__(self):
+    """
+       Create the registration page.
+
+       Args:
+           error_message: Optional error message to display
+
+       Returns:
+           Components representing the registration page
+       """
+    # Create alert for error message
+    error_alert = None
+    if self.error_message:
+      error_alert = Div(
+        P(self.error_message, cls="text-sm"),
+        cls="bg-soft bg-error border border-red-400 text-red-700 px-4 py-3 rounded mb-4"
+      )
+    
+    return Div(
+      # Page title
+      H1("Create an Account", cls="text-3xl font-bold text-center mb-6"),
+      
+      # Registration Form
+      Div(
+        # Error alert
+        error_alert if error_alert else "",
+        
+        Form(
+          # Username field
+          Div(
+            Label("Username", For="username", cls="block text-sm font-medium text-gray-700 mb-1"),
+            Input(
+              type="text",
+              id="username",
+              name="username",
+              placeholder="Choose a username",
+              required=True,
+              minlength=3,
+              maxlength=30,
+              pattern="[a-zA-Z0-9_-]+",
+              cls="w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2"
+            ),
+            P("Only letters, numbers, underscores, and hyphens", cls="text-xs text-gray-500 mt-1"),
+            cls="mb-4"
+          ),
+          
+          # Email field
+          Div(
+            Label("Email", For="email", cls="block text-sm font-medium text-gray-700 mb-1"),
+            Input(
+              type="email",
+              id="email",
+              name="email",
+              placeholder="you@example.com",
+              required=True,
+              cls="w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2"
+            ),
+            cls="mb-4"
+          ),
+          
+          # Password field
+          Div(
+            Label("Password", For="password", cls="block text-sm font-medium text-gray-700 mb-1"),
+            Input(
+              type="password",
+              id="password",
+              name="password",
+              placeholder="Create a password",
+              required=True,
+              minlength=8,
+              cls="w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2"
+            ),
+            P("At least 8 characters with uppercase, lowercase, and number", cls="text-xs text-gray-500 mt-1"),
+            cls="mb-4"
+          ),
+          
+          # Confirm password field
+          Div(
+            Label("Confirm Password", For="confirm_password", cls="block text-sm font-medium text-gray-700 mb-1"),
+            Input(
+              type="password",
+              id="confirm_password",
+              name="confirm_password",
+              placeholder="Confirm your password",
+              required=True,
+              cls="w-full px-3 py-2 border rounded-md focus:outline-none focus:ring-2"
+            ),
+            cls="mb-6"
+          ),
+          
+          # Submit button
+          Button(
+            "Create Account",
+            type="submit",
+            cls="btn w-full font-bold py-2 px-4 rounded"
+          ),
+          
+          # Registration link
+          Div(
+            P(
+              "Already have an account? ",
+              A("Sign in here", href="/login", cls="text-blue-600 hover:underline"),
+              cls="text-sm text-gray-600 text-center"
+            )
+          ),
+          
+          action="register-p",
+          method="post",
+          cls="mb-6"
+        ),
+        
+        cls="p-8 rounded-lg shadow-2xl max-w-md mx-auto"
+      )
+    )