the-tip-top-frontend/utils/constants.ts
soufiane 70f61fca88 feat: modern UI redesign with SVG icons and improved styling
- Update client dashboard with modern cards, SVG statistics icons, and prize icons
- Add roulette animation with colored prize icons during ticket draw
- Redesign history page with 4 statistics cards and SVG icons
- Add "Rejetés" filter button in history page
- Update profile page with modern card styling
- Redesign header with clickable user name/email button
- Add Facebook login button with green border styling
- Update game page with roulette animation and prize display
- Add prize values to constants (15€, 25€, 39€, 69€)
- Replace all emoji icons with professional SVG icons
- Apply consistent color scheme: green (#1a4d2e, #2d5a3d) and orange (#f59e0b)
- Improve button styles and hover effects across all pages

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-19 02:29:41 +01:00

201 lines
4.6 KiB
TypeScript

export const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || 'http://localhost:4000/api';
// API Endpoints
export const API_ENDPOINTS = {
AUTH: {
LOGIN: '/auth/login',
REGISTER: '/auth/register',
LOGOUT: '/auth/logout',
ME: '/auth/me',
GOOGLE: '/auth/google',
FACEBOOK: '/auth/facebook',
VERIFY_EMAIL: '/auth/verify-email',
FORGOT_PASSWORD: '/auth/forgot-password',
RESET_PASSWORD: '/auth/reset-password',
},
GAME: {
PLAY: '/game/play',
MY_TICKETS: '/game/my-tickets',
TICKET_DETAILS: (id: string) => `/game/tickets/${id}`,
},
EMPLOYEE: {
VALIDATE_TICKET: '/employee/validate-ticket',
PENDING_TICKETS: '/employee/pending-tickets',
CLAIM_TICKET: (id: string) => `/employee/tickets/${id}/claim`,
},
ADMIN: {
STATISTICS: '/admin/statistics',
ALL_TICKETS: '/admin/tickets',
ALL_USERS: '/admin/users',
PRIZES: '/admin/prizes',
CREATE_PRIZE: '/admin/prizes',
UPDATE_PRIZE: (id: string) => `/admin/prizes/${id}`,
DELETE_PRIZE: (id: string) => `/admin/prizes/${id}`,
},
USER: {
PROFILE: '/user/profile',
UPDATE_PROFILE: '/user/profile',
CHANGE_PASSWORD: '/user/change-password',
},
} as const;
// Local Storage Keys
export const STORAGE_KEYS = {
TOKEN: 'auth_token',
USER: 'user_data',
THEME: 'theme_preference',
} as const;
// Prize Names and Colors
export const PRIZE_CONFIG = {
INFUSEUR: {
name: 'Infuseur à thé',
description: 'Un infuseur à thé de qualité',
color: 'bg-blue-100 text-blue-800',
icon: '🫖',
value: 15,
},
THE_SIGNATURE: {
name: 'Thé signature 100g',
description: 'Notre thé signature premium 100g',
color: 'bg-green-100 text-green-800',
icon: '🍵',
value: 25,
},
COFFRET_DECOUVERTE: {
name: 'Coffret découverte 39€',
description: 'Un coffret découverte de nos meilleurs thés',
color: 'bg-purple-100 text-purple-800',
icon: '🎁',
value: 39,
},
COFFRET_PRESTIGE: {
name: 'Coffret prestige 69€',
description: 'Un coffret prestige d\'exception',
color: 'bg-amber-100 text-amber-800',
icon: '🏆',
value: 69,
},
THE_GRATUIT: {
name: 'Thé gratuit en magasin',
description: 'Un thé gratuit de votre choix en magasin',
color: 'bg-pink-100 text-pink-800',
icon: '☕',
value: 0,
},
} as const;
// Navigation Routes
export const ROUTES = {
HOME: '/',
LOGIN: '/login',
REGISTER: '/register',
LOTS: '/lots',
GAME: '/jeux',
PROFILE: '/profil',
MY_LOTS: '/mes-lots',
HISTORY: '/historique',
CLIENT_DASHBOARD: '/client',
EMPLOYEE_DASHBOARD: '/employe/dashboard',
EMPLOYEE_VERIFICATION: '/employe/verification',
EMPLOYEE_HISTORY: '/employe/historique',
ADMIN_DASHBOARD: '/admin/dashboard',
ADMIN_USERS: '/admin/utilisateurs',
ADMIN_STATISTICS: '/admin/statistiques',
ADMIN_DRAWS: '/admin/tirages',
} as const;
// Role-based Navigation
export const NAV_ITEMS: Array<{
label: string;
href: string;
roles: Array<'CLIENT' | 'EMPLOYEE' | 'ADMIN'>;
}> = [
{
label: 'Accueil',
href: ROUTES.HOME,
roles: ['CLIENT', 'EMPLOYEE', 'ADMIN'],
},
{
label: 'Lots',
href: ROUTES.LOTS,
roles: ['CLIENT', 'EMPLOYEE', 'ADMIN'],
},
{
label: 'Jouer',
href: ROUTES.GAME,
roles: ['CLIENT'],
},
{
label: 'Mes lots',
href: ROUTES.MY_LOTS,
roles: ['CLIENT'],
},
{
label: 'Mes gains',
href: ROUTES.HISTORY,
roles: ['CLIENT'],
},
{
label: 'Mon profil',
href: ROUTES.PROFILE,
roles: ['CLIENT', 'EMPLOYEE', 'ADMIN'],
},
{
label: 'Dashboard',
href: ROUTES.EMPLOYEE_DASHBOARD,
roles: ['EMPLOYEE'],
},
{
label: 'Validation',
href: ROUTES.EMPLOYEE_VERIFICATION,
roles: ['EMPLOYEE'],
},
{
label: 'Historique',
href: ROUTES.EMPLOYEE_HISTORY,
roles: ['EMPLOYEE'],
},
{
label: 'Dashboard',
href: ROUTES.ADMIN_DASHBOARD,
roles: ['ADMIN'],
},
{
label: 'Utilisateurs',
href: ROUTES.ADMIN_USERS,
roles: ['ADMIN'],
},
{
label: 'Statistiques',
href: ROUTES.ADMIN_STATISTICS,
roles: ['ADMIN'],
},
{
label: 'Tirages',
href: ROUTES.ADMIN_DRAWS,
roles: ['ADMIN'],
},
];
// Ticket Status
export const TICKET_STATUS = {
PENDING: 'PENDING',
CLAIMED: 'CLAIMED',
REJECTED: 'REJECTED',
} as const;
// Ticket Status Labels
export const TICKET_STATUS_LABELS = {
PENDING: 'En attente',
CLAIMED: 'Réclamé',
REJECTED: 'Rejeté',
} as const;
// Ticket Status Colors
export const TICKET_STATUS_COLORS = {
PENDING: 'bg-yellow-100 text-yellow-800',
CLAIMED: 'bg-green-100 text-green-800',
REJECTED: 'bg-red-100 text-red-800',
} as const;