Initial commit

2026-06-10 19:36:52 +07:00
commit 7ad037bf0a
69 changed files with 16579 additions and 0 deletions
@@ -0,0 +1,139 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { supabase } from '@/lib/supabase';
+import { useRouter } from 'next/navigation';
+
+export default function ChangePassword() {
+  const [password, setPassword] = useState('');
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const [user, setUser] = useState(null);
+  const [showPassword, setShowPassword] = useState(false);
+  const router = useRouter();
+
+  useEffect(() => {
+    supabase.auth.getUser().then(({ data }) => {
+      if (!data?.user) router.push('/login');
+      else setUser(data.user);
+    });
+  }, [router]);
+
+  const handleUpdate = async (e) => {
+    e.preventDefault();
+    setLoading(true);
+    setError(null);
+
+    const { error: authError } = await supabase.auth.updateUser({ password });
+
+    if (authError) {
+      setError(authError.message);
+      setLoading(false);
+      return;
+    }
+
+    const { error: profileError } = await supabase
+      .from('profiles')
+      .update({ password_changed: true })
+      .eq('id', user.id);
+
+    if (profileError) {
+      setError(profileError.message);
+      setLoading(false);
+      return;
+    }
+
+    router.push('/');
+  };
+
+  return (
+    <div style={{
+      minHeight: '100vh',
+      display: 'flex',
+      alignItems: 'center',
+      justifyContent: 'center',
+      background: '#f8fafc',
+      fontFamily: '"Inter", sans-serif'
+    }}>
+      <div style={{
+        background: 'white',
+        padding: '40px',
+        borderRadius: '24px',
+        boxShadow: '0 8px 32px rgba(0, 0, 0, 0.05)',
+        width: '100%',
+        maxWidth: '400px',
+        textAlign: 'center',
+        border: '1px solid #e2e8f0'
+      }}>
+        <h2 style={{ margin: '0 0 8px 0', color: '#1e293b', fontSize: '1.5rem' }}>Rotasi Keamanan</h2>
+        <p style={{ margin: '0 0 24px 0', color: '#ef4444', fontSize: '0.85rem', fontWeight: '500', background: '#fee2e2', padding: '10px', borderRadius: '8px' }}>
+          <i className="fas fa-lock"></i> Untuk alasan keamanan, Anda wajib mengubah kata sandi default sebelum melanjutkan.
+        </p>
+
+        {error && (
+          <div style={{ background: '#fee2e2', color: '#ef4444', padding: '10px', borderRadius: '8px', marginBottom: '16px', fontSize: '0.85rem' }}>
+            {error}
+          </div>
+        )}
+
+        <form onSubmit={handleUpdate} style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
+          <div style={{ textAlign: 'left' }}>
+            <label style={{ display: 'block', fontSize: '0.85rem', color: '#475569', marginBottom: '6px', fontWeight: '500' }}>Kata Sandi Baru</label>
+            <div style={{ position: 'relative' }}>
+              <input 
+                type={showPassword ? 'text' : 'password'} 
+                value={password}
+                onChange={(e) => setPassword(e.target.value)}
+                minLength={6}
+                style={{
+                  width: '100%', padding: '12px 44px 12px 16px', borderRadius: '12px',
+                  border: '1px solid #cbd5e1', background: 'white',
+                  outline: 'none', transition: 'border-color 0.2s', color: 'black',
+                  boxShadow: 'inset 0 2px 4px 0 rgba(0, 0, 0, 0.05)'
+                }}
+                required 
+              />
+              <button
+                type="button"
+                onClick={() => setShowPassword(!showPassword)}
+                style={{
+                  position: 'absolute',
+                  right: '14px',
+                  top: '50%',
+                  transform: 'translateY(-50%)',
+                  background: 'none',
+                  border: 'none',
+                  color: '#94a3b8',
+                  cursor: 'pointer',
+                  padding: '4px',
+                  display: 'flex',
+                  alignItems: 'center',
+                  justifyContent: 'center',
+                  fontSize: '1rem',
+                  outline: 'none'
+                }}
+                title={showPassword ? 'Sembunyikan Kata Sandi' : 'Tampilkan Kata Sandi'}
+              >
+                <i className={showPassword ? 'fas fa-eye-slash' : 'fas fa-eye'}></i>
+              </button>
+            </div>
+          </div>
+          <button 
+            type="submit" 
+            disabled={loading}
+            style={{
+              width: '100%', padding: '14px', borderRadius: '12px',
+              background: '#10b981', color: 'white',
+              border: 'none', fontWeight: '600', fontSize: '1rem',
+              cursor: loading ? 'not-allowed' : 'pointer',
+              marginTop: '8px', transition: 'background 0.2s',
+              opacity: loading ? 0.7 : 1
+            }}
+          >
+            {loading ? 'Menyimpan...' : 'Simpan & Lanjutkan'}
+          </button>
+        </form>
+      </div>
+    </div>
+  );
+}