Skip to content

POC: TanStack Query POC implementation#567

Merged
Wirasm merged 39 commits intomainfrom
poc-tanstack-query
Sep 5, 2025
Merged

POC: TanStack Query POC implementation#567
Wirasm merged 39 commits intomainfrom
poc-tanstack-query

Conversation

@Wirasm
Copy link
Copy Markdown
Collaborator

@Wirasm Wirasm commented Sep 3, 2025

Pull Request

Summary

This POC implements TanStack Query to replace manual useState polling patterns throughout the application. The implementation includes comprehensive query management, optimistic updates, and conditional devtools for developers.

Changes Made

  • Replace manual useState polling with TanStack Query for projects/tasks management
  • Add comprehensive query key factories for organized cache management
  • Implement optimistic updates with automatic rollback on failures
  • Create progress polling hooks with smart completion detection
  • Add VITE_SHOW_DEVTOOLS environment variable for conditional devtools display
  • Remove legacy hooks: useDatabaseMutation, usePolling, useProjectMutation
  • Update components to use mutation hooks directly (reduces prop drilling)
  • Enhanced QueryClient with optimized polling and caching settings
  • Added comprehensive architecture analysis report (report.md)

Type of Change

  • New feature (non-breaking change which adds functionality)
  • Performance improvement
  • Code refactoring

Affected Services

  • Frontend (React UI)
  • Docker/Infrastructure

Testing

  • Manually tested affected user flows
  • Docker builds succeed for all services
  • TanStack Query DevTools working conditionally
  • Progress polling and optimistic updates verified

Test Evidence

# Verified TanStack Query integration works
make dev docker
# Tested with VITE_SHOW_DEVTOOLS=true (devtools appear)  
# Tested with VITE_SHOW_DEVTOOLS=false (devtools hidden)
# Verified optimistic updates in task management
# Confirmed polling stops on completion

Checklist

  • My code follows the service architecture patterns
  • If using an AI coding assistant, I used the CLAUDE.md rules
  • My changes generate no new warnings
  • I have verified no regressions in existing features

Breaking Changes

None - this is a refactor that maintains existing API contracts.

Additional Notes

  • Architecture Analysis: Includes comprehensive report comparing TanStack Query vs WebSocket approaches
  • Developer Experience: DevTools can be enabled via environment variable for development
  • Performance: Request deduplication, smart caching, and optimistic updates improve UX
  • Migration Status: Some components (like KnowledgeBasePage) still need migration to complete the pattern
  • Recommendation: Continue with TanStack Query migration - architecture analysis confirms this is the right path

The POC demonstrates significant improvements in code maintainability, performance, and developer experience while maintaining all existing functionality.

Summary by CodeRabbit

  • New Features

    • Full Projects vertical slice: animated project cards, pin/default, create project modal, horizontal project list, project detail with read‑only Documents and Tasks (Kanban + Table) including drag‑drop, inline editing, task counts, document viewer, and feature-scoped error boundary.
  • Bug Fixes / Removals

    • Removed legacy rich PRP viewer/editor and many prior document/task UI pieces; Docs are read‑only in this release.
  • Chores

    • Tooling updates: lint/biome scripts, Biome/ESLint configs, dependency changes, devtools env flag, ETag-aware API caching.
  • Documentation

    • Expanded architecture and developer workflow docs.

Loading
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant