extra hyper-store reference to be fixed

Author: catmando

ruby/examples/docs/home-page/Gemfile.lock

@@ -1,9 +1,9 @@
 PATH
   remote: ../../../hyper-component
   specs:
-    hyper-component (0.1)
-      hyper-state (= 0.1)
-      hyperstack-config (= 0.1)
+    hyper-component (1.0.alpha1.1)
+      hyper-state (= 1.0.alpha1.1)
+      hyperstack-config (= 1.0.alpha1.1)
       libv8 (~> 6.3.0)
       mini_racer (~> 0.1.15)
       opal (>= 0.11.0, < 0.12.0)
@@ -13,7 +13,7 @@ PATH
 PATH
   remote: ../../../hyper-spec
   specs:
-    hyper-spec (0.1)
+    hyper-spec (1.0.alpha1.1)
       capybara
       chromedriver-helper (= 1.2.0)
       libv8 (~> 6.3.0)
@@ -32,14 +32,14 @@ PATH
 PATH
   remote: ../../../hyper-state
   specs:
-    hyper-state (0.1)
-      hyperstack-config (= 0.1)
+    hyper-state (1.0.alpha1.1)
+      hyperstack-config (= 1.0.alpha1.1)
       opal (>= 0.11.0, < 0.12.0)
 
 PATH
   remote: ../../../hyperstack-config
   specs:
-    hyperstack-config (0.1)
+    hyperstack-config (1.0.alpha1.1)
       libv8 (~> 6.3.0)
       listen (~> 3.0)
       mini_racer (~> 0.1.15)
@@ -159,7 +159,7 @@ GEM
       rails-dom-testing (>= 1, < 3)
       railties (>= 4.2.0)
       thor (>= 0.14, < 2.0)
-    libv8 (6.3.292.48.1)
+    libv8 (6.3.292.48.1-x86_64-darwin-15)
     listen (3.1.5)
       rb-fsevent (~> 0.9, >= 0.9.4)
       rb-inotify (~> 0.9, >= 0.9.7)

ruby/examples/docs/home-page/app/hyperstack/components/using_state.rb

@@ -7,7 +7,7 @@ class UsingState < HyperComponent
   render(DIV) do
     # the button method returns an HTML element
     # .on(:click) is an event handeler
-    button.on(:click) { mutate @show = !@show }
+    button.on(:click) { toggle :show }
     DIV do
       input
       output

ruby/examples/misc/stock-tickers/Gemfile.lock

@@ -1,9 +1,9 @@
 PATH
   remote: ../../../hyper-component
   specs:
-    hyper-component (1.0.alpha1)
-      hyper-state (= 1.0.alpha1)
-      hyperstack-config (= 1.0.alpha1)
+    hyper-component (1.0.alpha1.1)
+      hyper-state (= 1.0.alpha1.1)
+      hyperstack-config (= 1.0.alpha1.1)
       libv8 (~> 6.3.0)
       mini_racer (~> 0.1.15)
       opal (>= 0.11.0, < 0.12.0)
@@ -13,7 +13,7 @@ PATH
 PATH
   remote: ../../../hyper-spec
   specs:
-    hyper-spec (1.0.alpha1)
+    hyper-spec (1.0.alpha1.1)
       capybara
       chromedriver-helper (= 1.2.0)
       libv8 (~> 6.3.0)
@@ -32,20 +32,20 @@ PATH
 PATH
   remote: ../../../hyper-state
   specs:
-    hyper-state (1.0.alpha1)
-      hyperstack-config (= 1.0.alpha1)
+    hyper-state (1.0.alpha1.1)
+      hyperstack-config (= 1.0.alpha1.1)
       opal (>= 0.11.0, < 0.12.0)
 
 PATH
   remote: ../../../hyper-trace
   specs:
-    hyper-trace (1.0.alpha1)
-      hyperstack-config (= 1.0.alpha1)
+    hyper-trace (1.0.alpha1.1)
+      hyperstack-config (= 1.0.alpha1.1)
 
 PATH
   remote: ../../../hyperstack-config
   specs:
-    hyperstack-config (1.0.alpha1)
+    hyperstack-config (1.0.alpha1.1)
       libv8 (~> 6.3.0)
       listen (~> 3.0)
       mini_racer (~> 0.1.15)

ruby/examples/misc/stock-tickers/app/hyperstack/components/app.rb

@@ -1,9 +1,16 @@
 class App < HyperComponent
+
+  # To make our code easy to read we use the following conventions for
+  # instance variables (state):
+  #   @snake_case  : reactive instance variable that will trigger rerenders
+  #   @_snake_case : non-reactive instance variable that will never be mutated
+  #   @CamelCase   : a component param (this convention is inforced by Hyperstack)
+  
   before_mount { @symbols = Set.new }
 
   def add_symbol
-    mutate @symbols << @SymbolInput.value.upcase
-    @SymbolInput.value = ''
+    mutate @symbols << @_symbol_input.value.upcase
+    @_symbol_input.value = ''
   end
 
   render do
@@ -15,7 +22,7 @@ def add_symbol
       BS::Row(style: { marginTop: 20 }) do
         BS::Col(sm: 4) do
           BS::InputGroup(class: 'mb-3') do
-            BS::FormControl(dom: set(:SymbolInput), placeholder: 'New Stock Market Symbol')
+            BS::FormControl(dom: set(:_symbol_input), placeholder: 'New Stock Market Symbol')
             .on(:enter) { add_symbol }
             BS::InputGroup::Append() { BS::Button() { 'Add' } }
             .on(:click) { add_symbol }

ruby/examples/misc/stock-tickers/app/hyperstack/components/bs.rb

@@ -1,3 +1,7 @@
 class BS < Hyperstack::Component::NativeLibrary
+  # subclasses of Hyperstack::Component::NativeLibrary
+  # are wrappers around JS component libraries.
+  # once imported BS acts like an ordinary ruby module
+  
   imports 'ReactBootstrap'
 end

ruby/examples/misc/stock-tickers/app/hyperstack/components/display_ticker.rb

@@ -1,8 +1,18 @@
 class DisplayTicker < HyperComponent
-  param    :symbol
-  triggers :cancel
+
+  param    :symbol  # hyperstack will copy the param to @Symbol when it changes
+  triggers :cancel  # this is an outgoing event.  You trigger it by calling cancel!
+
+  # when the component mounts (is created) we create a corresponding ticker
+  # from our StockTicker store.  We will never within the component change the
+  # value of @_ticker so it begins with an underscore
+
   before_mount { @_ticker = StockTicker.new(@Symbol, 10.seconds) }
 
+  # The status helper method renders some bootstrap columns depending on
+  # the state of the ticker status.  Internal to each StockTicker state
+  # will be mutated, causing the component to rerender, and displaying new data.
+
   def status
     case @_ticker.status
     when :loading
@@ -16,6 +26,10 @@ def status
     end
   end
 
+  # Render the ticker.  Most of the work is done in the status method, but
+  # here we attach a close button using the BS `close` class (shown by an X)
+  # when the close button is clicked we trigger the `cancel` event.
+
   render do
     BS::Row() do
       BS::Col(sm: 1) { @Symbol.upcase }

ruby/examples/misc/stock-tickers/app/hyperstack/components/hyper_component.rb

@@ -1,6 +1,10 @@
-# def Hyperstack.naming_convention
-#   :prefix_params
-# end
+# Each Hyperstack application should define a base
+# HyperComponent class.  This where application wide
+# specific hooks can be added to customize behavior across
+# the application.
+
+# In this case we attach hypertrace instrumentation to all
+# of our components so we get debug tracing of what is going on.
 
 class HyperComponent
   include Hyperstack::Component

ruby/examples/misc/stock-tickers/app/hyperstack/stores/stock_ticker.rb

@@ -1,25 +1,55 @@
+# Our StockTicker class abstracts out fetching and updating the stock
+# data for each ticker.
+
+# By including the Hyperstack::State::Observable class we make our state
+# changes observable by other Components and Observables.
+
 class StockTicker
   include Hyperstack::State::Observable
 
   attr_reader  :symbol
+
+  # state readers, these work like attr_readers, but
+  # when the state is accessed (observed) it will be tracked
+  # so the State system knows which components to update when
+  # the state of the ticker changes
+
   state_reader :price
   state_reader :time
   state_reader :status
   state_reader :reason
 
+  # when the ticker is initialized we save the value of symbol and
+  # the update_interval in instance variables.
+  # @status is initialized to :loading, and all future changes will
+  # be marked with a call to mutate.
+  # Finally we make our first fetch of the symbols stock data.
+
   def initialize(symbol, update_interval = 5.seconds)
     @symbol = symbol
-    @status = :loading
     @update_interval = update_interval
+    @status = :loading
     fetch
   end
 
+  # Each fetch sets up a call to get the symbols delayed quote data.
+  # when the fetch returns we record the status, the price,
+  # and the time of the quote.
+
+  # prefixing the state changes with mutate will signal any observers
+  # that the state of this ticker has changed.
+
+  # once we have updated the state we setup another fetch cycle
+
+  # If the fetch fails, then we also update the status, and reason for the
+  # failure.  If the reason is that the symbol is unknown then we do not
+  # need to reattempt the fetch, but otherwise we will keep trying.
+
   def fetch
     HTTP.get("https://api.iextrading.com/1.0/stock/#{@symbol}/delayed-quote")
         .then do |resp|
           mutate @status = :success, @price = resp.json[:delayedPrice],
-                 @time = Time.at(resp.json[:delayedPriceTime] / 1000),
-                 @update_time = Time.now
+                 @time = Time.at(resp.json[:delayedPriceTime] / 1000)
           after(@update_interval) { fetch }
         end
         .fail do |resp|
@@ -28,12 +58,14 @@ def fetch
         end
   end
 
+  # just to demonstrate use of before_unmount - this is not needed
+  # but if there were some other cleanups you needed you could put them here
+  # however intervals (every) delays (after) and websocket receivers are all
+  # cleaned up automatically
+
   before_unmount do
-    # just to demonstrate use of before_unmount - this is not needed
-    # but if there were some other cleanups you needed you could put them here
-    # however intervals (every) delays (after) and websocket receivers are all
-    # cleaned up automatically
     puts "cancelling #{@symbol} ticker"
   end
 end
+
 StockTicker.hypertrace instrument: :all

ruby/rails-hyperstack/Gemfile

@@ -4,7 +4,6 @@ gem 'hyper-state',       path: '../hyper-state'
 gem 'hyper-component',   path: '../hyper-component'
 gem 'hyper-operation',   path: '../hyper-operation'
 gem 'hyper-model',       path: '../hyper-model'
-gem 'hyper-store',       path: '../hyper-store'
 gem 'hyper-router',      path: '../hyper-router'
 gem 'hyper-spec',        path: '../hyper-spec'
 gem 'rails', '~> 5.2'

ruby/rails-hyperstack/lib/rails-hyperstack.rb

@@ -1,7 +1,6 @@
 require 'hyperstack-config'
 require 'rails/generators'
 require 'hyper-state'
-require 'hyper-store'
 
 # remove these once lap29 is released ...
 Hyperstack.js_import 'react/react-source-browser', client_only: true, defines: ['ReactDOM', 'React']