refactor: adopt client/server component structure per documentation

Author: ihabadham

lib/generators/react_on_rails/base_generator.rb

@@ -44,7 +44,6 @@ def copy_base_files
       def copy_js_bundle_files
         base_path = "base/base/"
         base_files = %w[app/javascript/packs/server-bundle.js
-                        app/javascript/src/HelloWorld/HelloWorldServer.js
                         app/javascript/src/HelloWorld/HelloWorld.module.css]
         base_files.each { |file| copy_file("#{base_path}#{file}", file) }
       end

lib/generators/react_on_rails/react_no_redux_generator.rb

@@ -12,7 +12,8 @@ class ReactNoReduxGenerator < Rails::Generators::Base
 
       def copy_base_files
         base_js_path = "base/base"
-        base_files = %w[app/javascript/src/HelloWorld/ror_components/HelloWorld.jsx]
+        base_files = %w[app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx
+                        app/javascript/src/HelloWorld/ror_components/HelloWorld.server.jsx]
         base_files.each { |file| copy_file("#{base_js_path}/#{file}", file) }
       end
 

lib/generators/react_on_rails/react_with_redux_generator.rb

@@ -20,14 +20,17 @@ def copy_base_files
         base_files.each { |file| copy_file("#{base_js_path}/#{file}", file) }
 
         # Also copy Redux-connected component to auto-registration structure
-        copy_file("#{base_js_path}/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.jsx",
-                  "app/javascript/src/HelloWorld/ror_components/HelloWorld.jsx")
+        copy_file("#{base_js_path}/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.client.jsx",
+                  "app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx")
+        copy_file("#{base_js_path}/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.server.jsx",
+                  "app/javascript/src/HelloWorld/ror_components/HelloWorld.server.jsx")
         copy_file("#{base_js_path}/app/javascript/bundles/HelloWorld/components/HelloWorld.module.css",
                   "app/javascript/src/HelloWorld/HelloWorld.module.css")
 
-        ror_component_file = "app/javascript/src/HelloWorld/ror_components/HelloWorld.jsx"
-        gsub_file(ror_component_file, "../store/helloWorldStore", "../../../bundles/HelloWorld/store/helloWorldStore")
-        gsub_file(ror_component_file, "../containers/HelloWorldContainer",
+        # Update import paths in client component
+        ror_client_file = "app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx"
+        gsub_file(ror_client_file, "../store/helloWorldStore", "../../../bundles/HelloWorld/store/helloWorldStore")
+        gsub_file(ror_client_file, "../containers/HelloWorldContainer",
                   "../../../bundles/HelloWorld/containers/HelloWorldContainer")
       end
 
@@ -38,7 +41,8 @@ def copy_base_redux_files
            constants/helloWorldConstants.js
            reducers/helloWorldReducer.js
            store/helloWorldStore.js
-           startup/HelloWorldApp.jsx].each do |file|
+           startup/HelloWorldApp.client.jsx
+           startup/HelloWorldApp.server.jsx].each do |file|
              copy_file("#{base_hello_world_path}/#{file}",
                        "app/javascript/bundles/HelloWorld/#{file}")
            end
@@ -49,7 +53,7 @@ def create_appropriate_templates
         base_js_path = "#{base_path}/app/javascript"
         config = {
           component_name: "HelloWorld",
-          app_relative_path: "../bundles/HelloWorld/startup/HelloWorldApp"
+          app_relative_path: "../bundles/HelloWorld/startup/HelloWorldApp.client"
         }
 
         template("#{base_js_path}/packs/registration.js.tt", "app/javascript/packs/hello-world-bundle.js", config)

lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.jsx renamed to lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx

@@ -1,4 +1,4 @@
-import HelloWorld from './ror_components/HelloWorld';
+import HelloWorld from './HelloWorld.client';
 // This could be specialized for server rendering
 // For example, if using React Router, we'd have the SSR setup here.
 

lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/HelloWorldServer.js renamed to lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.server.jsx

@@ -0,0 +1,5 @@
+import HelloWorld from './HelloWorld.client';
+// This could be specialized for server rendering
+// For example, if using React Router, we'd have the SSR setup here.
+
+export default HelloWorld;

lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.jsx renamed to lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.client.jsx

@@ -23,7 +23,8 @@
        Procfile.dev-static-assets
        Procfile.dev-prod-assets].each { |file| assert_file(file) }
 
-    # Auto-registration component is always created
-    assert_file "app/javascript/src/HelloWorld/ror_components/HelloWorld.jsx"
+    # Auto-registration components are always created
+    assert_file "app/javascript/src/HelloWorld/ror_components/HelloWorld.client.jsx"
+    assert_file "app/javascript/src/HelloWorld/ror_components/HelloWorld.server.jsx"
   end
 end

lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.server.jsx

@@ -7,7 +7,7 @@
 
   it "creates appropriate templates" do
     assert_file("app/javascript/packs/hello-world-bundle.js") do |contents|
-      expect(contents).to match("import HelloWorld from '../bundles/HelloWorld/startup/HelloWorldApp';")
+      expect(contents).to match("import HelloWorld from '../bundles/HelloWorld/startup/HelloWorldApp.client';")
     end
     assert_file("app/views/hello_world/index.html.erb") do |contents|
       expect(contents).to match(/"HelloWorld"/)
@@ -20,6 +20,7 @@
        app/javascript/bundles/HelloWorld/constants/helloWorldConstants.js
        app/javascript/bundles/HelloWorld/reducers/helloWorldReducer.js
        app/javascript/bundles/HelloWorld/store/helloWorldStore.js
-       app/javascript/bundles/HelloWorld/startup/HelloWorldApp.jsx].each { |file| assert_file(file) }
+       app/javascript/bundles/HelloWorld/startup/HelloWorldApp.client.jsx
+       app/javascript/bundles/HelloWorld/startup/HelloWorldApp.server.jsx].each { |file| assert_file(file) }
   end
 end