svelte-on-rails 5.3.0 → 5.3.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8f91cbdd2375be3978749859e8bb36b16fbba13fa1e9ac494b9b5e731bc06f91
-  data.tar.gz: f0164b5a93bfb62b2abeedbaebc85064253ad6e4500d9d94a0cfda570416e794
+  metadata.gz: 66ba05e463ee27dcf6234fd49f46f1879daecd331f52549080d1d9f2f9e0748d
+  data.tar.gz: 1947be68d44b723ed074098728db6a0aaba6e5c5bbbb72dc09604b5fc4dc93f3
 SHA512:
-  metadata.gz: f490b501d07cfe64636b73e45ba2b42d30cfc2fc33168488635565fee4a1d3def9e31b5097cbba82aa7ebfad92e08b6a6be30afa53385dbb206e616d6a72352e
-  data.tar.gz: 94e88d6876d9d434e504899f47f5d71ba2d3129a3a55a94992ce6a573d9e78ab305e306f7c3c2576c0135b3aeb03c5578fec74175eb2fc18d89151bac059d664
+  metadata.gz: 3c4a60a0c0f2d372535af2a7972c4df70ecb2958e0f0f2e9c718f6aeeccbab8f2797c329ec8ea789e5aa9d9e5154bc5b5cc88f70d0a5211416aa1d5d0296d8ad
+  data.tar.gz: afa1cef4cef2787e3da4d0a040b6261f1313b503ae149238faa74f779c46a5d78a569a4ac98c84d0e76276c514d8940f9dd6b6086a58c9c7e54490a2671d18a1

data/README.md

@@ -5,24 +5,17 @@
 
 ---
 
-Combining [DHH's vision](https://rubyonrails.org/2021/12/15/Rails-7-fulfilling-a-vision) 
-with modern front-end requirements:
+Realizing [DHH's vision](https://rubyonrails.org/2021/12/15/Rails-7-fulfilling-a-vision) with modern front-end technologies.
 
-Svelte.
+# Why Integrate Svelte?
 
-Vite.
-
-# Why Choose Svelte for Integration?
-
-Svelte delivers the robust frontend experience missing from DHH’s 
-vision while aligning seamlessly with Rails’ full-stack philosophy.
+Svelte offers the simplest and most elegant soulution to building reactive, high-performance front-end components.
 
 - **Seamless Integration**
   - Works flawlessly with Hotwired/Turbo
-  - Complements Hotwired perfectly
+  - Enhances Hotwire’s capabilities
 - **Developer-Friendly**
-  - Easy to learn
-  - Intuitive and powerful
+  - Simple to learn, intuitive, and powerful
   - Lightning-fast performance
 - **Compared to Single Page Apps (SPAs)**
   - Full-stack development delivers maximum value:
@@ -30,20 +23,17 @@ vision while aligning seamlessly with Rails’ full-stack philosophy.
     - Single-source system delivery
   - For the most HTML Hotwired is enough
 - **Compared to Hotwired**
-  - Stimulus is not a tool for writing frontend-apps
-  - Svelte eliminates redundant HTML state logic
+  - Stimulus is not a tool for frontend-apps
+  - Svelte eliminates redundant HTML initial state logic
   - Consolidates component logic into a single file
-  - Offloads rendering of certain HTML components to frontend JavaScript, reducing server load
+  - Offloads rendering to JavaScript by Frontend, Server side Rendering only where necessary, reducing server load
 - **Compared to React/Vue**
-  - Svelte eliminates the virtual DOM, resulting in leaner, more compact packages and faster performance
-    - Watch Rich Harris’ [Rethinking Reactivity](https://svelte.dev/blog/svelte-3-rethinking-reactivity) (3:50–6:40) for a compelling comparison with react
+  - No virtual DOM, resulting in leaner packages and faster performance
+    - See Rich Harris’ [Rethinking Reactivity](https://svelte.dev/blog/svelte-3-rethinking-reactivity) (3:50–6:40) for a compelling comparison
   - Easier to learn
-  - React and Vue having a vaster Community, bigger Ecosystem
-    - But, for integration, like here, this is not importand
-    - Svelte is sufficiently established
-    - Svelte is younger and growing
+  - While React and Vue have larger communities, Svelte’s ecosystem is robust and growing, ideal for Rails integration
 
-Svelte empowers Rails’ full-stack vision with modern, streamlined frontend integration.
+Svelte empowers Rails’ full-stack vision with modern, efficient front-end integration.
 
 # Features
 
@@ -389,39 +379,19 @@ on the svelte-on-rails config file or pass the `expires_in` as argument to the v
 
 Pass `debug: true` to the helper and you will see on the logs how your configuration works.
 
-## ActionCable / TurboStream
+## ActionCable vs. TurboStream
 
 There are two ways that the server can talk to the client over Websocket:
 
-- ActionCable transmits directly to the frontends javascript
-- TurboStreams is a wrapper around ActionCable
-  - You always need a html part for communication
-
-**Configs**
-
-Check the regarding keys and their commends on the [config file](https://gitlab.com/sedl/svelte-on-rails/-/blob/main/templates/config_base/config/svelte_on_rails.yml?ref_type=heads).
-From there, you just need:
-
-```yaml
-turbo_stream:
-  target_html_id: 'svelte-on-rails-stream-actions-box'
-  channel: 'public'
-```
-
-## ActionCable vs TurboStream
-
-- **ActionCable**
-  - Cleaner setup no html needed
-  - Seams to initialize securer, especially for testings (not: production)
-- **TurboStream**
-  - Secured Streams by html-tag `signed-stream-name` if you want to send confidential data 
-    over streams or have different channels for each user privileges
-  - Has [Compatibility issue with UJS](https://github.com/hotwired/turbo-rails?tab=readme-ov-file#compatibility-with-rails-ujs)
+- **ActionCable** transmits directly to the frontends javascript
+- **TurboStreams** is a wrapper around ActionCable
+  - You always need a html part for communication by secured channels
+  - Makes sense when you want to transfer confidential data or separate onto privileged user channels
+  - Has [compatibility issues with Rails-UJS](https://github.com/hotwired/turbo-rails?tab=readme-ov-file#compatibility-with-rails-ujs)
 
+    
 ## SvelteOnRails::ActionCable
 
-ActionCable is the more basic library behind `TurboStream` and it is a second Option to call Javascript Actions from the server.
-
 **Setup**
 
 Add `app/channels/svelte_on_rails_channel.rb`
@@ -438,7 +408,14 @@ class SvelteOnRailsChannel < ApplicationCable::Channel
 end
 ```
 
-run
+config
+
+```yaml
+action_cable:
+  channel: "svelte_on_rails_channel"
+```
+
+javascript
 
 ```shell
 npm i @rails/actioncable
@@ -511,11 +488,6 @@ on the whole `document` and fires the given event there.
 
 # SvelteOnRails::TurboStream
 
-Turbo Stream makes more sense when you think of sending confidential data to the components
-or you want to separate to channels based on user groups, for example.
-
-Few setup is needed for that:
-
 **Setup**
 
 Please setup the `turbo-rails` gem and follow the chapter [Come alive with Turbo Streams](https://github.com/hotwired/turbo-rails?tab=readme-ov-file#come-alive-with-turbo-streams), which mainly is:
@@ -542,6 +514,17 @@ you can test it by:
 
 When this works you are good to go.
 
+**Configs**
+
+Check the regarding keys and their commends on the [config file](https://gitlab.com/sedl/svelte-on-rails/-/blob/main/templates/config_base/config/svelte_on_rails.yml?ref_type=heads).
+From there, you just need:
+
+```yaml
+turbo_stream:
+  target_html_id: 'svelte-on-rails-stream-actions-box'
+  channel: 'public'
+```
+
 **Minimal Usage Example**
 
 And call this by:

data/lib/svelte_on_rails/action_cable.rb

@@ -40,7 +40,7 @@ module SvelteOnRails
 
       args = {
         eventDetail: event_detail,
-        component: '/false/',
+        component: ':false:',
         event: event,
         selector: selector
       }

data/lib/svelte_on_rails/active_record_extensions.rb

@@ -10,8 +10,30 @@ module SvelteOnRails
     # Returns a hash of attributes, methods, and associations formatted for Svelte components
     def svelte_attributes(*attributes)
       @svelte_attributes ||= begin
+
+                               # separate offset and limit
+
+                               h = attributes.grep(Hash)
+                               attr = if h.present?
+                                        opts = h.first.symbolize_keys
+                                        offset = opts[:offset]
+                                        limit = opts[:limit]
+                                        if offset || limit
+                                          unless self.respond_to?(:each)
+                                            raise 'offset and limit are only supported for record sets that respond to :each'
+                                          end
+                                          _opts = opts.reject { |key, _| [:offset, :limit].include?(key) }
+                                          attributes.select { |item| !item.is_a?(Hash) }.push(_opts)
+                                        else
+                                          attributes
+                                        end
+                                      else
+                                        attributes
+                                      end
+
                                utils = SvelteOnRails::Lib::Utils
-                               utils.svelte_attributes(self, attributes)
+                               utils.svelte_attributes(self, attr, offset: offset, limit: limit)
+
                              end
     end
 

data/lib/svelte_on_rails/lib/utils.rb

@@ -163,21 +163,9 @@ module SvelteOnRails
         end
       end
 
-      def self.svelte_attributes(record, attributes, labels = {}, call_stack: 0, offset: nil, limit: nil)
+      def self.svelte_attributes(record, attributes, labels: {}, call_stack: 0, offset: nil, limit: nil)
 
-        if record.respond_to?(:each)
-          unless record.is_a?(ActiveRecord::Relation) || record.is_a?(ActiveRecord::Associations::CollectionProxy)
-            raise 'record set must be a Article::ActiveRecord_Associations_CollectionProxy'
-          end
-
-          recs = (limit ? record.limit(limit) : record)
-          recs2 = (offset ? recs.offset(limit) : recs)
-
-          values = recs2.map do |rec|
-            svelte_attributes(rec, attributes, labels, call_stack: call_stack + 1)
-          end
-
-        elsif record.is_a?(Class)
+        if record.is_a?(Class)
 
           # this is the case if a belongs_to association is empty; In that case we pass the class itself and extract only the labels
           raise 'limit and offset are supported only for iterable objects' if limit || offset
@@ -189,6 +177,19 @@ module SvelteOnRails
           end
           values = {}
 
+        elsif record.respond_to?(:each)
+
+          unless record.is_a?(ActiveRecord::Relation) || record.is_a?(ActiveRecord::Associations::CollectionProxy)
+            raise 'record set must be a Article::ActiveRecord_Associations_CollectionProxy'
+          end
+
+          recs = (offset ? record.offset(offset) : record)
+          recs2 = (limit ? recs.limit(limit) : recs)
+
+          values = recs2.map do |rec|
+            svelte_attributes(rec, attributes, labels: labels, call_stack: call_stack + 1)
+          end
+
         else
 
           # we have a single record
@@ -222,20 +223,24 @@ module SvelteOnRails
 
                 # values
 
-                content = record.send(_key)
                 reflect = record.class.reflect_on_association(_key)
                 if reflect
+                  recs = record.send(_key)
+                  content = (recs.present? ? recs : reflect.active_record) # if no record, we extract only the labels
                   if content.respond_to?(:each)
                     values[_key] = svelte_attributes(
-                      content, value, labels,
+                      content,
+                      value,
+                      labels: labels,
                       call_stack: call_stack + 1,
                       offset: offs,
                       limit: lim
                     )
                   else
                     values[_key] = svelte_attributes(
-                      content || reflect.active_record, # if no record, we extract only the labels
-                      value, labels,
+                      content,
+                      value,
+                      labels: labels,
                       call_stack: call_stack + 1,
                       offset: offs,
                       limit: lim
@@ -275,12 +280,12 @@ module SvelteOnRails
         hash_args = attributes.grep(Hash).first.with_indifferent_access # multiple arrays is not possible
 
         offset = if hash_args["#{key}_offset"] && !record.respond_to?("#{key}_offset")
-                 hash_args["#{key}_offset"]
-               end
+                   hash_args["#{key}_offset"]
+                 end
 
         limit = if hash_args["#{key}_limit"] && !record.respond_to?("#{key}_limit")
-                hash_args["#{key}_limit"]
-              end
+                  hash_args["#{key}_limit"]
+                end
 
         [offset, limit]
       end

data/lib/svelte_on_rails/lib/view_helper_support.rb

@@ -79,7 +79,13 @@ module SvelteOnRails
 
       def render_ssr
         renderer = SvelteOnRails::Renderer.new(filename)
-        renderer.render(@svelte_props)
+        res = renderer.render(@svelte_props)
+        if res['html'].is_a?(Array)
+          res['html'] = res['html'].join
+          res
+        else
+          res
+        end
       end
 
       def custom_cache_key

data/lib/svelte_on_rails/renderer/render.js

@@ -14,13 +14,13 @@ import {loadComponentModule, readPropsFromStdin} from './utils.js';
 
     try {
         MyComponent(payload, props); // Writes directly to payload.out
-        console.log(`[svelte-on-rails:debug] written to payload`)
+        console.log(`[svelte-on-rails:debug] written to payload (typeof payload.out => «${typeof payload.out}»)`)
     } catch (error) {
         console.error('[svelte-on-rails:debug] Error rendering component:', error);
         process.exit(1);
     }
 
-    const res = {status: 'SUCCESS', html: payload.out.join('')};
+    const res = {status: 'SUCCESS', html: payload.out};
     console.log('[svelte-on-rails:successful-json-response]' + JSON.stringify(res));
 })();
 

data/lib/svelte_on_rails/turbo_stream.rb

@@ -40,7 +40,7 @@ module SvelteOnRails
 
       args = {
         eventDetail: event_detail,
-        component: '/false/',
+        component: ':false:',
         event: event,
         selector: selector
       }

data/templates/all_features_test/app/frontend/initializers/actionCable.js

@@ -1,5 +1,6 @@
 import { createConsumer } from "@rails/actioncable"
-import {dispatchSvelteStreamEvent, actionCableDebugLog} from '@csedl/svelte-on-rails'
+import { SvelteOnRails, dispatchSvelteStreamEvent, actionCableDebugLog } from '@csedl/svelte-on-rails'
+SvelteOnRails.debug = true
 
 const consumer = createConsumer()
 

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: svelte-on-rails
 version: !ruby/object:Gem::Version
-  version: 5.3.0
+  version: 5.3.2
 platform: ruby
 authors:
 - Christian Sedlmair