Skip to content

feat: add repository growth analytics dashboard#620

Merged
mehul-m-prajapati merged 5 commits into
GitMetricsLab:mainfrom
arpit2006:feat/repo-tracker
May 31, 2026
Merged

feat: add repository growth analytics dashboard#620
mehul-m-prajapati merged 5 commits into
GitMetricsLab:mainfrom
arpit2006:feat/repo-tracker

Conversation

@arpit2006
Copy link
Copy Markdown
Contributor

@arpit2006 arpit2006 commented May 30, 2026

Related Issue


Description

Implemented a Repository Growth Analytics Dashboard to provide deeper insights into GitHub repository activity and growth trends through interactive visualizations and analytics components.

Features Added

  • 📈 Repository Growth Timeline to visualize repository evolution over time.

  • 🔥 Commit Activity Trends using charts for weekly/monthly activity analysis.

  • 🧠 Contribution Frequency Analytics to highlight contributor engagement patterns.

  • 💻 Language Usage Analytics displaying technology distribution across repositories.

  • ⭐ Star & Fork Growth tracking repository popularity metrics.

  • 📊 Repository Statistics Cards displaying:

    • Total Repositories
    • Total Stars
    • Total Forks
    • Most Used Language
    • Total Contributions

Benefits

  • Provides actionable repository insights instead of static information.
  • Improves user understanding of repository growth and activity patterns.
  • Enhances the overall GitHub analytics and visualization experience.
  • Offers a more engaging and data-driven dashboard interface.

How Has This Been Tested?

  • Verified analytics data rendering with GitHub API responses.
  • Tested charts and statistics components across multiple repositories.
  • Validated responsive behavior on desktop and mobile devices.
  • Confirmed accurate calculation of repository statistics and language distributions.
  • Performed manual UI testing for analytics dashboard interactions.

Screenshots (if applicable)

repo1 repo2

Type of Change

  • Bug fix
  • New feature
  • Code style update
  • Breaking change
  • Documentation update

Summary by CodeRabbit

  • New Features
    • Added Repository Analytics Dashboard with comprehensive repository metrics and visualizations.
    • Added "Repo Tracker" tab featuring repository growth timeline, language distribution, commit activity, and top repositories by stars and forks.
    • Integrated repository analytics fetching to display aggregated metrics including total repositories, stars, forks, and contribution data.
    • Implemented themed styling with CSS variables for consistent UI appearance.

Review Change Stack

@netlify
Copy link
Copy Markdown

netlify Bot commented May 30, 2026

Deploy Preview for github-spy failed.

Name Link
🔨 Latest commit 1d460c2
🔍 Latest deploy log https://app.netlify.com/projects/github-spy/deploys/6a1c109799db700009cc4feb

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 30, 2026

Review Change Stack

Warning

Review limit reached

@mehul-m-prajapati, we couldn't start this review because you've reached your PR review rate limit.

More reviews will be available in 30 minutes and 37 seconds. Learn how PR review limits work.

Your organization has run out of usage credits. Purchase more in the billing tab.

⌛ How to resolve this issue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

We recommend that you space out your commits to avoid hitting the rate limit.

🚦 How do rate limits work?

CodeRabbit enforces hourly rate limits for each developer per organization.

Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available.

Please see our Fair Usage Limits Policy for further information.

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 78287627-e4a1-48b8-bb01-2ddf08c29ddf

📥 Commits

Reviewing files that changed from the base of the PR and between 0d4ffaa and 1d460c2.

📒 Files selected for processing (4)
  • src/components/RepositoryAnalyticsDashboard.tsx
  • src/hooks/useGitHubData.ts
  • src/index.css
  • src/pages/Tracker/Tracker.tsx
📝 Walkthrough

Walkthrough

This PR implements a repository growth analytics dashboard that visualizes GitHub repository metrics through multiple Recharts components. The feature extends the data hook to fetch repository and commit statistics, creates a new analytics component with summary cards and four chart panels, introduces CSS variable theming, and integrates everything into a new "Repo Tracker" tab.

Changes

Repository Growth Analytics Dashboard

Layer / File(s) Summary
Repository Analytics Data Fetching
src/hooks/useGitHubData.ts
Hook now defines RepositorySummary and WeeklyCommitPoint types, manages analytics state (repositories, weeklyCommitActivity, analyticsLoading, analyticsError), provides helpers to page repositories and fetch commit participation with retry/backoff, and exports fetchRepositoryAnalytics(username) that aggregates weekly commits from top 5 repositories by stars and push recency.
Dashboard Analytics Computation
src/components/RepositoryAnalyticsDashboard.tsx (imports, types, helpers, useMemo)
RepositoryAnalyticsDashboard component processes repositories and weeklyCommitActivity via useMemo to compute: total repository/star/fork counts, cumulative monthly growth buckets, top 6 languages by repository count, top 6 repositories by stars then forks, and total contributions. Formats chart labels and defines theme-based color palette. Implements early-return loading and empty-state renders.
Dashboard UI and Chart Panels
src/components/RepositoryAnalyticsDashboard.tsx (main render)
Renders hero header, conditional error banner, summary cards for repos/stars/language, and four Recharts panels: composed timeline (repositories/stars/forks growth), pie chart (language distribution with custom in-card legend), area chart (weekly commit activity), and bar chart (top repositories stars vs forks). Includes static footer "Repository intelligence" section with icon signals and fallback messages for missing data.
Repository Analytics Theme Styling
src/index.css
Adds .repo-tracker-theme CSS variable scope defining primary/accent/success/danger colors plus RGB variants and derived shadows/backgrounds/text colors. Updates flow-line styling and repository tracker icon colors to reference theme variables instead of hard-coded RGBA and hex values.
Tracker Page Integration
src/pages/Tracker/Tracker.tsx
Adds "Repo Tracker" tab (index 2) that renders RepositoryAnalyticsDashboard with analytics props. Extends useGitHubData destructuring to include repositories, weeklyCommitActivity, analyticsLoading, analyticsError, and fetchRepositoryAnalytics callback. Updates form submission to concurrently call fetchData and fetchRepositoryAnalytics via Promise.all, adjusts error display to show dataError only, and conditionally renders the analytics dashboard or issues/PR table based on active tab.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related issues

  • [FEATURE]: Add Repository Growth Analytics #603: This PR directly implements the Repository Growth Analytics dashboard feature, addressing all acceptance criteria including analytics dashboard implementation, GitHub API integration, repository growth timeline, commit activity charts, language analytics visualization, star/fork statistics, and proper loading/error states.

Possibly related PRs

  • GitMetricsLab/github_tracker#490: Refactored Tracker page auth/data reload logic using UserContext; this PR builds on that foundation by extending Tracker with the analytics tab and concurrent data fetching.
  • GitMetricsLab/github_tracker#149: Modified useGitHubData hook pagination and concurrent fetchData flow; this PR extends the same hook with analytics fetching parallel to existing issue/PR logic.
  • GitMetricsLab/github_tracker#539: Changed Tracker error handling to rely on dataError only; this PR uses the same error-handling pattern in the error banner conditional.

Suggested labels

level:advanced, type:feature, quality:clean

Poem

🐰 A tracker that dances with charts,
Charts that sing of repos and stars,
Commits and languages twirl,
While CSS variables unfurl—
Analytics make dashboards spark!

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The title 'feat: add repository growth analytics dashboard' directly and concisely summarizes the main feature added across all modified files.
Description check ✅ Passed The PR description includes all required template sections with comprehensive details: related issue (#603), detailed feature descriptions, testing approach, screenshots, and type of change (New feature).
Linked Issues check ✅ Passed The implementation addresses all coding requirements from issue #603: repository analytics dashboard, GitHub API integration, growth timeline, commit activity charts, language analytics, star/fork stats, responsive design, and loading/error states.
Out of Scope Changes check ✅ Passed All code changes are directly aligned with issue #603 objectives: new dashboard component, hook extensions, CSS theming, and page integration for repository analytics visualization.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

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

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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

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

@arpit2006 arpit2006 force-pushed the feat/repo-tracker branch from 67dcda8 to 13e94f8 Compare May 30, 2026 09:29
@arpit2006
Copy link
Copy Markdown
Contributor Author

@mehul-m-prajapati, Requesting Review.

Implemented the Repository Growth Analytics Dashboard with interactive repository insights, analytics visualizations, and statistics cards. The feature provides a more data-driven view of repository activity, contribution trends, language usage, and growth metrics.

Please take a look when you get a chance. Happy to make any requested changes or improvements.

@arpit2006 arpit2006 changed the title Feat/repo tracker feat: add repository growth analytics dashboard May 30, 2026
@mehul-m-prajapati
Copy link
Copy Markdown
Collaborator

mehul-m-prajapati commented May 30, 2026

@arpit2006 : design and colors don't match the existing theme
Capture

font size too big, pie chart label out of alignment

@arpit2006
Copy link
Copy Markdown
Contributor Author

@mehul-m-prajapati, Thank you for the review. I will address the suggested changes and update the PR shortly.

@arpit2006
Copy link
Copy Markdown
Contributor Author

arpit2006 commented May 30, 2026

@mehul-m-prajapati ,Here are the changes please review this!


re2 re1

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 8

Caution

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

⚠️ Outside diff range comments (1)
src/pages/Tracker/Tracker.tsx (1)

86-108: ⚠️ Potential issue | 🟠 Major | ⚡ Quick win

Avoid duplicate and tab-irrelevant GitHub fetches.

handleSubmit always calls fetchData(..., 1, ...), but setPage(0) also retriggers the effect on Lines 89-93 when the user submits from any page other than 0, so the same first-page request is sent twice. Because tab is also a dependency there, switching to Repo Tracker refetches issues/PRs that this branch never renders. That wastes GitHub rate limit and can race your loading/error state.

Suggested fix
-  useEffect(() => {
-    if (username) {
-      fetchData(username, page + 1, ROWS_PER_PAGE);
-    }
-  }, [tab, page]);
+  useEffect(() => {
+    const trimmedUsername = username.trim();
+    if (!trimmedUsername || isRepoTrackerTab) {
+      return;
+    }
+    fetchData(trimmedUsername, page + 1, ROWS_PER_PAGE);
+  }, [username, page, isRepoTrackerTab, fetchData]);

   const handleSubmit = (e: React.FormEvent<HTMLFormElement>): void => {
     e.preventDefault();
-    setPage(0);

     const trimmedUsername = username.trim();

     if (!trimmedUsername) {
       return;
     }

-    void Promise.all([
-      fetchData(trimmedUsername, 1, ROWS_PER_PAGE),
-      fetchRepositoryAnalytics(trimmedUsername),
-    ]);
+    setUsername(trimmedUsername);
+    if (page !== 0) {
+      setPage(0); // let the effect fetch page 1 once
+    } else {
+      void fetchData(trimmedUsername, 1, ROWS_PER_PAGE);
+    }
+    void fetchRepositoryAnalytics(trimmedUsername);
   };
🤖 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 `@src/pages/Tracker/Tracker.tsx` around lines 86 - 108, The effect currently
fetches unconditionally and handleSubmit also calls fetchData, causing duplicate
requests and tab-irrelevant fetches; update the useEffect that calls fetchData
to include username in its dependency array and guard the call with the repo-tab
check (use isRepoTrackerTab or tab value) so it only runs for the issues/PRs
tab, and remove the explicit fetchData(...) call from handleSubmit (keep
setPage(0) and the fetchRepositoryAnalytics call) so the page reset triggers a
single fetch via the guarded useEffect; refer to useEffect, fetchData,
handleSubmit, fetchRepositoryAnalytics, isRepoTrackerTab, tab, page, username,
and ROWS_PER_PAGE when making these changes.
🤖 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.

Inline comments:
In `@src/components/RepositoryAnalyticsDashboard.tsx`:
- Around line 20-28: Remove the unused Lucide icon import GitFork from the
import list in RepositoryAnalyticsDashboard (where Activity, Database,
GitCommitVertical, GitFork, Languages, Star, TrendingUp are imported) to satisfy
ESLint; update the import statement to exclude GitFork and ensure no other
references to GitFork remain in the file.
- Around line 96-111: The donut is counting repository.language (one-per-repo)
so the metric is "primary language by repository", not actual byte usage; update
RepositoryAnalyticsDashboard to either (A) rename the chart/title/label to
"Primary language distribution" and keep the existing languageCounts logic
(languageCounts, sortedRepositories, monthlyBuckets, repositories) or (B) fetch
per-repo language breakdowns (e.g., call each repo's /languages, aggregate bytes
per language across repos, sum into languageCounts) and use that aggregated
bytes map for the donut; apply the same change to the other location noted
(lines 154–157 equivalent logic) so labels and data semantics match.
- Around line 109-152: The current logic in the loop over sortedRepositories
buckets repository.stargazers_count and repository.forks_count into the repo
creation month (see sortedRepositories, monthlyBuckets,
repository.stargazers_count, repository.forks_count, formatMonthLabel), which
incorrectly treats current stars/forks as historical growth; to fix, stop
aggregating stars and forks into monthlyBuckets (remove monthBucket.stars +=
repository.stargazers_count and monthBucket.forks += repository.forks_count and
the stars/forks fields from those buckets) and instead only increment created
counts so repositoryGrowth reflects cumulative repository count, or
alternatively change the chart/labels produced from repositoryGrowth to
explicitly state it shows "repository count growth" rather than "stars/forks
over time" until you implement fetching real historical star/fork events.
- Line 561: The Box wrapping the custom legend uses sx={{ ..., gap: 12 }} which
maps to theme.spacing(12) (≈96px) and causes aggressive wrapping; change the gap
to an explicit pixel or smaller spacing token (for example set gap: '12px' or
gap: 2) inside the same Box sx prop so the legend uses a reasonable fixed
spacing; update the Box JSX that currently contains sx={{ display: 'flex',
justifyContent: 'center', flexWrap: 'wrap', gap: 12, mt: 2 }} accordingly.

In `@src/hooks/useGitHubData.ts`:
- Around line 333-399: fetchRepositoryAnalytics can be overwritten by
out-of-order responses; mirror the fetchData pattern by capturing the current
lastRequestId at the start of fetchRepositoryAnalytics and after any await
(especially before any setRepositories, setWeeklyCommitActivity,
setAnalyticsError, or setAnalyticsLoading calls) bail out if the captured id !==
lastRequestId to prevent stale responses from updating state; reference
fetchRepositoryAnalytics and lastRequestId and ensure checks occur both after
fetchAllRepositories/Promise.all and inside the per-repository loop before
updating weeklyTotals/state.
- Around line 97-105: In the retry loop inside useGitHubData.ts, remove the
unnecessary any cast when checking the participation request status: replace
(response as any).status with response.status and ensure the code uses the
octokit.request call's typed return value (keep the call to octokit.request('GET
/repos/{owner}/{repo}/stats/participation', { owner, repo }) and the existing
retry/sleep logic intact); if TypeScript complains about the response type, add
an appropriate generic type to octokit.request or narrow the type before
accessing .status, but do not use any casts.

In `@src/index.css`:
- Around line 129-195: The CSS rules for .how-it-works-flow-line (and its
variants .how-it-works-flow-line.light, .how-it-works-flow-line.vertical,
.how-it-works-flow-line.vertical.light) and the icon color rules (.icon-merged,
.icon-pr-open, .icon-pr-closed, .icon-issue-open, .icon-issue-closed) must be
scoped inside the .repo-tracker-theme wrapper so the custom properties they rely
on are in scope; fix this by prefixing those selectors with .repo-tracker-theme
(e.g., .repo-tracker-theme .how-it-works-flow-line, .repo-tracker-theme
.icon-merged, etc.) so these overrides only apply when the theme wrapper is
present.

In `@src/pages/Tracker/Tracker.tsx`:
- Around line 99-107: The submit handler computes trimmedUsername but doesn't
persist it to state, so subsequent effects still read the raw username; after
computing and validating trimmedUsername in the submit flow, call the state
updater to persist it (e.g. setUsername(trimmedUsername)) before calling
fetchData(trimmedUsername, 1, ROWS_PER_PAGE) and
fetchRepositoryAnalytics(trimmedUsername) so later effects that read username
will use the normalized value.

---

Outside diff comments:
In `@src/pages/Tracker/Tracker.tsx`:
- Around line 86-108: The effect currently fetches unconditionally and
handleSubmit also calls fetchData, causing duplicate requests and tab-irrelevant
fetches; update the useEffect that calls fetchData to include username in its
dependency array and guard the call with the repo-tab check (use
isRepoTrackerTab or tab value) so it only runs for the issues/PRs tab, and
remove the explicit fetchData(...) call from handleSubmit (keep setPage(0) and
the fetchRepositoryAnalytics call) so the page reset triggers a single fetch via
the guarded useEffect; refer to useEffect, fetchData, handleSubmit,
fetchRepositoryAnalytics, isRepoTrackerTab, tab, page, username, and
ROWS_PER_PAGE when making these changes.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 6f94a815-32ec-4c59-b34e-7f2fd5effed5

📥 Commits

Reviewing files that changed from the base of the PR and between e7b8fc8 and 0d4ffaa.

📒 Files selected for processing (4)
  • src/components/RepositoryAnalyticsDashboard.tsx
  • src/hooks/useGitHubData.ts
  • src/index.css
  • src/pages/Tracker/Tracker.tsx

Comment thread src/components/RepositoryAnalyticsDashboard.tsx
Comment thread src/components/RepositoryAnalyticsDashboard.tsx
Comment thread src/components/RepositoryAnalyticsDashboard.tsx
Comment thread src/components/RepositoryAnalyticsDashboard.tsx
Comment thread src/hooks/useGitHubData.ts Outdated
Comment thread src/hooks/useGitHubData.ts
Comment thread src/index.css
Comment thread src/pages/Tracker/Tracker.tsx
@arpit2006 arpit2006 force-pushed the feat/repo-tracker branch from 0d4ffaa to a96d5a1 Compare May 30, 2026 19:03
@arpit2006
Copy link
Copy Markdown
Contributor Author

@mehul-m-prajapati , Addressed the feedback and pushed the updates. Requesting a re-review. Thanks!

@mehul-m-prajapati mehul-m-prajapati merged commit e672eee into GitMetricsLab:main May 31, 2026
1 of 2 checks passed
@github-actions
Copy link
Copy Markdown

🎉🎉 Thank you for your contribution! Your PR #620 has been merged! 🎉🎉

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

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEATURE]: Add Repository Growth Analytics

2 participants