Add Docker support and containerization

- Add Dockerfile for Next.js application
- Configure standalone output for Docker
- Add .dockerignore file
- Add docker-compose.yml for easy deployment
- Update next.config.ts for Docker compatibility

src/components/Login.tsx

@@ -0,0 +1,93 @@
+'use client';
+
+import { useState } from 'react';
+import { useAuth } from '@/context/AuthContext';
+
+export default function Login() {
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [confirmPassword, setConfirmPassword] = useState('');
+  const [isSignup, setIsSignup] = useState(false);
+  const [error, setError] = useState('');
+  const { login, signup } = useAuth();
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    setError('');
+    
+    if (isSignup) {
+      if (password !== confirmPassword) {
+        setError('Passwords do not match');
+        return;
+      }
+      try {
+        await signup(email, password);
+      } catch (err: any) {
+        setError(err.message);
+      }
+    } else {
+      try {
+        await login(email, password);
+      } catch (err: any) {
+        setError(err.message);
+      }
+    }
+  };
+
+  return (
+    <div className="min-h-screen bg-black text-white flex items-center justify-center">
+      <form onSubmit={handleSubmit} className="bg-gray-800 p-8 rounded-lg w-full max-w-md">
+        <h1 className="text-2xl font-bold mb-6 text-center">
+          {isSignup ? 'Sign Up for Prayer App' : 'Login to Prayer App'}
+        </h1>
+        {error && <p className="text-red-500 mb-4">{error}</p>}
+        <div className="mb-4">
+          <label className="block mb-2">Email</label>
+          <input
+            type="email"
+            value={email}
+            onChange={(e) => setEmail(e.target.value)}
+            className="w-full p-2 bg-gray-700 border border-gray-600 rounded"
+            required
+          />
+        </div>
+        <div className="mb-4">
+          <label className="block mb-2">Password</label>
+          <input
+            type="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            className="w-full p-2 bg-gray-700 border border-gray-600 rounded"
+            required
+          />
+        </div>
+        {isSignup && (
+          <div className="mb-6">
+            <label className="block mb-2">Confirm Password</label>
+            <input
+              type="password"
+              value={confirmPassword}
+              onChange={(e) => setConfirmPassword(e.target.value)}
+              className="w-full p-2 bg-gray-700 border border-gray-600 rounded"
+              required
+            />
+          </div>
+        )}
+        <button type="submit" className="w-full p-2 bg-blue-600 hover:bg-blue-700 rounded mb-4">
+          {isSignup ? 'Sign Up' : 'Login'}
+        </button>
+        <button
+          type="button"
+          onClick={() => {
+            setIsSignup(!isSignup);
+            setError('');
+            setConfirmPassword('');
+          }}
+          className="w-full p-2 bg-gray-600 hover:bg-gray-700 rounded"
+        >
+          {isSignup ? 'Already have an account? Login' : 'Need an account? Sign Up'}
+        </button>
+      </form>
+    </div>
+  );
+}