Description
lib/events-store.ts ships a 16-entry hardcoded mockEvents array and fakes loadEvents/loadNextPage with setTimeout, while a fully validated NEXT_PUBLIC_API_URL is exposed via lib/env.ts and lib/config.ts but never used for fetching. This issue introduces a typed API client and wires the store to fetch events (with pagination) from config.api.url, keeping mock data only as a test fallback. The Event, EventFilters, EventSort, and PaginationState types already exist in types/events.ts.
Requirements and context
- Create
lib/api/events.ts exporting typed functions (e.g. fetchEvents(params) and fetchEventsPage(params)) that call config.api.url and parse responses into Event[] from types/events.ts.
- Refactor
loadEvents and loadNextPage in lib/events-store.ts to call the client; preserve the existing loading/error/isFetchingNextPage/hasNextPage/lastFetchTime state contract and the isDataStale() 60s threshold.
- Keep
mockEvents available behind a guard (e.g. when NEXT_PUBLIC_API_URL resolves to the localhost default) so local dev and tests still work without a backend.
- Non-functional: handle non-2xx responses and network errors by setting
error and leaving prior data intact; no any leakage across the client boundary; no behavioral change to filtering/sorting which stays client-side.
- Validate response shape (the repo already depends on
zod) before committing it to the store.
Acceptance criteria
Suggested execution
1. Fork the repo and create a branch — git checkout -b feature/events-api-layer.
2. Implement changes — add lib/api/events.ts; refactor lib/events-store.ts; reuse lib/config.ts/lib/env.ts for the base URL.
3. Write/extend tests — Jest + React Testing Library with pnpm; add lib/api/__tests__/events.test.ts mocking fetch, asserting URL/params, success parsing, and error handling. Follow the store-test style in lib/__tests__/scroll-position-store.test.ts.
4. Test and commit —
pnpm install
pnpm type-check
pnpm test
pnpm build
Example commit message
feat(api): add typed events API client and wire it into the events store
Guidelines
- Aim for >=85% coverage on the new client and changed store paths.
- Document the expected response contract and required env vars in
docs/; keep loading/empty/error UX in EventsTable working unchanged.
- Timeframe: 96 hours.
Description
lib/events-store.tsships a 16-entry hardcodedmockEventsarray and fakesloadEvents/loadNextPagewithsetTimeout, while a fully validatedNEXT_PUBLIC_API_URLis exposed vialib/env.tsandlib/config.tsbut never used for fetching. This issue introduces a typed API client and wires the store to fetch events (with pagination) fromconfig.api.url, keeping mock data only as a test fallback. TheEvent,EventFilters,EventSort, andPaginationStatetypes already exist intypes/events.ts.Requirements and context
lib/api/events.tsexporting typed functions (e.g.fetchEvents(params)andfetchEventsPage(params)) that callconfig.api.urland parse responses intoEvent[]fromtypes/events.ts.loadEventsandloadNextPageinlib/events-store.tsto call the client; preserve the existingloading/error/isFetchingNextPage/hasNextPage/lastFetchTimestate contract and theisDataStale()60s threshold.mockEventsavailable behind a guard (e.g. whenNEXT_PUBLIC_API_URLresolves to the localhost default) so local dev and tests still work without a backend.errorand leaving prior data intact; noanyleakage across the client boundary; no behavioral change to filtering/sorting which stays client-side.zod) before committing it to the store.Acceptance criteria
lib/api/events.tsexists with typed, exported fetch functions that readconfig.api.url.loadEvents/loadNextPageuse the client and preserve the existing store state contract.store.errorwithout clearing already-loaded events.Suggested execution
1. Fork the repo and create a branch —
git checkout -b feature/events-api-layer.2. Implement changes — add
lib/api/events.ts; refactorlib/events-store.ts; reuselib/config.ts/lib/env.tsfor the base URL.3. Write/extend tests — Jest + React Testing Library with pnpm; add
lib/api/__tests__/events.test.tsmockingfetch, asserting URL/params, success parsing, and error handling. Follow the store-test style inlib/__tests__/scroll-position-store.test.ts.4. Test and commit —
pnpm install pnpm type-check pnpm test pnpm buildExample commit message
Guidelines
docs/; keep loading/empty/error UX inEventsTableworking unchanged.