Ajout paramètre message bas de page personnalisable

This commit is contained in:
Yannick Le Duc
2025-08-27 12:21:09 +02:00
parent 28df167fee
commit aa859a1e44
15 changed files with 580 additions and 207 deletions

View File

@@ -9,7 +9,7 @@ import { Label } from '@/components/ui/label';
import Navigation from '@/components/Navigation';
import AuthGuard from '@/components/AuthGuard';
import SmtpSettingsForm from '@/components/SmtpSettingsForm';
import { Settings, Monitor, Save, CheckCircle, Mail } from 'lucide-react';
import { Settings, Monitor, Save, CheckCircle, Mail, FileText } from 'lucide-react';
export const dynamic = 'force-dynamic';
@@ -19,6 +19,8 @@ function SettingsPageContent() {
const [saving, setSaving] = useState(false);
const [saved, setSaved] = useState(false);
const [randomizePropositions, setRandomizePropositions] = useState(false);
const [proposePageMessage, setProposePageMessage] = useState('');
const [footerMessage, setFooterMessage] = useState('');
useEffect(() => {
loadSettings();
@@ -33,6 +35,14 @@ function SettingsPageContent() {
// Charger la valeur du paramètre d'ordre aléatoire
const randomizeValue = await settingsService.getBooleanValue('randomize_propositions', false);
setRandomizePropositions(randomizeValue);
// Charger le message de la page de dépôt de propositions
const messageValue = await settingsService.getStringValue('propose_page_message', 'Partagez votre vision et proposez des projets qui feront la différence dans votre collectif. Votre voix compte pour façonner l\'avenir de votre communauté.');
setProposePageMessage(messageValue);
// Charger le message du bas de page
const footerValue = await settingsService.getStringValue('footer_message', 'Développé avec ❤️ pour faciliter la démocratie participative - [Logiciel libre et open source](GITURL) et transparent pour tous');
setFooterMessage(footerValue);
} catch (error) {
console.error('Erreur lors du chargement des paramètres:', error);
} finally {
@@ -48,6 +58,8 @@ function SettingsPageContent() {
try {
setSaving(true);
await settingsService.setBooleanValue('randomize_propositions', randomizePropositions);
await settingsService.setStringValue('propose_page_message', proposePageMessage);
await settingsService.setStringValue('footer_message', footerMessage);
setSaved(true);
setTimeout(() => setSaved(false), 2000);
} catch (error) {
@@ -148,6 +160,62 @@ function SettingsPageContent() {
</CardContent>
</Card>
{/* Textes Category */}
<Card>
<CardHeader>
<div className="flex items-center gap-3">
<div className="w-10 h-10 bg-green-100 dark:bg-green-900 rounded-lg flex items-center justify-center">
<FileText className="w-5 h-5 text-green-600 dark:text-green-300" />
</div>
<div>
<CardTitle className="text-xl">Textes</CardTitle>
<CardDescription>
Personnalisez les textes affichés dans l'application
</CardDescription>
</div>
</div>
</CardHeader>
<CardContent className="space-y-6">
{/* Propose Page Message Setting */}
<div className="space-y-4">
<div>
<Label htmlFor="propose-page-message" className="text-base font-medium">
Message d'invitation - Page de dépôt de propositions
</Label>
<p className="text-sm text-slate-600 dark:text-slate-300 mt-1">
Ce texte apparaît sous le titre de la campagne pour inviter les utilisateurs à déposer des propositions.
</p>
</div>
<textarea
id="propose-page-message"
value={proposePageMessage}
onChange={(e) => setProposePageMessage(e.target.value)}
className="w-full min-h-[100px] p-3 border border-slate-200 dark:border-slate-700 rounded-lg bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 resize-y"
placeholder="Entrez votre message d'invitation..."
/>
</div>
{/* Footer Message Setting */}
<div className="space-y-4">
<div>
<Label htmlFor="footer-message" className="text-base font-medium">
Message du bas de page
</Label>
<p className="text-sm text-slate-600 dark:text-slate-300 mt-1">
Ce texte apparaît en bas des pages publiques. Vous pouvez utiliser <code className="bg-slate-100 dark:bg-slate-700 px-1 rounded text-xs">[texte du lien](GITURL)</code> pour insérer un lien vers le repository Git.
</p>
</div>
<textarea
id="footer-message"
value={footerMessage}
onChange={(e) => setFooterMessage(e.target.value)}
className="w-full min-h-[80px] p-3 border border-slate-200 dark:border-slate-700 rounded-lg bg-white dark:bg-slate-800 text-slate-900 dark:text-slate-100 resize-y"
placeholder="Entrez votre message de bas de page..."
/>
</div>
</CardContent>
</Card>
{/* Email Category */}
<SmtpSettingsForm onSave={() => {
setSaved(true);