feat: Add dynamic toggle to the hero CTA button when logged in

[AndyVale]

Abstract

Hi, this PR introduces a minor but important UX improvement to the homepage.
Previously, the main CTA (call-to-action) button in the Hero section always prompted the user to "Join Free" and directed them to the registration page, even if they were already authenticated.

This PR fixes that by dynamically updating the button's text and destination based on the user's login state.

Changes

• Dynamic CTA State public/index.html:
  • Implemented the updateHeroCta() function that checks localStorage for the active edu_token and edu_user.
  • When a user is logged in, the hero CTA button automatically changes its text to "Go to Dashboard" and routes to /dashboard.html.
  • When a user is logged out (or guest), it defaults back to "Join Free" and routes to /login.html?tab=register.
• Event Binding: Ensured the new function is called smoothly upon page load and correctly reverts state during the logout() action.

update_button.mp4

Impact

Improves the frontend navigation flow for returning users by allowing them to jump straight into their dashboard directly from the hero banner, rather than manually navigating through the authentication pages. No backend or API changes were required.

Purpose

Add dynamic hero CTA button behavior that adapts based on user authentication state, improving navigation flow for both new and returning users on the landing page.

Key Changes

• Added updateHeroCta() function in public/index.html that dynamically updates the hero CTA button text and destination based on authentication status:
  • Logged-in users: CTA displays "Go to Dashboard" and links to /dashboard.html
  • Logged-out users: CTA displays "Join Free" and links to /login.html?tab=register
• Integrated into page lifecycle: Function is invoked on initial page load to ensure correct state on first visit, and called within the logout() function to reset the CTA when users sign out
• Storage-based state detection: Leverages existing localStorage keys (edu_token and edu_user) to determine authentication status

Impact

• User Experience: Reduces friction for returning users by providing direct dashboard access from the hero section without requiring navigation through intermediate pages
• Scope: Client-side DOM manipulation only—no backend or API changes required
• Code Changes: 25 lines added, 2 lines modified

[coderabbitai]

Walkthrough

Added a dynamically updating hero call-to-action element that reflects authentication state. The hero CTA destination and label adjust based on whether a user is logged in (checked via localStorage), with updates triggered on page load and after logout.

Changes

Cohort / File(s)	Summary
Hero CTA Functionality public/index.html	Added a new hero CTA element with dynamic behavior tied to authentication state. Introduced updateHeroCta() function to set CTA destination and label based on edu_token and edu_user from localStorage. Integrated function calls on initial page load and within the logout() function to keep the CTA synchronized with authentication status.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~8 minutes

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly and accurately summarizes the main change: adding dynamic functionality to the hero CTA button that toggles based on authentication state.
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

• X
• Mastodon
• Reddit
• LinkedIn

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

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@public/index.html`:
- Around line 169-182: updateHeroCta duplicates the token/user lookup logic in
updateNav; extract that logic into a shared helper (e.g., getAuthState or
resolveAuthState) that returns { token, user, isAuthenticated } and call it from
both updateHeroCta and updateNav so both UI pieces use the same source of truth;
updateHeroCta to read isAuthenticated (or token/user) from the helper and then
set heroCta.href/textContent accordingly, removing the duplicated
localStorage/JSON.parse code.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Repository: alphaonelabs/coderabbit/.coderabbit.yaml

Review profile: ASSERTIVE

Plan: Pro

Run ID: de1d139e-662c-4545-a13b-eb376871ac11

📥 Commits

Reviewing files that changed from the base of the PR and between 97eec85 and 703a933.

📒 Files selected for processing (1)

• public/index.html