view_component-live 0.2.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 15f0780daa710f06f03b185800452e61c950a2c1c24829483df627a5ad592bc0
+  data.tar.gz: f48fe82437ae5f18a74bfc27734b798d9914ff0d3374667abca0c1f831b00766
+SHA512:
+  metadata.gz: 6da365cd6e73595f444d2388eeb08bc4cc54ccd781a8b2260f86faf953b3c480c4db65c46e645677d768aa85c70b6e6c7259fb62596b808793cbe6be0cd706bb
+  data.tar.gz: cf951d287fa7505e96034f19565a5bc744648b5e9b4601834944841a3baf9ae0ae7cecb797bf59f09d1403b13ffb533361ddd4423021f1ffeec4981a1cdd12ab

data/MIT-LICENSE

@@ -0,0 +1,20 @@
+Copyright 2019 Simon Træls Ravn
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,89 @@
+# ViewComponent::Live
+This is a small add-on to the ViewComponent gem to make your components update automatically when data is changed serverside.
+
+**Renamed to ViewComponent::Live to follow naming convention of ViewComponent gem**
+
+## Usage
+Lets say you have a MiniBasketComponent that is renders the small basket in the top of your webshop.
+Wouldn't it be nice if that just updated it self whenever a change happens to the draft order?
+
+First lets create a small component for our mini basket.
+This component requires a DraftOrder and will listen to any change to the draft order it renders.
+```ruby
+class MiniBasketComponent < ViewComponent::Base
+  include ViewComponent::Live::Subscriber
+
+  listen_to :draft_order
+
+  def initialize(draft_order:)
+    @order = draft_order
+  end
+
+  def count
+    @order.product_count
+  end
+
+  def id
+    @order.id
+  end
+end
+```
+
+**Important!** There is a strict naming requirement on the `listen_to` part and named argument in initialize!
+
+Then the component view.
+Notice the **=** on the live block. It wraps the view in a **div** tag so we know what part of the page to update.
+```erb
+<%= live do %>
+  <b><%= count %> products in basket</b>
+<% end %>
+```
+
+Finally we need to tell our DraftOrder to broadcast changes.
+```ruby
+class DraftOrder < ApplicationRecord
+  include ViewComponent::Live::Broadcaster
+end
+```
+
+Thats it. Now any update your draft order will be broadcast through ActionCable and your view will update in real time.
+
+## Installation
+Add this line to your application's Gemfile:
+
+```ruby
+gem 'view_component-live'
+```
+
+And then execute:
+```bash
+$ bundle
+```
+
+Add stimulus controller
+```bash
+$ yarn add stimulus-actionview-live, '1.0.0'
+```
+
+Add these 2 lines to your `app/javascript/controllers/index.js`
+```javascript
+import LiveController from "stimulus-actionview-live"
+application.register("live", LiveController)
+```
+
+## Test
+Running the tests requires a Redis server to have ActionCable running in a productionlike environment. This might seem like a bit overkill but this way one system test will test the entire gem.
+
+In the `test/dummy` app there is a complete example of a live updating component.
+_Note to self, remember to compile webpacker when making changes to dummy app assets_
+
+## License
+The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
+# TODO
+## Nice to have
+- install generator that does yarn add and adds lines to stimulus controllers file
+- find a way to do collection updates, a component that lists many items
+- could we do something for components that rely on multiple objects?
+- allow the listen to method to accept a list of attributes so we only get updates to relevant things
+

data/Rakefile

@@ -0,0 +1,32 @@
+begin
+  require 'bundler/setup'
+rescue LoadError
+  puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
+end
+
+require 'rdoc/task'
+
+RDoc::Task.new(:rdoc) do |rdoc|
+  rdoc.rdoc_dir = 'rdoc'
+  rdoc.title    = 'Actionview::Component::Live'
+  rdoc.options << '--line-numbers'
+  rdoc.rdoc_files.include('README.md')
+  rdoc.rdoc_files.include('lib/**/*.rb')
+end
+
+APP_RAKEFILE = File.expand_path("test/dummy/Rakefile", __dir__)
+load 'rails/tasks/engine.rake'
+
+load 'rails/tasks/statistics.rake'
+
+require 'bundler/gem_tasks'
+
+require 'rake/testtask'
+
+Rake::TestTask.new(:test) do |t|
+  t.libs << 'test'
+  t.pattern = 'test/**/*_test.rb'
+  t.verbose = false
+end
+
+task default: :test

data/app/channels/view_component/live/live_channel.rb

@@ -0,0 +1,16 @@
+module ViewComponent
+  module Live
+    class LiveChannel < ActionCable::Channel::Base
+      def subscribed
+        stream_from "view_component:live:live:#{params[:component]}:#{params[:id]}"
+      end
+
+      def unsubscribed
+        # Any cleanup needed when channel is unsubscribed
+      end
+
+      def notify
+      end
+    end
+  end
+end

data/app/models/view_component/live/broadcaster.rb

@@ -0,0 +1,13 @@
+module ViewComponent
+  module Live
+    module Broadcaster
+      extend ActiveSupport::Concern
+
+      included do
+        after_update do
+          LiveUpdater.update self
+        end
+      end
+    end
+  end
+end

data/app/models/view_component/live/live_updater.rb

@@ -0,0 +1,27 @@
+module ViewComponent
+  module Live
+    class LiveUpdater
+      class << self
+        def update(model)
+          model_name = model.class.name
+          return unless subscriptions[model_name].present?
+
+          subscriptions[model_name].each do |component_name|
+            locals = {model_name.underscore.to_sym => model}
+            body = ApplicationController.render template: 'live', layout: false, locals: {component: component_name, locals: locals}
+            LiveChannel.broadcast_to "#{component_name}:#{model.id}", body: body
+          end
+        end
+
+        def subscribe(model, component_name)
+          subscriptions[model] ||= []
+          subscriptions[model] << component_name
+        end
+
+        def subscriptions
+          @subscriptions ||= {}
+        end
+      end
+    end
+  end
+end

data/app/models/view_component/live/subscriber.rb

@@ -0,0 +1,30 @@
+module ViewComponent
+  module Live
+    module Subscriber
+      extend ActiveSupport::Concern
+
+      def live_render!
+        @live_render = true
+      end
+
+      def live_render?
+        @live_render
+      end
+
+      class_methods do
+        def listen_to(name)
+          LiveUpdater.subscribe(name.to_s.classify, self)
+        end
+      end
+
+      # Used as view helper to wrap view in div that will connect to auto-updating stimulus controller
+      # If we render the component in live update on cable we will not wrap it - we just need the component content.
+      #
+      def live
+        return yield if live_render?
+        # <div data-controller="live" data-live-component="UserCardComponent" data-live-id="<%= id %>">
+        content_tag(:div, nil, data: {controller: :live, live_component: self.class.name, live_id: id}) { yield }
+      end
+    end
+  end
+end

data/app/views/live.html.erb

@@ -0,0 +1 @@
+<%= render component.new(locals).tap(&:live_render!) %>

data/config/routes.rb

@@ -0,0 +1,2 @@
+Rails.application.routes.draw do
+end

data/lib/tasks/actionview/component/live_tasks.rake

@@ -0,0 +1,4 @@
+# desc "Explaining what the task does"
+# task :actionview_component_live do
+#   # Task goes here
+# end

data/lib/view_component/live.rb

@@ -0,0 +1,15 @@
+require "view_component/engine"
+require "view_component/live/engine"
+
+require_relative "../../app/models/view_component/live/broadcaster"
+require_relative "../../app/models/view_component/live/subscriber"
+require_relative "../../app/models/view_component/live/live_updater"
+
+require_relative "../../app/channels/view_component/live/live_channel"
+
+
+module ViewComponent
+  module Live
+    # Your code goes here...
+  end
+end

data/lib/view_component/live/engine.rb

@@ -0,0 +1,6 @@
+module ViewComponent
+  module Live
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/view_component/live/version.rb

@@ -0,0 +1,5 @@
+module ViewComponent
+  module Live
+    VERSION = '0.2.1'
+  end
+end

metadata

@@ -0,0 +1,169 @@
+--- !ruby/object:Gem::Specification
+name: view_component-live
+version: !ruby/object:Gem::Version
+  version: 0.2.1
+platform: ruby
+authors:
+- Simon Træls Ravn
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2020-03-27 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: rails
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 6.0.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 6.0.0
+- !ruby/object:Gem::Dependency
+  name: view_component
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 2.1.0
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 2.1.0
+- !ruby/object:Gem::Dependency
+  name: sqlite3
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.4.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 1.4.0
+- !ruby/object:Gem::Dependency
+  name: capybara
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 3.29.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 3.29.0
+- !ruby/object:Gem::Dependency
+  name: selenium-webdriver
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 3.142.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 3.142.0
+- !ruby/object:Gem::Dependency
+  name: puma
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.3.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.3.0
+- !ruby/object:Gem::Dependency
+  name: webpacker
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.0'
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '4.0'
+- !ruby/object:Gem::Dependency
+  name: redis
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.1.0
+  type: :development
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: 4.1.0
+description: Liveupdate from ActiveModel models to view components
+email:
+- cs2@cs2.dk
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- MIT-LICENSE
+- README.md
+- Rakefile
+- app/assets/config/actionview_component_live_manifest.js
+- app/channels/view_component/live/live_channel.rb
+- app/models/view_component/live/broadcaster.rb
+- app/models/view_component/live/live_updater.rb
+- app/models/view_component/live/subscriber.rb
+- app/views/live.html.erb
+- config/routes.rb
+- lib/tasks/actionview/component/live_tasks.rake
+- lib/view_component/live.rb
+- lib/view_component/live/engine.rb
+- lib/view_component/live/version.rb
+homepage: https://bitbucket.org/cs2software/actionview-component-live
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubygems_version: 3.0.3
+signing_key: 
+specification_version: 4
+summary: Liveupdating view components
+test_files: []