From 303bf5420e128d47c2e87f0a76df3160690cc798 Mon Sep 17 00:00:00 2001
From: Jean-Baptiste Bellet <jb.bellet@gmail.com>
Date: Mon, 31 May 2021 09:43:59 +0200
Subject: [PATCH] Add select2WatchNgModel directive

 - Select2 components cannot handle ng-model correctly: they do not update if the ng-model change. Add a directive to watch the ng-model and update the component value
---
 .../directives/select2_watch_model.js.coffee  |  8 +++++++
 .../spree/admin/orders/_filters.html.haml     | 23 +++++++++++--------
 app/views/spree/admin/orders/index.html.haml  |  2 +-
 3 files changed, 22 insertions(+), 11 deletions(-)
 create mode 100644 app/assets/javascripts/admin/directives/select2_watch_model.js.coffee

diff --git a/app/assets/javascripts/admin/directives/select2_watch_model.js.coffee b/app/assets/javascripts/admin/directives/select2_watch_model.js.coffee
new file mode 100644
index 0000000000..510e0905f4
--- /dev/null
+++ b/app/assets/javascripts/admin/directives/select2_watch_model.js.coffee
@@ -0,0 +1,8 @@
+angular.module("ofn.admin").directive "select2WatchNgModel", () ->
+  restrict: 'E'
+  scope: true
+  require: "ngModel"
+  link: (scope, element, attrs, ngModel) ->
+    ngModel.$render = () ->
+      newValue = ngModel.$viewValue;
+      element.children(".select2").select2("val", newValue)
diff --git a/app/views/spree/admin/orders/_filters.html.haml b/app/views/spree/admin/orders/_filters.html.haml
index 546645c043..bc39f719e9 100644
--- a/app/views/spree/admin/orders/_filters.html.haml
+++ b/app/views/spree/admin/orders/_filters.html.haml
@@ -10,9 +10,10 @@
           = text_field_tag "q[completed_at_lteq]", nil, class: 'datepicker', datepicker: 'q.completed_at_lteq', 'ng-model' => 'q.completed_at_lteq', :placeholder => t(:stop)
       .field
         = label_tag nil, t(:status)
-        = select_tag("q[state_eq]",
-            options_for_select(Spree::Order.state_machines[:state].states.collect {|s| [t("spree.order_state.#{s.name}"), s.value]}),
-            {include_blank: true, class: 'select2', 'ng-model' => 'q.state_eq'})
+        %select2-watch-ng-model{'ng-model': 'q.state_eq'}
+          = select_tag("q[state_eq]",
+              options_for_select(Spree::Order.state_machines[:state].states.collect {|s| [t("spree.order_state.#{s.name}"), s.value]}),
+              {include_blank: true, class: 'select2', 'ng-model' => 'q.state_eq'})
     .four.columns
       .field
         = label_tag "q_number_cont", t(:order_number)
@@ -34,20 +35,22 @@
           = t(:show_only_complete_orders)
       .field
         = label_tag nil, t(:shipping_method)
-        = select_tag("shipping_method_id",
+        %select2-watch-ng-model{'ng-model': 'q.shipping_method_id'}
           = select_tag("q[shipping_method_id]",
             options_for_select(Spree::ShippingMethod.managed_by(spree_current_user).collect {|s| [t("spree.shipping_method_names.#{s.name}"), s.id]}),
             {include_blank: true, class: 'select2', 'ng-model': 'q.shipping_method_id'})
     .field-block.alpha.eight.columns
       = label_tag nil, t(:distributors)
-      = select_tag("q[distributor_id_in]",
-          options_for_select(Enterprise.is_distributor.managed_by(spree_current_user).map {|e| [e.name, e.id]}, params[:distributor_ids]),
-          {class: "select2 fullwidth", multiple: true, 'ng-model' => 'q.distributor_id_in'})
+      %select2-watch-ng-model{'ng-model': 'q.distributor_id_in'}
+        = select_tag("q[distributor_id_in]",
+            options_for_select(Enterprise.is_distributor.managed_by(spree_current_user).map {|e| [e.name, e.id]}, params[:distributor_ids]),
+            {class: "select2 fullwidth", multiple: true, 'ng-model' => 'q.distributor_id_in'})
     .field-block.omega.eight.columns
       = label_tag nil, t(:order_cycles)
-      = select_tag("q[order_cycle_id_in]",
-          options_for_select(OrderCycle.managed_by(spree_current_user).where('order_cycles.orders_close_at is not null').order('order_cycles.orders_close_at DESC').map {|oc| [oc.name, oc.id]}, params[:order_cycle_ids]),
-          {class: "select2 fullwidth", multiple: true, 'ng-model' => 'q.order_cycle_id_in'})
+      %select2-watch-ng-model{'ng-model': 'q.order_cycle_id_in'}
+        = select_tag("q[order_cycle_id_in]",
+            options_for_select(OrderCycle.managed_by(spree_current_user).where('order_cycles.orders_close_at is not null').order('order_cycles.orders_close_at DESC').map {|oc| [oc.name, oc.id]}, params[:order_cycle_ids]),
+            {class: "select2 fullwidth", multiple: true, 'ng-model' => 'q.order_cycle_id_in'})
     .clearfix
     .actions.filter-actions
       %div
diff --git a/app/views/spree/admin/orders/index.html.haml b/app/views/spree/admin/orders/index.html.haml
index 758fc4dd07..08899c50d0 100644
--- a/app/views/spree/admin/orders/index.html.haml
+++ b/app/views/spree/admin/orders/index.html.haml
@@ -8,7 +8,7 @@
 = render partial: 'spree/admin/shared/order_sub_menu'
 
 - content_for :main_ng_app_name do
-  = "admin.orders"
+  = "ofn.admin"
 
 - content_for :main_ng_ctrl_name do
   = "ordersCtrl"