Create render_react_component controller helper

[garbles]

render_react_component allows you to render a React component in place of a typical rails template from app/views.

Instead of creating a view that only renders a component, e.g.

<!-- app/views/todos/index.html.erb -->

<%= react_component "TodoList", {:todos => @todos}, :prerender => true %>

You can create call the helper from the controller action instead, e.g.

# app/controllers/todos_controller.rb

class TodosController < ApplicationController
  def index
    @todos = %w{todo1 todo2 todo3}
    render_react_component "TodoList", {:todos => @todos}, :prerender => true
  end
end

[facebook-github-bot]

Thank you for your pull request and welcome to our community. We require contributors to sign our Contributor License Agreement, and we don't seem to have you on file. In order for us to review and merge your code, please sign up at https://code.facebook.com/cla - and if you have received this in error or have any questions, please drop us a line at [email protected]. Thanks!

[facebook-github-bot]

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Facebook open source project. Thanks!

[rmosolgo]

Should this go in an active support hook?

See for example how react-rails includes the view helper, also here's an ActionController example

[garbles]

Good idea. Done here 2cc9748

[rmosolgo]

👍 Although I don't have a place to use it, I think this is a fitting feature. It would be nice if took a :layout option (or maybe even :status?) like render does.

Also, before merging, it should be added to the readme!

[vipulnsward]

We can just merge in passed options and send to render, so someone can easily override layout/ status or other render options.

[garbles]

garbles@adec41d

[vipulnsward]

I think this is pretty useful, as more people are using complete view contents to be served from a React Component, although this deviates from semantics of render and hides render call under magical render_react_component. A good alternative would be to just support:

render inline: react_component('TodoList'), layout: 'my_layout'

[rmosolgo]

@vipulnsward that is nice, react_component(...) in the controller keeps the API surface area down too, good for my brain :)

[garbles]

@vipulnsward That's an idea, but I'd rather not have to specify the layout for every action. By default rendering inline will not use a layout.

[zpao]

Are there other "renderers" out there that we can mimic for API? Personally I also find piggybacking on Rails' render a bit nicer and gives a bit more option value.

I'd rather not have to specify the layout for every action

Can't you just specify it once in the controller? layout false Or even layout false, :except => ['index']

[garbles]

Are there other "renderers" out there that we can mimic for API?

@zpao I could probably make something like that work. Would rather use a custom renderer than calling render inline: react_component(...), layout: .... What about this:

render component: "TodoList", data: {...}, options: { prerender: true }, layout: ..., status: ...

(layout and status are optional, of course)

Can't you just specify it once in the controller? layout false Or even layout false, :except => ['index']

:inline will ignore the layout unless explicitly stated with the :layout option AFAIK.

/cc @rmosolgo @vipulnsward