docs: add RoR-specific competitive landscape and template refs#2869
docs: add RoR-specific competitive landscape and template refs#2869
Conversation
Move React on Rails-specific content from the shared claude-code-commands-skills-agents repo into project-local .claude/docs/ files: - docs-competitive-landscape.md: competitor analysis (Inertia Rails, Vite Ruby, react-rails, Hotwire) and documentation improvement targets - docs-templates.md: RoR-specific README, API, config, and troubleshooting template examples using react_component helper Addresses the react_on_rails side of: - shakacode/claude-code-commands-skills-agents#19 - shakacode/claude-code-commands-skills-agents#20 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
|
You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard. |
WalkthroughThree documentation files are added to support React on Rails development: a competitive landscape analysis comparing docs across similar projects, a templates file with copy-ready documentation examples and patterns, and a link update to reference these new docs. Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
![claude[bot]](https://avatars.githubusercontent.com/in/1236702?s=60&v=4){kind=small}
| When documenting API methods, use `react_component` as the canonical example: | ||
|
|
||
| ```ruby | ||
| method_name(component_name, options = {}) -> String |
There was a problem hiding this comment.
Placeholder method_name was not replaced with the actual method name. Based on the surrounding context ("use react_component as the canonical example"), this should be:
| method_name(component_name, options = {}) -> String | |
| react_component(component_name, options = {}) -> String |
| **Common causes:** | ||
|
|
||
| 1. Component not registered — call `ReactOnRails.register({ MyComponent })` in your entry file | ||
| 2. Entry file not included in the page — check `javascript_pack_tag` or Shakapacker configuration |
There was a problem hiding this comment.
This troubleshooting step only covers Shakapacker/Webpacker users. Since the Requirements section below lists "Shakapacker >= 6.0 (or Rspack)" and the competitive landscape doc highlights Rspack support as a key differentiator, this should mention both bundlers to avoid confusing users on non-Shakapacker setups:
| 2. Entry file not included in the page — check `javascript_pack_tag` or Shakapacker configuration | |
| 2. Entry file not included in the page — check `javascript_pack_tag` (Shakapacker) or your Rspack/Vite entry point configuration |
| - Wiki with community-contributed articles | ||
| - No dedicated docs site | ||
| - Outdated examples in some areas | ||
| - Migration guide to React on Rails exists (this is an opportunity) |
There was a problem hiding this comment.
This is ambiguous — it could mean either (a) a migration guide already exists and that's an advantage, or (b) there's an opportunity to create one because react-rails users need a migration path. Intent appears to be the latter. Consider clarifying:
| - Migration guide to React on Rails exists (this is an opportunity) | |
| - No migration guide from react-rails to React on Rails exists yet — creating one is an opportunity to capture those users |
Review: docs-only additionsOverall this is a clean, well-scoped addition. The competitive landscape analysis is genuinely useful context for Claude when working on documentation, and the templates give concrete React on Rails-specific examples that fill a real gap. Three issues to address before merging: Bug (must fix)
Clarity (should fix)
Consistency (should fix)
Minor observation
|
Greptile SummaryThis PR adds two new AI-agent guidance documents to
Confidence Score: 5/5Safe to merge — documentation-only changes with no impact on runtime behaviour. All three changed files are documentation/guidance files consumed only by AI agents. The two style-level issues in
Important Files Changed
Flowchart%%{init: {'theme': 'neutral'}}%%
flowchart TD
CLAUDE["CLAUDE.md\n(entry point for Claude Code)"]
CL["docs-competitive-landscape.md\nCompetitor analysis &\nimprovement targets"]
CT["docs-templates.md\nRoR-specific code samples\n(README, API ref, config, troubleshooting)"]
OTHER["Other .claude/docs/ files\n(architecture, CI, testing…)"]
CLAUDE -->|references| CL
CLAUDE -->|references| CT
CLAUDE -->|references| OTHER
CL -->|informs| DOCS_WORK["AI agent doc-writing tasks"]
CT -->|informs| DOCS_WORK
Reviews (1): Last reviewed commit: "docs: add RoR-specific competitive lands..." | Re-trigger Greptile |
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
|
|
||
| ## API Reference Entry Example | ||
|
|
||
| When documenting API methods, use `react_component` as the canonical example: |
There was a problem hiding this comment.
method_name inconsistent with stated intent
The prose above this code block says "use react_component as the canonical example", but the signature itself uses the generic placeholder method_name. Any AI agent consuming this template will copy the placeholder rather than the actual helper name.
| When documenting API methods, use `react_component` as the canonical example: | |
| react_component(component_name, options = {}) -> String |
|
|
||
| ReactOnRails.register({ MyComponent }); | ||
| ``` | ||
|
|
||
| ### SSR fails with "ReferenceError: window is not defined" | ||
|
|
||
| **Cause:** Component or dependency accesses browser APIs during the initial render pass, which runs in Node/ExecJS where those globals do not exist. |
There was a problem hiding this comment.
isBrowser declared but never used in the snippet
The variable isBrowser is defined on the first line but then the example immediately jumps to a useEffect block without referencing it. A developer reading this will likely copy both lines and end up with a lint warning (no-unused-vars), or worse, assume isBrowser is automatically applied inside the effect. Either use it in the example or remove the declaration and rely solely on the useEffect guard:
| ReactOnRails.register({ MyComponent }); | |
| ``` | |
| ### SSR fails with "ReferenceError: window is not defined" | |
| **Cause:** Component or dependency accesses browser APIs during the initial render pass, which runs in Node/ExecJS where those globals do not exist. | |
| useEffect(() => { | |
| // window is always defined here — useEffect only runs in the browser | |
| const width = window.innerWidth; | |
| }, []); |
Or, if the intent is to show the isBrowser guard pattern separately, add a usage:
const isBrowser = typeof window !== 'undefined';
if (isBrowser) {
// Safe to access window APIs outside React lifecycle
}
useEffect(() => {
// Also safe here — only runs in browser
}, []);![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (1)
.claude/docs/docs-competitive-landscape.md (1)
62-73: Consider adding a “Last reviewed on” date for the competitive checklist.This section will age quickly; a date marker helps future updates prioritize stale assumptions.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.claude/docs/docs-competitive-landscape.md around lines 62 - 73, Add a "Last reviewed on" date string at the top of the competitive checklist section that begins with "Based on competitive analysis, the minimum viable docs improvement:" (in docs-competitive-landscape.md) so readers can see staleness; insert a single-line timestamp such as "Last reviewed on: YYYY-MM-DD" immediately above or below that header, use ISO date format, and ensure the date is updated whenever that checklist is edited.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.claude/docs/docs-templates.md:
- Around line 27-31: Update the example API signature to use the actual helper
name instead of a generic placeholder: replace the line using
method_name(component_name, options = {}) -> String with the canonical helper
signature react_component(component_name, options = {}) -> String so readers can
copy/paste the real method name; ensure the parameter names and return type
remain unchanged.
---
Nitpick comments:
In @.claude/docs/docs-competitive-landscape.md:
- Around line 62-73: Add a "Last reviewed on" date string at the top of the
competitive checklist section that begins with "Based on competitive analysis,
the minimum viable docs improvement:" (in docs-competitive-landscape.md) so
readers can see staleness; insert a single-line timestamp such as "Last reviewed
on: YYYY-MM-DD" immediately above or below that header, use ISO date format, and
ensure the date is updated whenever that checklist is edited.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: af81773d-80d6-47e8-8d40-7c8f0d892db6
📒 Files selected for processing (3)
.claude/docs/docs-competitive-landscape.md.claude/docs/docs-templates.mdCLAUDE.md
| When documenting API methods, use `react_component` as the canonical example: | ||
|
|
||
| ```ruby | ||
| method_name(component_name, options = {}) -> String | ||
| ``` |
There was a problem hiding this comment.
Use the actual helper name in the API signature example.
method_name(component_name, options = {}) is a generic placeholder and can mislead copy/paste. Since this section declares react_component as canonical, show that exact signature.
✏️ Proposed doc fix
- method_name(component_name, options = {}) -> String
+ react_component(component_name, options = {}) -> String📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| When documenting API methods, use `react_component` as the canonical example: | |
| ```ruby | |
| method_name(component_name, options = {}) -> String | |
| ``` | |
| When documenting API methods, use `react_component` as the canonical example: | |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In @.claude/docs/docs-templates.md around lines 27 - 31, Update the example API
signature to use the actual helper name instead of a generic placeholder:
replace the line using method_name(component_name, options = {}) -> String with
the canonical helper signature react_component(component_name, options = {}) ->
String so readers can copy/paste the real method name; ensure the parameter
names and return type remain unchanged.
## Summary - Adds `.claude/docs/docs-competitive-landscape.md` with React on Rails competitor analysis (Inertia Rails, Vite Ruby, react-rails, Hotwire) and documentation improvement targets - Adds `.claude/docs/docs-templates.md` with RoR-specific template examples (README Hello World with `react_component`, API reference, config reference, troubleshooting) - Updates `CLAUDE.md` to reference both new docs files This is the react_on_rails side of moving project-specific content out of the shared `claude-code-commands-skills-agents` repo. Addresses shakacode/claude-code-commands-skills-agents#19 Addresses shakacode/claude-code-commands-skills-agents#20 ## Test plan - [x] Files contain only React on Rails-specific content (no Shakapacker sections) - [x] CLAUDE.md references both new files - [x] Pre-commit hooks pass (prettier, trailing newlines) 🤖 Generated with [Claude Code](https://claude.com/claude-code) <!-- CURSOR_SUMMARY --> --- > [!NOTE] > **Low Risk** > Low risk: documentation-only additions plus a reference update in `CLAUDE.md`, with no runtime or build changes. > > **Overview** > Adds two new Claude guidance docs: a **competitive documentation landscape** (`.claude/docs/docs-competitive-landscape.md`) summarizing key competitors and doc gaps to target, and **project-specific documentation templates** (`.claude/docs/docs-templates.md`) with canonical React on Rails examples for README/API/config/troubleshooting sections. > > Updates `CLAUDE.md` to include these new docs in the recommended reading list. > > <sup>Written by [Cursor Bugbot](https://cursor.com/dashboard?tab=bugbot) for commit 2848581. This will update automatically on new commits. Configure [here](https://cursor.com/dashboard?tab=bugbot).</sup> <!-- /CURSOR_SUMMARY --> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Documentation** * Updated internal documentation framework with enhanced guidance covering implementation patterns, configuration references, and troubleshooting examples for React on Rails projects. <!-- end of auto-generated comment: release notes by coderabbit.ai --> Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…ew-fixes * origin/main: Remove dependency on internal TanStack Router router.ssr flag (#2833) Revert "Eliminate double JSON.stringify in RSC payload embedding (#2835)" (#2878) Eliminate double JSON.stringify in RSC payload embedding (#2835) docs: align Pro references with canonical docs routes (#2866) docs: make Pro route entry points explicit (#2867) Bump fastify from 5.8.1 to 5.8.3 in the npm-security group across 1 directory (#2846) docs: add RoR-specific competitive landscape and template refs (#2869) Clarify streaming narrative in RSC docs (#2813) (#2814)
1 participant
Summary
.claude/docs/docs-competitive-landscape.mdwith React on Rails competitor analysis (Inertia Rails, Vite Ruby, react-rails, Hotwire) and documentation improvement targets.claude/docs/docs-templates.mdwith RoR-specific template examples (README Hello World withreact_component, API reference, config reference, troubleshooting)CLAUDE.mdto reference both new docs filesThis is the react_on_rails side of moving project-specific content out of the shared
claude-code-commands-skills-agentsrepo.Addresses shakacode/claude-code-commands-skills-agents#19
Addresses shakacode/claude-code-commands-skills-agents#20
Test plan
🤖 Generated with Claude Code
Note
Low Risk
Low risk: documentation-only additions plus a reference update in
CLAUDE.md, with no runtime or build changes.Overview
Adds two new Claude guidance docs: a competitive documentation landscape (
.claude/docs/docs-competitive-landscape.md) summarizing key competitors and doc gaps to target, and project-specific documentation templates (.claude/docs/docs-templates.md) with canonical React on Rails examples for README/API/config/troubleshooting sections.Updates
CLAUDE.mdto include these new docs in the recommended reading list.Written by Cursor Bugbot for commit 2848581. This will update automatically on new commits. Configure here.
Summary by CodeRabbit