From fef937a8d818cc1a322224ef662cdfd7700726b5 Mon Sep 17 00:00:00 2001
From: Coleman Watts <coleman@civicrm.org>
Date: Thu, 9 Jun 2022 21:05:44 -0400
Subject: [PATCH] AngularJS - Remove UI-Utils library

The [UI-Utils Libary](https://github.com/angular-ui/ui-utils/tree/v0.1.1) was introduced in 2014,
but never used for much of anything. It remains very underutilized, and is the source of a major bug
(see https://lab.civicrm.org/dev/core/-/issues/2688).
Since it's abandonware, it seems best to stop using it rather than try to patch it.

Fixes dev/core#2688
---
 Civi/Angular/Manager.php                   |  1 -
 ang/crmCaseType.ang.php                    |  2 +-
 ang/crmCaseType.js                         |  6 +++++-
 ang/crmCaseType/edit.html                  |  2 +-
 ang/crmCaseType/timelineTable.html         | 15 +++++--------
 ang/crmCxn.ang.php                         |  2 +-
 ang/crmMailing.ang.php                     |  2 +-
 ang/crmMailing/BlockHeaderFooter.html      |  6 ++----
 ang/crmMailing/BlockPublication.html       |  3 +--
 ang/crmMailing/BlockResponses.html         | 12 ++++-------
 ang/crmMailingAB.ang.php                   |  2 +-
 ang/crmUi.ang.php                          |  1 -
 ang/crmUi.js                               | 25 ++++++++++++++++------
 ang/crmUi/tabset.html                      |  4 ++--
 ang/ui.utils.ang.php                       |  6 ------
 composer.json                              |  3 ---
 tests/phpunit/Civi/Angular/ManagerTest.php |  1 -
 17 files changed, 43 insertions(+), 50 deletions(-)
 delete mode 100644 ang/ui.utils.ang.php

diff --git a/Civi/Angular/Manager.php b/Civi/Angular/Manager.php
index 6c7cde0b2a..ec14228af1 100644
--- a/Civi/Angular/Manager.php
+++ b/Civi/Angular/Manager.php
@@ -117,7 +117,6 @@ class Manager {
       $angularModules['jsonFormatter'] = include "$civicrm_root/ang/jsonFormatter.ang.php";
       $angularModules['ngRoute'] = include "$civicrm_root/ang/ngRoute.ang.php";
       $angularModules['ngSanitize'] = include "$civicrm_root/ang/ngSanitize.ang.php";
-      $angularModules['ui.utils'] = include "$civicrm_root/ang/ui.utils.ang.php";
       $angularModules['ui.bootstrap'] = include "$civicrm_root/ang/ui.bootstrap.ang.php";
       $angularModules['ui.sortable'] = include "$civicrm_root/ang/ui.sortable.ang.php";
       $angularModules['unsavedChanges'] = include "$civicrm_root/ang/unsavedChanges.ang.php";
diff --git a/ang/crmCaseType.ang.php b/ang/crmCaseType.ang.php
index f035068cde..62ba2a55c3 100644
--- a/ang/crmCaseType.ang.php
+++ b/ang/crmCaseType.ang.php
@@ -7,5 +7,5 @@ return [
   'js' => ['ang/crmCaseType.js'],
   'css' => ['ang/crmCaseType.css'],
   'partials' => ['ang/crmCaseType'],
-  'requires' => ['ngRoute', 'ui.utils', 'crmUi', 'unsavedChanges', 'crmUtil', 'crmResource'],
+  'requires' => ['ngRoute', 'crmUi', 'unsavedChanges', 'crmUtil', 'crmResource'],
 ];
diff --git a/ang/crmCaseType.js b/ang/crmCaseType.js
index c8b836b385..5e8d49d7a8 100644
--- a/ang/crmCaseType.js
+++ b/ang/crmCaseType.js
@@ -239,7 +239,7 @@
     };
   });
 
-  crmCaseType.controller('CaseTypeCtrl', function($scope, crmApi, apiCalls, crmUiHelp) {
+  crmCaseType.controller('CaseTypeCtrl', function($scope, $timeout, crmApi, apiCalls, crmUiHelp) {
     var defaultAssigneeDefaultValue, ts;
 
     (function init () {
@@ -254,6 +254,10 @@
       initCaseType();
       initCaseTypeDefinition();
       initSelectedStatuses();
+
+      $timeout(function() {
+        $('form[name=editCaseTypeForm] .crmCaseType-acttab').tabs({show: true, hide: true});
+      });
     })();
 
     /// Stores the api calls results in the $scope object
diff --git a/ang/crmCaseType/edit.html b/ang/crmCaseType/edit.html
index 034093b270..47e3f3c13f 100644
--- a/ang/crmCaseType/edit.html
+++ b/ang/crmCaseType/edit.html
@@ -13,7 +13,7 @@ Required vars: caseType
 
   <div ng-include="'~/crmCaseType/caseTypeDetails.html'"></div>
 
-  <div ng-show="isForkable()" class="crmCaseType-acttab" ui-jq="tabs" ui-options="{show: true, hide: true}">
+  <div ng-show="isForkable()" class="crmCaseType-acttab">
     <ul>
       <li><a href="#acttab-roles">{{:: ts('Case Roles') }}</a></li>
       <li><a href="#acttab-statuses">{{:: ts('Case Statuses') }}</a></li>
diff --git a/ang/crmCaseType/timelineTable.html b/ang/crmCaseType/timelineTable.html
index e25351d782..7703d57e21 100644
--- a/ang/crmCaseType/timelineTable.html
+++ b/ang/crmCaseType/timelineTable.html
@@ -27,8 +27,7 @@ Required vars: activitySet
     </td>
     <td>
       <select
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth: true}"
+        crm-ui-select="{dropdownAutoWidth: true}"
         ng-model="activity.status"
         ng-options="actStatus.name as actStatus.label for actStatus in activityStatuses|orderBy:'label'"
         >
@@ -37,8 +36,7 @@ Required vars: activitySet
     </td>
     <td>
       <select
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth: true}"
+        crm-ui-select="{dropdownAutoWidth: true}"
         ng-model="activity.reference_activity"
         ng-options="activityType.name as activityType.label for activityType in caseType.definition.timelineActivityTypes"
         >
@@ -55,8 +53,7 @@ Required vars: activitySet
     </td>
     <td>
       <select
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth: true}"
+        crm-ui-select="{dropdownAutoWidth: true}"
         ng-model="activity.reference_select"
         ng-options="key as value for (key,value) in {newest: ts('Newest'), oldest: ts('Oldest')}"
         >
@@ -64,8 +61,7 @@ Required vars: activitySet
     </td>
     <td>
       <select
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth: true}"
+        crm-ui-select="{dropdownAutoWidth: true}"
         ng-model="activity.default_assignee_type"
         ng-options="option.value as option.label for option in defaultAssigneeTypes"
         ng-change="clearActivityDefaultAssigneeValues(activity)"
@@ -73,8 +69,7 @@ Required vars: activitySet
 
       <p ng-if="activity.default_assignee_type === defaultAssigneeTypeValues.BY_RELATIONSHIP">
         <select
-          ui-jq="select2"
-          ui-options="{dropdownAutoWidth: true}"
+          crm-ui-select="{dropdownAutoWidth: true}"
           ng-model="activity.default_assignee_relationship"
           ng-options="option.id as option.text for option in relationshipTypeOptions"
           required
diff --git a/ang/crmCxn.ang.php b/ang/crmCxn.ang.php
index f78e6b1044..752a7bf7cb 100644
--- a/ang/crmCxn.ang.php
+++ b/ang/crmCxn.ang.php
@@ -5,5 +5,5 @@ return [
   'js' => ['ang/crmCxn.js', 'ang/crmCxn/*.js'],
   'css' => ['ang/crmCxn.css'],
   'partials' => ['ang/crmCxn'],
-  'requires' => ['crmUtil', 'ngRoute', 'ngSanitize', 'ui.utils', 'crmUi', 'dialogService', 'crmResource'],
+  'requires' => ['crmUtil', 'ngRoute', 'ngSanitize', 'crmUi', 'dialogService', 'crmResource'],
 ];
diff --git a/ang/crmMailing.ang.php b/ang/crmMailing.ang.php
index 1499250fc0..e93dca1272 100644
--- a/ang/crmMailing.ang.php
+++ b/ang/crmMailing.ang.php
@@ -11,7 +11,7 @@ return [
   'css' => ['ang/crmMailing.css'],
   'partials' => ['ang/crmMailing'],
   'settingsFactory' => ['CRM_Mailing_Info', 'createAngularSettings'],
-  'requires' => ['crmUtil', 'crmAttachment', 'crmAutosave', 'ngRoute', 'ui.utils', 'crmUi', 'dialogService', 'crmResource'],
+  'requires' => ['crmUtil', 'crmAttachment', 'crmAutosave', 'ngRoute', 'crmUi', 'dialogService', 'crmResource'],
   'permissions' => [
     'view all contacts',
     'edit all contacts',
diff --git a/ang/crmMailing/BlockHeaderFooter.html b/ang/crmMailing/BlockHeaderFooter.html
index 249560d785..ea27d2ac00 100644
--- a/ang/crmMailing/BlockHeaderFooter.html
+++ b/ang/crmMailing/BlockHeaderFooter.html
@@ -8,8 +8,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.header_id"
         name="header_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true, allowClear: true}"
+        crm-ui-select="{dropdownAutoWidth : true, allowClear: true}"
         ng-change="checkTokens(mailing, '*')"
         ng-model="mailing.header_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'Header'} | orderBy:'name'">
@@ -20,8 +19,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.footer_id"
         name="footer_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true, allowClear: true}"
+        crm-ui-select="{dropdownAutoWidth : true, allowClear: true}"
         ng-change="checkTokens(mailing, '*')"
         ng-model="mailing.footer_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'Footer'} | orderBy:'name'">
diff --git a/ang/crmMailing/BlockPublication.html b/ang/crmMailing/BlockPublication.html
index 6e82b9fa39..de8e5788ef 100644
--- a/ang/crmMailing/BlockPublication.html
+++ b/ang/crmMailing/BlockPublication.html
@@ -4,8 +4,7 @@
       <select
         crm-ui-id="subform.visibility"
         name="visibility"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true}"
+        crm-ui-select="{dropdownAutoWidth : true}"
         ng-model="mailing.visibility"
         ng-options="v.key as v.value for v in crmMailingConst.visibility"
         required
diff --git a/ang/crmMailing/BlockResponses.html b/ang/crmMailing/BlockResponses.html
index cf56f00796..5c467ffd0a 100644
--- a/ang/crmMailing/BlockResponses.html
+++ b/ang/crmMailing/BlockResponses.html
@@ -34,8 +34,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.reply_id"
         name="reply_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true}"
+        crm-ui-select="{dropdownAutoWidth : true}"
         ng-model="mailing.reply_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'Reply'}"
         required>
@@ -46,8 +45,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.optout_id"
         name="optout_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true}"
+        crm-ui-select="{dropdownAutoWidth : true}"
         ng-model="mailing.optout_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'OptOut'}"
         required>
@@ -58,8 +56,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.resubscribe_id"
         name="resubscribe_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true}"
+        crm-ui-select="{dropdownAutoWidth : true}"
         ng-model="mailing.resubscribe_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'Resubscribe'}"
         required>
@@ -70,8 +67,7 @@ Required vars: mailing, crmMailingConst
       <select
         crm-ui-id="subform.unsubscribe_id"
         name="unsubscribe_id"
-        ui-jq="select2"
-        ui-options="{dropdownAutoWidth : true}"
+        crm-ui-select="{dropdownAutoWidth : true}"
         ng-model="mailing.unsubscribe_id"
         ng-options="mc.id as mc.name for mc in crmMailingConst.headerfooterList | filter:{component_type: 'Unsubscribe'}"
         required>
diff --git a/ang/crmMailingAB.ang.php b/ang/crmMailingAB.ang.php
index c1f82a5a46..38fd42d2c5 100644
--- a/ang/crmMailingAB.ang.php
+++ b/ang/crmMailingAB.ang.php
@@ -11,5 +11,5 @@ return [
   ],
   'css' => ['ang/crmMailingAB.css'],
   'partials' => ['ang/crmMailingAB'],
-  'requires' => ['ngRoute', 'ui.utils', 'crmUi', 'crmAttachment', 'crmMailing', 'crmD3', 'crmResource'],
+  'requires' => ['ngRoute', 'crmUi', 'crmAttachment', 'crmMailing', 'crmD3', 'crmResource'],
 ];
diff --git a/ang/crmUi.ang.php b/ang/crmUi.ang.php
index 3351c87485..0cdb8d9f5a 100644
--- a/ang/crmUi.ang.php
+++ b/ang/crmUi.ang.php
@@ -10,7 +10,6 @@ return [
   'requires' => array_merge(
     [
       'crmResource',
-      'ui.utils',
     ],
     // Only require the +10kb if we're likely to need it.
     $isPretty ? ['jsonFormatter'] : []
diff --git a/ang/crmUi.js b/ang/crmUi.js
index c455951417..11eb5e28ef 100644
--- a/ang/crmUi.js
+++ b/ang/crmUi.js
@@ -628,7 +628,12 @@
             }
           }
 
-          init();
+          // If using ngOptions, wait for them to load
+          if (attrs.ngOptions) {
+            $timeout(init);
+          } else {
+            init();
+          }
         }
       };
     })
@@ -759,14 +764,22 @@
         templateUrl: '~/crmUi/tabset.html',
         transclude: true,
         controllerAs: 'crmUiTabSetCtrl',
-        controller: function($scope, $parse) {
-          var tabs = $scope.tabs = []; // array<$scope>
+        controller: function($scope, $element, $timeout) {
+          var init;
+          $scope.tabs = [];
           this.add = function(tab) {
             if (!tab.id) throw "Tab is missing 'id'";
-            tabs.push(tab);
+            $scope.tabs.push(tab);
+
+            // Init jQuery.tabs() once all tabs have been added
+            if (init) {
+              $timeout.cancel(init);
+            }
+            init = $timeout(function() {
+              $element.find('.crm-tabset').tabs($scope.tabSetOptions);
+            });
           };
-        },
-        link: function (scope, element, attrs) {}
+        }
       };
     })
 
diff --git a/ang/crmUi/tabset.html b/ang/crmUi/tabset.html
index 9a17d97e1b..d348197e10 100644
--- a/ang/crmUi/tabset.html
+++ b/ang/crmUi/tabset.html
@@ -1,4 +1,4 @@
-<div ui-jq="tabs" ui-options="{{tabSetOptions}}" class="crm-tabset">
+<div class="crm-tabset">
   <ul>
     <li ng-repeat="tab in tabs" class="ui-corner-all crm-tab-button crm-count-{{tab.count}}">
       <a href="#{{tab.id}}">
@@ -9,4 +9,4 @@
     </li>
   </ul>
   <div ng-transclude></div>
-</div>
\ No newline at end of file
+</div>
diff --git a/ang/ui.utils.ang.php b/ang/ui.utils.ang.php
deleted file mode 100644
index b7eedaee79..0000000000
--- a/ang/ui.utils.ang.php
+++ /dev/null
@@ -1,6 +0,0 @@
-<?php
-// This file declares an Angular module which can be autoloaded
-return [
-  'ext' => 'civicrm',
-  'js' => ['bower_components/angular-ui-utils/ui-utils.min.js'],
-];
diff --git a/composer.json b/composer.json
index 43f5f96eff..bb3216403c 100644
--- a/composer.json
+++ b/composer.json
@@ -162,9 +162,6 @@
       "angular-ui-sortable": {
         "url": "https://github.com/angular-ui/ui-sortable/archive/v0.19.0.zip"
       },
-      "angular-ui-utils": {
-        "url": "https://github.com/angular-ui/ui-utils/archive/v0.1.1.zip"
-      },
       "angular-unsavedChanges": {
         "url": "https://github.com/facultymatt/angular-unsavedChanges/archive/v0.1.1.zip",
         "ignore": [".*", "node_modules", "bower_components", "test", "tests"]
diff --git a/tests/phpunit/Civi/Angular/ManagerTest.php b/tests/phpunit/Civi/Angular/ManagerTest.php
index 7d82c5bb1e..805ca53f1b 100644
--- a/tests/phpunit/Civi/Angular/ManagerTest.php
+++ b/tests/phpunit/Civi/Angular/ManagerTest.php
@@ -185,7 +185,6 @@ class ManagerTest extends \CiviUnitTestCase {
       'dialogService',
       'ngRoute',
       'ngSanitize',
-      'ui.utils',
     ];
     $ignore = [
       'jsonFormatter',
-- 
2.25.1