Skip to content

[claude] Add FieldWorks Lite and Lexbox documentation site - #2518

Closed
myieye wants to merge 14 commits into
developfrom
claude/fw-lite-lexbox-docs-0e3415-hwa2rw
Closed

[claude] Add FieldWorks Lite and Lexbox documentation site#2518
myieye wants to merge 14 commits into
developfrom
claude/fw-lite-lexbox-docs-0e3415-hwa2rw

Conversation

@myieye

@myieye myieye commented Jul 30, 2026

Copy link
Copy Markdown
Collaborator

[Claude, autonomous]

Adds a Docusaurus docs site for FieldWorks Lite and Lexbox — a user guide, technical/sync docs, and an interactive "How sync works" explainer — and wires up a GitHub Pages deploy workflow.

Interactive diagram (desktop) Fits one screen (mobile)
<img width="440" src="https://raw.githubusercontent.com/sillsdev/languageforge-lexbox/4d394f0f2150e4ca5747cd8c9a125637a0c7b8b2/claude/fw-lite-lexbox-docs-0e3415-hwa2rw/b281e81ab3b866cb.png"&gt; <img width="200" src="https://raw.githubusercontent.com/sillsdev/languageforge-lexbox/9c92dbe1100e078342d1b3ed76ea9ca0a125045f/claude/fw-lite-lexbox-docs-0e3415-hwa2rw/7360fb7e0652828a.png"&gt;

What's here

  • User guide (docs/user-guide/) — getting started, FAQ, and the sync explainer, written for non-technical FieldWorks Lite users. Lexbox is grounded once and kept out of the way so pure-FWL readers aren't confused.
  • Technical docs (docs/technical/) — the sync chain, the FwHeadless merge, CRDT notes, dev setup.
  • Interactive sync explainer (docs/src/components/SyncExplainer/) — one fixed diagram that replays per question, with a learner-paced stepper. Trigger pills are tap/keyboard/screen-reader toggletips; the diagram flips vertical by container width so it never overflows the docs column.
  • docs.yaml — builds the site on every docs PR and deploys to GitHub Pages from develop.
  • Rationale and content ground-truth are recorded in DOCS-PLAN.md.

How this reaches GitHub Pages

There is no live docs site yet — develop still has only the old docs/DEVELOPER-*.md files. This PR is what turns the site on:

  1. Merge this PR into develop. docs.yaml builds on every docs PR (a check on this PR) but the deploy job is gated to refs/heads/develop, so the site publishes only once this lands.
  2. One-time repo setting (admin): Settings → Pages → Source: GitHub Actions. That creates the github-pages environment the deploy job targets; without it the deploy step fails.
  3. Pick the URL. Config defaults to url: https://docs.lexbox.org, baseUrl: /, both overridable via DOCS_URL / DOCS_BASE_URL. For a custom domain, set the Pages custom domain to docs.lexbox.org (DNS CNAME → sillsdev.github.io) and keep baseUrl: /. To use the default project URL instead, deploy with DOCS_BASE_URL=/languageforge-lexbox/ so assets resolve at https://sillsdev.github.io/languageforge-lexbox/.

Test plan

  • pnpm --dir docs typecheck and pnpm --dir docs build both green.
  • Verified the explainer end to end (chip select, stepping, toggletips, colored leg numbers, TOC) via screenshots in light + dark, desktop + mobile.

Notes

  • The branch is behind develop but the changes are docs-only (no overlap with recent work), so it merges cleanly.
  • The two extra "screenshot" commits on the branch are net-zero (add + remove) so they don't touch the diff; they vanish on squash-merge.

🤖 Generated with Claude Code


Generated by Claude Code

myieye and others added 14 commits July 29, 2026 18:30
docs/ becomes a Docusaurus site with a user guide and technical section,
seeded from existing README/AGENTS.md content. The user guide's 'How sync
works' page is an interactive question-driven explainer (all content in
docs/src/components/SyncExplainer/syncScenarios.ts). DOCS-PLAN.md records
the tooling survey and decisions.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Named type imports in the Docusaurus config, Boolean() coercions,
content-derived keys, arrow-const components, and Topology/Stepper
extracted from SyncExplainer. DOCS-PLAN.md gains the FieldWorks Classic
docs relationship and the React-vs-Svelte decision with its revisit
trigger.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Lets CI deploy previews to another host (e.g. a fork's GitHub Pages)
until the production URL is decided.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
persist-credentials off in the docs workflow checkout, correct the
shared-storage claim in the system overview, read-only credential check
in the dev setup, FAQ headings to level 2.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Empty split parts produced duplicate position keys; skip them and count
the ** markers when advancing.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Correct the platform list (no Mac or iOS builds ship), add a scenario
step disclosing that the FW Lite Sync button and the project page's
'Sync FieldWorks Lite' are the same action, and add a 'Where you'll see
this in the app' section mapping each leg to its dialog tab, statuses,
and buttons.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The always-reserved space read as a dead gap between the device box and
leg 1, worst on mobile. Also tell pure-FieldWorks-Lite teams up front
that legs 2 and 3 don't concern them.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
- Ground "Lexbox" for FieldWorks Lite users in the user-guide index and a new
  FAQ, so the FWL guide stays self-contained and doesn't assume readers know
  or visit Lexbox.
- Explain the sync snapshot as the JSON file recording the last merged state
  (the diff baseline, and the "have we synced before?" flag), instead of using
  the bare term "ProjectSnapshot".
- Make the explainer diagram interactive: the three leg triggers are now
  tap/click toggletips (touch + keyboard + screen-reader friendly) that reveal
  where the Sync button lives and that its two names are the same action.
- Color the diagram's leg numbers at rest to match the numbered table below,
  so a leg in the diagram ties to its row.
- Put the caption and stepper directly under the diagram in one "player" card
  so the controls read as driving the picture; compact the phone layout and
  scroll the player into view on select so the diagram and Next are co-visible.
- Turn the diagram vertical by container width (not viewport) so the wide
  horizontal layout never overflows the docs column into the sidebars.
- Give the page real section headings so "On this page" lists the first
  section instead of starting mid-page.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01TZKRnigoAXxEWZVJFrto1k
@myieye myieye closed this Jul 30, 2026
@coderabbitai

coderabbitai Bot commented Jul 30, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 46028320-30fe-426f-a2a3-628b10dc7fa7

📥 Commits

Reviewing files that changed from the base of the PR and between a425984 and f2c8075.

⛔ Files ignored due to path filters (5)
  • docs/pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml
  • docs/static/img/error-example.png is excluded by !**/*.png
  • docs/static/img/favicon.png is excluded by !**/*.png
  • docs/static/img/logo-dark.svg is excluded by !**/*.svg
  • docs/static/img/logo.svg is excluded by !**/*.svg
📒 Files selected for processing (34)
  • .github/workflows/docs.yaml
  • AGENTS.md
  • DOCS-PLAN.md
  • README.md
  • docs/.gitignore
  • docs/docusaurus.config.ts
  • docs/package.json
  • docs/pnpm-workspace.yaml
  • docs/sidebars.ts
  • docs/src/components/SyncExplainer/index.tsx
  • docs/src/components/SyncExplainer/styles.module.css
  • docs/src/components/SyncExplainer/syncScenarios.ts
  • docs/src/css/custom.css
  • docs/src/pages/index.module.css
  • docs/src/pages/index.tsx
  • docs/technical/architecture/_category_.json
  • docs/technical/architecture/integrations.md
  • docs/technical/architecture/overview.md
  • docs/technical/ci-cd.md
  • docs/technical/development/_category_.json
  • docs/technical/development/index.md
  • docs/technical/development/setup-linux.md
  • docs/technical/development/setup-macos.md
  • docs/technical/development/setup-windows.md
  • docs/technical/index.md
  • docs/technical/sync/_category_.json
  • docs/technical/sync/crdt.md
  • docs/technical/sync/fwheadless-merge.md
  • docs/technical/sync/index.md
  • docs/tsconfig.json
  • docs/user-guide/faq.md
  • docs/user-guide/getting-started.md
  • docs/user-guide/how-sync-works.mdx
  • docs/user-guide/index.md

📝 Walkthrough

Walkthrough

Changes

Adds a Docusaurus documentation site with user and technical sections, GitHub Pages deployment, reorganized setup links, detailed sync documentation, and an interactive responsive sync explainer.

Documentation site

Layer / File(s) Summary
Docusaurus site foundation
DOCS-PLAN.md, docs/package.json, docs/docusaurus.config.ts, docs/src/pages/*, docs/src/css/*
Adds site configuration, navigation, homepage, styling, package scripts, type checking, and documentation planning.
User guide content
docs/user-guide/*
Adds FieldWorks Lite onboarding, FAQ, and sync documentation.
Technical documentation
docs/technical/architecture/*, docs/technical/development/*, docs/technical/sync/*, docs/technical/ci-cd.md
Adds architecture, integration, local development, CI/CD, and synchronization documentation.
Interactive sync explainer
docs/src/components/SyncExplainer/*
Adds scenario-driven diagrams, step controls, token animation, accessibility behavior, tooltips, and responsive styling.
Publishing and references
.github/workflows/docs.yaml, README.md, AGENTS.md
Adds GitHub Pages build/deployment automation and updates documentation and image references.

Estimated code review effort: 4 (Complex) | ~60 minutes

Suggested labels: 📦 Lexbox

Poem

I’m a rabbit with docs in my burrow tonight,
Sync paths now sparkle in pixels of light.
Pages build, guides bloom,
Tokens hop round the room—
Every trail leads to knowledge just right!

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch claude/fw-lite-lexbox-docs-0e3415-hwa2rw

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

Comment @coderabbitai help to get the list of available commands.

@myieye
myieye deleted the claude/fw-lite-lexbox-docs-0e3415-hwa2rw branch July 30, 2026 21:10
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