Merge pull request 'Rename path parameter {token} to {eventToken}' (#37) from 015-rename-token-to-eventToken into master

Aligns the path parameter naming with the value object convention
used throughout the codebase (eventToken, rsvpToken, organizerToken).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

backend/.mvn/wrapper/maven-wrapper.properties

@@ -1,3 +1,3 @@
 wrapperVersion=3.3.4
 distributionType=only-script
-distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.9.13/apache-maven-3.9.13-bin.zip
+distributionUrl=https://repo.maven.apache.org/maven2/org/apache/maven/apache-maven/3.9.14/apache-maven-3.9.14-bin.zip

backend/src/main/java/de/fete/adapter/in/web/EventController.java

@@ -15,6 +15,8 @@ import de.fete.domain.model.Event;
 import de.fete.domain.model.EventToken;
 import de.fete.domain.model.OrganizerToken;
 import de.fete.domain.model.Rsvp;
+import de.fete.domain.model.RsvpToken;
+import de.fete.domain.port.in.CancelRsvpUseCase;
 import de.fete.domain.port.in.CountAttendeesByEventUseCase;
 import de.fete.domain.port.in.CreateEventUseCase;
 import de.fete.domain.port.in.CreateRsvpUseCase;
@@ -35,6 +37,7 @@ public class EventController implements EventsApi {
   private final CreateEventUseCase createEventUseCase;
   private final GetEventUseCase getEventUseCase;
   private final CreateRsvpUseCase createRsvpUseCase;
+  private final CancelRsvpUseCase cancelRsvpUseCase;
   private final CountAttendeesByEventUseCase countAttendeesByEventUseCase;
   private final GetAttendeesUseCase getAttendeesUseCase;
 
@@ -43,11 +46,13 @@ public class EventController implements EventsApi {
       CreateEventUseCase createEventUseCase,
       GetEventUseCase getEventUseCase,
       CreateRsvpUseCase createRsvpUseCase,
+      CancelRsvpUseCase cancelRsvpUseCase,
       CountAttendeesByEventUseCase countAttendeesByEventUseCase,
       GetAttendeesUseCase getAttendeesUseCase) {
     this.createEventUseCase = createEventUseCase;
     this.getEventUseCase = getEventUseCase;
     this.createRsvpUseCase = createRsvpUseCase;
+    this.cancelRsvpUseCase = cancelRsvpUseCase;
     this.countAttendeesByEventUseCase = countAttendeesByEventUseCase;
     this.getAttendeesUseCase = getAttendeesUseCase;
   }
@@ -78,10 +83,10 @@ public class EventController implements EventsApi {
   }
 
   @Override
-  public ResponseEntity<GetEventResponse> getEvent(UUID token) {
+  public ResponseEntity<GetEventResponse> getEvent(UUID eventToken) {
-    var eventToken = new de.fete.domain.model.EventToken(token);
+    var evtToken = new EventToken(eventToken);
-    Event event = getEventUseCase.getByEventToken(eventToken)
+    Event event = getEventUseCase.getByEventToken(evtToken)
-        .orElseThrow(() -> new EventNotFoundException(token));
+        .orElseThrow(() -> new EventNotFoundException(eventToken));
 
     var response = new GetEventResponse();
     response.setEventToken(event.getEventToken().value());
@@ -91,19 +96,19 @@ public class EventController implements EventsApi {
     response.setTimezone(event.getTimezone().getId());
     response.setLocation(event.getLocation());
     response.setAttendeeCount(
-        (int) countAttendeesByEventUseCase.countByEvent(eventToken));
+        (int) countAttendeesByEventUseCase.countByEvent(evtToken));
 
     return ResponseEntity.ok(response);
   }
 
   @Override
   public ResponseEntity<GetAttendeesResponse> getAttendees(
-      UUID token, UUID organizerToken) {
+      UUID eventToken, UUID organizerToken) {
-    var eventToken = new EventToken(token);
+    var evtToken = new EventToken(eventToken);
     var orgToken = new OrganizerToken(organizerToken);
 
     List<String> names = getAttendeesUseCase
-        .getAttendeeNames(eventToken, orgToken);
+        .getAttendeeNames(evtToken, orgToken);
 
     var attendees = names.stream()
         .map(name -> new Attendee().name(name))
@@ -117,9 +122,9 @@ public class EventController implements EventsApi {
 
   @Override
   public ResponseEntity<CreateRsvpResponse> createRsvp(
-      UUID token, CreateRsvpRequest createRsvpRequest) {
+      UUID eventToken, CreateRsvpRequest createRsvpRequest) {
-    var eventToken = new EventToken(token);
+    var evtToken = new EventToken(eventToken);
-    Rsvp rsvp = createRsvpUseCase.createRsvp(eventToken, createRsvpRequest.getName());
+    Rsvp rsvp = createRsvpUseCase.createRsvp(evtToken, createRsvpRequest.getName());
 
     var response = new CreateRsvpResponse();
     response.setRsvpToken(rsvp.getRsvpToken().value());
@@ -128,6 +133,12 @@ public class EventController implements EventsApi {
     return ResponseEntity.status(HttpStatus.CREATED).body(response);
   }
 
+  @Override
+  public ResponseEntity<Void> cancelRsvp(UUID eventToken, UUID rsvpToken) {
+    cancelRsvpUseCase.cancelRsvp(new EventToken(eventToken), new RsvpToken(rsvpToken));
+    return ResponseEntity.noContent().build();
+  }
+
   private static ZoneId parseTimezone(String timezone) {
     try {
       return ZoneId.of(timezone);

backend/src/main/java/de/fete/adapter/in/web/SpaController.java

@@ -68,17 +68,17 @@ public class SpaController {
 
   /** Serves SPA HTML with event-specific meta-tags. */
   @GetMapping(
-      value = "/events/{token}",
+      value = "/events/{eventToken}",
       produces = MediaType.TEXT_HTML_VALUE
   )
   @ResponseBody
-  public String serveEventPage(@PathVariable String token,
+  public String serveEventPage(@PathVariable String eventToken,
       HttpServletRequest request) {
     if (htmlTemplate == null) {
       return "";
     }
     String baseUrl = getBaseUrl(request);
-    Map<String, String> meta = resolveEventMeta(token, baseUrl);
+    Map<String, String> meta = resolveEventMeta(eventToken, baseUrl);
     return htmlTemplate.replace(PLACEHOLDER, renderTags(meta));
   }
 

backend/src/main/java/de/fete/adapter/out/persistence/RsvpJpaRepository.java

@@ -14,4 +14,7 @@ public interface RsvpJpaRepository extends JpaRepository<RsvpJpaEntity, Long> {
 
   /** Finds all RSVPs for the given event, ordered by ID ascending. */
   java.util.List<RsvpJpaEntity> findAllByEventIdOrderByIdAsc(Long eventId);
+
+  /** Deletes an RSVP by event ID and RSVP token. Returns count of deleted rows. */
+  long deleteByEventIdAndRsvpToken(Long eventId, UUID rsvpToken);
 }

backend/src/main/java/de/fete/adapter/out/persistence/RsvpPersistenceAdapter.java

@@ -36,6 +36,11 @@ public class RsvpPersistenceAdapter implements RsvpRepository {
         .toList();
   }
 
+  @Override
+  public boolean deleteByEventIdAndRsvpToken(Long eventId, RsvpToken rsvpToken) {
+    return jpaRepository.deleteByEventIdAndRsvpToken(eventId, rsvpToken.value()) > 0;
+  }
+
   private RsvpJpaEntity toEntity(Rsvp rsvp) {
     var entity = new RsvpJpaEntity();
     entity.setId(rsvp.getId());

backend/src/main/java/de/fete/application/service/RsvpService.java

@@ -5,11 +5,13 @@ import de.fete.domain.model.EventToken;
 import de.fete.domain.model.OrganizerToken;
 import de.fete.domain.model.Rsvp;
 import de.fete.domain.model.RsvpToken;
+import de.fete.domain.port.in.CancelRsvpUseCase;
 import de.fete.domain.port.in.CountAttendeesByEventUseCase;
 import de.fete.domain.port.in.CreateRsvpUseCase;
 import de.fete.domain.port.in.GetAttendeesUseCase;
 import de.fete.domain.port.out.EventRepository;
 import de.fete.domain.port.out.RsvpRepository;
+import jakarta.transaction.Transactional;
 import java.time.Clock;
 import java.time.LocalDate;
 import java.util.List;
@@ -18,7 +20,8 @@ import org.springframework.stereotype.Service;
 /** Application service implementing RSVP operations. */
 @Service
 public class RsvpService
-    implements CreateRsvpUseCase, CountAttendeesByEventUseCase, GetAttendeesUseCase {
+    implements CreateRsvpUseCase, CancelRsvpUseCase, CountAttendeesByEventUseCase,
+    GetAttendeesUseCase {
 
   private final EventRepository eventRepository;
   private final RsvpRepository rsvpRepository;
@@ -51,6 +54,14 @@ public class RsvpService
     return rsvpRepository.save(rsvp);
   }
 
+  @Override
+  @Transactional
+  public void cancelRsvp(EventToken eventToken, RsvpToken rsvpToken) {
+    eventRepository.findByEventToken(eventToken)
+        .ifPresent(event ->
+            rsvpRepository.deleteByEventIdAndRsvpToken(event.getId(), rsvpToken));
+  }
+
   @Override
   public long countByEvent(EventToken eventToken) {
     Event event = eventRepository.findByEventToken(eventToken)

backend/src/main/java/de/fete/domain/port/in/CancelRsvpUseCase.java

@@ -0,0 +1,11 @@
+package de.fete.domain.port.in;
+
+import de.fete.domain.model.EventToken;
+import de.fete.domain.model.RsvpToken;
+
+/** Inbound port for cancelling an RSVP. */
+public interface CancelRsvpUseCase {
+
+  /** Cancels the RSVP identified by the given tokens. Idempotent — no error if not found. */
+  void cancelRsvp(EventToken eventToken, RsvpToken rsvpToken);
+}

backend/src/main/java/de/fete/domain/port/out/RsvpRepository.java

@@ -1,6 +1,7 @@
 package de.fete.domain.port.out;
 
 import de.fete.domain.model.Rsvp;
+import de.fete.domain.model.RsvpToken;
 import java.util.List;
 
 /** Outbound port for persisting and querying RSVPs. */
@@ -14,4 +15,7 @@ public interface RsvpRepository {
 
   /** Finds all RSVPs for the given event, ordered by ID ascending. */
   List<Rsvp> findByEventId(Long eventId);
+
+  /** Deletes an RSVP by event ID and RSVP token. Returns true if a record was deleted. */
+  boolean deleteByEventIdAndRsvpToken(Long eventId, RsvpToken rsvpToken);
 }

backend/src/main/resources/openapi/api.yaml

@@ -37,14 +37,46 @@ paths:
               schema:
                 $ref: "#/components/schemas/ValidationProblemDetail"
 
-  /events/{token}/rsvps:
+  /events/{eventToken}/rsvps/{rsvpToken}:
+    delete:
+      operationId: cancelRsvp
+      summary: Cancel RSVP
+      description: |
+        Permanently deletes an RSVP identified by the RSVP token.
+        Idempotent: returns 204 whether the RSVP existed or not.
+      tags:
+        - events
+      parameters:
+        - name: eventToken
+          in: path
+          required: true
+          schema:
+            type: string
+            format: uuid
+          description: Event token (UUID)
+        - name: rsvpToken
+          in: path
+          required: true
+          schema:
+            type: string
+            format: uuid
+          description: RSVP token (UUID) identifying the attendance to cancel
+      responses:
+        "204":
+          description: >
+            RSVP successfully cancelled (or was already cancelled).
+            No response body.
+        "500":
+          description: Internal server error
+
+  /events/{eventToken}/rsvps:
     post:
       operationId: createRsvp
       summary: Submit an RSVP for an event
       tags:
         - events
       parameters:
-        - name: token
+        - name: eventToken
           in: path
           required: true
           schema:
@@ -83,14 +115,14 @@ paths:
               schema:
                 $ref: "#/components/schemas/ProblemDetail"
 
-  /events/{token}/attendees:
+  /events/{eventToken}/attendees:
     get:
       operationId: getAttendees
       summary: Get attendee list for an event (organizer only)
       tags:
         - events
       parameters:
-        - name: token
+        - name: eventToken
           in: path
           required: true
           schema:
@@ -124,14 +156,14 @@ paths:
               schema:
                 $ref: "#/components/schemas/ProblemDetail"
 
-  /events/{token}:
+  /events/{eventToken}:
     get:
       operationId: getEvent
       summary: Get public event details by token
       tags:
         - events
       parameters:
-        - name: token
+        - name: eventToken
           in: path
           required: true
           schema:

backend/src/test/java/de/fete/adapter/in/web/EventControllerIntegrationTest.java

@@ -1,6 +1,7 @@
 package de.fete.adapter.in.web;
 
 import static org.assertj.core.api.Assertions.assertThat;
+import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.delete;
 import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.get;
 import static org.springframework.test.web.servlet.request.MockMvcRequestBuilders.post;
 import static org.springframework.test.web.servlet.result.MockMvcResultMatchers.content;
@@ -374,6 +375,72 @@ class EventControllerIntegrationTest {
             "application/problem+json"));
   }
 
+  // --- Cancel RSVP tests ---
+
+  @Test
+  void cancelRsvpReturns204AndDeletesRow() throws Exception {
+    EventJpaEntity event = seedEvent(
+        "Cancel Event", null, "Europe/Berlin",
+        null, LocalDate.now().plusDays(30));
+    UUID rsvpToken = seedRsvpAndGetToken(event, "Departing Guest");
+
+    long countBefore = rsvpJpaRepository.count();
+
+    mockMvc.perform(delete("/api/events/" + event.getEventToken()
+            + "/rsvps/" + rsvpToken))
+        .andExpect(status().isNoContent());
+
+    assertThat(rsvpJpaRepository.count()).isEqualTo(countBefore - 1);
+    assertThat(rsvpJpaRepository.findByRsvpToken(rsvpToken)).isEmpty();
+  }
+
+  @Test
+  void cancelRsvpReturns204WhenAlreadyDeleted() throws Exception {
+    EventJpaEntity event = seedEvent(
+        "Idempotent Event", null, "Europe/Berlin",
+        null, LocalDate.now().plusDays(30));
+
+    mockMvc.perform(delete("/api/events/" + event.getEventToken()
+            + "/rsvps/" + UUID.randomUUID()))
+        .andExpect(status().isNoContent());
+  }
+
+  @Test
+  void cancelRsvpReturns204WhenEventNotFound() throws Exception {
+    mockMvc.perform(delete("/api/events/" + UUID.randomUUID()
+            + "/rsvps/" + UUID.randomUUID()))
+        .andExpect(status().isNoContent());
+  }
+
+  @Test
+  void attendeeCountDecreasesAfterCancelRsvp() throws Exception {
+    EventJpaEntity event = seedEvent(
+        "Count Cancel Event", null, "Europe/Berlin",
+        null, LocalDate.now().plusDays(30));
+    UUID rsvpToken = seedRsvpAndGetToken(event, "Leaving Guest");
+    seedRsvp(event, "Staying Guest");
+
+    mockMvc.perform(get("/api/events/" + event.getEventToken()))
+        .andExpect(jsonPath("$.attendeeCount").value(2));
+
+    mockMvc.perform(delete("/api/events/" + event.getEventToken()
+            + "/rsvps/" + rsvpToken))
+        .andExpect(status().isNoContent());
+
+    mockMvc.perform(get("/api/events/" + event.getEventToken()))
+        .andExpect(jsonPath("$.attendeeCount").value(1));
+  }
+
+  private UUID seedRsvpAndGetToken(EventJpaEntity event, String name) {
+    var rsvp = new RsvpJpaEntity();
+    UUID token = UUID.randomUUID();
+    rsvp.setRsvpToken(token);
+    rsvp.setEventId(event.getId());
+    rsvp.setName(name);
+    rsvpJpaRepository.save(rsvp);
+    return token;
+  }
+
   private void seedRsvp(EventJpaEntity event, String name) {
     var rsvp = new RsvpJpaEntity();
     rsvp.setRsvpToken(UUID.randomUUID());

backend/src/test/java/de/fete/application/service/RsvpServiceTest.java

@@ -191,6 +191,41 @@ class RsvpServiceTest {
     return rsvp;
   }
 
+  @Test
+  void cancelRsvpDeletesWhenEventAndRsvpExist() {
+    Event event = buildActiveEvent();
+    EventToken token = event.getEventToken();
+    RsvpToken rsvpToken = RsvpToken.generate();
+    when(eventRepository.findByEventToken(token)).thenReturn(Optional.of(event));
+    when(rsvpRepository.deleteByEventIdAndRsvpToken(event.getId(), rsvpToken)).thenReturn(true);
+
+    rsvpService.cancelRsvp(token, rsvpToken);
+
+    verify(rsvpRepository).deleteByEventIdAndRsvpToken(event.getId(), rsvpToken);
+  }
+
+  @Test
+  void cancelRsvpSucceedsWhenRsvpNotFound() {
+    Event event = buildActiveEvent();
+    EventToken token = event.getEventToken();
+    RsvpToken rsvpToken = RsvpToken.generate();
+    when(eventRepository.findByEventToken(token)).thenReturn(Optional.of(event));
+    when(rsvpRepository.deleteByEventIdAndRsvpToken(event.getId(), rsvpToken)).thenReturn(false);
+
+    rsvpService.cancelRsvp(token, rsvpToken);
+
+    verify(rsvpRepository).deleteByEventIdAndRsvpToken(event.getId(), rsvpToken);
+  }
+
+  @Test
+  void cancelRsvpSucceedsWhenEventNotFound() {
+    EventToken token = EventToken.generate();
+    RsvpToken rsvpToken = RsvpToken.generate();
+    when(eventRepository.findByEventToken(token)).thenReturn(Optional.empty());
+
+    rsvpService.cancelRsvp(token, rsvpToken);
+  }
+
   private Event buildActiveEvent() {
     var event = new Event();
     event.setId(1L);

frontend/e2e/cancel-rsvp.spec.ts

@@ -0,0 +1,276 @@
+import { http, HttpResponse } from 'msw'
+import { test, expect } from './msw-setup'
+import type { StoredEvent } from '../src/composables/useEventStorage'
+
+const STORAGE_KEY = 'fete:events'
+
+const fullEvent = {
+  eventToken: 'a1b2c3d4-e5f6-7890-abcd-ef1234567890',
+  title: 'Summer BBQ',
+  description: 'Bring your own drinks!',
+  dateTime: '2026-03-15T20:00:00+01:00',
+  timezone: 'Europe/Berlin',
+  location: 'Central Park, NYC',
+  attendeeCount: 12,
+}
+
+const rsvpToken = 'd4e5f6a7-b8c9-0123-4567-890abcdef012'
+
+function seedEvents(events: StoredEvent[]): string {
+  return `window.localStorage.setItem('${STORAGE_KEY}', ${JSON.stringify(JSON.stringify(events))})`
+}
+
+function rsvpSeed(): StoredEvent {
+  return {
+    eventToken: fullEvent.eventToken,
+    title: fullEvent.title,
+    dateTime: fullEvent.dateTime,
+    rsvpToken,
+    rsvpName: 'Anna',
+  }
+}
+
+test.describe('US1: Cancel RSVP from Event Detail View', () => {
+  test('status bar shows cancel affordance when RSVP\'d', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Status bar visible
+    const statusBar = page.getByRole('button', { name: /You're attending/ })
+    await expect(statusBar).toBeVisible()
+
+    // Cancel button hidden initially
+    await expect(page.getByRole('button', { name: 'Cancel attendance' })).not.toBeVisible()
+  })
+
+  test('tapping status bar reveals cancel button', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Tap status bar
+    await page.getByRole('button', { name: /You're attending/ }).click()
+
+    // Cancel button appears
+    await expect(page.getByRole('button', { name: 'Cancel attendance' })).toBeVisible()
+  })
+
+  test('confirm cancellation → localStorage cleared, count decremented, bar reset', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return new HttpResponse(null, { status: 204 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Expand → Cancel attendance → Confirm in dialog
+    await page.getByRole('button', { name: /You're attending/ }).click()
+    await page.locator('.rsvp-bar__cancel').click()
+
+    // Confirm dialog
+    await expect(page.getByText('Your attendance will be permanently cancelled.')).toBeVisible()
+    await page.getByRole('alertdialog').getByRole('button', { name: 'Cancel attendance' }).click()
+
+    // Bar resets to CTA state
+    await expect(page.getByRole('button', { name: "I'm attending" })).toBeVisible()
+    await expect(page.getByText("You're attending!")).not.toBeVisible()
+
+    // Attendee count decremented
+    await expect(page.getByText('11 going')).toBeVisible()
+
+    // localStorage cleared
+    const stored = await page.evaluate(() => {
+      const raw = localStorage.getItem('fete:events')
+      return raw ? JSON.parse(raw) : null
+    })
+    const event = stored?.find((e: StoredEvent) => e.eventToken === fullEvent.eventToken)
+    expect(event?.rsvpToken).toBeUndefined()
+    expect(event?.rsvpName).toBeUndefined()
+  })
+
+  test('server error → error message, state unchanged', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return HttpResponse.json({ error: 'fail' }, { status: 500 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Expand → Cancel → Confirm in dialog
+    await page.getByRole('button', { name: /You're attending/ }).click()
+    await page.locator('.rsvp-bar__cancel').click()
+    await page.getByRole('alertdialog').getByRole('button', { name: 'Cancel attendance' }).click()
+
+    // Error message
+    await expect(page.getByText('Could not cancel RSVP. Please try again.')).toBeVisible()
+
+    // Attendee count unchanged
+    await expect(page.getByText('12 going')).toBeVisible()
+  })
+
+  test('re-RSVP after cancel works', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return new HttpResponse(null, { status: 204 })
+      }),
+      http.post('*/api/events/:token/rsvps', () => {
+        return HttpResponse.json(
+          { rsvpToken: 'new-rsvp-token', name: 'Max' },
+          { status: 201 },
+        )
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Cancel first
+    await page.getByRole('button', { name: /You're attending/ }).click()
+    await page.locator('.rsvp-bar__cancel').click()
+    await page.getByRole('alertdialog').getByRole('button', { name: 'Cancel attendance' }).click()
+
+    // CTA should be back
+    await expect(page.getByRole('button', { name: "I'm attending" })).toBeVisible()
+
+    // Re-RSVP
+    await page.getByRole('button', { name: "I'm attending" }).click()
+    const dialog = page.getByRole('dialog', { name: 'RSVP' })
+    await dialog.getByLabel('Your name').fill('Max')
+    await dialog.getByRole('button', { name: 'Count me in' }).click()
+
+    // Status bar returns
+    await expect(page.getByText("You're attending!")).toBeVisible()
+  })
+})
+
+test.describe('US2: Auto-Cancel on Event List Removal', () => {
+  test('removal of RSVP\'d event shows attendance warning in dialog', async ({ page }) => {
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove Summer BBQ/ }).click()
+
+    await expect(page.getByText('your attendance will be cancelled')).toBeVisible()
+  })
+
+  test('removal of non-RSVP\'d event shows standard dialog', async ({ page }) => {
+    const noRsvp: StoredEvent = {
+      eventToken: 'no-rsvp-token',
+      title: 'No RSVP Event',
+      dateTime: '2027-06-15T18:00:00Z',
+      organizerToken: 'org-123',
+    }
+    await page.addInitScript(seedEvents([noRsvp]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove No RSVP Event/ }).click()
+
+    await expect(page.getByText('This event will be removed from your list.')).toBeVisible()
+    await expect(page.getByText('attendance will be cancelled')).not.toBeVisible()
+  })
+
+  test('confirm removal → DELETE called → event removed from list', async ({ page, network }) => {
+    network.use(
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return new HttpResponse(null, { status: 204 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove Summer BBQ/ }).click()
+    await page.getByRole('button', { name: 'Remove', exact: true }).click()
+
+    // Event gone
+    await expect(page.getByText('Summer BBQ')).not.toBeVisible()
+
+    // localStorage updated
+    const stored = await page.evaluate(() => {
+      const raw = localStorage.getItem('fete:events')
+      return raw ? JSON.parse(raw) : null
+    })
+    const found = stored?.find((e: StoredEvent) => e.eventToken === fullEvent.eventToken)
+    expect(found).toBeUndefined()
+  })
+
+  test('server error on DELETE → error message, event stays in list', async ({ page, network }) => {
+    network.use(
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return HttpResponse.json({ error: 'fail' }, { status: 500 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove Summer BBQ/ }).click()
+    await page.getByRole('button', { name: 'Remove', exact: true }).click()
+
+    // Event still in list
+    await expect(page.getByText('Summer BBQ')).toBeVisible()
+  })
+
+  test('dismiss dialog → no changes', async ({ page }) => {
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove Summer BBQ/ }).click()
+    await page.getByRole('button', { name: 'Cancel' }).click()
+
+    // Event still there
+    await expect(page.getByText('Summer BBQ')).toBeVisible()
+  })
+})
+
+test.describe('US3: Cancel RSVP with Stale/Invalid Token', () => {
+  test('cancel from detail view with stale token (404) → treated as success', async ({ page, network }) => {
+    network.use(
+      http.get('*/api/events/:token', () => HttpResponse.json(fullEvent)),
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return HttpResponse.json({ error: 'not found' }, { status: 404 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto(`/events/${fullEvent.eventToken}`)
+
+    // Cancel flow
+    await page.getByRole('button', { name: /You're attending/ }).click()
+    await page.locator('.rsvp-bar__cancel').click()
+    await page.getByRole('alertdialog').getByRole('button', { name: 'Cancel attendance' }).click()
+
+    // Treated as success — CTA returns
+    await expect(page.getByRole('button', { name: "I'm attending" })).toBeVisible()
+
+    // localStorage cleaned
+    const stored = await page.evaluate(() => {
+      const raw = localStorage.getItem('fete:events')
+      return raw ? JSON.parse(raw) : null
+    })
+    const event = stored?.find((e: StoredEvent) => e.eventToken === fullEvent.eventToken)
+    expect(event?.rsvpToken).toBeUndefined()
+  })
+
+  test('event list removal with stale token (404) → treated as success', async ({ page, network }) => {
+    network.use(
+      http.delete('*/api/events/:token/rsvps/:rsvpToken', () => {
+        return HttpResponse.json({ error: 'not found' }, { status: 404 })
+      }),
+    )
+    await page.addInitScript(seedEvents([rsvpSeed()]))
+    await page.goto('/')
+
+    await page.getByRole('button', { name: /Remove Summer BBQ/ }).click()
+    await page.getByRole('button', { name: 'Remove', exact: true }).click()
+
+    // Event removed from list
+    await expect(page.getByText('Summer BBQ')).not.toBeVisible()
+  })
+})

frontend/package.json

@@ -38,17 +38,17 @@
     "@vue/tsconfig": "^0.9.0",
     "eslint": "^10.0.2",
     "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-oxlint": "~1.53.0",
+    "eslint-plugin-oxlint": "~1.54.0",
     "eslint-plugin-vue": "~10.8.0",
     "jiti": "^2.6.1",
     "jsdom": "^28.1.0",
     "msw": "^2.12.10",
     "npm-run-all2": "^8.0.4",
     "openapi-typescript": "^7.13.0",
-    "oxlint": "~1.54.0",
+    "oxlint": "~1.55.0",
     "prettier": "3.8.1",
     "typescript": "~5.9.3",
-    "vite": "^7.3.1",
+    "vite": "^8.0.0",
     "vite-plugin-vue-devtools": "^8.0.6",
     "vitest": "^4.0.18",
     "vue-tsc": "^3.2.5"

frontend/src/components/EventList.vue

@@ -28,7 +28,7 @@
     <ConfirmDialog
       :open="!!pendingDeleteToken"
       title="Remove event?"
-      message="This event will be removed from your list."
+      :message="deleteDialogMessage"
       confirm-label="Remove"
       cancel-label="Cancel"
       @confirm="confirmDelete"
@@ -42,24 +42,62 @@ import { computed, ref } from 'vue'
 import { useEventStorage, isValidStoredEvent } from '../composables/useEventStorage'
 import { useEventGrouping } from '../composables/useEventGrouping'
 import { formatRelativeTime } from '../composables/useRelativeTime'
+import { api } from '../api/client'
 import EventCard from './EventCard.vue'
 import SectionHeader from './SectionHeader.vue'
 import DateSubheader from './DateSubheader.vue'
 import ConfirmDialog from './ConfirmDialog.vue'
 import type { StoredEvent } from '../composables/useEventStorage'
 
-const { getStoredEvents, removeEvent } = useEventStorage()
+const { getStoredEvents, getRsvp, removeEvent } = useEventStorage()
 
 const pendingDeleteToken = ref<string | null>(null)
+const deleteError = ref('')
+
+const deleteDialogMessage = computed(() => {
+  if (!pendingDeleteToken.value) return ''
+  const rsvp = getRsvp(pendingDeleteToken.value)
+  if (rsvp) {
+    return 'This event will be removed from your list and your attendance will be cancelled.'
+  }
+  return 'This event will be removed from your list.'
+})
 
 function requestDelete(eventToken: string) {
+  deleteError.value = ''
   pendingDeleteToken.value = eventToken
 }
 
-function confirmDelete() {
+async function confirmDelete() {
-  if (pendingDeleteToken.value) {
+  if (!pendingDeleteToken.value) return
-    removeEvent(pendingDeleteToken.value)
+
+  const eventToken = pendingDeleteToken.value
+  const rsvp = getRsvp(eventToken)
+
+  if (rsvp) {
+    try {
+      const { response } = await api.DELETE('/events/{eventToken}/rsvps/{rsvpToken}', {
+        params: {
+          path: {
+            eventToken: eventToken,
+            rsvpToken: rsvp.rsvpToken,
+          },
+        },
+      })
+
+      if (response.status !== 204 && response.status !== 404) {
+        deleteError.value = 'Could not cancel attendance. Please try again.'
+        pendingDeleteToken.value = null
+        return
+      }
+    } catch {
+      deleteError.value = 'Could not cancel attendance. Please try again.'
+      pendingDeleteToken.value = null
+      return
+    }
   }
+
+  removeEvent(eventToken)
   pendingDeleteToken.value = null
 }
 

frontend/src/components/RsvpBar.vue

@@ -2,9 +2,32 @@
   <div class="rsvp-bar">
     <div class="rsvp-bar__inner">
       <!-- Status state: already RSVPed -->
-      <div v-if="hasRsvp" class="rsvp-bar__status">
+      <div v-if="hasRsvp" class="rsvp-bar__status-wrapper">
-        <span class="rsvp-bar__check" aria-hidden="true">✓</span>
+        <div
-        <span class="rsvp-bar__text">You're attending!</span>
+          class="rsvp-bar__status"
+          role="button"
+          tabindex="0"
+          :aria-expanded="expanded"
+          aria-label="You're attending. Tap to show cancel option."
+          @click="expanded = !expanded"
+          @keydown.enter.prevent="expanded = !expanded"
+          @keydown.space.prevent="expanded = !expanded"
+          @keydown.escape="expanded = false"
+        >
+          <span class="rsvp-bar__check" aria-hidden="true">✓</span>
+          <span class="rsvp-bar__text">You're attending!</span>
+          <span class="rsvp-bar__chevron" :class="{ 'rsvp-bar__chevron--open': expanded }" aria-hidden="true">›</span>
+        </div>
+        <Transition name="rsvp-bar-cancel">
+          <button
+            v-if="expanded"
+            class="rsvp-bar__cancel"
+            type="button"
+            @click="$emit('cancel')"
+          >
+            Cancel attendance
+          </button>
+        </Transition>
       </div>
 
       <!-- CTA state: no RSVP yet -->
@@ -18,13 +41,37 @@
 </template>
 
 <script setup lang="ts">
-defineProps<{
+import { ref, watch } from 'vue'
+
+const props = defineProps<{
   hasRsvp?: boolean
 }>()
 
 defineEmits<{
   open: []
+  cancel: []
 }>()
+
+const expanded = ref(false)
+
+watch(() => props.hasRsvp, () => {
+  expanded.value = false
+})
+
+function onClickOutside(e: MouseEvent) {
+  const target = e.target as HTMLElement
+  if (!target.closest('.rsvp-bar__status-wrapper')) {
+    expanded.value = false
+  }
+}
+
+watch(expanded, (isExpanded) => {
+  if (isExpanded) {
+    document.addEventListener('click', onClickOutside, { capture: true })
+  } else {
+    document.removeEventListener('click', onClickOutside, { capture: true })
+  }
+})
 </script>
 
 <style scoped>
@@ -73,6 +120,12 @@ defineEmits<{
   cursor: pointer;
 }
 
+.rsvp-bar__status-wrapper {
+  display: flex;
+  flex-direction: column;
+  gap: var(--spacing-xs);
+}
+
 .rsvp-bar__status {
   display: flex;
   align-items: center;
@@ -88,6 +141,13 @@ defineEmits<{
   font-weight: 600;
   font-size: 0.95rem;
   color: var(--color-text-on-gradient);
+  cursor: pointer;
+  user-select: none;
+  -webkit-user-select: none;
+}
+
+.rsvp-bar__status:hover {
+  background: linear-gradient(135deg, var(--color-glass-hover) 0%, var(--color-glass-strong) 100%);
 }
 
 .rsvp-bar__check {
@@ -101,4 +161,49 @@ defineEmits<{
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+.rsvp-bar__chevron {
+  font-size: 1.2rem;
+  font-weight: 700;
+  transition: transform 0.2s ease;
+  transform: rotate(0deg);
+  margin-left: auto;
+}
+
+.rsvp-bar__chevron--open {
+  transform: rotate(90deg);
+}
+
+.rsvp-bar__cancel {
+  display: block;
+  width: 100%;
+  padding: var(--spacing-sm) var(--spacing-lg);
+  border-radius: var(--radius-card);
+  font-family: inherit;
+  font-size: 0.9rem;
+  font-weight: 600;
+  color: #ef5350;
+  background: linear-gradient(135deg, var(--color-glass-strong) 0%, var(--color-glass-subtle) 100%);
+  border: 1px solid var(--color-glass-border);
+  backdrop-filter: blur(16px);
+  -webkit-backdrop-filter: blur(16px);
+  cursor: pointer;
+  text-align: center;
+  transition: background 0.15s ease;
+}
+
+.rsvp-bar__cancel:hover {
+  background: linear-gradient(135deg, var(--color-glass-hover) 0%, var(--color-glass-strong) 100%);
+}
+
+.rsvp-bar-cancel-enter-active,
+.rsvp-bar-cancel-leave-active {
+  transition: opacity 0.15s ease, transform 0.15s ease;
+}
+
+.rsvp-bar-cancel-enter-from,
+.rsvp-bar-cancel-leave-to {
+  opacity: 0;
+  transform: translateY(-4px);
+}
 </style>

frontend/src/composables/useEventStorage.ts

@@ -78,10 +78,20 @@ export function useEventStorage() {
     return undefined
   }
 
+  function removeRsvp(eventToken: string): void {
+    const events = readEvents()
+    const event = events.find((e) => e.eventToken === eventToken)
+    if (event) {
+      delete event.rsvpToken
+      delete event.rsvpName
+      writeEvents(events)
+    }
+  }
+
   function removeEvent(eventToken: string): void {
     const events = readEvents().filter((e) => e.eventToken !== eventToken)
     writeEvents(events)
   }
 
-  return { saveCreatedEvent, getStoredEvents, getOrganizerToken, saveRsvp, getRsvp, removeEvent }
+  return { saveCreatedEvent, getStoredEvents, getOrganizerToken, saveRsvp, getRsvp, removeRsvp, removeEvent }
 }

frontend/src/views/EventDetailView.vue

@@ -70,11 +70,28 @@
       </div>
     </div>
 
+    <!-- Cancel error message -->
+    <div v-if="cancelError" class="detail__cancel-error" role="alert">
+      <p>{{ cancelError }}</p>
+    </div>
+
     <!-- RSVP bar -->
     <RsvpBar
       v-if="state === 'loaded' && event && !isOrganizer"
       :has-rsvp="!!rsvpName"
       @open="sheetOpen = true"
+      @cancel="confirmCancelOpen = true"
+    />
+
+    <!-- Cancel confirmation dialog -->
+    <ConfirmDialog
+      :open="confirmCancelOpen"
+      title="Cancel attendance?"
+      message="Your attendance will be permanently cancelled."
+      confirm-label="Cancel attendance"
+      cancel-label="Keep"
+      @confirm="handleCancelRsvp"
+      @cancel="confirmCancelOpen = false"
     />
 
     <!-- RSVP bottom sheet -->
@@ -113,6 +130,7 @@ import { api } from '@/api/client'
 import { useEventStorage } from '@/composables/useEventStorage'
 import AttendeeList from '@/components/AttendeeList.vue'
 import BottomSheet from '@/components/BottomSheet.vue'
+import ConfirmDialog from '@/components/ConfirmDialog.vue'
 import RsvpBar from '@/components/RsvpBar.vue'
 import type { components } from '@/api/schema'
 
@@ -120,7 +138,7 @@ type GetEventResponse = components['schemas']['GetEventResponse']
 type State = 'loading' | 'loaded' | 'not-found' | 'error'
 
 const route = useRoute()
-const { saveRsvp, getRsvp, getOrganizerToken } = useEventStorage()
+const { saveRsvp, getRsvp, removeRsvp, getOrganizerToken } = useEventStorage()
 
 const state = ref<State>('loading')
 const event = ref<GetEventResponse | null>(null)
@@ -132,6 +150,8 @@ const nameError = ref('')
 const submitError = ref('')
 const submitting = ref(false)
 const rsvpName = ref<string | undefined>(undefined)
+const confirmCancelOpen = ref(false)
+const cancelError = ref('')
 const isOrganizer = ref(false)
 const attendeeNames = ref<string[] | null>(null)
 
@@ -149,8 +169,8 @@ async function fetchEvent() {
   event.value = null
 
   try {
-    const { data, error, response } = await api.GET('/events/{token}', {
+    const { data, error, response } = await api.GET('/events/{eventToken}', {
-      params: { path: { token: route.params.eventToken as string } },
+      params: { path: { eventToken: route.params.eventToken as string } },
     })
 
     if (error) {
@@ -197,8 +217,8 @@ async function submitRsvp() {
   submitting.value = true
 
   try {
-    const { data, error } = await api.POST('/events/{token}/rsvps', {
+    const { data, error } = await api.POST('/events/{eventToken}/rsvps', {
-      params: { path: { token: route.params.eventToken as string } },
+      params: { path: { eventToken: route.params.eventToken as string } },
       body: { name: nameInput.value },
     })
 
@@ -228,11 +248,42 @@ async function submitRsvp() {
   }
 }
 
+async function handleCancelRsvp() {
+  confirmCancelOpen.value = false
+  cancelError.value = ''
+
+  const stored = getRsvp(route.params.eventToken as string)
+  if (!stored) return
+
+  try {
+    const { response } = await api.DELETE('/events/{eventToken}/rsvps/{rsvpToken}', {
+      params: {
+        path: {
+          eventToken: route.params.eventToken as string,
+          rsvpToken: stored.rsvpToken,
+        },
+      },
+    })
+
+    if (response.status === 204 || response.status === 404) {
+      removeRsvp(route.params.eventToken as string)
+      rsvpName.value = undefined
+      if (event.value) {
+        event.value.attendeeCount = Math.max(0, event.value.attendeeCount - 1)
+      }
+    } else {
+      cancelError.value = 'Could not cancel RSVP. Please try again.'
+    }
+  } catch {
+    cancelError.value = 'Could not cancel RSVP. Please try again.'
+  }
+}
+
 async function fetchAttendees(eventToken: string, organizerToken: string) {
   try {
-    const { data, error } = await api.GET('/events/{token}/attendees', {
+    const { data, error } = await api.GET('/events/{eventToken}/attendees', {
       params: {
-        path: { token: eventToken },
+        path: { eventToken: eventToken },
         query: { organizerToken },
       },
     })

frontend/src/views/__tests__/EventCreateView.spec.ts

@@ -163,6 +163,7 @@ describe('EventCreateView', () => {
       getOrganizerToken: vi.fn(),
       saveRsvp: vi.fn(),
       getRsvp: vi.fn(),
+      removeRsvp: vi.fn(),
       removeEvent: vi.fn(),
     })
 

frontend/src/views/__tests__/EventDetailView.spec.ts

@@ -280,8 +280,8 @@ describe('EventDetailView', () => {
     await flushPromises()
 
     // Verify API call
-    expect(vi.mocked(api.POST)).toHaveBeenCalledWith('/events/{token}/rsvps', {
+    expect(vi.mocked(api.POST)).toHaveBeenCalledWith('/events/{eventToken}/rsvps', {
-      params: { path: { token: 'test-token' } },
+      params: { path: { eventToken: 'test-token' } },
       body: { name: 'Max' },
     })
 

specs/014-cancel-rsvp/checklists/requirements.md

@@ -0,0 +1,36 @@
+# Specification Quality Checklist: Cancel RSVP
+
+**Purpose**: Validate specification completeness and quality before proceeding to planning
+**Created**: 2026-03-09
+**Feature**: [spec.md](../spec.md)
+
+## Content Quality
+
+- [x] No implementation details (languages, frameworks, APIs)
+- [x] Focused on user value and business needs
+- [x] Written for non-technical stakeholders
+- [x] All mandatory sections completed
+
+## Requirement Completeness
+
+- [x] No [NEEDS CLARIFICATION] markers remain
+- [x] Requirements are testable and unambiguous
+- [x] Success criteria are measurable
+- [x] Success criteria are technology-agnostic (no implementation details)
+- [x] All acceptance scenarios are defined
+- [x] Edge cases are identified
+- [x] Scope is clearly bounded
+- [x] Dependencies and assumptions identified
+
+## Feature Readiness
+
+- [x] All functional requirements have clear acceptance criteria
+- [x] User scenarios cover primary flows
+- [x] Feature meets measurable outcomes defined in Success Criteria
+- [x] No implementation details leak into specification
+
+## Notes
+
+- All items pass. Spec is ready for `/speckit.clarify` or `/speckit.plan`.
+- The "Design Proposals" section is intentionally included as requested by the user — these are UX options, not implementation details.
+- One decision point remains: which design option (A, B, or C) for the cancel UI. This is deferred to discussion with the user rather than marked as [NEEDS CLARIFICATION] since the user explicitly requested proposals.

specs/014-cancel-rsvp/contracts/cancel-rsvp.yaml

@@ -0,0 +1,40 @@
+# Cancel RSVP — API Contract
+# This contract will be merged into backend/src/main/resources/openapi/api.yaml
+
+# Path: /events/{token}/rsvps/{rsvpToken}
+# Method: DELETE
+
+path:
+  /events/{token}/rsvps/{rsvpToken}:
+    delete:
+      summary: Cancel RSVP
+      description: |
+        Permanently deletes an RSVP identified by the RSVP token.
+        Idempotent: returns 204 whether the RSVP existed or not.
+      operationId: cancelRsvp
+      tags:
+        - Events
+      parameters:
+        - name: token
+          in: path
+          required: true
+          description: Event token (UUID)
+          schema:
+            type: string
+            format: uuid
+            example: "550e8400-e29b-41d4-a716-446655440000"
+        - name: rsvpToken
+          in: path
+          required: true
+          description: RSVP token (UUID) identifying the attendance to cancel
+          schema:
+            type: string
+            format: uuid
+            example: "7c9e6679-7425-40de-944b-e07fc1f90ae7"
+      responses:
+        "204":
+          description: >
+            RSVP successfully cancelled (or was already cancelled).
+            No response body.
+        "500":
+          description: Internal server error

specs/014-cancel-rsvp/data-model.md

@@ -0,0 +1,74 @@
+# Data Model: Cancel RSVP
+
+**Feature**: 014-cancel-rsvp | **Date**: 2026-03-09
+
+## Entities
+
+### RSVP (existing — no schema changes)
+
+| Field | Type | Constraints | Notes |
+|-------|------|-------------|-------|
+| id | BIGSERIAL | PK, auto-generated | Internal DB ID, never exposed |
+| rsvp_token | UUID | UNIQUE, NOT NULL | Bearer credential for the guest |
+| event_id | BIGINT | FK → events.id, NOT NULL | Links RSVP to event |
+| name | VARCHAR(100) | NOT NULL | Guest display name |
+
+**No migration needed.** The cancel feature only deletes existing rows — no new columns or tables.
+
+## State Transitions
+
+```
+┌──────────┐    POST /events/{token}/rsvps    ┌──────────┐
+│ No RSVP  │ ──────────────────────────────► │ Attending │
+│ (guest)  │ ◄────────────────────────────── │  (guest)  │
+└──────────┘  DELETE /events/{token}/rsvps/   └──────────┘
+                    {rsvpToken}
+```
+
+The transition is fully reversible: after cancellation, the guest can create a new RSVP (new token generated).
+
+## Client-Side Storage (localStorage)
+
+### StoredEvent (existing interface — no changes)
+
+```typescript
+interface StoredEvent {
+  eventToken: string      // always present
+  title: string           // always present
+  dateTime: string        // always present
+  organizerToken?: string // present if organizer
+  rsvpToken?: string      // present if RSVP'd — CLEARED on cancel
+  rsvpName?: string       // present if RSVP'd — CLEARED on cancel
+}
+```
+
+### Cancel Effects on localStorage
+
+| Action | rsvpToken | rsvpName | Event in list |
+|--------|-----------|----------|---------------|
+| Cancel from detail view | Removed | Removed | Kept |
+| Remove from event list | Removed | Removed | Removed |
+
+## Repository Changes
+
+### RsvpRepository (domain port)
+
+New method:
+
+```java
+/**
+ * Delete an RSVP by event ID and RSVP token.
+ * @return true if a record was deleted, false if not found
+ */
+boolean deleteByEventIdAndRsvpToken(Long eventId, RsvpToken rsvpToken);
+```
+
+### RsvpJpaRepository
+
+New method:
+
+```java
+long deleteByEventIdAndRsvpToken(Long eventId, UUID rsvpToken);
+```
+
+Returns count of deleted rows (0 or 1). Spring Data JPA auto-implements this derived query.

specs/014-cancel-rsvp/plan.md

@@ -0,0 +1,90 @@
+# Implementation Plan: Cancel RSVP
+
+**Branch**: `014-cancel-rsvp` | **Date**: 2026-03-09 | **Spec**: [spec.md](spec.md)
+**Input**: Feature specification from `/specs/014-cancel-rsvp/spec.md`
+
+## Summary
+
+Allow guests to cancel their RSVP either explicitly from the event detail view (tap-to-reveal pattern on the RSVP bar) or implicitly when removing an RSVP'd event from their event list. The backend provides an idempotent DELETE endpoint; the frontend handles confirmation, API call, localStorage cleanup, and UI state reset.
+
+## Technical Context
+
+**Language/Version**: Java 25 (backend), TypeScript 5.9 (frontend)
+**Primary Dependencies**: Spring Boot 3.5.x, Vue 3, Vue Router 5, openapi-fetch, openapi-typescript
+**Storage**: PostgreSQL (JPA via Spring Data, Liquibase migrations)
+**Testing**: JUnit + Mockito (backend unit), MockMvc + Testcontainers (backend integration), Vitest (frontend unit), Playwright + MSW (frontend E2E)
+**Target Platform**: Self-hosted PWA (web browser, mobile-first)
+**Project Type**: Web application (hexagonal backend + SPA frontend)
+**Performance Goals**: Cancel operation < 500ms server-side
+**Constraints**: Privacy by design (no analytics), token-based auth (no login), idempotent delete
+**Scale/Scope**: Single new endpoint, 3 modified frontend components, 1 new composable method
+
+## Constitution Check
+
+*GATE: Must pass before Phase 0 research. Re-check after Phase 1 design.*
+
+| Principle | Status | Notes |
+|-----------|--------|-------|
+| I. Privacy by Design | PASS | No new PII stored. Delete operation removes data. No analytics. |
+| II. Test-Driven Methodology | PASS | Plan includes TDD cycle: tests before implementation. E2E mandatory. |
+| III. API-First Development | PASS | OpenAPI spec updated first, types generated before implementation. |
+| IV. Simplicity & Quality | PASS | Minimal changes to existing code. No new abstractions. Idempotent delete is the simplest correct approach. |
+| V. Dependency Discipline | PASS | No new dependencies required. |
+| VI. Accessibility | PASS | Interactive elements will use semantic HTML, ARIA, keyboard navigation. Confirm dialog already accessible. |
+
+**Gate result**: ALL PASS — proceed to Phase 0.
+
+## Project Structure
+
+### Documentation (this feature)
+
+```text
+specs/014-cancel-rsvp/
+├── plan.md              # This file
+├── research.md          # Phase 0 output
+├── data-model.md        # Phase 1 output
+├── contracts/           # Phase 1 output
+│   └── cancel-rsvp.yaml # DELETE endpoint contract
+└── tasks.md             # Phase 2 output (by /speckit.tasks)
+```
+
+### Source Code (repository root)
+
+```text
+backend/
+├── src/main/java/de/fete/
+│   ├── domain/
+│   │   ├── model/Rsvp.java                          # existing (no changes)
+│   │   ├── model/RsvpToken.java                     # existing (no changes)
+│   │   └── port/
+│   │       ├── in/CancelRsvpUseCase.java            # NEW use case port
+│   │       └── out/RsvpRepository.java              # MODIFY (add deleteByRsvpToken)
+│   ├── application/service/RsvpService.java          # MODIFY (implement cancel)
+│   └── adapter/
+│       ├── in/web/EventController.java               # MODIFY (add DELETE handler)
+│       └── out/persistence/
+│           ├── RsvpJpaRepository.java                # MODIFY (add deleteByRsvpToken)
+│           └── RsvpPersistenceAdapter.java           # MODIFY (implement delete)
+├── src/main/resources/openapi/api.yaml               # MODIFY (add DELETE endpoint)
+└── src/test/java/de/fete/
+    ├── application/service/RsvpServiceTest.java      # MODIFY (add cancel tests)
+    └── adapter/in/web/EventControllerIntegrationTest.java  # MODIFY (add cancel tests)
+
+frontend/
+├── src/
+│   ├── api/schema.d.ts                               # REGENERATE (from updated OpenAPI)
+│   ├── components/
+│   │   ├── RsvpBar.vue                               # MODIFY (tap-to-reveal cancel)
+│   │   ├── EventList.vue                             # MODIFY (conditional dialog msg)
+│   │   └── ConfirmDialog.vue                         # existing (no changes)
+│   ├── composables/useEventStorage.ts                # MODIFY (add removeRsvp)
+│   └── views/EventDetailView.vue                     # MODIFY (add cancel logic)
+└── e2e/
+    └── cancel-rsvp.spec.ts                           # NEW (E2E tests)
+```
+
+**Structure Decision**: Follows existing hexagonal architecture. New use case port + implementation in existing service. Single new endpoint added to existing controller.
+
+## Complexity Tracking
+
+No constitution violations — table not needed.

specs/014-cancel-rsvp/quickstart.md

@@ -0,0 +1,57 @@
+# Quickstart: Cancel RSVP
+
+**Feature**: 014-cancel-rsvp | **Date**: 2026-03-09
+
+## Implementation Order
+
+1. **OpenAPI spec** — Add DELETE endpoint to `api.yaml`
+2. **Regenerate types** — Backend (Maven generate) + Frontend (`npm run generate:api`)
+3. **Backend TDD** — Write tests → implement repository → service → controller
+4. **Frontend composable** — Add `removeRsvp()` to `useEventStorage.ts`
+5. **Frontend US-1** — RsvpBar tap-to-reveal + EventDetailView cancel logic
+6. **Frontend US-2** — EventList conditional dialog + server-side cancel before removal
+7. **Frontend US-3** — Edge case handling (stale tokens treated as success)
+8. **E2E tests** — Playwright tests for all three user stories
+
+## Key Commands
+
+```bash
+# Backend
+cd backend && ./mvnw test                    # Run backend tests
+cd backend && ./mvnw verify                  # Full verify (checkstyle + tests)
+cd backend && ./mvnw spring-boot:run         # Run backend locally
+
+# Frontend
+cd frontend && npm run generate:api          # Regenerate types from OpenAPI
+cd frontend && npm run test:unit             # Run unit tests
+cd frontend && npx playwright test           # Run E2E tests
+cd frontend && npm run dev                   # Dev server
+
+# Both
+cd backend && ./mvnw test && cd ../frontend && npm run test:unit  # Quick check
+```
+
+## Key Files to Modify
+
+| File | Change |
+|------|--------|
+| `backend/src/main/resources/openapi/api.yaml` | Add DELETE `/events/{token}/rsvps/{rsvpToken}` |
+| `backend/.../port/in/CancelRsvpUseCase.java` | New use case interface |
+| `backend/.../port/out/RsvpRepository.java` | Add `deleteByEventIdAndRsvpToken()` |
+| `backend/.../RsvpJpaRepository.java` | Add derived delete query |
+| `backend/.../RsvpPersistenceAdapter.java` | Implement delete |
+| `backend/.../RsvpService.java` | Implement `CancelRsvpUseCase` |
+| `backend/.../EventController.java` | Add `cancelRsvp()` handler |
+| `frontend/src/composables/useEventStorage.ts` | Add `removeRsvp()` |
+| `frontend/src/components/RsvpBar.vue` | Tap-to-reveal cancel button |
+| `frontend/src/views/EventDetailView.vue` | Cancel logic + confirm dialog |
+| `frontend/src/components/EventList.vue` | Conditional dialog message + server cancel |
+| `frontend/e2e/cancel-rsvp.spec.ts` | E2E tests for all scenarios |
+
+## Gotchas
+
+- The JPA `deleteBy...` method requires `@Transactional` on the calling service method.
+- The `@Transactional` import must be `jakarta.transaction.Transactional` (not Spring's).
+- After updating OpenAPI spec, run `npm run generate:api` in frontend AND Maven generate-sources in backend.
+- The RsvpBar component currently has no click handler on the status state — this needs to be added carefully with proper accessibility (role, aria-expanded, keyboard support).
+- The EventList's `confirmDelete` currently calls `removeEvent()` synchronously — it needs to become async for the server call.

specs/014-cancel-rsvp/research.md

@@ -0,0 +1,82 @@
+# Research: Cancel RSVP
+
+**Feature**: 014-cancel-rsvp | **Date**: 2026-03-09
+
+## 1. Idempotent DELETE Semantics
+
+**Decision**: Return 204 No Content for both successful deletion and "already deleted" cases.
+
+**Rationale**: HTTP DELETE is defined as idempotent (RFC 9110 §9.3.5). Returning 204 regardless of whether the RSVP existed simplifies client logic — the client doesn't need to distinguish "deleted now" from "was already gone." This directly satisfies FR-002 and US-3.
+
+**Alternatives considered**:
+- Return 404 for "not found" RSVP: Violates idempotency expectations, forces client to handle two success paths.
+- Return 200 with body: Unnecessary — no useful information to return after deletion.
+
+## 2. Authorization Model for Delete
+
+**Decision**: DELETE requires both event token (path) and RSVP token (path). The RSVP token acts as a bearer credential — possession equals authorization.
+
+**Rationale**: Consistent with the existing privacy model. The RSVP token is a UUID v4 generated server-side, unguessable. No additional auth needed. The event token scopes the operation to prevent cross-event token collision (defense in depth).
+
+**Alternatives considered**:
+- RSVP token only: Sufficient in practice (UUIDs are globally unique) but loses the event context in the URL, making the API less RESTful.
+- Require organizer token: Would prevent guests from self-cancelling — contradicts the spec.
+
+## 3. Backend Delete Implementation Pattern
+
+**Decision**: Use `deleteByRsvpToken(UUID)` on the JPA repository. Return the count of deleted rows (0 or 1) to determine if a record was actually removed (needed for attendee count response).
+
+**Rationale**: Spring Data JPA supports `deleteBy...` derived queries returning `long` (count of deleted rows). This is a single query, no need to fetch-then-delete. The existing `findByRsvpToken()` method confirms the naming convention.
+
+**Alternatives considered**:
+- `findByRsvpToken()` then `delete(entity)`: Two queries instead of one. Unnecessary.
+- Native `@Query` DELETE: Overkill for a simple single-column delete.
+
+## 4. Backend Validation: Event Token Check
+
+**Decision**: Validate that the RSVP belongs to the specified event before deleting. If the RSVP token exists but belongs to a different event, return 404.
+
+**Rationale**: Defense in depth. Prevents accidental or malicious cross-event RSVP deletion via URL manipulation. The combined lookup (`findByEventIdAndRsvpToken`) is a single indexed query.
+
+**Alternatives considered**:
+- Skip event validation: Simpler but allows deleting RSVPs via wrong event URLs. Minor security concern but violates principle of least surprise.
+
+## 5. Frontend: Tap-to-Reveal Pattern for Cancel
+
+**Decision**: The "You're attending!" bar becomes tappable. Tapping reveals a slide-out "Cancel attendance" button. Tapping outside or pressing Escape collapses it. A subtle chevron/icon hints at interactivity.
+
+**Rationale**: Specified in the feature spec's design decision. Prevents accidental cancellation (two-step: reveal + confirm dialog). Keeps the default state clean and positive.
+
+**Alternatives considered**:
+- Always-visible cancel button: Too prominent, encourages cancellation over attendance.
+- Long-press to reveal: Not discoverable, no established mobile convention for this.
+- Swipe gesture: Already used for event list deletion — would create gesture ambiguity.
+
+## 6. Frontend: removeRsvp vs removeEvent in localStorage
+
+**Decision**: Add `removeRsvp(eventToken)` method to `useEventStorage.ts` that clears only `rsvpToken` and `rsvpName` from a stored event, keeping the event itself in the list.
+
+**Rationale**: Cancel from event detail view should NOT remove the event from the list — the guest may still want to see event details. Only the RSVP fields need clearing. The existing `removeEvent()` method is used for event list removal (US-2).
+
+**Alternatives considered**:
+- Reuse `removeEvent()` for both: Would remove the event from the list when cancelling from detail view — unexpected behavior.
+
+## 7. Frontend: Event List Removal with RSVP
+
+**Decision**: When removing an event that has an RSVP token, call DELETE on the server FIRST. On success (or 404), then remove from localStorage. On server error, show error and keep the event.
+
+**Rationale**: Server-first ensures data consistency (FR-007). If we removed from localStorage first and the server call failed, the RSVP would remain on the server with no way for the guest to cancel it.
+
+**Alternatives considered**:
+- Optimistic removal (remove from localStorage, fire-and-forget server call): Risks data inconsistency if server call fails.
+- Remove from localStorage first, retry server call: Complex retry logic, still risks inconsistency.
+
+## 8. Attendee Count After Cancellation
+
+**Decision**: After successful DELETE, decrement the local attendee count by 1 in the event detail view. Do not re-fetch the event.
+
+**Rationale**: Avoids an extra GET request. The count is deterministic — if the delete succeeded, exactly one attendee was removed. The same pattern is used for RSVP creation (increment by 1).
+
+**Alternatives considered**:
+- Re-fetch event data: Extra network request, slower UX, unnecessary.
+- Return updated count from DELETE endpoint: Adds response body to a 204 — semantically wrong.

specs/014-cancel-rsvp/spec.md

@@ -0,0 +1,114 @@
+# Feature Specification: Cancel RSVP
+
+**Feature Branch**: `014-cancel-rsvp`
+**Created**: 2026-03-09
+**Status**: Draft
+**Input**: User description: "A guest can cancel their attendance if they still have their RSVP token in localStorage. The event detail view should offer this functionality (design proposals needed). The RSVP is permanently deleted from the database by RSVP token. When a guest removes an entry from their event list, attendance is automatically cancelled. The confirmation dialog informs the guest about this behavior."
+
+## User Scenarios & Testing *(mandatory)*
+
+### User Story 1 - Cancel RSVP from Event Detail View (Priority: P1)
+
+A guest who previously RSVP'd to an event visits the event detail page. The sticky bottom bar shows their attendance status ("You're attending!"). The guest can cancel their attendance directly from this view. After cancellation, their RSVP is permanently removed from the server and from localStorage. The attendee count decreases by one, and the RSVP bar returns to the initial "I'm attending" call-to-action state, allowing the guest to re-RSVP if desired.
+
+**Why this priority**: This is the core feature — the explicit, intentional cancellation flow. It gives guests direct control over their attendance and is the primary interaction point.
+
+**Independent Test**: Can be fully tested by navigating to an event detail page as an RSVP'd guest, cancelling, and verifying the RSVP is deleted server-side and the UI resets.
+
+**Acceptance Scenarios**:
+
+1. **Given** a guest has an RSVP token stored in localStorage for an event, **When** they view the event detail page, **Then** they see a way to cancel their attendance alongside their attendance status.
+2. **Given** the guest initiates cancellation, **When** the system presents a confirmation prompt, **Then** the prompt clearly states that attendance will be permanently cancelled.
+3. **Given** the guest confirms cancellation, **When** the server successfully deletes the RSVP, **Then** the RSVP token and name are removed from localStorage, the attendee count decreases by one, and the RSVP bar returns to the initial call-to-action state.
+4. **Given** the guest confirms cancellation, **When** the server returns an error, **Then** the guest sees an error message and their attendance status remains unchanged.
+5. **Given** the guest cancels and the RSVP bar resets, **When** the guest taps the call-to-action, **Then** they can submit a new RSVP as normal.
+
+---
+
+### User Story 2 - Auto-Cancel on Event List Removal (Priority: P2)
+
+A guest removes an event from their personal event list (via delete button or swipe gesture on the event card). If the guest has an RSVP token for that event, the confirmation dialog informs them that removing the event will also cancel their attendance on the server. Upon confirmation, the RSVP is deleted from the server before the event is removed from localStorage.
+
+**Why this priority**: This ensures data consistency between client and server. Without it, a guest could believe they cancelled but their name would remain on the attendee list.
+
+**Independent Test**: Can be fully tested by adding an RSVP'd event to the list, removing it via the event list, and verifying the RSVP is deleted server-side.
+
+**Acceptance Scenarios**:
+
+1. **Given** a guest has an event in their list with an RSVP token, **When** they initiate removal (delete button or swipe), **Then** the confirmation dialog explicitly mentions that their attendance will also be cancelled.
+2. **Given** a guest has an event in their list without an RSVP token (organizer-only or link-only), **When** they initiate removal, **Then** the confirmation dialog does not mention attendance cancellation (existing behavior unchanged).
+3. **Given** the guest confirms removal of an RSVP'd event, **When** the server successfully deletes the RSVP, **Then** the event is removed from localStorage (including RSVP token) and disappears from the list.
+4. **Given** the guest confirms removal of an RSVP'd event, **When** the server fails to delete the RSVP, **Then** the guest sees an error message and the event remains in the list unchanged.
+5. **Given** the guest dismisses the confirmation dialog, **When** no action is taken, **Then** the event and RSVP remain unchanged.
+
+---
+
+### User Story 3 - Cancel RSVP with Expired/Invalid Token (Priority: P3)
+
+A guest attempts to cancel their RSVP, but the token is no longer valid on the server (e.g., the event was deleted, or the RSVP was already removed by another means). The system handles this gracefully.
+
+**Why this priority**: Edge case handling — less common but important for a smooth user experience.
+
+**Independent Test**: Can be tested by manipulating localStorage to contain a stale RSVP token and attempting cancellation.
+
+**Acceptance Scenarios**:
+
+1. **Given** a guest has a stale RSVP token in localStorage, **When** they attempt to cancel from the event detail view, **Then** the system treats a "not found" server response as a successful cancellation (the RSVP is already gone), cleans up localStorage, and resets the UI.
+2. **Given** a guest has a stale RSVP token in localStorage, **When** they remove the event from their list, **Then** the system treats a "not found" server response as success and removes the event from localStorage.
+
+---
+
+### Edge Cases
+
+- What happens when the guest has no internet connection during cancellation? → Show an error message; do not modify localStorage or UI state.
+- What happens if the event itself has been deleted? → The event detail view already handles the "not found" state. For list removal, treat the 404 as success and clean up localStorage.
+- What happens if multiple browser tabs are open? → localStorage changes propagate across tabs; the RSVP bar should reflect the current localStorage state on visibility/focus.
+
+## Requirements *(mandatory)*
+
+### Functional Requirements
+
+- **FR-001**: System MUST provide a cancellation endpoint that permanently deletes an RSVP record identified by event token and RSVP token.
+- **FR-002**: System MUST return a success response when the RSVP is deleted, including when the RSVP does not exist (idempotent delete).
+- **FR-003**: The event detail view MUST display a cancel option when the guest has an RSVP token in localStorage for the current event.
+- **FR-004**: The cancel option MUST require explicit confirmation before proceeding.
+- **FR-005**: After successful cancellation, the system MUST remove the RSVP token and RSVP name from localStorage for that event.
+- **FR-006**: After successful cancellation on the event detail view, the attendee count MUST decrease by one and the RSVP bar MUST return to its initial call-to-action state.
+- **FR-007**: When a guest removes an RSVP'd event from their event list, the system MUST attempt to delete the RSVP on the server before removing it from localStorage.
+- **FR-008**: The event list removal confirmation dialog MUST inform the guest that their attendance will be cancelled when an RSVP token is present.
+- **FR-009**: If the server returns an error (other than "not found") during cancellation, the system MUST show an error message and leave the local state unchanged.
+- **FR-010**: The cancellation endpoint MUST only delete the RSVP matching the provided RSVP token — no other RSVPs or event data may be affected.
+
+### Key Entities
+
+- **RSVP**: An attendance record linking a guest name to an event. Identified by a unique RSVP token (UUID). Existence indicates attendance; deletion indicates cancellation.
+- **Stored Event (client-side)**: A localStorage entry containing event metadata, and optionally an RSVP token and name if the guest has RSVP'd.
+
+## Success Criteria *(mandatory)*
+
+### Measurable Outcomes
+
+- **SC-001**: A guest can cancel their RSVP from the event detail view in under 5 seconds (two taps: cancel + confirm).
+- **SC-002**: After cancellation, the guest's name no longer appears in the attendee list when viewed by the organizer.
+- **SC-003**: Removing an RSVP'd event from the event list results in server-side RSVP deletion 100% of the time when the server is reachable.
+- **SC-004**: The confirmation dialog clearly communicates the consequence (attendance cancellation) — no guest should be surprised by the side effect.
+- **SC-005**: A guest can re-RSVP after cancellation without any issues.
+
+## Design Decision: Cancel UI on Event Detail View
+
+**Chosen**: Tap-to-Reveal Pattern
+
+The current RSVP bar (sticky bottom) shows "You're attending!" after an RSVP. The status bar becomes tappable. Tapping it reveals a slide-out or expand animation with a "Cancel attendance" button. Tapping outside collapses it back. A subtle visual hint (chevron or icon) indicates the bar is interactive.
+
+## Assumptions
+
+- The existing `findByRsvpToken()` repository method can be leveraged for the delete operation.
+- The RSVP token alone (combined with the event token in the URL) is sufficient authorization for deletion — consistent with the project's token-based privacy model.
+- The delete operation is idempotent: deleting an already-deleted RSVP returns success (not an error).
+- The event list confirmation dialog already exists and can be extended with conditional messaging.
+
+## Dependencies
+
+- **008-rsvp**: The RSVP creation flow and localStorage storage pattern (completed).
+- **007-view-event**: The event detail view and RSVP bar component (completed).
+- **009-list-events**: The event list with delete functionality (completed).

specs/014-cancel-rsvp/tasks.md

@@ -0,0 +1,206 @@
+# Tasks: Cancel RSVP
+
+**Input**: Design documents from `/specs/014-cancel-rsvp/`
+**Prerequisites**: plan.md (required), spec.md (required), research.md, data-model.md, contracts/
+
+**Tests**: Included — constitution mandates TDD (Red → Green → Refactor). E2E tests mandatory per principle II.
+
+**Organization**: Tasks are grouped by user story to enable independent implementation and testing of each story.
+
+## Format: `[ID] [P?] [Story] Description`
+
+- **[P]**: Can run in parallel (different files, no dependencies)
+- **[Story]**: Which user story this task belongs to (e.g., US1, US2, US3)
+- Include exact file paths in descriptions
+
+---
+
+## Phase 1: Setup (API Contract & Type Generation)
+
+**Purpose**: Define the DELETE endpoint contract and regenerate types for both backend and frontend.
+
+- [x] T001 Add DELETE `/events/{token}/rsvps/{rsvpToken}` endpoint to `backend/src/main/resources/openapi/api.yaml` per `specs/014-cancel-rsvp/contracts/cancel-rsvp.yaml` — operationId `cancelRsvp`, responses 204 (success/idempotent) and 500
+- [x] T002 Regenerate backend API interfaces from updated OpenAPI spec via `cd backend && ./mvnw generate-sources`
+- [x] T003 Regenerate frontend TypeScript types from updated OpenAPI spec via `cd frontend && npm run generate:api`
+
+---
+
+## Phase 2: Foundational (Backend Delete Infrastructure)
+
+**Purpose**: Backend repository and service layer for RSVP deletion — blocks all user stories.
+
+**⚠️ CRITICAL**: No user story work can begin until this phase is complete.
+
+### Tests (write FIRST, must FAIL before implementation)
+
+- [x] T004 [P] Write unit test for `cancelRsvp()` in `backend/src/test/java/de/fete/application/service/RsvpServiceTest.java` — test cases: successful delete (returns true), RSVP not found (returns false), event not found (returns false)
+- [x] T005 [P] Write integration test for `DELETE /api/events/{token}/rsvps/{rsvpToken}` in `backend/src/test/java/de/fete/adapter/in/web/EventControllerIntegrationTest.java` — test cases: 204 on successful delete, 204 on already-deleted RSVP (idempotent), 204 when event not found (idempotent), verify RSVP row actually removed from DB
+
+### Implementation
+
+- [x] T006 Create `CancelRsvpUseCase` interface in `backend/src/main/java/de/fete/domain/port/in/CancelRsvpUseCase.java` — single method `cancelRsvp(EventToken, RsvpToken)` returning void
+- [x] T007 Add `deleteByEventIdAndRsvpToken(Long eventId, RsvpToken rsvpToken)` to domain port `backend/src/main/java/de/fete/domain/port/out/RsvpRepository.java`
+- [x] T008 Add `deleteByEventIdAndRsvpToken(Long eventId, UUID rsvpToken)` derived delete query to `backend/src/main/java/de/fete/adapter/out/persistence/RsvpJpaRepository.java`
+- [x] T009 Implement `deleteByEventIdAndRsvpToken()` in `backend/src/main/java/de/fete/adapter/out/persistence/RsvpPersistenceAdapter.java` — delegate to JPA repository, return boolean (deleted count > 0)
+- [x] T010 Implement `CancelRsvpUseCase` in `backend/src/main/java/de/fete/application/service/RsvpService.java` — look up event by token, if found call repository delete, no error on not-found (idempotent). Add `@Transactional`
+- [x] T011 Implement `cancelRsvp()` handler in `backend/src/main/java/de/fete/adapter/in/web/EventController.java` — accept event token and RSVP token path params, call use case, return 204 No Content
+- [x] T012 Run `cd backend && ./mvnw verify` — all tests (existing + new) must pass
+
+**Checkpoint**: Backend DELETE endpoint functional and tested. Verify via integration tests.
+
+---
+
+## Phase 3: User Story 1 — Cancel RSVP from Event Detail View (Priority: P1) 🎯 MVP
+
+**Goal**: Guest can tap the "You're attending!" bar to reveal a cancel button, confirm cancellation, and have RSVP deleted server-side with UI reset.
+
+**Independent Test**: Navigate to event detail as RSVP'd guest → tap status bar → tap cancel → confirm → verify RSVP deleted, attendee count decremented, bar reset to CTA state. Then re-RSVP to verify flow works again.
+
+### Tests (write FIRST, must FAIL before implementation)
+
+- [x] T013 [US1] Write E2E test file `frontend/e2e/cancel-rsvp.spec.ts` — US1 scenarios: (1) status bar shows cancel affordance when RSVP'd, (2) tap reveals cancel button, (3) confirm cancellation → 204 → localStorage cleared + count decremented + bar reset, (4) server error → error message + state unchanged, (5) re-RSVP after cancel works
+
+### Implementation
+
+- [x] T014 [US1] Add `removeRsvp(eventToken: string)` method to `frontend/src/composables/useEventStorage.ts` — clears `rsvpToken` and `rsvpName` from the stored event without removing the event from the list
+- [x] T015 [US1] Modify `frontend/src/components/RsvpBar.vue` — make status state tappable with tap-to-reveal pattern: (1) add `expanded` state, (2) tapping "You're attending!" toggles expanded, (3) expanded state shows "Cancel attendance" button, (4) emit `cancel` event on button click, (5) collapse on outside click/Escape, (6) add subtle chevron icon hint, (7) ARIA: `role="button"`, `aria-expanded`, keyboard support (Enter/Space to toggle, Escape to collapse)
+- [x] T016 [US1] Add cancel RSVP logic to `frontend/src/views/EventDetailView.vue` — (1) handle `cancel` emit from RsvpBar, (2) show ConfirmDialog with message "Your attendance will be permanently cancelled.", (3) on confirm: call `api.DELETE('/events/{token}/rsvps/{rsvpToken}')`, (4) on 204: call `removeRsvp()`, decrement attendee count, reset RSVP state (`rsvpName = ''`), (5) on error: show error message "Could not cancel RSVP. Please try again.", (6) keep local state unchanged on error
+- [x] T017 [US1] Run frontend unit tests `cd frontend && npm run test:unit` and E2E tests `cd frontend && npx playwright test cancel-rsvp` — all must pass
+
+**Checkpoint**: US1 fully functional. Guest can cancel RSVP from event detail view and re-RSVP.
+
+---
+
+## Phase 4: User Story 2 — Auto-Cancel on Event List Removal (Priority: P2)
+
+**Goal**: When a guest removes an RSVP'd event from their event list, the confirmation dialog warns about attendance cancellation and the RSVP is deleted server-side before localStorage cleanup.
+
+**Independent Test**: Add RSVP'd event to list → initiate removal → verify dialog mentions attendance → confirm → verify server DELETE called → event removed from list. Also test: event without RSVP shows standard dialog (no mention of attendance).
+
+### Tests (write FIRST, must FAIL before implementation)
+
+- [x] T018 [US2] Add US2 E2E scenarios to `frontend/e2e/cancel-rsvp.spec.ts` — (1) removal of RSVP'd event shows "attendance will be cancelled" in dialog, (2) removal of non-RSVP'd event shows standard dialog (no attendance mention), (3) confirm removal → DELETE called → event removed from list, (4) server error on DELETE → error message + event stays in list, (5) dismiss dialog → no changes
+
+### Implementation
+
+- [x] T019 [US2] Modify `frontend/src/components/EventList.vue` — (1) detect if pending-delete event has RSVP token via `getRsvp(eventToken)`, (2) set conditional dialog message: with RSVP → "This event will be removed from your list and your attendance will be cancelled." / without RSVP → existing message, (3) make `confirmDelete()` async: if RSVP exists, call `api.DELETE('/events/{token}/rsvps/{rsvpToken}')` first, (4) on success or 404: proceed with `removeEvent()`, (5) on other error: show error message, abort removal
+- [x] T020 [US2] Import API client and `getRsvp` from `useEventStorage` in `frontend/src/components/EventList.vue` — ensure API client is available for server calls
+- [x] T021 [US2] Run E2E tests `cd frontend && npx playwright test cancel-rsvp` — all US1 + US2 scenarios must pass
+
+**Checkpoint**: US1 + US2 functional. Both cancel paths work independently.
+
+---
+
+## Phase 5: User Story 3 — Cancel RSVP with Expired/Invalid Token (Priority: P3)
+
+**Goal**: Gracefully handle stale RSVP tokens — treat "not found" server responses as successful cancellation.
+
+**Independent Test**: Set stale RSVP token in localStorage → attempt cancel from detail view → verify 404 treated as success → localStorage cleaned. Same for event list removal.
+
+### Tests (write FIRST, must FAIL before implementation)
+
+- [x] T022 [US3] Add US3 E2E scenarios to `frontend/e2e/cancel-rsvp.spec.ts` — (1) cancel from detail view with stale token (server 404) → treated as success, localStorage cleaned, UI reset, (2) event list removal with stale token (server 404) → treated as success, event removed
+
+### Implementation
+
+- [x] T023 (already implemented in T016 — 404 treated as success) [US3] Update cancel logic in `frontend/src/views/EventDetailView.vue` — treat 404 response from DELETE as success (RSVP already gone): clean up localStorage and reset UI same as 204
+- [x] T024 (already implemented in T019 — 404 treated as success) [US3] Update cancel logic in `frontend/src/components/EventList.vue` — treat 404 response from DELETE as success: proceed with `removeEvent()` (note: this may already be handled if T019 implemented "success or 404" correctly — verify and adjust if needed)
+- [x] T025 [US3] Run all E2E tests `cd frontend && npx playwright test cancel-rsvp` — all US1 + US2 + US3 scenarios must pass
+
+**Checkpoint**: All user stories functional. Edge cases handled gracefully.
+
+---
+
+## Phase 6: Polish & Cross-Cutting Concerns
+
+**Purpose**: Final verification and cleanup across all stories.
+
+- [x] T026 Run full backend verify `cd backend && ./mvnw verify` — checkstyle + all tests
+- [x] T027 Run full frontend test suite `cd frontend && npm run test:unit && npx playwright test` — all unit + E2E tests
+- [x] T028 Verify accessibility: RsvpBar cancel interaction is keyboard-navigable (Tab, Enter/Space, Escape), ARIA attributes correct, confirm dialog focus management works
+
+---
+
+## Dependencies & Execution Order
+
+### Phase Dependencies
+
+- **Setup (Phase 1)**: No dependencies — start immediately
+- **Foundational (Phase 2)**: Depends on Phase 1 (generated API interfaces needed)
+- **US1 (Phase 3)**: Depends on Phase 2 (backend endpoint must exist)
+- **US2 (Phase 4)**: Depends on Phase 2 (backend endpoint must exist). Independent of US1.
+- **US3 (Phase 5)**: Depends on US1 and US2 (refines their error handling)
+- **Polish (Phase 6)**: Depends on all stories complete
+
+### User Story Dependencies
+
+- **US1 (P1)**: Independent after Phase 2 — core cancel flow
+- **US2 (P2)**: Independent after Phase 2 — can be implemented in parallel with US1
+- **US3 (P3)**: Depends on US1 + US2 — refines error handling in both
+
+### Within Each User Story
+
+- Tests MUST be written and FAIL before implementation
+- Composable/model changes before component changes
+- Component changes before view integration
+- Story complete before moving to next priority
+
+### Parallel Opportunities
+
+- T004 + T005 (backend tests) can run in parallel
+- T006 + T007 (use case + repository port) can run in parallel
+- US1 and US2 can be implemented in parallel after Phase 2 (different files)
+- T026 + T027 (backend verify + frontend tests) can run in parallel
+
+---
+
+## Parallel Example: Phase 2 (Foundational)
+
+```bash
+# Write tests in parallel:
+Task T004: "Unit test for cancelRsvp in RsvpServiceTest.java"
+Task T005: "Integration test for DELETE endpoint in EventControllerIntegrationTest.java"
+
+# Then implement sequentially: T006 → T007 → T008 → T009 → T010 → T011 → T012
+```
+
+## Parallel Example: US1 + US2
+
+```bash
+# After Phase 2 completes, launch in parallel:
+# Stream A (US1): T013 → T014 → T015 → T016 → T017
+# Stream B (US2): T018 → T019 → T020 → T021
+```
+
+---
+
+## Implementation Strategy
+
+### MVP First (User Story 1 Only)
+
+1. Complete Phase 1: Setup (OpenAPI + type generation)
+2. Complete Phase 2: Foundational (backend DELETE endpoint)
+3. Complete Phase 3: User Story 1 (cancel from detail view)
+4. **STOP and VALIDATE**: Test cancel flow end-to-end
+5. Deploy/demo if ready
+
+### Incremental Delivery
+
+1. Setup + Foundational → Backend ready
+2. Add US1 → Cancel from detail view works → Deploy (MVP!)
+3. Add US2 → Auto-cancel on list removal → Deploy
+4. Add US3 → Stale token edge cases handled → Deploy
+5. Each story adds value without breaking previous stories
+
+---
+
+## Notes
+
+- [P] tasks = different files, no dependencies
+- [Story] label maps task to specific user story for traceability
+- Each user story should be independently completable and testable
+- Verify tests fail before implementing
+- Commit after each task or logical group
+- Stop at any checkpoint to validate story independently
+- Backend idempotent DELETE (204 always) simplifies all frontend error handling
+- The `@Transactional` annotation is required on the service method calling JPA `deleteBy...`