User profile page with past and future events

This commit is contained in:
Sylvain Duchesne
2026-01-26 17:29:10 +01:00
parent 3fb60388fb
commit 561a0df3fe
6 changed files with 667 additions and 638 deletions
+41 -12
View File
@@ -3,10 +3,16 @@ import { Header, Avatar, Title, Text, Button, Card, Badge, Divider } from '../co
import type { ScreenProps } from './index';
export function UserProfileScreen({ navigate }: ScreenProps) {
const upcomingEvents = [
{ title: 'Résidence Reconnexion', date: '16-20 fév.', common: true },
{ title: 'Atelier permaculture', date: '28 fév.', common: false },
];
const pastEvents = [
{ title: 'Forum Ouvert Transition', date: '22 fév.' },
{ title: 'Rencontre des Colibris', date: '12 fév.' },
{ title: 'Formation CNV', date: '1 mars' },
{ title: 'Forum Ouvert Transition', date: '22 jan.', common: true },
{ title: 'Rencontre des Colibris', date: '12 jan.', common: true },
{ title: 'Formation CNV', date: '8 jan.', common: false },
{ title: 'Café des possibles', date: '15 déc.', common: false },
];
return (
@@ -47,19 +53,42 @@ export function UserProfileScreen({ navigate }: ScreenProps) {
<Divider />
{/* Common events */}
{/* Upcoming events */}
<div style={{ padding: 16 }}>
<Text style={{ fontWeight: 'bold', marginBottom: 4 }}>Événements en commun</Text>
<Text style={{ fontSize: 13, color: 'var(--sketch-gray)', marginBottom: 12 }}>
Vous avez participé à 3 événements ensemble
</Text>
<Text style={{ fontWeight: 'bold', marginBottom: 12 }}>Événements à venir</Text>
{upcomingEvents.map((event, i) => (
<Card key={i} onClick={() => navigate('event-detail')} style={{ marginBottom: 12 }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
<div>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>{event.title}</Text>
<Text className="user-content" style={{ margin: '4px 0 0 0', fontSize: 14 }}>
{event.date}
</Text>
</div>
{event.common && <Badge>moi aussi</Badge>}
</div>
</Card>
))}
</div>
<Divider />
{/* Past events */}
<div style={{ padding: 16 }}>
<Text style={{ fontWeight: 'bold', marginBottom: 12 }}>Événements passés</Text>
{pastEvents.map((event, i) => (
<Card key={i} onClick={() => navigate('event-detail')} style={{ marginBottom: 12 }}>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>{event.title}</Text>
<Text className="user-content" style={{ margin: '4px 0 0 0', fontSize: 14 }}>
{event.date}
</Text>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
<div>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>{event.title}</Text>
<Text className="user-content" style={{ margin: '4px 0 0 0', fontSize: 14 }}>
{event.date}
</Text>
</div>
{event.common && <Badge>moi aussi</Badge>}
</div>
</Card>
))}
</div>