PIRX Docs
Dashboard

Sync Progress Overlay

Source: components/home/sync-progress-overlay.tsx


What You See

A full-screen overlay that appears during your first data sync or when PIRX is importing a large batch of activities. It shows the PIRX logo at the top, a progress bar that fills as work completes, and four stage dots along the bottom labeled Preparing, Importing, Processing, and Projecting. Below the progress bar you see a status message (like 'Importing activities...') and a count of activities imported so far. An elapsed timer appears after 5 seconds. When everything finishes, a green checkmark animates in with the message 'Your data is ready!' before the overlay fades away.

How the Numbers Work

The overlay tracks four pipeline stages in order: Preparing (sync task queued), Importing (pulling activities from your wearable), Processing (computing features like rolling distances and zone percentages), and Projecting (running the projection engine for all events). The progress bar jumps to fixed positions at each stage transition and smoothly fills within the Importing stage based on chunk completion.

Step by Step

The overlay is driven by the useSyncProgress hook, which subscribes to Supabase Realtime on the task_registry table filtered by your user_id. Each task row has a task_name (backfill_history, compute_features, recompute_all_events) and a status (queued, running, completed, failed). The hook maps these to stages: backfill_history queued = Preparing (5 percent), backfill_history running = Importing (35 percent), compute_features running = Processing (75 percent), recompute_all_events running = Projecting (90 percent), recompute_all_events completed = Complete (100 percent). During the Importing stage, the task metadata includes total_chunks and completed_chunks from the backend's paginated Terra history fetch, so the progress bar fills proportionally within the 5-to-70 percent range. The activities_imported count from the same metadata is shown as a running tally. A high-water mark prevents the stage from going backward. On completion, a 2.2-second delay shows the success animation before the overlay calls onComplete to dismiss itself.

On this page