Login Page

Route: /login
File: app/login/page.tsx

Page Ka Maqsad

Yeh system ka entry point hai. Bina login ke koi bhi protected page access nahi ho sakta. User apne username aur password se authenticate hota hai.

Kya Dikhta Hai?

• Mobile Shop System logo (Store icon)
• Username input field
• Password input field
• Login button
• Default credentials hint: admin / admin123
• Error message (agar galat credentials hon)

Kya Kar Sakte Hain?

Login Flow (Technical)

User form submit karta hai
        ↓
AuthContext.login() call hota hai
        ↓
Supabase RPC: verify_user_password(username, password)
        ↓
Database bcrypt se password verify karta hai
        ↓
Success → User data localStorage mein save
        ↓
Redirect → Dashboard (/)

Form Fields

Default Credentials

Username: admin
Password: admin123

Production mein password zaroor change karein — Sidebar → Shop Settings → User Profile se.

Security Features

• Password database mein bcrypt hash ke saath store
• verify_user_password function SECURITY DEFINER — secure server-side verification
• Inactive users (is_active = false) login nahi kar sakte
• Session localStorage mein currentUser key se save

Protected Route Behavior

components/protected-route.tsx yeh ensure karta hai:

• /login — bina sidebar ke dikhta hai
• Baqi sab routes — login required
• Not authenticated → automatic /login redirect
• Loading state — spinner dikhta hai jab auth check ho raha ho

UI Notes

• Full-screen centered card design
• Gradient background
• Loading state: button par "Logging in..." text
• Urdu hint: "Apne credentials se login karein"

Related Files

• lib/auth-context.tsx — Login/logout logic
• components/protected-route.tsx — Route protection
• supabase/complete-schema.sql — users table + verify_user_password function