feat: Preparation des modèles Settings pour l'enregistrement SMTP [#17]

This commit is contained in:
Luc SORIGNET
2025-05-05 09:25:07 +02:00
parent 99a882a64a
commit eda6f587fb
33 changed files with 468 additions and 74 deletions

View File

@ -1,4 +1,5 @@
import React, { useState } from 'react';
import { motion, AnimatePresence } from 'framer-motion';
const SidebarTabs = ({ tabs, onTabChange }) => {
const [activeTab, setActiveTab] = useState(tabs[0].id);
@ -30,15 +31,24 @@ const SidebarTabs = ({ tabs, onTabChange }) => {
</div>
{/* Tabs Content */}
<div className="flex-1 overflow-y-auto p-4 rounded-b-lg shadow-inner">
{tabs.map((tab) => (
<div
key={tab.id}
className={`${activeTab === tab.id ? 'block' : 'hidden'}`}
>
{tab.content}
</div>
))}
<div className="flex-1 overflow-y-auto p-4 rounded-b-lg shadow-inner relative">
<AnimatePresence mode="wait">
{tabs.map(
(tab) =>
activeTab === tab.id && (
<motion.div
key={tab.id}
initial={{ opacity: 0, x: 50 }} // Animation d'entrée
animate={{ opacity: 1, x: 0 }} // Animation visible
exit={{ opacity: 0, x: -50 }} // Animation de sortie
transition={{ duration: 0.3 }} // Durée des animations
className="absolute w-full h-full"
>
{tab.content}
</motion.div>
)
)}
</AnimatePresence>
</div>
</div>
);