Skip to content

feat: Suspense boundary architecture for multi-domain data fetching#94

Merged
elizabetheonoja-art merged 1 commit into
Utility-Protocol:mainfrom
real-venus:feat/suspense-boundaries
Jun 26, 2026
Merged

feat: Suspense boundary architecture for multi-domain data fetching#94
elizabetheonoja-art merged 1 commit into
Utility-Protocol:mainfrom
real-venus:feat/suspense-boundaries

Conversation

@real-venus

Copy link
Copy Markdown
Contributor

React Concurrent Suspense Boundary Architecture for Multi-Domain Data Fetching (#63)

Closes #63

What's included

File Responsibility
src/types/suspense.ts DomainKey, per-domain Suspense timeouts (10/3/5/8 s) and cache TTLs (30/5/120/300 s), CacheEntry, SuspenseResource, and cache-group helpers.
src/store/slices/cacheSlice.ts Per-key entries with fetchedAt/ttlMs, isFresh/isStale, CACHE_UPDATED/PENDING/REJECTED, and group + single-key invalidation.
src/utils/suspenseResource.ts createResource(read/prefetch/invalidate/peek) — the throw-promise pattern with SWR: fresh → data, stale → data + background revalidate (no suspend), missing → suspend, rejected → throw. In-flight fetches de-duplicated per key.
src/hooks/useSuspenseResource.ts Reads a resource and re-renders on cache updates (so SWR revalidation lands).
src/components/boundaries/* ErrorBoundary, domain SkeletonLoaders, ErrorPanel, the generic DomainBoundary (Retry → invalidate groups + remount via key bump), the four primary boundaries, the Dashboard/Map composites, and CascadeProvider/CascadeGate.
src/components/dashboard/DashboardPage.tsx Composes the boundaries with proper nesting.
src/services/soroban.ts Adds promise-based readContractState for Suspense wrapping.
tests/unit/* + tests/components/boundaries.test.tsx Cache store, resource factory (suspend / SWR / reject / invalidate / dedup), and RTL boundary behaviour.

…tility-Protocol#63)

Coordinates the four data domains (blockchain, telemetry, metadata, spatial)
behind named Suspense boundaries with stale-while-revalidate caching and a
fallback cascade.

- types/suspense.ts: DomainKey, per-domain Suspense timeouts (10/3/5/8s) and
  cache TTLs (30/5/120/300s), CacheEntry, SuspenseResource, cache-group helpers
- store/slices/cacheSlice.ts: per-key entries with fetched-at/TTL, isFresh/
  isStale, CACHE_UPDATED/PENDING/REJECTED, and group + single-key invalidation
- utils/suspenseResource.ts: createResource(read/prefetch/invalidate/peek) —
  throw-promise pattern with SWR (fresh→data, stale→data+background revalidate,
  missing→suspend, rejected→throw), de-duplicated in-flight fetches
- hooks/useSuspenseResource.ts: reads a resource and re-renders on cache updates
- components/boundaries: ErrorBoundary, domain skeletons, ErrorPanel, the
  generic DomainBoundary (Retry → invalidate groups + remount), the four primary
  boundaries, the dashboard/map composites, and a CascadeProvider/CascadeGate for
  the fallback cascade
- components/dashboard/DashboardPage.tsx: composes the boundaries (component,
  not src/pages, since this is an App Router project)
- services/soroban.ts: adds promise-based readContractState for Suspense wrapping
- tests for the cache store, the resource factory (suspend/SWR/reject/invalidate/
  dedup), and RTL boundary behaviour (fallback->content, error+retry, cascade)
@elizabetheonoja-art elizabetheonoja-art merged commit 63ec2d5 into Utility-Protocol:main Jun 26, 2026
4 checks passed
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.

React Concurrent Mode Suspense Boundary Architecture for Multi-Domain Data Fetching with Fallback Cascade

2 participants