Refactor core component to use html_attributes, add default to collection order

Author: pascalwengerter

app/concepts/matestack/ui/core/collection/order/order.js

@@ -16,7 +16,7 @@ const componentDef = {
         this.ordering[key] = "asc"
       } else if (this.ordering[key] == "asc") {
         this.ordering[key] = "desc"
-      } else if (this.ordering[key] = "desc") {
+      } else if (this.ordering[key] == "desc") {
         this.ordering[key] = undefined
       }
       var url;

app/concepts/matestack/ui/core/collection/order/order.rb

@@ -8,7 +8,7 @@ def setup
 
     def response
       components {
-        div @tag_attributes do
+        div html_attributes do
           yield_components
         end
       }

app/concepts/matestack/ui/core/collection/order/toggle/indicator/indicator.rb

@@ -3,8 +3,11 @@ class Indicator < Matestack::Ui::Core::Component::Static
 
     def response
       components {
-        span @tag_attributes do
-          plain "{{orderIndicator( '#{@component_config[:key]}', {asc: '#{@component_config[:asc]}', desc: '#{@component_config[:desc]}'} ) }}"
+        span html_attributes do
+          span attributes: {"v-if": "ordering['#{@component_config[:key]}'] === undefined"}, text: @component_config[:default]
+          plain "{{ 
+            orderIndicator('#{@component_config[:key]}', { asc: '#{@component_config[:asc]}', desc: '#{@component_config[:desc]}'})
+          }}"
         end
       }
     end

app/concepts/matestack/ui/core/collection/order/toggle/toggle.haml

@@ -1,3 +1,3 @@
-%a{@tag_attributes, "@click": "toggleOrder(\"#{@component_config[:key]}\")"}
+%a{ html_attributes, "@click": "toggleOrder(\"#{@component_config[:key]}\")" }
   - if block_given?
     = yield

app/concepts/matestack/ui/core/collection/order/toggle/toggle.rb

@@ -1,5 +1,4 @@
 module Matestack::Ui::Core::Collection::Order::Toggle
   class Toggle < Matestack::Ui::Core::Component::Static
-
   end
 end

spec/0.8/components/dynamic/collection/complete_spec.rb

@@ -72,7 +72,7 @@ def ordering
       end
 
       def content
-        async rerender_on: "my-first-collection-update" do
+        async id: 'my-collection', rerender_on: "my-first-collection-update" do
           collection_content @my_collection.config do
             ul do
               @my_collection.paginated_data.each do |dummy|
@@ -259,7 +259,7 @@ def ordering_1
       end
 
       def content_1
-        async rerender_on: "my-first-collection-update" do
+        async id: 'my-collection-1', rerender_on: "my-first-collection-update" do
           collection_content @my_first_collection.config do
             ul do
               @my_first_collection.paginated_data.each do |dummy|
@@ -318,7 +318,7 @@ def ordering_2
       end
 
       def content_2
-        async rerender_on: "my-second-collection-update" do
+        async id: 'my-collection-2', rerender_on: "my-second-collection-update" do
           collection_content @my_second_collection.config do
             ul do
               @my_second_collection.paginated_data.each do |dummy|
@@ -502,7 +502,7 @@ def response
       end
 
       def content
-        async rerender_on: "my-first-collection-update" do
+        async id: 'my-collection', rerender_on: "my-first-collection-update" do
           collection_content @my_collection.config do
             ul do
               @my_collection.paginated_data.each do |dummy|
@@ -540,4 +540,4 @@ def my_action_config id
     expect(page).not_to have_content("some-title-3")
   end
 
-end
+end

spec/0.8/components/dynamic/collection/filter_spec.rb

@@ -58,7 +58,7 @@ def filter
         end
 
         def content
-          async rerender_on: "my-first-collection-update" do
+          async id: 'my-colletion', rerender_on: "my-first-collection-update" do
             collection_content @my_collection.config do
               ul do
                 @my_collection.data.each do |dummy|
@@ -126,4 +126,4 @@ def content
 
   end
 
-end
+end

spec/0.8/components/dynamic/collection/order_spec.rb

@@ -48,14 +48,16 @@ def ordering
             collection_order_toggle key: :title do
               button do
                 plain "title"
-                collection_order_toggle_indicator key: :title, asc: ' asc', desc: ' desc'
+                collection_order_toggle_indicator key: :title, default: ' created_at', asc: ' asc', desc: ' desc'
+                # try line below
+                # collection_order_toggle_indicator default: ' created_at', asc: ' asc', desc: ' desc'
               end
             end
           end
         end
 
         def content
-          async rerender_on: "my-first-collection-update" do
+          async id: 'my-collection', rerender_on: "my-first-collection-update" do
             collection_content @my_collection.config do
               ul do
                 @my_collection.paginated_data.each do |dummy|
@@ -72,11 +74,11 @@ def content
       end
 
       visit "/example"
-      expect(page).to have_button("title")
+      expect(page).to have_button("title created_at")
       expect(all(".item").first.text).to eq "some-title-1 some-description-1"
       expect(all(".item").last.text).to eq "some-title-11 some-description-11"
 
-      click_button "title"
+      click_button "title created_at"
       sleep 0.2 # otherwise getting stale element error, quick fix
       expect(page).to have_button("title asc")
       expect(all(".item").first.text).to eq "some-title-1 some-description-1"
@@ -90,16 +92,16 @@ def content
 
       click_button "title desc"
       sleep 0.2 # otherwise getting stale element error, quick fix
-      expect(page).to have_button("title")
+      expect(page).to have_button("title created_at")
       expect(all(".item").first.text).to eq "some-title-1 some-description-1"
       expect(all(".item").last.text).to eq "some-title-11 some-description-11"
 
       # test persistent state
       page.driver.browser.navigate.refresh
       sleep 0.2 # otherwise getting stale element error, quick fix
-      expect(page).to have_button("title")
+      expect(page).to have_button("title created_at")
       expect(all(".item").first.text).to eq "some-title-1 some-description-1"
       expect(all(".item").last.text).to eq "some-title-11 some-description-11"
     end
   end
-end
+end

spec/0.8/components/dynamic/collection/pagination_spec.rb

@@ -43,7 +43,7 @@ def response
         end
 
         def content
-          async rerender_on: "my-first-collection-update" do
+          async id: 'my-collection', rerender_on: "my-first-collection-update" do
             collection_content @my_collection.config do
               ul do
                 @my_collection.paginated_data.each do |dummy|
@@ -175,7 +175,7 @@ def response
         end
 
         def content
-          async rerender_on: "my-first-collection-update" do
+          async id: 'my-collection', rerender_on: "my-first-collection-update" do
             collection_content @my_collection.config do
               ul do
                 @my_collection.paginated_data.each do |dummy|
@@ -238,4 +238,4 @@ def my_action_config id
 
   end
 
-end
+end