fix: move hook calls before early returns to comply with Rules of Hooks

[g-k-s-03]

Addressed Issues:
Fixes #75

changes
Verified via grep on current main that all hooks appear before
their respective guards after the fix:

File	Guard line	Last hook line
OverviewPage.jsx	L29	L17 (useEffect)
RepositoriesPage.jsx	L56	L53 (useSortedData)
ContributorsPage.jsx	L58	L55 (useSortedData)
GovernancePage.jsx	L27	L18 (useMemo)
AnalyticsPage.jsx	L44	L39 (useMemo)

Production build: 1214 modules transformed, zero errors.
5 files changed, 22 insertions(+), 20 deletions(-)

What was wrong

Five page components were calling React hooks after an early
if (!model) return null guard. React requires hooks to be called
unconditionally on every render in the same order. When the app first
loads, model is null so the component exits early, and those hooks are
skipped. Once data loads, model gets a value, and those hooks suddenly
run React detects the mismatch and throws:
Rendered more hooks than during the previous render.
This causes a crash in development and undefined behavior in production.

What was changed

Moved all hook calls above the guard in each of the five files.
Used optional chaining to handle null model safely in hooks that
previously depended on model data:

• OverviewPage.jsx :- moved useState, useRef, useEffect above guard
• RepositoriesPage.jsx :- moved useMemo ×2, useSortedData above guard;
  changed model.allRepos to model?.allRepos ?? []
• ContributorsPage.jsx :- moved useNavigate, useMemo ×2, useSortedData
  above guard; changed model.contributors to model?.contributors ?? []
• GovernancePage.jsx :- moved useMemo above guard
• AnalyticsPage.jsx:- moved useMemo ×3 above guard

Non-hook variable assignments that reference model directly were left
after the guard where they are safe.

Why ESLint did not catch this

The react-hooks/rules-of-hooks ESLint rule would normally flag this
automatically, but eslint.config.js currently targets *.{ts,tsx} while
all source files are .jsx/.js so linting never ran on these files.

Summary by CodeRabbit

• Refactor
  • Optimized internal logic ordering across analytics, contributors, governance, overview, and repositories pages for improved performance efficiency.

---

Note: This release contains internal code improvements with no changes to user-facing functionality or features.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: 97d7b731-c6bf-427f-a325-3f81777e82a6

📥 Commits

Reviewing files that changed from the base of the PR and between 33fd4fc and 1edf31e.

📒 Files selected for processing (5)

• src/pages/AnalyticsPage.jsx
• src/pages/ContributorsPage.jsx
• src/pages/GovernancePage.jsx
• src/pages/OverviewPage.jsx
• src/pages/RepositoriesPage.jsx

---

Walkthrough

Across five page components (OverviewPage, RepositoriesPage, ContributorsPage, AnalyticsPage, GovernancePage), the if (!model) return null guard is relocated to a later position in each render function. All useMemo, useEffect, useRef, useState, and useNavigate calls are moved above the guard, using optional chaining and null-coalescing (model?.allRepos ?? [], etc.) so those computations are safe when model is absent.

Changes

Rules of Hooks guard relocation

Layer / File(s)	Summary
OverviewPage: hooks before null guard src/pages/OverviewPage.jsx	open state, infoRef, and the mousedown useEffect are placed unconditionally before the model null-guard; the guard is repositioned after those hook declarations.
Data pages: useMemo + optional chaining before null guard src/pages/RepositoriesPage.jsx, src/pages/ContributorsPage.jsx, src/pages/AnalyticsPage.jsx, src/pages/GovernancePage.jsx	Each page moves its useMemo blocks and useNavigate call above the null-guard. Safe access patterns (model?.allRepos ?? [], model?.contributors ?? []) allow the memos to compute without a model. The null-guard is reinserted after all derived values are computed.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Suggested labels

Typescript Lang

Poem

🐇 Hop hop, hooks must never hide,
Behind a guard where null resides!
We moved the fence down the trail,
So useMemo will never fail.
Rules of Hooks — now satisfied! 🎉

🚥 Pre-merge checks | ✅ 4

✅ 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 accurately summarizes the main change: moving hook calls before early returns to comply with React's Rules of Hooks.
Linked Issues check	✅ Passed	The PR successfully addresses all coding requirements from issue #75: moving hooks above early returns in all five affected files and using optional chaining to safely handle null model values.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to fixing the Rules of Hooks violations identified in issue #75; no unrelated modifications are present.

_{✏️ 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

• X
• Mastodon
• Reddit
• LinkedIn

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

[g-k-s-03]

Hey @Zahnentferner and @rahul-vyas-dev, requesting a review on this PR.

This fixes the Rules of Hooks violations across all 5 affected page
components. CodeRabbit has reviewed and approved with no issues flagged.
All CI checks are passing, and there are no merge conflicts.
Would appreciate a maintainer review when you get a chance. Thanks!