fix: do not show back button when there is no history

[shuuji3]

When users landed on non-home page, there is no router history so nothing happens when clicking the back button.

cf. https://npmx.dev/about vs https://npmxdev-git-fork-shuuji3-fix-hide-back-button-wit-2dbbf1-poetry.vercel.app/about

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
npmx.dev	Ready	Preview, Comment	Feb 7, 2026 7:08am

2 Skipped Deployments

Project	Deployment	Actions	Updated (UTC)
docs.npmx.dev	Ignored	Preview	Feb 7, 2026 7:08am
npmx-lunaria	Ignored		Feb 7, 2026 7:08am

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

[coderabbitai]

📝 Walkthrough

Walkthrough

This pull request adds conditional visibility to back buttons across four page components: about.vue, compare.vue, privacy.vue, and settings.vue. Each back button now includes a v-show directive that checks whether router.options.history.state.back is not null. The back button renders only when a valid back state exists in the router history. The total modification involves one line added per file with no alterations to navigation logic or button functionality.

Possibly related PRs

• fix: add back button and centre icon on compare page #941: Introduced the back button to compare.vue and initialised router functionality; this PR enhances the same component's back button with conditional visibility based on router history state.
• chore: consistent back button across pages #936: Added back buttons and router.back() wiring to about.vue, compare.vue, privacy.vue, and settings.vue; this PR extends those implementations with visibility conditions on the same components.

Suggested reviewers

• danielroe

🚥 Pre-merge checks | ✅ 1

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The PR description clearly explains the issue: back buttons on non-home pages have no router history, making them non-functional. The changes across four page files add conditional visibility to hide the back button when router history is unavailable.

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

✨ Finishing touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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

[coderabbitai]

Actionable comments posted: 0

Caution

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

⚠️ Outside diff range comments (4)

app/pages/settings.vue (1)

51-56: ⚠️ Potential issue | 🟡 Minor

Remove inline focus-visible utility on the button; rely on global focus styles.
The class includes focus-visible:outline-accent/70, which conflicts with the project’s global button focus-visible rule.

Proposed change

-            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0 p-1.5 -mx-1.5"
+            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded shrink-0 p-1.5 -mx-1.5"

Based on learnings: “Ensure focus-visible styling for button/select is implemented globally in app/assets/main.css … Do not apply per-element inline utility classes like focus-visible:outline-accent/70.”

app/pages/compare.vue (1)

117-122: ⚠️ Potential issue | 🟡 Minor

Remove inline focus-visible utility on the button; rely on global focus styles.
The class includes focus-visible:outline-accent/70, which conflicts with the project’s global button focus-visible rule.

Proposed change

-            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0"
+            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded shrink-0"

Based on learnings: “Ensure focus-visible styling for button/select is implemented globally in app/assets/main.css … Do not apply per-element inline utility classes like focus-visible:outline-accent/70.”

app/pages/about.vue (1)

52-57: ⚠️ Potential issue | 🟡 Minor

Remove inline focus-visible utility on the button; rely on global focus styles.
The class includes focus-visible:outline-accent/70, which conflicts with the project’s global button focus-visible rule.

Proposed change

-            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0"
+            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded shrink-0"

Based on learnings: “Ensure focus-visible styling for button/select is implemented globally in app/assets/main.css … Do not apply per-element inline utility classes like focus-visible:outline-accent/70.”

app/pages/privacy.vue (1)

29-34: ⚠️ Potential issue | 🟡 Minor

Remove inline focus-visible utility on the button; rely on global focus styles.
The class includes focus-visible:outline-accent/70, which conflicts with the project’s global button focus-visible rule.

Proposed change

-            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded focus-visible:outline-accent/70 shrink-0"
+            class="inline-flex items-center gap-2 font-mono text-sm text-fg-muted hover:text-fg transition-colors duration-200 rounded shrink-0"

Based on learnings: “Ensure focus-visible styling for button/select is implemented globally in app/assets/main.css … Do not apply per-element inline utility classes like focus-visible:outline-accent/70.”