reactive_component 0.9.0 → 0.9.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 111726d46e0cac07d669edebc52f2d7e5e2ee05f5b94f7b766d2b400d647f196
-  data.tar.gz: d0cbaadaddb9b4b2c362ba2036e1f8a9efc5a67665a7673d9694134b1a439f64
+  metadata.gz: b5392838b8ed189cab22600b11b26eaa10215f601dd18294a4070febd9d88fbc
+  data.tar.gz: ed5fc1b4fb9c8e41ca0e717481323655b04b31bd4c94eb7ae011d4e05452b881
 SHA512:
-  metadata.gz: b7df34cf75a7a5b83a6ab9d7c98995dcb5bed86b2a67269ab10ca00580af0b769d6aaba0ad37aa861740c4a7e2d242ae851dda561866a76858ae9ad022795f8d
-  data.tar.gz: 32e7b0d49b496c2fff61011751c13d66de283c0c661b6de755da3b2a8919739b6f04861f1de49f9e66c049147a30a960e9436403012ac48f954de0b4a1830d7d
+  metadata.gz: bc1903d993c6504bccd2235175c131287589437461991084dfd93f6124f806de5589a669581bc9e3a34feac4fd5ad5f251131cabe498e5ad4218ade2db225574
+  data.tar.gz: 84a9b85096b7838863837ed0fac03be89394ceef37a24484a1425a9643f707dc120204a8c8b9bf90f2f5645e5d18ce87f04e0d4603a6a6c218f31f16b85d1bc1

data/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## [0.9.1] - 2026-09-17
+
+### Changed
+- The renderer logs every render and update only when `ReactiveComponent.debug`
+  is on, which it reads from the `data-reactive-debug` attribute already on the
+  wrapper. It used to log everywhere, production included, unless a
+  `devToolbar:debug` key in `localStorage` was set to the string `"false"`.
+- A client-state change on a notify component that has no data yet asks the
+  server to render it instead of doing nothing, and an update request carries
+  the state the component is in now rather than the one the page was built
+  with.
+- A notify wrapper with client state no longer embeds its initial data payload.
+  It asks the server to render it, so the attribute was the page a second time,
+  carrying every branch of every extracted expression. A push wrapper keeps it:
+  it renders from that payload until the first broadcast arrives.
+
 ## [0.9.0] - 2026-09-17
 
 ### Added

data/app/javascript/reactive_component/controllers/reactive_renderer_controller.js

@@ -3,11 +3,6 @@ import { createConsumer } from "@rails/actioncable"
 import { compileTemplate, decompress, morphElement, buildActionBody, routeMessage, duplicateIds, strictData } from "reactive_component/lib/reactive_renderer_utils"
 
 const consumer = createConsumer()
-const log = (...args) => {
-  if (localStorage.getItem("devToolbar:debug") !== "false") {
-    console.log("[reactive-renderer]", ...args)
-  }
-}
 
 function findSubscription(streamValue) {
   const identifier = JSON.stringify({ channel: "ReactiveComponent::Channel", signed_stream_name: streamValue })
@@ -113,6 +108,14 @@ export default class extends Controller {
     this.element.removeAttribute("data-reactive-renderer-connected")
   }
 
+  // ReactiveComponent.debug marks the wrapper, so the gem is quiet unless the
+  // app turns debugging on server-side.
+  log(...args) {
+    if (this.element.hasAttribute("data-reactive-debug")) {
+      console.log("[reactive-renderer]", ...args)
+    }
+  }
+
   resolveTemplate() {
     if (this.hasTemplateValue) return this.templateValue
 
@@ -129,18 +132,18 @@ export default class extends Controller {
 
     switch (route.type) {
       case "render":
-        log("render", this.element.id, route.data)
+        this.log("render", this.element.id, route.data)
         this.lastServerData = route.data
         if (this.renderFn) this.render({ ...route.data, ...this.clientState })
         break
 
       case "request_update":
-        log("update", this.element.id, { action: message.action, strategy: "notify" })
+        this.log("update", this.element.id, { action: message.action, strategy: "notify" })
         this.requestUpdate()
         break
 
       case "update":
-        log("update", this.element.id, route.data)
+        this.log("update", this.element.id, route.data)
         this.lastServerData = route.data
         if (this.renderFn) this.render({ ...route.data, ...this.clientState })
         this.element.dispatchEvent(new CustomEvent("reactive-renderer:updated", {
@@ -168,7 +171,9 @@ export default class extends Controller {
         component: this.componentValue,
         sgid: this.sgidValue,
         dom_id: this.element.id,
-        params: this.paramsValue
+        // The channel reads client state off params, so the server renders the
+        // state the component is in now, not the one the page was built with.
+        params: { ...this.paramsValue, ...this.clientState }
       })
     }, 50)
   }
@@ -262,16 +267,23 @@ export default class extends Controller {
               changed = true
             }
           }
-          if (changed && ctrl.lastServerData && ctrl.renderFn) {
-            requestAnimationFrame(() => ctrl.render({ ...ctrl.lastServerData, ...ctrl.clientState }))
-          }
+          if (changed) ctrl.rerender()
         })
       }
     }
 
     Object.assign(this.clientState, updates)
+    this.rerender()
+  }
+
+  // A push component holds the data it needs. A notify one may not have any
+  // yet, its payload arrives on request, so a state change asks for it rather
+  // than leaving the click with nothing to show.
+  rerender() {
     if (this.lastServerData && this.renderFn) {
       requestAnimationFrame(() => this.render({ ...this.lastServerData, ...this.clientState }))
+    } else if (this.strategyValue === "notify") {
+      this.requestUpdate()
     }
   }
 

data/lib/reactive_component/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module ReactiveComponent
-  VERSION = '0.9.0'
+  VERSION = '0.9.1'
 end

data/lib/reactive_component/wrapper.rb

@@ -45,8 +45,15 @@ module ReactiveComponent
 
       if client_state
         attrs << %(data-reactive-renderer-state-value="#{ERB::Util.html_escape(client_state.to_json)}")
-        initial_data = component_class.build_data(record, **client_state.symbolize_keys)
-        attrs << %(data-reactive-renderer-data-value="#{ERB::Util.html_escape(initial_data.to_json)}")
+
+        # A push wrapper renders from this payload until the first broadcast
+        # arrives. A notify one asks the server for its data instead, so the
+        # attribute would be the page a second time, both branches of every
+        # extracted expression included.
+        unless strategy.to_s == 'notify'
+          initial_data = component_class.build_data(record, **client_state.symbolize_keys)
+          attrs << %(data-reactive-renderer-data-value="#{ERB::Util.html_escape(initial_data.to_json)}")
+        end
       end
 
       attrs << %(data-reactive-renderer-strategy-value="#{strategy}") if strategy

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: reactive_component
 version: !ruby/object:Gem::Version
-  version: 0.9.0
+  version: 0.9.1
 platform: ruby
 authors:
 - Przemyslaw Lusar