Table of Contents
- 📚 API Reference
- Services Firebase
- authService
- transactionService
- addTransaction(userId, type, amount, category, date, note)
- subscribeToTransactions(userId, callback)
- getTransactionsByMonth(userId, year, month)
- subscriptionService
- addSubscription(userId, name, amount, category, frequency, nextPaymentDate, reminderDays)
- subscribeToSubscriptions(userId, callback)
- categoryService
- Hooks personnalisés
- Composants réutilisables
- Types TypeScript
- Utilitaires
- Constantes
- Navigation
📚 API Reference
Documentation des services, hooks et composants de WalletTracker.
Services Firebase
authService
Service de gestion de l'authentification.
signup(email, password, displayName)
Crée un nouveau compte utilisateur.
import { authService } from '../services/authService';
await authService.signup(
'user@example.com',
'password123',
'John Doe'
);
login(email, password)
Connecte un utilisateur existant.
await authService.login('user@example.com', 'password123');
logout()
Déconnecte l'utilisateur actuel.
await authService.logout();
transactionService
Service de gestion des transactions.
addTransaction(userId, type, amount, category, date, note)
Ajoute une nouvelle transaction.
import { transactionService } from '../services/transactionService';
await transactionService.addTransaction(
userId,
'expense', // 'expense' ou 'income'
50.00, // montant
'Alimentation', // catégorie
new Date(), // date
'Courses du mois' // note (optionnel)
);
subscribeToTransactions(userId, callback)
Écoute les changements de transactions en temps réel.
const unsubscribe = transactionService.subscribeToTransactions(
userId,
(transactions) => {
console.log('Transactions mises à jour:', transactions);
}
);
// N'oubliez pas de se désabonner
return () => unsubscribe();
getTransactionsByMonth(userId, year, month)
Récupère les transactions d'un mois spécifique.
const transactions = await transactionService.getTransactionsByMonth(
userId,
2025,
10 // Octobre
);
subscriptionService
Service de gestion des abonnements.
addSubscription(userId, name, amount, category, frequency, nextPaymentDate, reminderDays)
Ajoute un nouvel abonnement.
import { subscriptionService } from '../services/subscriptionService';
await subscriptionService.addSubscription(
userId,
'Netflix',
15.99,
'Divertissement',
'monthly', // 'daily', 'weekly', 'monthly', 'yearly'
new Date('2025-11-01'),
3 // rappel 3 jours avant
);
subscribeToSubscriptions(userId, callback)
Écoute les changements d'abonnements en temps réel.
const unsubscribe = subscriptionService.subscribeToSubscriptions(
userId,
(subscriptions) => {
console.log('Abonnements mis à jour:', subscriptions);
}
);
categoryService
Service de gestion des catégories.
getCategories(userId)
Récupère les catégories de l'utilisateur.
import { categoryService } from '../services/categoryService';
const categories = await categoryService.getCategories(userId);
initializeDefaultCategories(userId)
Initialise les catégories par défaut.
await categoryService.initializeDefaultCategories(userId);
Les catégories par défaut incluent :
- Dépenses : Alimentation, Transport, Logement, Santé, Loisirs, Shopping, Éducation, Autres
- Revenus : Salaire, Freelance, Investissements, Cadeaux, Autres
Hooks personnalisés
useAuth
Hook pour gérer l'authentification.
import { useAuth } from '../hooks/useAuth';
function MyComponent() {
const { user, initializing, logout } = useAuth();
if (initializing) {
return <ActivityIndicator />;
}
if (!user) {
return <LoginScreen />;
}
return (
<View>
<Text>Bienvenue {user.displayName}</Text>
<Button title="Déconnexion" onPress={logout} />
</View>
);
}
Propriétés retournées :
user: Objet utilisateur Firebase ounullinitializing:boolean- True pendant le chargement initiallogout: Fonction de déconnexion
Composants réutilisables
Button
Bouton personnalisé avec 3 variantes.
import { Button } from '../components/Button';
<Button
title="Ajouter"
onPress={() => console.log('Clicked')}
variant="primary" // 'primary', 'secondary', 'outline'
loading={false}
disabled={false}
style={{ marginTop: 16 }}
/>
Props :
title: string - Texte du boutononPress: () => void - Fonction appelée au clicvariant?: 'primary' | 'secondary' | 'outline'loading?: boolean - Affiche un spinnerdisabled?: boolean - Désactive le boutonstyle?: ViewStyle - Styles personnalisés
InputText
Champ de saisie personnalisé.
import { InputText } from '../components/InputText';
<InputText
label="Email"
placeholder="votre@email.com"
value={email}
onChangeText={setEmail}
keyboardType="email-address"
secureTextEntry={false}
error="Email invalide"
/>
Props :
label: string - Label du champplaceholder?: string - Texte de placeholdervalue: string - Valeur actuelleonChangeText: (text: string) => voidkeyboardType?: KeyboardTypesecureTextEntry?: boolean - Pour les mots de passeerror?: string - Message d'erreurmultiline?: booleannumberOfLines?: number
TransactionCard
Carte d'affichage d'une transaction.
import { TransactionCard } from '../components/TransactionCard';
<TransactionCard
transaction={{
id: '123',
type: 'expense',
amount: 50.00,
category: 'Alimentation',
date: new Date(),
note: 'Courses',
userId: 'user123'
}}
/>
SubscriptionCard
Carte d'affichage d'un abonnement.
import { SubscriptionCard } from '../components/SubscriptionCard';
<SubscriptionCard
subscription={{
id: '123',
name: 'Netflix',
amount: 15.99,
category: 'Divertissement',
frequency: 'monthly',
nextPaymentDate: new Date('2025-11-01'),
reminderDays: 3,
isActive: true,
userId: 'user123'
}}
/>
Types TypeScript
Transaction
type TransactionType = 'income' | 'expense';
interface Transaction {
id: string;
userId: string;
type: TransactionType;
amount: number;
category: string;
date: Date;
note?: string;
createdAt: Date;
}
Subscription
type SubscriptionFrequency = 'daily' | 'weekly' | 'monthly' | 'yearly';
interface Subscription {
id: string;
userId: string;
name: string;
amount: number;
category: string;
frequency: SubscriptionFrequency;
nextPaymentDate: Date;
reminderDays: number;
isActive: boolean;
createdAt: Date;
}
Category
interface Category {
id: string;
userId: string;
name: string;
icon: string;
color: string;
type: TransactionType;
}
Utilitaires
formatCurrency(amount)
Formate un montant en euros.
import { formatCurrency } from '../utils/helpers';
formatCurrency(1234.56); // "1 234,56 €"
formatDate(date, format)
Formate une date.
import { formatDate } from '../utils/helpers';
formatDate(new Date(), 'short'); // "23/10/2025"
formatDate(new Date(), 'medium'); // "23 oct. 2025"
formatDate(new Date(), 'long'); // "23 octobre 2025"
Constantes
import { COLORS, CATEGORIES } from '../utils/constants';
// Couleurs
COLORS.primary // '#4A90E2'
COLORS.success // '#52C41A'
COLORS.danger // '#FF6B6B'
// Catégories par défaut
CATEGORIES.EXPENSE // Catégories de dépenses
CATEGORIES.INCOME // Catégories de revenus
Navigation
Types de navigation
type RootStackParamList = {
Auth: undefined;
Main: undefined;
};
type MainTabParamList = {
Dashboard: undefined;
Transactions: { type?: TransactionType; openModal?: boolean };
Subscriptions: undefined;
Analysis: undefined;
};
Utilisation
import { useNavigation } from '@react-navigation/native';
const navigation = useNavigation();
// Naviguer vers un écran
navigation.navigate('Transactions', {
type: 'expense',
openModal: true
});
Pour plus d'exemples, consultez le code source dans /src ! 💻