feat: Optimistic UI Updates (JEF-74)

[mankatcheung]

Summary

Adds optimistic UI updates for all frequently-used mutations so changes feel instant instead of waiting for a server round-trip.

Changes

Star toggle (highest impact)

• Detail page: star icon flips immediately
• Board/list caches updated optimistically via
• Rolls back on error, invalidates on settled

Kanban board drag-and-drop

• Card moves instantly to the new column on status change
• Rolls back on error

Note / Contact / Interview Round CRUD

• Create: optimistic item appended with temp ID
• Update: item modified in-place immediately
• Delete: item removed from list immediately
• All three resources follow the same pattern: → snapshot → → rollback → invalidate

Document delete

• Removed from list immediately

Pattern

All mutations follow the TanStack Query optimistic update pattern:

onMutate  → cancelQueries → snapshot cache → setQueryData optimistically → return snapshot
onError   → restore snapshot from context
onSettled → invalidateQueries to sync with server

Testing

• Typecheck passes
• Lint passes
• All 155 web tests pass

Closes JEF-74

Summary by CodeRabbit

• Improvements
  • Application changes now appear immediately across notes, starring, interview rounds, contacts, documents and status updates.
  • Board and application views stay synchronised as changes are made.
  • If an update fails, the previous information is restored automatically and the latest data is refreshed from the server.
  • Improved reliability and responsiveness when creating, editing or deleting application-related information.

[coderabbitai]

Walkthrough

Application detail and board mutations now update cached data immediately. Failed mutations restore previous cache values. Settled mutations invalidate related queries to reconcile local state with the server.

Changes

Application cache consistency

Layer / File(s)	Summary
Detail cache mutations apps/web/src/routes/_authenticated/applications/$applicationId/index.tsx	Notes and application starring now update detail and matching board caches optimistically. Failures restore cached data, and settled mutations invalidate queries.
Related entity mutations apps/web/src/routes/_authenticated/applications/$applicationId/index.tsx	Interview rounds, contacts, and documents now update cached lists immediately, restore failed changes, and invalidate queries after settlement.
Board status mutation apps/web/src/routes/_authenticated/applications/-board-page.tsx	Status changes now cancel active queries, update cached applications, restore failed changes, and invalidate queries after success or failure.

Estimated code review effort: 4 (Complex) | ~45 minutes

Possibly related issues

• mankatcheung/job-finder issue 195 — Covers optimistic updates for starring applications and changing application statuses.

Possibly related PRs

• mankatcheung/job-finder#171 — Adds calendar-related application and interview data that uses the updated cache handling.
• mankatcheung/job-finder#178 — Shares application query and cache code in the detail and board routes.

Poem

A rabbit sees the cache update,
With notes and stars in place.
If failure hops into the path,
Old data leaves no trace.
The server speaks; queries settle.
“All tidy,” says the hare.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarises the main change: adding optimistic UI updates across application mutations.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/jef-74-optimistic-ui-updates

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

Preview deployments for this PR:

• Web: https://job-finder-duvec20jk-mankatcheungs-projects.vercel.app
• API: https://job-finder-fzj0cmkuo-mankatcheungs-projects.vercel.app

[coderabbitai]

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

apps/web/src/routes/_authenticated/applications/$applicationId/index.tsx (1)

166-204: 🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick win

Cancel the board-cache query before the optimistic star update.

setQueriesData writes to queries matching ['applications'], including ['applications', null], but onMutate only cancels ['application', applicationId]. Cancel the same ['applications'] filter before writing optimistically, then avoid the duplicate ['applications'] invalidation in onError because onSettled invalidates it afterwards.

🤖 Prompt for AI Agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@apps/web/src/routes/_authenticated/applications/`$applicationId/index.tsx
around lines 166 - 204, Update toggleStar.onMutate to cancel queries matching
the same non-exact ['applications'] filter used by setQueriesData before
applying the optimistic board-cache update, including ['applications', null].
Remove the redundant ['applications'] invalidation from onError, relying on
onSettled to perform that invalidation.

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Outside diff comments:
In `@apps/web/src/routes/_authenticated/applications/`$applicationId/index.tsx:
- Around line 166-204: Update toggleStar.onMutate to cancel queries matching the
same non-exact ['applications'] filter used by setQueriesData before applying
the optimistic board-cache update, including ['applications', null]. Remove the
redundant ['applications'] invalidation from onError, relying on onSettled to
perform that invalidation.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: f991bbfd-7492-4407-b65e-6d37e9a1a942

📥 Commits

Reviewing files that changed from the base of the PR and between 60cc946 and 1179d6b.

📒 Files selected for processing (2)

• apps/web/src/routes/_authenticated/applications/$applicationId/index.tsx
• apps/web/src/routes/_authenticated/applications/-board-page.tsx