Merge pull request #47 from cortex-cms/react-foundation

Alex Tharp · web-flow · commit 02cecd36c4e6 · 2017-02-23T11:35:02.000-06:00
React Foundation
diff --git a/.gitignore b/.gitignore
@@ -1,10 +1,68 @@
+# See https://help.github.com/articles/ignoring-files for more about ignoring files.
+#
+# If you find yourself ignoring temporary files generated by your text editor
+# or operating system, you probably want to add a global ignore instead:
+#   git config --global core.excludesfile '~/.gitignore_global'
+
+# Ignore bundler config.
+/.bundle
+/vendor/bundle
+/vendor/assets
+
+# Ignore the default SQLite database.
+/db/*.sqlite3
+/db/*.sqlite3-journal
+
+# Ignore all logfiles and tempfiles.
+/log/*.log
+/tmp
+
+# Debug
+.byebug_history
+
+# OS Files
+.DS_Store
+._.DS_Store
+.directory
+
+# Text-editor/IDE generated files
+*.sublime-workspace
+*.sublime-project
+/.idea
+*.iml
+
+*.rbc
+*.sassc
+.sass-cache
+capybara-*.html
+.powrc
+/public/system
+/coverage/
+/spec/tmp
+**.orig
+rerun.txt
+.env
+
 Gemfile.lock
-.bundle/
-log/*.log
-pkg/
+.ruby-version
+.ruby-gemset
+
+# unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
+.rvmrc
+
+# React on Rails
+npm-debug.log*
+node_modules
+
+# Generated js bundles
+/app/assets/webpack/*
+
+# Test app
 test/dummy/db/*.sqlite3
 test/dummy/db/*.sqlite3-journal
 test/dummy/log/*.log
 test/dummy/tmp/
-.idea/
+
+# build artifacts
 *.gem
+pkg/
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,22 @@
+CHANGELOG.md
+Gemfile
+README.md
+app
+coverage
+docs
+examples
+node_modules
+react_on_rails.gemspec
+Dockerfile_tests
+Gemfile.lock
+Rakefile
+bin
+docker-compose.yml
+etc
+lib
+rakelib
+ruby-lint.yml
+spec
+node_modules
+tmp
+gen-examples
diff --git a/app/cells/plugins/core/cell.rb b/app/cells/plugins/core/cell.rb
@@ -1,6 +1,8 @@
 module Plugins
   module Core
     class Cell < FieldCell
+      include ReactOnRailsHelper
+
       view_paths << "#{Cortex::Plugins::Core::Engine.root}/app/cells"
 
       def required?
diff --git a/app/cells/plugins/core/react_test/show.haml b/app/cells/plugins/core/react_test/show.haml
@@ -0,0 +1 @@
+= react_component("HelloWorld2App", props: hello_world_props)
diff --git a/app/cells/plugins/core/react_test_cell.rb b/app/cells/plugins/core/react_test_cell.rb
@@ -0,0 +1,15 @@
+module Plugins
+  module Core
+    class ReactTestCell < Plugins::Core::Cell
+      def show
+        render
+      end
+
+      private
+
+      def hello_world_props
+        { name: 'Stranger' }
+      end
+    end
+  end
+end
diff --git a/config/initializers/react_on_rails.rb b/config/initializers/react_on_rails.rb
@@ -0,0 +1,3 @@
+ActiveSupport.on_load(:action_view) do
+  include ReactOnRailsHelper
+end
diff --git a/cortex-plugins-core.gemspec b/cortex-plugins-core.gemspec
@@ -17,6 +17,7 @@ Gem::Specification.new do |s|
   s.files = Dir["{app,config,db,lib}/**/*", "LICENSE.md", "Rakefile", "README.md"]
 
   s.add_dependency "rails", ">= 4"
+  s.add_dependency "react_on_rails", "~> 6"
   s.add_dependency "cells", "~> 4.1"
   s.add_dependency "cells-rails", "~> 0.0.6"
   s.add_dependency "cells-haml", "~> 0.0.10"
diff --git a/lib/cortex/plugins/core/engine.rb b/lib/cortex/plugins/core/engine.rb
@@ -1,4 +1,5 @@
 require 'jsonb_accessor'
+require 'react_on_rails'
 
 module Cortex
   module Plugins
diff --git a/lib/cortex/plugins/core/version.rb b/lib/cortex/plugins/core/version.rb
@@ -1,7 +1,7 @@
 module Cortex
   module Plugins
     module Core
-      VERSION = '0.10.4'
+      VERSION = '0.11.0'
     end
   end
 end
diff --git a/node_package/.babelrc b/node_package/.babelrc
@@ -0,0 +1,3 @@
+{
+  "presets": ["es2015", "stage-0", "react"]
+}
diff --git a/node_package/actions/helloWorld2ActionCreators.jsx b/node_package/actions/helloWorld2ActionCreators.jsx
@@ -0,0 +1,8 @@
+/* eslint-disable import/prefer-default-export */
+
+import { HELLO_WORLD2_NAME_UPDATE } from '../constants/helloWorld2Constants';
+
+export const updateName = (text) => ({
+  type: HELLO_WORLD2_NAME_UPDATE,
+  text,
+});
diff --git a/node_package/components/HelloWorld2.jsx b/node_package/components/HelloWorld2.jsx
@@ -0,0 +1,28 @@
+import React, { PropTypes } from 'react';
+
+const HelloWorld2 = ({ name, updateName }) => (
+  <div>
+    <h3>
+      Hello2, {name}!
+    </h3>
+    <hr />
+    <form >
+      <label htmlFor="name">
+        Say hello2 to:
+      </label>
+      <input
+        id="name"
+        type="text"
+        value={name}
+        onChange={(e) => updateName(e.target.value)}
+      />
+    </form>
+  </div>
+);
+
+HelloWorld2.propTypes = {
+  name: PropTypes.string.isRequired,
+  updateName: PropTypes.func.isRequired,
+};
+
+export default HelloWorld2;
diff --git a/node_package/constants/helloWorld2Constants.jsx b/node_package/constants/helloWorld2Constants.jsx
@@ -0,0 +1,3 @@
+/* eslint-disable import/prefer-default-export */
+
+export const HELLO_WORLD2_NAME_UPDATE = 'HELLO_WORLD2_NAME_UPDATE';
diff --git a/node_package/containers/HelloWorld2Container.jsx b/node_package/containers/HelloWorld2Container.jsx
@@ -0,0 +1,13 @@
+// Simple example of a React "smart" component
+
+import { connect } from 'react-redux';
+import HelloWorld2 from '../components/HelloWorld2';
+import * as actions from '../actions/helloWorld2ActionCreators';
+
+// Which part of the Redux global state does our component want to receive as props?
+const mapStateToProps = (state) => ({ name: state.name });
+
+// Don't forget to actually use connect!
+// Note that we don't export HelloWorld2, but the redux "connected" version of it.
+// See https://github.com/reactjs/react-redux/blob/master/docs/api.md#examples
+export default connect(mapStateToProps, actions)(HelloWorld2);
diff --git a/node_package/reducers/helloWorld2Reducer.jsx b/node_package/reducers/helloWorld2Reducer.jsx
@@ -0,0 +1,15 @@
+import { combineReducers } from 'redux';
+import { HELLO_WORLD2_NAME_UPDATE } from '../constants/helloWorld2Constants';
+
+const name = (state = '', action) => {
+  switch (action.type) {
+    case HELLO_WORLD2_NAME_UPDATE:
+      return action.text;
+    default:
+      return state;
+  }
+};
+
+const helloWorld2Reducer = combineReducers({ name });
+
+export default helloWorld2Reducer;
diff --git a/node_package/startup/HelloWorld2App.jsx b/node_package/startup/HelloWorld2App.jsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import { Provider } from 'react-redux';
+
+import configureStore from '../store/helloWorld2Store';
+import HelloWorld2Container from '../containers/HelloWorld2Container';
+
+// See documentation for https://github.com/reactjs/react-redux.
+// This is how you get props from the Rails view into the redux store.
+// This code here binds your smart component to the redux store.
+// railsContext provides contextual information especially useful for server rendering, such as
+// knowing the locale. See the React on Rails documentation for more info on the railsContext
+const HelloWorld2App = (props, _railsContext) => (
+  <Provider store={configureStore(props)}>
+    <HelloWorld2Container />
+  </Provider>
+);
+
+export default HelloWorld2App;
diff --git a/node_package/startup/registration.jsx b/node_package/startup/registration.jsx
@@ -0,0 +1,8 @@
+import ReactOnRails from 'react-on-rails';
+
+import HelloWorld2App from './HelloWorld2App';
+
+// This is how react_on_rails can see the HelloWorld2 in the browser.
+ReactOnRails.register({
+  HelloWorld2App,
+});
diff --git a/node_package/store/helloWorld2Store.jsx b/node_package/store/helloWorld2Store.jsx
@@ -0,0 +1,8 @@
+import { createStore } from 'redux';
+import helloWorld2Reducer from '../reducers/helloWorld2Reducer';
+
+const configureStore = (railsProps) => (
+  createStore(helloWorld2Reducer, railsProps)
+);
+
+export default configureStore;
diff --git a/package.json b/package.json
@@ -0,0 +1,42 @@
+{
+  "name": "cortex-plugins-core",
+  "version": "0.11.0",
+  "main": "node_package/startup/registration.jsx",
+  "homepage": "https://github.com/cortex-cms/cortex-plugins-core",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/cortex-cms/cortex-plugins-core.git"
+  },
+  "keywords": ["cortex", "cms", "plugins", "core"],
+  "author": "EmployerSiteContentProducts@cb.com",
+  "license": "Apache-2.0",
+  "engines": {
+    "node": "7.4.0",
+    "npm": "4.1.1"
+  },
+  "cacheDirectories": [
+    "node_modules"
+  ],
+  "peerDependencies": {
+    "babel-cli": "*",
+    "babel-core": "*",
+    "babel-loader": "*",
+    "babel-polyfill": "*",
+    "babel-preset-es2015": "*",
+    "babel-preset-react": "*",
+    "babel-preset-stage-0": "*",
+    "babel-runtime": "*",
+    "es5-shim": "*",
+    "expose-loader": "*",
+    "imports-loader": "*",
+    "react": "*",
+    "react-dom": "*",
+    "react-on-rails": "*",
+    "react-redux": "*",
+    "redux": "*",
+    "webpack": "*"
+  },
+  "files": [
+    "node_package"
+  ]
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+= react_component("HelloWorld2App", props: hello_world_props)`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+ActiveSupport.on_load(:action_view) do`
	`2`	`+ include ReactOnRailsHelper`
	`3`	`+end`
Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`require 'jsonb_accessor'`
	`2`	`+require 'react_on_rails'`
`2`	`3`
`3`	`4`	`module Cortex`
`4`	`5`	`module Plugins`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+{`
	`2`	`+ "presets": ["es2015", "stage-0", "react"]`
	`3`	`+}`