feat(ui): wire StatsBar component into App layout

[mpiton]

Summary

• Wire the existing StatsBar component into App.tsx main content area
• Shows 4 stats (pending reviews highlighted, open PRs, issues, workspaces) + "synced Xs ago"
• Hidden in workspace mode (which has its own WorkspaceStatusBar)
• Proper flex-col layout with min-h-0 flex-1 overflow-y-auto for scroll handling

Changes

• src/App.tsx — Import + render <StatsBar /> above MainContent, conditional on !isWorkspace
• src/App.test.tsx — Add useGitHubData mock + 2 integration tests (stats bar visible/hidden)

Test plan

• All 457 tests pass (npx vitest run)
• StatsBar renders on dashboard views (reviews, overview, issues, etc.)
• StatsBar hidden in workspace mode
• Scroll behavior preserved with flex-col layout
• No TypeScript regressions (pre-existing errors only)
• oxlint clean on changed files

Closes #100

---

Summary by cubic

Wired the StatsBar into the main app so dashboard views show pending reviews, open PRs, issues, active workspaces, and last sync time. Keeps workspace mode unchanged and makes the content area scrollable.

• New Features
  • Render StatsBar above dashboard MainContent; hidden in workspace mode (uses WorkspaceStatusBar).
  • Update main layout to a flex column with min-h-0 flex-1 overflow-y-auto for proper scrolling.
  • Add App.test.tsx tests with a useGitHubData mock to verify stats bar visibility on dashboard and absence in workspace.

^{Written for commit 9da64cd. Summary will update on new commits.}

Summary by CodeRabbit

Release Notes

• New Features

  • Stats bar now displays in review views (non-workspace mode) for quick access to metrics
  • Main interface layout restructured with improved scrolling capabilities and better content organization

• Tests

  • Expanded test coverage to validate stats bar visibility across different view modes

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 4abf06b4-0221-4d80-acae-71ee9f1989bc

📥 Commits

Reviewing files that changed from the base of the PR and between 560cf57 and 9da64cd.

📒 Files selected for processing (2)

• src/App.test.tsx
• src/App.tsx

---

📝 Walkthrough

Walkthrough

The App layout is restructured to conditionally render a new StatsBar component above main content in non-workspace views. The main element changes from a single flex container to a flex-column layout with a scrollable inner wrapper. Tests are updated with mocked GitHub data and new assertions verifying stats bar visibility based on the current view.

Changes

Cohort / File(s)	Summary
StatsBar Integration src/App.tsx	Added StatsBar import and conditional rendering above main content when not in workspace mode. Restructured main layout from single flex container to flex-col with scrollable inner wrapper applying overflow-y-auto and proper height management per view mode.
App Tests src/App.test.tsx	Added Vitest mock for useGitHubData hook returning fixed dataset with dashboard, stats, and sync state. Updated default view assertion to check for overview element via data-testid. Added test cases validating stats-bar presence in non-workspace views and absence in workspace mode.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~22 minutes

Possibly related PRs

• PR #58: Implements the StatsBar component being conditionally rendered in this PR—directly provides the integrated component.
• PR #49: Modifies src/App.tsx main layout and workspace/non-workspace conditional rendering logic with similar structural concerns.
• PR #59: Updates App layout and StatsBar rendering alongside changes to view management—overlapping feature integration.

Poem

🐰 A stats bar hops into view,
Pending reviews in vibrant hue,
Flex-col flows with scrolls so smooth,
Tests assert with mocked truth,
Layout restructured, tests renewed! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and concisely describes the primary change: integrating the StatsBar component into the App layout.
Linked Issues check	✅ Passed	All coding requirements from issue #100 are met: StatsBar integrated into App.tsx, displays four stats from useGitHubData().stats, conditionally rendered for non-workspace views, and App layout updated accordingly.
Out of Scope Changes check	✅ Passed	All changes are scoped to integrating StatsBar into the App layout and updating related tests; no unrelated modifications detected.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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/implement-statsbar-component

---

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

[greptile-apps]

Greptile Summary

This PR wires the pre-existing StatsBar component into App.tsx, displaying it above the main content area on all non-workspace views. The flex-col layout change to <main> and the wrapping <div> with min-h-0 flex-1 overflow-y-auto are a standard and correct approach for preventing flex overflow while enabling scroll.

Key changes:

• App.tsx: Adds <StatsBar /> conditionally (hidden when currentView === \"workspaces\"), with proper flex-col layout on <main> and a scroll-handling wrapper div for the content area.
• App.test.tsx: Adds the required useGitHubData mock (necessary because StatsBar and MainContent both call the hook), updates one pre-existing test to check for the actual rendered view rather than a transient loading state, and adds two focused integration tests for stats bar visibility.

Confidence Score: 4/5

Safe to merge; changes are small, well-tested, and use established flexbox patterns.

The implementation is straightforward and the tests cover both the visible and hidden cases. The flex layout changes follow standard Tailwind patterns. Score is 4 rather than 5 because layout changes can have visual edge cases difficult to catch in unit tests, and the workspace-mode h-full wrapper is a structural change that could affect WorkspaceView's internal scroll in some environments.

No files require special attention.

Important Files Changed

Filename	Overview
src/App.tsx	Adds StatsBar import and conditional rendering; wraps content in a scroll-enabling div; CSS flex changes are correct for both workspace and non-workspace modes.
src/App.test.tsx	Adds useGitHubData mock (required by StatsBar being in the tree), updates one test assertion to check rendered view instead of transient loading state, and adds two correct integration tests for stats bar visibility.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[App renders] --> B{authQuery loading?}
    B -- yes --> C[Checking auth…]
    B -- no --> D{authQuery error?}
    D -- yes --> E[Error message]
    D -- no --> F{connected?}
    F -- no --> G[AuthGate]
    F -- yes --> H[Main layout: flex h-screen]
    H --> I[aside: Sidebar]
    H --> J{isWorkspace?}
    J -- yes --> K["main: flex-1"]
    J -- no --> L["main: flex min-w-0 flex-1 flex-col"]
    L --> M[StatsBar]
    L --> N["div: min-h-0 flex-1 overflow-y-auto"]
    K --> O["div: h-full"]
    N --> P[ChunkErrorBoundary / Suspense / MainContent]
    O --> P

Loading

_{Reviews (1): Last reviewed commit: "feat(ui): wire StatsBar component into A..." | Re-trigger Greptile}

[cubic-dev-ai]

No issues found across 2 files