isomorfeus-react 16.10.0 → 16.10.1

data/lib/isomorfeus/props/validate_hash_proxy.rb

@@ -0,0 +1,178 @@
+module Isomorfeus
+  module Props
+    class ValidateHashProxy
+      def initialize
+        @validation_hash = { required: true, validate: {} }
+      end
+
+      def is
+        self
+      end
+      alias_method :and, :is
+      alias_method :has, :is
+      alias_method :with, :is
+
+      def cast
+        @validation_hash[:cast] = true
+        self
+      end
+
+      def default(v)
+        @validation_hash[:required] = false
+        @validation_hash[:default] = v
+        self
+      end
+
+      def ensure(v = nil, &block)
+        if block_given?
+          @validation_hash[:ensure_block] = block
+        else
+          @validation_hash[:ensure] = v
+        end
+        self
+      end
+
+      def exact_class(t_class)
+        @validation_hash[:class] = t_class
+        self
+      end
+
+      def greater_than(v)
+        @validation_hash[:validate][:gt] = v
+        self
+      end
+      alias_method :gt, :greater_than
+
+      def is_a(i_class)
+        @validation_hash[:is_a] = i_class
+        self
+      end
+
+      def keys(*keys)
+        @validation_hash[:validate][:hash_keys] = keys
+        self
+      end
+
+      def size(l)
+        @validation_hash[:validate][:size] = v
+        self
+      end
+      alias_method :length, :size
+
+      def less_than(v)
+        @validation_hash[:validate][:lt] = v
+        self
+      end
+      alias_method :lt, :less_than
+
+      def matches(regexp)
+        @validation_hash[:validate][:matches] = regexp
+        self
+      end
+
+      def max(l)
+        @validation_hash[:validate][:max] = l
+        self
+      end
+
+      def max_size(l)
+        @validation_hash[:validate][:max_size] = l
+        self
+      end
+      alias_method :max_length, :max_size
+
+      def min(l)
+        @validation_hash[:validate][:min] = l
+        self
+      end
+
+      def min_size(l)
+        @validation_hash[:validate][:min_size] = l
+        self
+      end
+      alias_method :min_length, :min_size
+
+      def negative
+        @validation_hash[:validate][:direction] = :negative
+        self
+      end
+
+      def optional
+        @validation_hash[:required] = false
+        self
+      end
+
+      def positive
+        @validation_hash[:validate][:direction] = :positive
+        self
+      end
+
+      def required
+        @validation_hash[:required] = true
+        self
+      end
+
+      def test(&block)
+        @validation_hash[:validate][:test] = block
+        self
+      end
+      alias_method :condition, :test
+      alias_method :check, :test
+
+      # types
+
+      def Array
+        @validation_hash[:class] = Array
+        self
+      end
+
+      def Boolean
+        @validation_hash[:type] = :boolean
+        self
+      end
+
+      def Enumerable
+        @validation_hash[:is_a] = Enumerable
+        self
+      end
+
+      def Float
+        @validation_hash[:class] = Float
+        self
+      end
+
+      def Hash
+        @validation_hash[:class] = Hash
+        self
+      end
+
+      def Integer
+        @validation_hash[:class] = Integer
+        self
+      end
+
+      def String
+        @validation_hash[:class] = String
+        self
+      end
+
+      # sub types
+
+      def Email
+        @validation_hash[:type] = :string
+        @validation_hash[:validate][:sub_type] = :email
+        self
+      end
+
+      def Url
+        @validation_hash[:type] = :string
+        @validation_hash[:validate][:sub_type] = :url
+        self
+      end
+
+      def to_h
+        @validation_hash
+      end
+    end
+  end
+end

data/lib/isomorfeus/props/validator.rb

@@ -0,0 +1,131 @@
+module Isomorfeus
+  module Props
+    class Validator
+      def initialize(source_class, prop, value, options)
+        @c = source_class
+        @p = prop
+        @v = value
+        @o = options
+      end
+
+      def validate!
+        ensured = ensure!
+        unless ensured
+          cast!
+          type!
+        end
+        run_checks!
+        true
+      end
+
+      private
+
+      # basic tests
+
+      def cast!
+        if @o.key?(:cast)
+          begin
+            @v = case @o[:class]
+                 when Integer then @v.to_i
+                 when String then @v.to_s
+                 when Float then @v.to_f
+                 when Array then @v.to_a
+                 when Hash then @v.to_h
+                 end
+            @v = !!@v if @o[:type] == :boolean
+          rescue
+            raise "#{@c}: #{@p} cast failed" unless @v.class == @o[:class]
+          end
+        end
+      end
+
+      def ensure!
+        if @o.key?(:ensure)
+          @v = @o[:ensure] unless @v
+          true
+        elsif @o.key?(:ensure_block)
+          @v = @o[:ensure_block].call(@v)
+          true
+        else
+          false
+        end
+      end
+
+      def type!
+        if @o.key?(:class)
+          raise "#{@c}: #{@p} class not #{@o[:class]}" unless @v.class == @o[:class]
+        elsif @o.key?(:is_a)
+          raise "#{@c}: #{@p} is not a #{@o[:is_a]}" unless @v.is_a?(@o[:is_a])
+        elsif @o.key?(:type)
+          case @o[:type]
+          when :boolean
+            raise "#{@c}: #{@p} is not a boolean" unless @v.class == TrueClass || @v.class == FalseClass
+          end
+        end
+      end
+
+      # all other checks
+
+      def run_checks!
+        if @o.key?(:validate)
+          @o[:validate].each do |m, l|
+            send('c_' + m, l)
+          end
+        end
+      end
+
+      # specific validations
+      def c_gt(v)
+        raise "#{@c}: #{@p} not greater than #{v}!" unless @v > v
+      end
+
+      def c_lt(v)
+        raise "#{@c}: #{@p} not less than #{v}!" unless @v < v
+      end
+
+      def c_keys(v)
+        raise "#{@c}: #{@p} keys dont fit!" unless @v.keys.sort == v.sort
+      end
+
+      def c_size(v)
+        raise "#{@c}: #{@p} length/size is not #{v}" unless @v.size == v
+      end
+
+      def c_matches(v)
+        raise "#{@c}: #{@p} does not match #{v}" unless v.match?(@v)
+      end
+
+      def c_max(v)
+        raise "#{@c}: #{@p} is larger than #{v}" unless @v <= v
+      end
+
+      def c_min(v)
+        raise "#{@c}: #{@p} is smaller than #{v}" unless @v >= v
+      end
+
+      def c_max_size(v)
+        raise "#{@c}: #{@p} is larger than #{v}" unless @v.size <= v
+      end
+
+      def c_min_size(v)
+        raise "#{@c}: #{@p} is smaller than #{v}" unless @v.size >= v
+      end
+
+      def c_direction(v)
+        raise "#{@c}: #{@p} is positive" if v == :negative && @v >= 0
+        raise "#{@c}: #{@p} is negative" if v == :positive && @v < 0
+      end
+
+      def c_test
+        raise "#{@c}: #{@p} test condition check failed" unless @o[:test].call(@v)
+      end
+
+      def c_sub_type(v)
+        case v
+        when :email
+        when :url
+        end
+      end
+    end
+  end
+end

data/lib/isomorfeus/react_view_helper.rb

@@ -0,0 +1,130 @@
+module Isomorfeus
+  module ReactViewHelper
+    def mount_component(component_name, props = {}, asset = 'application_ssr.js')
+      @ssr_response_status = nil
+      @ssr_styles = nil
+      thread_id_asset = "#{Thread.current.object_id}#{asset}"
+      render_result = "<div data-iso-env=\"#{Isomorfeus.env}\" data-iso-root=\"#{component_name}\" data-iso-props='#{Oj.dump(props, mode: :strict)}'"
+      if Isomorfeus.server_side_rendering
+
+        # initialize speednode context
+        unless Isomorfeus.ssr_contexts.key?(thread_id_asset)
+          asset_file_name = OpalWebpackLoader::Manifest.lookup_path_for(asset)
+          asset_path = File.join('public', asset_file_name)
+          Isomorfeus.ssr_contexts[thread_id_asset] = ExecJS.permissive_compile(File.read(asset_path))
+        end
+
+        # build javascript for rendering first pass
+        javascript = <<~JAVASCRIPT
+          global.FirstPassFinished = false;
+          global.Opal.Isomorfeus['$env=']('#{Isomorfeus.env}');
+          if (typeof global.Opal.Isomorfeus.$negotiated_locale === 'function') {
+            global.Opal.Isomorfeus["$negotiated_locale="]('#{props[:locale]}');
+          }
+          global.Opal.Isomorfeus['$force_init!']();
+          global.Opal.Isomorfeus['$ssr_response_status='](200);
+          global.Opal.Isomorfeus.TopLevel['$ssr_route_path=']('#{props[:location]}');
+        JAVASCRIPT
+
+        # if location_host and scheme are given and if Transport is loaded, connect and then render, otherwise do not render
+        ws_scheme = props[:location_scheme] == 'https:' ? 'wss:' : 'ws:'
+        location_host = props[:location_host] ? props[:location_host] : 'localhost'
+        api_ws_path = Isomorfeus.respond_to?(:api_websocket_path) ? Isomorfeus.api_websocket_path : ''
+        transport_ws_url = ws_scheme + location_host + api_ws_path
+        javascript << <<~JAVASCRIPT
+          var api_ws_path = '#{api_ws_path}';
+          if (typeof global.Opal.Isomorfeus.Transport !== 'undefined' && api_ws_path !== '') {
+            global.Opal.Isomorfeus.TopLevel["$transport_ws_url="]("#{transport_ws_url}");
+            global.Opal.send(global.Opal.Isomorfeus.Transport.$promise_connect(), 'then', [], ($$1 = function(){
+              try {
+                global.Opal.Isomorfeus.TopLevel.$render_component_to_string('#{component_name}', #{Oj.dump(props, mode: :strict)});
+                global.FirstPassFinished = 'transport';
+              } catch (e) { global.FirstPassFinished = 'transport'; }
+            }, $$1.$$s = this, $$1.$$arity = 0, $$1))
+          } else { return global.FirstPassFinished = true; };
+        JAVASCRIPT
+
+        # execute first render pass
+        first_pass_skipped = Isomorfeus.ssr_contexts[thread_id_asset].exec(javascript)
+
+        # wait for first pass to finish
+        unless first_pass_skipped
+          first_pass_finished = Isomorfeus.ssr_contexts[thread_id_asset].exec('return global.FirstPassFinished')
+          unless first_pass_finished
+            start_time = Time.now
+            while !first_pass_finished
+              break if (Time.now - start_time) > 10
+              sleep 0.01
+              first_pass_finished = Isomorfeus.ssr_contexts[thread_id_asset].exec('return global.FirstPassFinished')
+            end
+          end
+
+          # wait for transport requests to finish
+          if first_pass_finished == 'transport'
+            transport_busy = Isomorfeus.ssr_contexts[thread_id_asset].exec('return global.Opal.Isomorfeus.Transport["$busy?"]()')
+            if transport_busy
+              start_time = Time.now
+              while transport_busy
+                break if (Time.now - start_time) > 10
+                sleep 0.01
+                transport_busy = Isomorfeus.ssr_contexts[thread_id_asset].exec('return global.Opal.Isomorfeus.Transport["$busy?"]()')
+              end
+            end
+          end
+        end
+
+        # build javascript for second render pass
+        javascript = <<~JAVASCRIPT
+          let rendered_tree;
+          let ssr_styles;
+          let component;
+          if (typeof global.Opal.global.MuiStyles !== 'undefined' && typeof global.Opal.global.MuiStyles.ServerStyleSheets !== 'undefined') {
+            component = '#{component_name}'.split(".").reduce(function(o, x) {
+              return (o !== null && typeof o[x] !== "undefined" && o[x] !== null) ? o[x] : null;
+            }, global.Opal.global)
+            if (!component) { component = global.Opal.Isomorfeus.$cached_component_class('#{component_name}'); }
+            let sheets = new global.Opal.global.MuiStyles.ServerStyleSheets();
+            let app = global.Opal.React.$create_element(component, global.Opal.Hash.$new(#{Oj.dump(props, mode: :strict)}));
+            rendered_tree = global.Opal.global.ReactDOMServer.renderToString(sheets.collect(app));
+            ssr_styles = sheets.toString();
+          } else if (typeof global.Opal.global.ReactJSS !== 'undefined' && typeof global.Opal.global.ReactJSS.SheetsRegistry !== 'undefined') {
+            component = '#{component_name}'.split(".").reduce(function(o, x) {
+              return (o !== null && typeof o[x] !== "undefined" && o[x] !== null) ? o[x] : null;
+            }, global.Opal.global)
+            if (!component) { component = global.Opal.Isomorfeus.$cached_component_class('#{component_name}'); }
+            let sheets = new global.Opal.global.ReactJSS.SheetsRegistry();
+            let generate_id = global.Opal.global.ReactJSS.createGenerateId();
+            let app = global.Opal.React.$create_element(component, global.Opal.Hash.$new(#{Oj.dump(props, mode: :strict)}));
+            let element = global.Opal.global.React.createElement(global.Opal.global.ReactJSS.JssProvider, { registry: sheets, generateId: generate_id }, app);
+            rendered_tree = global.Opal.global.ReactDOMServer.renderToString(element);
+            ssr_styles = sheets.toString();
+          } else {
+            rendered_tree = global.Opal.Isomorfeus.TopLevel.$render_component_to_string('#{component_name}', #{Oj.dump(props, mode: :strict)});
+          }
+          let application_state = global.Opal.Isomorfeus.store.native.getState();
+          if (typeof global.Opal.Isomorfeus.Transport !== 'undefined') { global.Opal.Isomorfeus.Transport.$disconnect(); }
+          return [rendered_tree, application_state, ssr_styles, global.Opal.Isomorfeus['$ssr_response_status']()];
+        JAVASCRIPT
+
+        # execute second render pass
+        rendered_tree, application_state, @ssr_styles, @ssr_response_status = Isomorfeus.ssr_contexts[thread_id_asset].exec(javascript)
+
+        # build result
+        render_result << " data-iso-nloc='#{props[:locale]}' data-iso-state='#{Oj.dump(application_state, mode: :strict)}'>"
+        render_result << rendered_tree
+      else
+        render_result << " data-iso-nloc='#{props[:locale]}'>"
+      end
+      render_result << '</div>'
+      render_result
+    end
+
+    def ssr_response_status
+      @ssr_response_status || 200
+    end
+
+    def ssr_styles
+      @ssr_styles || ''
+    end
+  end
+end

data/lib/isomorfeus/top_level.rb

@@ -0,0 +1,86 @@
+module Isomorfeus
+  class TopLevel
+    class << self
+      def mount!
+        Isomorfeus.init
+        Isomorfeus::TopLevel.on_ready do
+          root_element = `document.querySelector('div[data-iso-root]')`
+          component_name = root_element.JS.getAttribute('data-iso-root')
+          Isomorfeus.env = root_element.JS.getAttribute('data-iso-env')
+          component = nil
+          begin
+            component = component_name.constantize
+          rescue Exception
+            @timeout_start = Time.now unless @timeout_start
+            if (Time.now - @timeout_start) < 10
+              `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 100)`
+            else
+              `console.error("Unable to mount '" + #{component_name} + "'!")`
+            end
+          end
+          if component
+            props_json = root_element.JS.getAttribute('data-iso-props')
+            props = `Opal.Hash.$new(JSON.parse(props_json))`
+            hydrated = root_element.JS.getAttribute('data-iso-hydrated')
+            state_json = root_element.JS.getAttribute('data-iso-state')
+            if state_json
+              %x{
+                var state = JSON.parse(state_json);
+                var keys = Object.keys(state);
+                for(var i=0; i < keys.length; i++) {
+                  global.Opal.Isomorfeus.store.native.dispatch({ type: keys[i].toUpperCase(), set_state: state[keys[i]] });
+                }
+              }
+            end
+            begin
+              Isomorfeus::TopLevel.mount_component(component, props, root_element, hydrated)
+            rescue Exception
+              @timeout_start = Time.now unless @timeout_start
+              if (Time.now - @timeout_start) < 10
+                `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 100)`
+              else
+                `console.error("Unable to mount '" + #{component_name} + "'!")`
+              end
+            end
+          end
+        end
+      end
+
+      def on_ready(&block)
+        # this looks a bit odd but works across _all_ browsers, and no event handler mess
+        %x{
+          function run() { block.$call() };
+          function ready_fun() {
+            /in/.test(document.readyState) ? setTimeout(ready_fun,5) : run();
+          }
+          ready_fun();
+        }
+      end
+
+      def on_ready_mount(component, props = nil, element_query = nil)
+        # init in case it hasn't been run yet
+        Isomorfeus.init
+        on_ready do
+          Isomorfeus::TopLevel.mount_component(component, props, element_query)
+        end
+      end
+
+      def mount_component(component, props, element_or_query, hydrated = false)
+        if `(typeof element_or_query === 'string')` || (`(typeof element_or_query.$class === 'function')` && element_or_query.class == String)
+          element = `document.body.querySelector(element_or_query)`
+        elsif `(typeof element_or_query.$is_a === 'function')` && element_or_query.is_a?(Browser::Element)
+          element = element_or_query.to_n
+        else
+          element = element_or_query
+        end
+
+        top = if hydrated
+                ReactDOM.hydrate(React.create_element(component, props), element)
+              else
+                ReactDOM.render(React.create_element(component, props), element)
+              end
+        Isomorfeus.top_component = top if top
+      end
+    end
+  end
+end