Reconnexion/festipod
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add location to events + improve examples

Browse Source
This commit is contained in:
Sylvain Duchesne
2026-01-26 15:15:36 +01:00
parent 157e04b859
commit 82b04c0258
12 changed files with 1216 additions and 1190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
features/notif/us-19-recapitulatif.feature
+1 -2
View File
@@ -27,5 +27,4 @@ Fonctionnalité: US-19 Recevoir un récapitulatif des prochaines rencontres
Scénario: Vérifier les données de l'accueil
Étant donné que je suis sur la page "accueil"
Alors l'écran contient un texte "Barbecue d'été"
Et l'écran contient un texte "Soirée jeux de société"
Alors les événements affichent leur lieu
features/step_definitions/screen.steps.ts
+9
View File
@@ -68,6 +68,15 @@ Then('je peux voir la liste des événements', async function (this: FestipodWor
}
});
Then('les événements affichent leur lieu', async function (this: FestipodWorld) {
const source = this.getRenderedText();
// HomeScreen.tsx and EventsScreen.tsx EventCard components display location as:
// 📍 <span className="user-content">{location}</span>
// Check that there's actual location text after the emoji
const locationPattern = /📍.*<span[^>]*className="user-content"[^>]*>[^<]+<\/span>/;
expect(locationPattern.test(source), 'Event cards should display location text after 📍 emoji').to.be.true;
});
Then('je peux voir le QR code', async function (this: FestipodWorld) {
const source = this.getRenderedText();
if (this.currentScreenId === 'share-profile') {
features/user/us-12-carte-evenements.feature
+2 -1
View File
@@ -24,7 +24,8 @@ Fonctionnalité: US-12 Consulter la carte/tableau des événements
Alors je peux voir les événements auxquels l'utilisateur a participé
Scénario: Vérifier les données de l'écran événements
* Scénario non implémenté
Étant donné que je suis sur la page "découvrir"
Alors les événements affichent leur lieu
Scénario: Vérifier les données de l'écran profil
* Scénario non implémenté
reports/cucumber-report.html
+1 -1
View File
File diff suppressed because one or more lines are too long
reports/cucumber-report.json
+623 -623
View File
File diff suppressed because it is too large Load Diff
src/data/features.ts
+480 -475
View File
File diff suppressed because it is too large Load Diff
src/data/index.ts
+4 -4
View File
@@ -372,8 +372,8 @@ export const sampleUsers = [
];
export const sampleEvents = [
{ id: '1', title: 'Barbecue d\'été', date: '25 jan.', location: 'Parc de la Tête d\'Or', participants: 24 },
{ id: '2', title: 'Soirée jeux', date: '31 jan.', location: 'Chez Marie', participants: 12 },
{ id: '3', title: 'Randonnée des Monts', date: '15 fév.', location: 'Mont Pilat', participants: 18 },
{ id: '4', title: 'Atelier poterie', date: '22 fév.', location: 'L\'Atelier Créatif', participants: 8 },
{ id: '1', title: 'Résidence Reconnexion', date: '16-20 fév.', location: 'Le Revel, Rogues (30)', participants: 24 },
{ id: '2', title: 'Atelier low-tech', date: '8 fév.', location: 'La Maison du Vélo, Lyon', participants: 12 },
{ id: '3', title: 'Forum Ouvert Transition', date: '22 fév.', location: 'Tiers-lieu L\'Hermitage', participants: 45 },
{ id: '4', title: 'Formation CNV', date: '1 mars', location: 'MJC Montplaisir, Lyon', participants: 16 },
];
src/data/stepDefinitions.ts
+18 -11
View File
@@ -248,82 +248,89 @@ export const stepDefinitions: StepDefinitionInfo[] = [
"sourceCode": "Then('je peux voir la liste des événements', async function (this: FestipodWorld) {\n const source = this.getRenderedText();\n if (this.currentScreenId === 'home') {\n // HomeScreen.tsx has: \"Événements à venir\" text and EventCard components\n expect(/Mes événements à venir/.test(source), 'Home screen should have \"Événements à venir\" text').to.be.true;\n } else if (this.currentScreenId === 'events') {\n // EventsScreen.tsx has: EventCard components with event data\n expect(/<Card[^>]*onClick/.test(source), 'Events screen should have clickable Card components').to.be.true;\n } else {\n expect.fail(`Unexpected screen \"${this.currentScreenId}\" - events list should be on home or events screen`);\n }\n});",
"lineNumber": 58
},
{
"pattern": "les événements affichent leur lieu",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('les événements affichent leur lieu', async function (this: FestipodWorld) {\n const source = this.getRenderedText();\n // HomeScreen.tsx and EventsScreen.tsx EventCard components display location as:\n // 📍 <span className=\"user-content\">{location}</span>\n // Check that there's actual location text after the emoji\n const locationPattern = /📍.*<span[^>]*className=\"user-content\"[^>]*>[^<]+<\\/span>/;\n expect(locationPattern.test(source), 'Event cards should display location text after 📍 emoji').to.be.true;\n});",
"lineNumber": 71
},
{
"pattern": "je peux voir le QR code",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux voir le QR code', async function (this: FestipodWorld) {\n const source = this.getRenderedText();\n if (this.currentScreenId === 'share-profile') {\n // ShareProfileScreen.tsx has: \"QR Code\" comment and \"Scannez pour me retrouver\" text\n expect(/QR Code/.test(source), 'Share profile should have \"QR Code\" text').to.be.true;\n expect(/Scannez pour me retrouver/.test(source), 'Share profile should have \"Scannez pour me retrouver\" text').to.be.true;\n } else if (this.currentScreenId === 'meeting-points') {\n // MeetingPointsScreen.tsx has: \"Mon QR Code\" text and \"Scannez pour m'ajouter\"\n expect(/Mon QR Code/.test(source), 'Meeting points should have \"Mon QR Code\" text').to.be.true;\n expect(/Scannez pour m'ajouter/.test(source), 'Meeting points should have \"Scannez pour m\\'ajouter\" text').to.be.true;\n } else {\n expect.fail(`QR code should be on share-profile or meeting-points, not \"${this.currentScreenId}\"`);\n }\n});",
"lineNumber": 71
"lineNumber": 80
},
{
"pattern": "je peux voir le lien de partage",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux voir le lien de partage', async function (this: FestipodWorld) {\n expect(this.currentScreenId, 'Share link should be on share-profile screen').to.equal('share-profile');\n const source = this.getRenderedText();\n // ShareProfileScreen.tsx has: \"Mon lien de profil\" text and profileLink variable\n expect(/Mon lien de profil/.test(source), 'Share profile should have \"Mon lien de profil\" text').to.be.true;\n expect(/festipod\\.app\\/u\\//.test(source), 'Share profile should have profile link URL').to.be.true;\n});",
"lineNumber": 86
"lineNumber": 95
},
{
"pattern": "je visualise l'événement {string}",
"keyword": "Given",
"file": "screen.steps.ts",
"sourceCode": "Given('je visualise l\\'événement {string}', async function (this: FestipodWorld, eventName: string) {\n this.navigateTo('#/demo/event-detail');\n expect(this.currentScreen, 'Event detail screen should be loaded').to.not.be.null;\n this.attach(`Viewing event: ${eventName}`, 'text/plain');\n});",
"lineNumber": 97
"lineNumber": 106
},
{
"pattern": "je visualise le profil de {string}",
"keyword": "Given",
"file": "screen.steps.ts",
"sourceCode": "Given('je visualise le profil de {string}', async function (this: FestipodWorld, userName: string) {\n this.navigateTo('#/demo/user-profile');\n expect(this.currentScreen, 'User profile screen should be loaded').to.not.be.null;\n this.attach(`Viewing profile: ${userName}`, 'text/plain');\n});",
"lineNumber": 103
"lineNumber": 112
},
{
"pattern": "l'écran affiche les informations de l'événement",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('l\\'écran affiche les informations de l\\'événement', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('event-detail');\n const source = this.getRenderedText();\n // EventDetailScreen.tsx has: <Title>, 📅, 🕓, 📍 emojis, and \"À propos\" section\n expect(/<Title[^>]*>[^<]+<\\/Title>/.test(source), 'Event detail should have a Title').to.be.true;\n expect(/📅/.test(source), 'Event detail should have date emoji 📅').to.be.true;\n expect(/🕓/.test(source), 'Event detail should have time emoji 🕓').to.be.true;\n expect(/📍/.test(source), 'Event detail should have location emoji 📍').to.be.true;\n expect(/À propos/.test(source), 'Event detail should have \"À propos\" section').to.be.true;\n});",
"lineNumber": 109
"lineNumber": 118
},
{
"pattern": "l'écran affiche les informations du profil",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('l\\'écran affiche les informations du profil', async function (this: FestipodWorld) {\n const source = this.getRenderedText();\n if (this.currentScreenId === 'profile') {\n // ProfileScreen.tsx has: <Avatar initials=\"MD\" size=\"lg\" />, <Title>Marie Dupont</Title>, @mariedupont\n expect(/<Avatar[^>]*initials=\"MD\"/.test(source), 'Profile should have Avatar with initials=\"MD\"').to.be.true;\n expect(/<Title[^>]*>Marie Dupont<\\/Title>/.test(source), 'Profile should have Title \"Marie Dupont\"').to.be.true;\n expect(/@mariedupont/.test(source), 'Profile should have username @mariedupont').to.be.true;\n } else if (this.currentScreenId === 'user-profile') {\n // UserProfileScreen.tsx has: <Avatar initials=\"JD\" size=\"lg\" />, <Title>Jean Durand</Title>, @jeandurand\n expect(/<Avatar[^>]*initials=\"JD\"/.test(source), 'User profile should have Avatar with initials=\"JD\"').to.be.true;\n expect(/<Title[^>]*>Jean Durand<\\/Title>/.test(source), 'User profile should have Title \"Jean Durand\"').to.be.true;\n expect(/@jeandurand/.test(source), 'User profile should have username @jeandurand').to.be.true;\n } else {\n expect.fail(`Unexpected screen \"${this.currentScreenId}\" for profile info check`);\n }\n});",
"lineNumber": 120
"lineNumber": 129
},
{
"pattern": "je peux m'inscrire à l'événement",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux m\\'inscrire à l\\'événement', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('event-detail');\n const source = this.getRenderedText();\n // EventDetailScreen.tsx line 49: {isJoined ? '✓ Inscrit' : 'Participer'}\n // The button shows \"Participer\" when not joined\n const hasParticiperButton = /isJoined \\? '✓ Inscrit' : 'Participer'/.test(source);\n expect(hasParticiperButton, 'Event detail should have Participer/Inscrit toggle button').to.be.true;\n});",
"lineNumber": 140
"lineNumber": 149
},
{
"pattern": "je peux me désinscrire de l'événement",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux me désinscrire de l\\'événement', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('event-detail');\n const source = this.getRenderedText();\n // EventDetailScreen.tsx line 49: {isJoined ? '✓ Inscrit' : 'Participer'}\n // Same button toggles - clicking \"✓ Inscrit\" will unregister\n const hasInscritButton = /isJoined \\? '✓ Inscrit' : 'Participer'/.test(source);\n expect(hasInscritButton, 'Event detail should have Participer/Inscrit toggle button (click to unregister)').to.be.true;\n});",
"lineNumber": 149
"lineNumber": 158
},
{
"pattern": "je peux contacter l'utilisateur",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux contacter l\\'utilisateur', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('user-profile');\n const source = this.getRenderedText();\n // UserProfileScreen.tsx line 44: <Button>Contacter</Button>\n const hasContactButton = /<Button>Contacter<\\/Button>/.test(source);\n expect(hasContactButton, 'User profile should have \"Contacter\" button').to.be.true;\n});",
"lineNumber": 158
"lineNumber": 167
},
{
"pattern": "je peux voir les événements auxquels l'utilisateur a participé",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux voir les événements auxquels l\\'utilisateur a participé', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('user-profile');\n const source = this.getRenderedText();\n // UserProfileScreen.tsx line 52: \"Événements en commun\" section with pastEvents\n expect(/Événements en commun/.test(source), 'User profile should have \"Événements en commun\" section').to.be.true;\n expect(/pastEvents/.test(source), 'User profile should display pastEvents data').to.be.true;\n});",
"lineNumber": 166
"lineNumber": 175
},
{
"pattern": "je peux configurer mes notifications",
"keyword": "Then",
"file": "screen.steps.ts",
"sourceCode": "Then('je peux configurer mes notifications', async function (this: FestipodWorld) {\n expect(this.currentScreenId).to.equal('settings');\n const source = this.getRenderedText();\n // SettingsScreen.tsx line 25: <Text>Notifications</Text> with Toggle\n expect(/>Notifications</.test(source), 'Settings should have \"Notifications\" text').to.be.true;\n expect(/<Toggle[^>]*checked=\\{notifications\\}/.test(source), 'Settings should have Toggle for notifications').to.be.true;\n});",
"lineNumber": 174
"lineNumber": 183
}
];
src/data/testResults.ts
+29 -29
View File
@@ -19,7 +19,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 4,
"failed": 0,
"skipped": 3,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Accéder à la création d'événement",
@@ -57,7 +57,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 3,
"failed": 0,
"skipped": 0,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Accéder aux détails d'un événement terminé",
@@ -79,7 +79,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Voir les commentaires existants",
@@ -109,7 +109,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 2,
"failed": 0,
"skipped": 4,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Consulter un événement avant inscription",
@@ -143,7 +143,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 8,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Consulter un macro-événement",
@@ -185,7 +185,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 4,
"failed": 0,
"skipped": 0,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Accéder aux points de rencontre",
@@ -211,7 +211,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Partager un événement auquel je participe",
@@ -241,7 +241,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 1,
"failed": 0,
"skipped": 3,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Configurer les notifications de nouveaux participants",
@@ -267,7 +267,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 3,
"failed": 0,
"skipped": 2,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.645Z",
"scenarios": [
{
"name": "Voir les événements à venir sur l'accueil",
@@ -297,7 +297,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 4,
"failed": 0,
"skipped": 1,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder au profil d'un participant",
@@ -324,10 +324,10 @@ const rawResults: RawFeatureTestStatus[] = [
{
"featureId": "us-12",
"totalScenarios": 7,
"passed": 2,
"passed": 3,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.584Z",
"skipped": 4,
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à la liste des événements depuis le profil",
@@ -347,7 +347,7 @@ const rawResults: RawFeatureTestStatus[] = [
},
{
"name": "Vérifier les données de l'écran événements",
"status": "skipped"
"status": "passed"
},
{
"name": "Vérifier les données de l'écran profil",
@@ -365,7 +365,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 3,
"failed": 0,
"skipped": 2,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à la liste des inscrits d'un événement",
@@ -395,7 +395,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 5,
"failed": 0,
"skipped": 1,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à mon profil",
@@ -429,7 +429,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 2,
"failed": 0,
"skipped": 3,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder aux paramètres de profil",
@@ -459,7 +459,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 5,
"failed": 0,
"skipped": 0,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder au partage de profil",
@@ -489,7 +489,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 5,
"failed": 0,
"skipped": 0,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder au partage depuis le profil",
@@ -519,7 +519,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 2,
"failed": 0,
"skipped": 1,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder aux paramètres de notification",
@@ -541,7 +541,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 1,
"failed": 0,
"skipped": 2,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder aux paramètres de notification",
@@ -563,7 +563,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 3,
"failed": 0,
"skipped": 1,
"lastRun": "2026-01-26T13:48:13.584Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à la création d'événement",
@@ -589,7 +589,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 4,
"failed": 0,
"skipped": 1,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder au profil pour voir la photo",
@@ -619,7 +619,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder aux détails d'un événement terminé",
@@ -649,7 +649,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 3,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder au bilan consolidé",
@@ -671,7 +671,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 7,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à la création d'atelier",
@@ -709,7 +709,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Accéder à la zone de notes personnelles",
@@ -739,7 +739,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 5,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Voir les commentaires existants d'un atelier",
@@ -769,7 +769,7 @@ const rawResults: RawFeatureTestStatus[] = [
"passed": 0,
"failed": 0,
"skipped": 4,
"lastRun": "2026-01-26T13:48:13.585Z",
"lastRun": "2026-01-26T14:13:45.646Z",
"scenarios": [
{
"name": "Voir les ateliers d'un événement",
src/screens/EventDetailScreen.tsx
+11 -10
View File
@@ -26,17 +26,17 @@ export function EventDetailScreen({ navigate }: ScreenProps) {
<Placeholder height={180} label="Photo de couverture" />
<div style={{ padding: 16 }}>
<Title className="user-content" style={{ marginBottom: 8 }}>Barbecue d'été</Title>
<Title className="user-content" style={{ marginBottom: 8 }}>Résidence Reconnexion</Title>
<div style={{ display: 'flex', flexDirection: 'column', gap: 8, marginBottom: 16 }}>
<Text style={{ margin: 0, fontSize: 15 }}>
📅 <span className="user-content">Samedi 25 janvier 2025</span>
📅 <span className="user-content">Lundi 16 - Vendredi 20 février 2026</span>
</Text>
<Text style={{ margin: 0, fontSize: 15 }}>
🕓 <span className="user-content">16h00 - 21h00</span>
🕓 <span className="user-content">Semaine complète (arrivée dimanche possible)</span>
</Text>
<Text style={{ margin: 0, fontSize: 15 }}>
📍 <span className="user-content">Parc Central, Pelouse Ouest</span>
📍 <span className="user-content">Le Revel, Rogues (30)</span>
</Text>
</div>
@@ -64,9 +64,9 @@ export function EventDetailScreen({ navigate }: ScreenProps) {
{/* Host */}
<div style={{ display: 'flex', alignItems: 'center', gap: 12, marginBottom: 16 }}>
<Avatar initials="MD" />
<Avatar initials="RC" />
<div>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>Marie Dupont</Text>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>Reconnexion</Text>
<Text style={{ margin: 0, fontSize: 14, color: 'var(--sketch-gray)' }}>Organisateur</Text>
</div>
</div>
@@ -76,15 +76,16 @@ export function EventDetailScreen({ navigate }: ScreenProps) {
{/* Description */}
<Text style={{ fontWeight: 'bold', marginBottom: 8 }}>À propos</Text>
<Text className="user-content" style={{ lineHeight: 1.6 }}>
Rejoignez-nous pour un super barbecue d'été ! Au menu : burgers, saucisses, options végé
et plein de boissons. Apportez votre plat préféré à partager. Jeux et musique assurés !
Une semaine collaborative pour se rencontrer, co-créer et faire avancer le projet de Réseau Social Universel.
Au programme : sessions plénières en intelligence collective, ateliers en forum ouvert, et randonnée
au Cirque de Navacelles. Hébergement sur place au Revel, écolieu à Rogues dans le Gard.
</Text>
<Divider />
{/* Attendees */}
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 12 }}>
<Text style={{ fontWeight: 'bold', margin: 0 }}>Participants (12)</Text>
<Text style={{ fontWeight: 'bold', margin: 0 }}>Participants (24)</Text>
<Text
style={{ margin: 0, fontSize: 14, cursor: 'pointer' }}
onClick={() => navigate('participants-list')}
@@ -118,7 +119,7 @@ export function EventDetailScreen({ navigate }: ScreenProps) {
justifyContent: 'center',
fontSize: 12,
}}>
+8
+20
</div>
<Text style={{ margin: '4px 0 0 0', fontSize: 12 }}>autres</Text>
</div>
src/screens/EventsScreen.tsx
+22 -22
View File
@@ -52,38 +52,38 @@ export function EventsScreen({ navigate }: ScreenProps) {
{/* Content */}
<div style={{ flex: 1, padding: 16, overflow: 'auto' }}>
<EventCard
title="Barbecue d'été"
date="Sam. 25 jan. · 16h00"
location="Parc Central"
title="Résidence Reconnexion"
date="Lun. 16 - Ven. 20 fév."
location="Le Revel, Rogues (30)"
attendees={24}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Atelier low-tech"
date="Sam. 8 fév. · 14h00"
location="La Maison du Vélo, Lyon"
attendees={12}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Soirée jeux de société"
date="Ven. 31 jan. · 19h00"
location="Chez Joe"
attendees={8}
title="Forum Ouvert Transition"
date="Sam. 22 fév. · 9h00"
location="Tiers-lieu L'Hermitage"
attendees={45}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Randonnée"
date="Dim. 2 fév. · 9h00"
location="Sentier de montagne"
attendees={5}
title="Formation CNV"
date="Sam. 1 mars · 9h30"
location="MJC Montplaisir, Lyon"
attendees={16}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Marathon films"
date="Sam. 8 fév. · 18h00"
location="Chez Sarah"
attendees={6}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Yoga au parc"
date="Dim. 9 fév. · 8h00"
location="Parc Riverside"
attendees={15}
title="Rencontre des Colibris"
date="Mer. 12 fév. · 19h00"
location="La Maison de l'Environnement"
attendees={30}
onClick={() => navigate('event-detail')}
/>
</div>
src/screens/HomeScreen.tsx
+16 -12
View File
@@ -2,13 +2,14 @@ import React from 'react';
import { Button, Title, Text, Card, NavBar, Badge } from '../components/sketchy';
import type { ScreenProps } from './index';
function EventCard({ title, date, attendees, onClick }: { title: string; date: string; attendees: number; onClick: () => void }) {
function EventCard({ title, date, location, attendees, onClick }: { title: string; date: string; location: string; attendees: number; onClick: () => void }) {
return (
<Card onClick={onClick} style={{ marginBottom: 12 }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start' }}>
<div>
<Text className="user-content" style={{ margin: 0, fontWeight: 'bold' }}>{title}</Text>
<Text className="user-content" style={{ margin: '4px 0 0 0', fontSize: 14 }}>{date}</Text>
<Text style={{ margin: '2px 0 0 0', fontSize: 14 }}>📍 <span className="user-content">{location}</span></Text>
</div>
<Badge>{attendees} inscrits</Badge>
</div>
@@ -40,21 +41,24 @@ export function HomeScreen({ navigate }: ScreenProps) {
</div>
<EventCard
title="Barbecue d'été"
date="Sam. 25 jan. · 16h00"
title="Résidence Reconnexion"
date="Lun. 16 - Ven. 20 fév."
location="Le Revel, Rogues (30)"
attendees={24}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Atelier low-tech"
date="Sam. 8 fév. · 14h00"
location="La Maison du Vélo, Lyon"
attendees={12}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Soirée jeux de société"
date="Ven. 31 jan. · 19h00"
attendees={8}
onClick={() => navigate('event-detail')}
/>
<EventCard
title="Randonnée"
date="Dim. 2 fév. · 9h00"
attendees={5}
title="Forum Ouvert Transition"
date="Sam. 22 fév. · 9h00"
location="Tiers-lieu L'Hermitage"
attendees={45}
onClick={() => navigate('event-detail')}
/>