[Bug]: window.location.href in playground-header causes full-page reload instead of client-side navigation

[nyxsky404]

Short summary

The "Back to Dashboard" button in the playground header uses window.location.href = '/dashboard' instead of Next.js's router.push(), triggering a full browser page reload instead of a client-side SPA navigation.

Steps to reproduce

1. Open any playground (/playground/[id])
2. Wait for the WebContainer and Monaco editor to finish loading
3. Click the ← (Back to Dashboard) button in the top-left of the playground header
4. Observe the browser URL bar and the page transition

Expected behavior

The app should navigate client-side to /dashboard using Next.js's App Router (router.push('/dashboard')), preserving the SPA session without a full reload.

Actual behavior

window.location.href = '/dashboard' triggers a full HTTP browser navigation. The browser:

• Discards all loaded JS bundles (Monaco Editor, WebContainer SDK, Yjs, AI state)
• Shows a white/blank flash during navigation
• Re-downloads and reinitializes the entire app from scratch

This also breaks the upcoming unsaved-changes guard (issue #427), because window.location.href bypasses any router-level navigation interceptors.

Affected area

Playground editor

Environment

All browsers, any OS. Reproducible in both local dev and production. The issue is purely in the source code at:

modules/playground/components/playground-header.tsx line 64

// Current (wrong):
onClick={() => window.location.href = '/dashboard'}

// Fix — import useRouter from 'next/navigation' and use:
onClick={() => router.push('/dashboard')}

Screenshots, logs, or recordings

Not required — the issue is visible as a full-page white flash and network waterfall showing all assets re-fetching.

Relevant code:

// modules/playground/components/playground-header.tsx:64
<Button
    size="icon"
    variant="ghost"
    className="h-7 w-7 text-muted-foreground hover:text-foreground"
    onClick={() => window.location.href = '/dashboard'}   // ← problem
    aria-label="Back to Dashboard"
>

Fix:

import { useRouter } from "next/navigation";

// inside component:
const router = useRouter();

// button onClick:
onClick={() => router.push('/dashboard')}

Confirmation

• I searched existing issues before opening this report.
• I included enough detail for reproduction.

[github-actions]

👋 Thanks for opening an issue, @nyxsky404!

Our maintainers will review this issue shortly 🚀

---

📘 Before Contributing

Please read the contribution guide carefully before requesting assignment:

👉 https://github.com/piyushdotcomm/Editron/blob/main/CONTRIBUTING.md

---

🏷️ NSoC'26 / GSSoC'26 Requirement

Please clearly mention whether you are contributing via:

• NSoC'26
• GSSoC'26
• or as a regular contributor

Example: I am contributing under GSSoC'26

⚠️ Assignment requests without this information may be rejected automatically.

---

⏳ GSSoC Assignment Restriction

GSSoC contributors will only be allowed to take issue assignments after:

🗓️ May 15th, 12:00 AM IST

Before that date, assignment requests from GSSoC contributors will be automatically blocked.

---

🤖 Assignment System

To request assignment, comment: /assign or assign me

The smart assignment workflow validates:

• contributor eligibility
• NSoC/GSSoC participation mention
• active issue assignment limits
• repository contribution rules

---

⚠️ Important Repository Rules

• Do not start working before assignment
• Maximum 3 active assigned issues per contributor
• Contributors are encouraged to combine related fixes into 1–2 quality PRs instead of many small PRs
• PRs without assignment may be closed
• Spam or low-quality PRs may be rejected

Happy contributing 🎉

[nyxsky404]

hey! i'd like to work on this issue pls /assign it to me under GSSoC'26?

[nyxsky404]

/assign gssoc

[github-actions]

✅ Assigned @nyxsky404

🏷️ Program: gssoc26

📌 You now have 2 active assignment(s).
Please work on meaningful contributions and avoid opening many tiny PRs.

🏷️ Auto-detected difficulty: level:intermediate. A maintainer may update this.

[narutamaaurum]

Fixed in PR #483. Replaced with using Next.js hook for client-side SPA navigation.