327 lines
18 KiB
TypeScript
327 lines
18 KiB
TypeScript
import { motion } from 'framer-motion';
|
|
import { useLanguage } from '../contexts/LanguageContext';
|
|
import { Link } from 'react-router-dom';
|
|
import { ArrowLeft, Shield } from 'lucide-react';
|
|
|
|
const HomeSyncPolicies = () => {
|
|
const { language, t } = useLanguage();
|
|
|
|
const containerVariants = {
|
|
hidden: { opacity: 0 },
|
|
visible: {
|
|
opacity: 1,
|
|
transition: {
|
|
staggerChildren: 0.1
|
|
}
|
|
}
|
|
};
|
|
|
|
const sectionVariants = {
|
|
hidden: { opacity: 0, y: 20 },
|
|
visible: { opacity: 1, y: 0 }
|
|
};
|
|
|
|
// Helper to render specific style for headers
|
|
const H2 = ({ children }: { children: React.ReactNode }) => (
|
|
<h2 style={{ fontSize: '1.8rem', marginTop: '3rem', marginBottom: '1.5rem', fontWeight: '700', color: 'var(--primary-color)' }}>{children}</h2>
|
|
);
|
|
|
|
const H3 = ({ children }: { children: React.ReactNode }) => (
|
|
<h3 style={{ fontSize: '1.4rem', marginTop: '2rem', marginBottom: '1rem', fontWeight: '600', color: 'var(--text-color)' }}>{children}</h3>
|
|
);
|
|
|
|
const P = ({ children }: { children: React.ReactNode }) => (
|
|
<p style={{ lineHeight: '1.8', opacity: 0.9, marginBottom: '1rem', fontSize: '1rem' }}>{children}</p>
|
|
);
|
|
|
|
const List = ({ items }: { items: string[] }) => (
|
|
<ul style={{ listStyle: 'none', paddingLeft: '1rem', marginBottom: '1.5rem' }}>
|
|
{items.map((item, idx) => (
|
|
<li key={idx} style={{ marginBottom: '0.5rem', display: 'flex', alignItems: 'flex-start', gap: '10px' }}>
|
|
<span style={{ color: 'var(--primary-color)', marginTop: '5px' }}>•</span>
|
|
<span style={{ lineHeight: '1.6', opacity: 0.9 }}>{item}</span>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
);
|
|
|
|
return (
|
|
<div className="homesync-policies-page" style={{ paddingTop: '100px', minHeight: '100vh', paddingBottom: '50px' }}>
|
|
<div className="container" style={{ maxWidth: '900px', margin: '0 auto', padding: '0 20px' }}>
|
|
<Link
|
|
to={`/${language}/homesync`}
|
|
style={{
|
|
display: 'inline-flex',
|
|
alignItems: 'center',
|
|
gap: '8px',
|
|
marginBottom: '40px',
|
|
color: 'var(--text-color)',
|
|
textDecoration: 'none',
|
|
fontSize: '1rem',
|
|
opacity: 0.8
|
|
}}
|
|
>
|
|
<ArrowLeft size={18} />
|
|
{t('policies.back')}
|
|
</Link>
|
|
|
|
<motion.div
|
|
variants={containerVariants}
|
|
initial="hidden"
|
|
animate="visible"
|
|
>
|
|
{/* Header */}
|
|
<motion.div variants={sectionVariants} style={{ marginBottom: '4rem', textAlign: 'center' }}>
|
|
<div style={{ display: 'inline-flex', padding: '1rem', background: 'rgba(79, 70, 229, 0.1)', borderRadius: '50%', marginBottom: '1.5rem' }}>
|
|
<Shield size={48} color="var(--primary-color)" />
|
|
</div>
|
|
<h1 style={{ fontSize: '2.5rem', marginBottom: '1rem', fontWeight: '800' }}>
|
|
FAMILY ORGANIZER / HOME SYNC
|
|
</h1>
|
|
<p style={{ fontSize: '1.2rem', opacity: 0.7, maxWidth: '700px', margin: '0 auto' }}>
|
|
Documentation du Projet & Politique de Confidentialité
|
|
</p>
|
|
<p style={{ fontSize: '0.9rem', opacity: 0.5, marginTop: '1rem' }}>
|
|
Dernière mise à jour : 12 février 2026 | Version : 2026.2.8
|
|
</p>
|
|
</motion.div>
|
|
|
|
{/* CONTENT START */}
|
|
<div style={{
|
|
background: 'var(--card-bg, rgba(255, 255, 255, 0.03))',
|
|
padding: '3rem',
|
|
borderRadius: '1.5rem',
|
|
border: '1px solid var(--border-color, rgba(255, 255, 255, 0.08))'
|
|
}}>
|
|
|
|
{/* PARTIE 1 */}
|
|
<motion.div variants={sectionVariants}>
|
|
<h1 style={{ fontSize: '2rem', borderBottom: '2px solid var(--primary-color)', paddingBottom: '1rem', marginBottom: '2rem' }}>
|
|
PARTIE 1 : DESCRIPTION DU PROJET
|
|
</h1>
|
|
|
|
<H2>1.1 PRÉSENTATION GÉNÉRALE</H2>
|
|
<P>
|
|
Family Organizer est une application mobile développée avec Flutter qui permet aux familles de simplifier et centraliser la gestion quotidienne de leur foyer.
|
|
</P>
|
|
<P>
|
|
L'application offre une plateforme collaborative où tous les membres d'une famille peuvent :
|
|
</P>
|
|
<List items={[
|
|
"Synchroniser leurs emplois du temps",
|
|
"Gérer des listes de courses partagées",
|
|
"Organiser des événements et rappels",
|
|
"Rester connectés en temps réel"
|
|
]} />
|
|
|
|
<H2>1.2 FONCTIONNALITÉS PRINCIPALES</H2>
|
|
|
|
<H3>📅 CALENDRIER PARTAGÉ & INTELLIGENT</H3>
|
|
<List items={[
|
|
"Vue centralisée de tous les événements familiaux",
|
|
"Trois modes d'affichage : Mois, Semaine, Jour",
|
|
"Synchronisation bidirectionnelle avec Google Agenda (optionnelle)",
|
|
"Import et export d'événements avec Google Calendar",
|
|
"Types d'événements personnalisés avec code couleur et icônes",
|
|
"Catégories : Sport, École, Repas, Travail, Loisirs, etc.",
|
|
"Ajout de détails riches : lieu, description, priorité",
|
|
"Liens automatiques vers Waze/Google Maps pour la navigation",
|
|
"Gestion de la visibilité (privé/partagé)",
|
|
"Notifications et rappels paramétrables"
|
|
]} />
|
|
|
|
<H3>🛒 LISTES DE COURSES COLLABORATIVES</H3>
|
|
<List items={[
|
|
"Ajout et modification en temps réel",
|
|
"Synchronisation instantanée entre tous les membres",
|
|
"Organisation par état (à acheter / acheté)",
|
|
"Gestion collaborative : toute modification est visible immédiatement",
|
|
"Réorganisation possible des articles"
|
|
]} />
|
|
|
|
<H3>👥 GESTION DE FAMILLE (HOUSEHOLD)</H3>
|
|
<List items={[
|
|
"Création de nouvelles familles",
|
|
"Système de rejoindre une famille via ID unique",
|
|
"Gestion des profils utilisateurs",
|
|
"Administration des membres de la famille",
|
|
"Plusieurs foyers possibles par utilisateur"
|
|
]} />
|
|
|
|
<H3>🔐 SÉCURITÉ & AUTHENTIFICATION</H3>
|
|
<List items={[
|
|
"Connexion par email et mot de passe",
|
|
"Connexion via Google Sign-In",
|
|
"Sécurisation des données utilisateur",
|
|
"Gestion des sessions et tokens d'authentification"
|
|
]} />
|
|
|
|
<H3>🎨 PERSONNALISATION</H3>
|
|
<List items={[
|
|
"Thèmes personnalisables (clair/sombre)",
|
|
"Préférences sauvegardées par utilisateur",
|
|
"Interface adaptative et responsive"
|
|
]} />
|
|
|
|
<H2>1.3 STACK TECHNIQUE</H2>
|
|
<H3>Frontend</H3>
|
|
<List items={[
|
|
"Framework : Flutter (Dart 3.9.2)",
|
|
"State Management : BLoC (Business Logic Component)",
|
|
"UI : Material Design avec thèmes personnalisés"
|
|
]} />
|
|
|
|
<H3>Backend & Services</H3>
|
|
<List items={[
|
|
"Firebase Core (authentification, base de données, stockage)",
|
|
"Cloud Firestore (base de données en temps réel)",
|
|
"Firebase Authentication (gestion des utilisateurs)",
|
|
"Firebase Cloud Messaging (notifications push)",
|
|
"Firebase Storage (stockage des fichiers et images)"
|
|
]} />
|
|
|
|
<H2>1.4 ARCHITECTURE DE L'APPLICATION</H2>
|
|
<P>L'application suit l'architecture BLoC (Business Logic Component) favorisant la séparation des responsabilités et la testabilité.</P>
|
|
|
|
</motion.div>
|
|
|
|
<div style={{ height: '3rem' }}></div>
|
|
|
|
{/* PARTIE 2 */}
|
|
<motion.div variants={sectionVariants}>
|
|
<h1 style={{ fontSize: '2rem', borderBottom: '2px solid var(--primary-color)', paddingBottom: '1rem', marginBottom: '2rem' }}>
|
|
PARTIE 2 : POLITIQUE DE CONFIDENTIALITÉ
|
|
</h1>
|
|
|
|
<P>
|
|
Cette Politique de Confidentialité décrit comment Family Organizer ("nous", "notre" ou "l'application") collecte, utilise et protège vos informations personnelles.
|
|
</P>
|
|
|
|
<H2>2.1 INFORMATIONS COLLECTÉES</H2>
|
|
<P>Nous collectons différents types d'informations pour fournir et améliorer nos services :</P>
|
|
|
|
<H3>A) INFORMATIONS D'IDENTIFICATION PERSONNELLE</H3>
|
|
<List items={[
|
|
"Prénom et nom",
|
|
"Adresse e-mail",
|
|
"Mot de passe (stocké de manière chiffrée via Firebase Authentication)",
|
|
"Photo de profil (optionnelle)",
|
|
"Plateforme d'authentification utilisée (Email ou Google)",
|
|
"Date de création du compte"
|
|
]} />
|
|
|
|
<H3>B) INFORMATIONS DE CONNEXION GOOGLE</H3>
|
|
<P>Si vous choisissez de vous connecter via Google Sign-In :</P>
|
|
<List items={[
|
|
"ID utilisateur Google",
|
|
"Nom et prénom associés au compte Google",
|
|
"Adresse e-mail Google",
|
|
"Photo de profil Google",
|
|
"Token d'accès Google (pour la synchronisation Google Calendar)"
|
|
]} />
|
|
|
|
<H3>C) DONNÉES D'UTILISATION DE L'APPLICATION</H3>
|
|
<List items={[
|
|
"Événements du calendrier (titre, description, date, heure, lieu, priorité)",
|
|
"Listes de courses (articles, statuts)",
|
|
"Informations de famille/foyer (nom, membres, code d'invitation)",
|
|
"Préférences de notifications",
|
|
"Paramètres de l'application"
|
|
]} />
|
|
|
|
<H3>D) DONNÉES GOOGLE CALENDAR (SI SYNCHRONISATION ACTIVÉE)</H3>
|
|
<List items={[
|
|
"Événements de votre Google Calendar",
|
|
"Métadonnées des événements (titre, date, heure, lieu, description)",
|
|
"Permissions d'accès en lecture et écriture à votre Google Calendar"
|
|
]} />
|
|
|
|
<H2>2.2 COMMENT NOUS UTILISONS VOS INFORMATIONS</H2>
|
|
<H3>A) FOURNITURE DES SERVICES</H3>
|
|
<List items={[
|
|
"Créer et gérer votre compte utilisateur",
|
|
"Authentifier votre identité lors de la connexion",
|
|
"Synchroniser vos données entre appareils",
|
|
"Permettre la collaboration avec les membres de votre famille",
|
|
"Afficher et gérer vos événements du calendrier",
|
|
"Gérer vos listes de courses partagées",
|
|
"Envoyer des notifications et rappels"
|
|
]} />
|
|
|
|
<H3>B) SYNCHRONISATION GOOGLE CALENDAR</H3>
|
|
<List items={[
|
|
"Importer des événements depuis Google Calendar",
|
|
"Exporter des événements vers Google Calendar",
|
|
"Maintenir la synchronisation bidirectionnelle"
|
|
]} />
|
|
|
|
<H2>2.3 PARTAGE DE VOS INFORMATIONS</H2>
|
|
<H3>A) PARTAGE AU SEIN DE VOTRE FAMILLE/FOYER</H3>
|
|
<P>Les informations suivantes sont partagées avec les membres de votre famille :</P>
|
|
<List items={[
|
|
"Votre nom et photo de profil",
|
|
"Les événements que vous marquez comme \"partagés\"",
|
|
"Les listes de courses de la famille",
|
|
"Les rappels familiaux"
|
|
]} />
|
|
<P><em>Les événements marqués comme "privés" ne sont <strong>PAS</strong> visibles par les autres membres.</em></P>
|
|
|
|
<H3>B) PARTAGE AVEC DES TIERS</H3>
|
|
<P>Nous partageons vos informations avec les services tiers suivants :</P>
|
|
<ul style={{ listStyle: 'none', paddingLeft: '1rem' }}>
|
|
<li style={{ marginBottom: '1rem' }}>
|
|
<strong>• FIREBASE (GOOGLE)</strong><br />
|
|
Authentification, Base de données, Stockage, Notifications.<br />
|
|
<a href="https://firebase.google.com/support/privacy" target="_blank" rel="noopener noreferrer" style={{ color: 'var(--primary-color)' }}>Politique de confidentialité Firebase</a>
|
|
</li>
|
|
<li style={{ marginBottom: '1rem' }}>
|
|
<strong>• GOOGLE APIS</strong><br />
|
|
Synchronisation Google Calendar, Google Sign-In.<br />
|
|
<a href="https://policies.google.com/privacy" target="_blank" rel="noopener noreferrer" style={{ color: 'var(--primary-color)' }}>Politique de confidentialité Google</a>
|
|
</li>
|
|
</ul>
|
|
|
|
<H2>2.4 SÉCURITÉ DES DONNÉES</H2>
|
|
<P>Nous prenons la sécurité de vos données très au sérieux :</P>
|
|
<List items={[
|
|
"Chiffrement des mots de passe via Firebase Authentication",
|
|
"Communication sécurisée HTTPS/TLS",
|
|
"Stockage sécurisé des tokens d'authentification",
|
|
"Règles de sécurité Firestore pour protéger l'accès aux données"
|
|
]} />
|
|
|
|
<H2>2.6 VOS DROITS</H2>
|
|
<P>Conformément aux réglementations sur la protection des données (RGPD), vous disposez des droits suivants :</P>
|
|
<List items={[
|
|
"Droit d'accès",
|
|
"Droit de rectification",
|
|
"Droit à l'effacement",
|
|
"Droit à la portabilité",
|
|
"Droit d'opposition",
|
|
"Droit de retirer votre consentement"
|
|
]} />
|
|
|
|
<H2>2.7 GOOGLE CALENDAR - INFORMATIONS SPÉCIFIQUES</H2>
|
|
<P>La synchronisation avec Google Calendar est <strong>OPTIONNELLE</strong> et nécessite votre consentement explicite.</P>
|
|
<P>Les données de votre Google Calendar sont utilisées UNIQUEMENT pour :</P>
|
|
<List items={[
|
|
"Importer vos événements Google dans Family Organizer",
|
|
"Exporter vos événements Family Organizer vers Google Calendar",
|
|
"Maintenir la synchronisation bidirectionnelle"
|
|
]} />
|
|
|
|
<H2>2.16 CONTACT</H2>
|
|
<P>Pour toute question concernant cette Politique de Confidentialité ou vos données personnelles, vous pouvez nous contacter via les paramètres de l'application.</P>
|
|
|
|
</motion.div>
|
|
|
|
</div>
|
|
|
|
</motion.div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default HomeSyncPolicies;
|