Module: ReactOnRails::ProHelper

Included in:
Helper
Defined in:
lib/react_on_rails/pro_helper.rb

Instance Method Summary collapse

Instance Method Details

#generate_component_script(render_options) ⇒ Object

Generates the complete component specification script tag. For Pro users, includes an inline script for immediate hydration during streaming.



7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
 
# File 'lib/react_on_rails/pro_helper.rb', line 7

def generate_component_script(render_options)
  # Setup the page_loaded_js, which is the same regardless of prerendering or not!
  # The reason is that React is smart about not doing extra work if the server rendering did its job.
  component_specification_tag = content_tag(:script,
                                            json_safe_and_pretty(render_options.client_props).html_safe,
                                            type: "application/json",
                                            class: "js-react-on-rails-component",
                                            id: "js-react-on-rails-component-#{render_options.dom_id}",
                                            "data-component-name" => render_options.react_component_name,
                                            "data-trace" => (render_options.trace ? true : nil),
                                            "data-dom-id" => render_options.dom_id,
                                            "data-store-dependencies" =>
                                              render_options.store_dependencies&.to_json)

  # Add immediate invocation script for Pro users to enable hydration during streaming
  spec_tag = if ReactOnRails::Utils.react_on_rails_pro?
               # Escape dom_id for JavaScript context
               escaped_dom_id = escape_javascript(render_options.dom_id)
               nonce = csp_nonce
               script_options = nonce.present? ? { nonce: nonce } : {}
               immediate_script = content_tag(:script, %(
      typeof ReactOnRails === 'object' && ReactOnRails.reactOnRailsComponentLoaded('#{escaped_dom_id}');
    ).html_safe, script_options)
               "#{component_specification_tag}\n#{immediate_script}"
             else
               component_specification_tag
             end

  spec_tag.html_safe
end

#generate_store_script(redux_store_data) ⇒ Object

Generates the complete store hydration script tag. For Pro users, includes an inline script for immediate hydration during streaming.



40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
 
# File 'lib/react_on_rails/pro_helper.rb', line 40

def generate_store_script(redux_store_data)
  store_hydration_data = content_tag(:script,
                                     json_safe_and_pretty(redux_store_data[:props]).html_safe,
                                     type: "application/json",
                                     "data-js-react-on-rails-store" => redux_store_data[:store_name])

  # Add immediate invocation script for Pro users to enable hydration during streaming
  store_hydration_scripts = if ReactOnRails::Utils.react_on_rails_pro?
                              # Escape store_name for JavaScript context
                              escaped_store_name = escape_javascript(redux_store_data[:store_name])
                              nonce = csp_nonce
                              script_options = nonce.present? ? { nonce: nonce } : {}
                              immediate_script = content_tag(
                                :script,
                                <<~JS.html_safe,
                                  typeof ReactOnRails === 'object' && ReactOnRails.reactOnRailsStoreLoaded('#{escaped_store_name}');
                                JS
                                script_options
                              )
                              "#{store_hydration_data}\n#{immediate_script}"
                            else
                              store_hydration_data
                            end

  store_hydration_scripts.html_safe
end