Skip to content

Add global installation method selector and sync code blocks#1

Merged
f merged 1 commit into
f:mainfrom
emreerkan:main
May 22, 2026
Merged

Add global installation method selector and sync code blocks#1
f merged 1 commit into
f:mainfrom
emreerkan:main

Conversation

@emreerkan
Copy link
Copy Markdown
Contributor

What

This PR introduces a global installation method selector (npx, npm, wp-cli) to the Docusaurus navbar and syncs the selected method globally across the homepage and all documentation code blocks.

Why

Previously, the installation method (e.g., using npx pressship vs wp ship) was only a local state on the homepage, while the documentation hardcoded commands using either npx pressship or pressship. This meant users who preferred wp-cli had to mentally translate commands while reading the docs. By persisting this choice in localStorage and syncing it globally, we ensure users get a tailored, consistent reading experience across the entire site.

How

  1. Global Context: Created an InstallMethodContext in src/theme/Root.tsx to handle cross-tab localStorage syncing and state management globally.
  2. Navbar Dropdown: Ejected NavbarItem/ComponentTypes to insert a custom-installMethod component into the top right of the Docusaurus navbar.
  3. Dynamic Markdown Blocks: Swizzled the Docusaurus CodeBlock component (src/theme/CodeBlock/index.tsx) to dynamically replace npx pressship and pressship prefixes with the user's selected method using RegExp. This automatically applies to all bash and sh code blocks in .md files without needing to write custom React components for every snippet.
  4. Homepage Refactor: Removed the isolated state from src/pages/index.tsx so the homepage terminal examples now simply consume the global Context.

Notes for the Future

Currently, we use a two-step RegExp inside the CodeBlock wrapper to catch both npx pressship and bare pressship prefixes (due to mixed usage across our docs). If we standardize the command formatting in the raw markdown files in the future, we can simplify this RegExp significantly, or even replace it entirely with a native Docusaurus feature (like MDX variables) to make it more resilient.

@f f merged commit 7dbc5dd into f:main May 22, 2026
1 check passed
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.

2 participants