feat: implement admin dashboard with authentication and title management capabilities

components/EditTitleForm.tsx

@@ -0,0 +1,85 @@
+'use client';
+
+import React, { useState } from 'react';
+import { updateAppTitle } from '@/app/actions/admin';
+import { Type } from 'lucide-react';
+
+interface EditTitleFormProps {
+  currentTitle: string;
+}
+
+export function EditTitleForm({ currentTitle }: EditTitleFormProps) {
+  const [loading, setLoading] = useState(false);
+
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    setLoading(true);
+    const formData = new FormData(e.currentTarget);
+    try {
+      await updateAppTitle(formData);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div style={{
+      position: 'relative',
+      zIndex: 45,
+      background: 'var(--card-bg)',
+      backdropFilter: 'blur(24px)',
+      WebkitBackdropFilter: 'blur(24px)',
+      border: '1px solid var(--card-border)',
+      borderRadius: '20px',
+      padding: '1.75rem',
+      marginBottom: '2rem',
+    }}>
+      <h2 style={{
+        fontSize: '0.78rem',
+        fontWeight: 700,
+        color: 'var(--fg-muted)',
+        marginBottom: '1.25rem',
+        letterSpacing: '0.08em',
+        display: 'flex',
+        alignItems: 'center',
+        gap: '0.5rem',
+      }}>
+        <Type size={14} /> TITRE DE L'APPLICATION
+      </h2>
+
+      <form onSubmit={handleSubmit} style={{ display: 'flex', gap: '0.75rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
+        <div style={{ flex: '1 1 200px' }}>
+          <label style={{ display: 'block', fontSize: '0.72rem', fontWeight: 700, color: 'var(--fg-muted)', marginBottom: '0.45rem', letterSpacing: '0.06em' }}>
+            TITRE AFFICHÉ
+          </label>
+          <input name="title" type="text" defaultValue={currentTitle} required />
+        </div>
+
+        <button
+          className="save-title-btn"
+          type="submit"
+          disabled={loading}
+          style={{
+            background: 'var(--accent-btn-hover)',
+            border: '1px solid var(--card-border)',
+            color: 'var(--fg)',
+            padding: '0.78rem 1.25rem',
+            borderRadius: '12px',
+            fontWeight: 600,
+            fontSize: '0.88rem',
+            cursor: 'pointer',
+            whiteSpace: 'nowrap',
+            flexShrink: 0,
+            transition: 'all 200ms ease',
+            opacity: loading ? 0.6 : 1,
+          }}
+        >
+          {loading ? '…' : 'Enregistrer'}
+        </button>
+        <style>{`
+          .save-title-btn:hover { background: var(--success) !important; border-color: transparent !important; color: #fff !important; }
+        `}</style>
+      </form>
+    </div>
+  );
+}