Skip to content

Migrate to Nextra 4, bring the wiki into /docs, and redesign the homepage#8

Open
JoHena wants to merge 3 commits into
Suwayomi:masterfrom
JoHena:master
Open

Migrate to Nextra 4, bring the wiki into /docs, and redesign the homepage#8
JoHena wants to merge 3 commits into
Suwayomi:masterfrom
JoHena:master

Conversation

@JoHena

@JoHena JoHena commented Jul 3, 2026

Copy link
Copy Markdown

Summary

  • Framework migration — Nextra 2 (Pages Router) → Nextra 4 (App Router). Site structure, routing, and build pipeline all change; visible behavior stays the same except where noted below.
  • Docs migration — the 5 pages from the Suwayomi-Server GitHub wiki (Configuration, Extensions, Local Source, Data Directory,
    Troubleshooting) now live in a /docs section on the site, plus two new pages: an FAQ and a Clients overview.
  • Homepage redesign — replaces the placeholder centered hero with a themed, multi-panel layout using the project's logo and brand colors.

Framework migration (Nextra 2 → 4)

  • pages/.mdx → content/.mdx (Nextra 4's content-directory convention)
  • theme.config.tsx + pages/_app.tsx → app/layout.jsx + a nested app/(docs)/layout.jsx route group holding the Nextra Layout/Navbar/Footer
  • New app/(docs)/[...mdxPath]/page.jsx catch-all and mdx-components.jsx, both required by Nextra 4
  • next.config.js → next.config.mjs (Nextra 4 ships ESM-only)
  • Homepage moved to a dedicated app/page.jsx — a literal route can't share a route segment with an optional catch-all, and per-page theme overrides for it (hiding nav/sidebar) didn't apply reliably in dev under the old approach.
  • The two redirect pages (tachiyomi-extension, tracker-oauth) had their useState/useEffect logic moved into real 'use client' components, since App Router pages are server components by default.

Docs content

  • Migrated wiki pages keep their original content, with internal links rewritten to /docs/... and GitHub alert syntax converted to Nextra's
  • New docs/faq.mdx and docs/clients.mdx, both authored from the Suwayomi-Server README
    since I wrote that copy rather than moving existing text
  • Clients render in a custom card grid (ClientIcon/ClientCard) rather than Nextra's built-in Cards.Card, which squished icon/title/text together

Homepage

  • Multi-panel "manga page" layout: main panel (title/subtitle), two info panels, a full-width screenshot of the bundled WebUI, and a CTA panel
  • Uses the actual Suwayomi logo (pulled from the Suwayomi-Server repo icon) and the project's real teal/black brand colors
image

AzureAD\JohnathanJesusMoreno added 3 commits July 3, 2026 13:42
Moves pages/*.mdx into content/ using Nextra 4's content-directory
convention, replaces theme.config.tsx + _app.tsx with app/layout.jsx
and a nested (docs) route group for the Nextra Layout/Navbar/Footer,
and adds the required app/[...mdxPath] catch-all and mdx-components.jsx.

Pins zod to 4.3.6 via yarn resolutions to work around a shipped
nextra-theme-docs@4.6.1/zod-4.4.x incompatibility, and disables
webpack's persistent cache (silently hangs the build on this machine).
The homepage moves to a dedicated app/page.jsx (a literal route can't
share a segment with an optional catch-all, and per-page theme
overrides for it don't apply reliably in dev). The two redirect pages
(tachiyomi-extension, tracker-oauth) move their hook logic into real
client components since App Router pages are server components by
default.
Brings the 5 existing wiki pages (configuration, extensions, local
source, data directory, troubleshooting) into a proper /docs section
with internal links, and adds two new pages authored from the
Suwayomi-Server README: a clients overview and an FAQ.

Clients render as a custom card grid (icon, title, description) via
ClientIcon/ClientCard rather than Nextra's built-in Cards.Card, which
was too compact and squished the icon/title/text together.
Replaces the plain centered hero with a multi-panel "manga page"
composition: a dark stage holding a main panel (title/subtitle), two
info panels (extensions, any client), a full-width screenshot of the
bundled WebUI, and a CTA panel up top - all bordered with visible
gutters between them, using the actual Suwayomi logo (pulled from the
Suwayomi-Server repo) as a stamped corner badge and the project's real
teal/black brand colors instead of placeholder ones.
@JoHena JoHena marked this pull request as ready for review July 3, 2026 21:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant