From beed914477bdcb3de99678d9f5c66037f5124dde Mon Sep 17 00:00:00 2001
From: Tim Otten <totten@civicrm.org>
Date: Mon, 21 Jun 2021 19:50:51 -0700
Subject: [PATCH] msgtplui - Switch from crm-mailing-token to crm-ui-select

This will make it easier to swap the list of tokens, depending on the particular message template
---
 ext/msgtplui/ang/msgtplui/Edit.html        |  4 ++--
 ext/msgtplui/ang/msgtplui/Edit.js          |  7 +++++--
 ext/msgtplui/ang/msgtplui/EditContent.html | 24 +++++++++++++++++++---
 ext/msgtplui/ang/msgtplui/EditContent.js   |  4 ----
 4 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/ext/msgtplui/ang/msgtplui/Edit.html b/ext/msgtplui/ang/msgtplui/Edit.html
index c71d171233..db3b6e7e0b 100644
--- a/ext/msgtplui/ang/msgtplui/Edit.html
+++ b/ext/msgtplui/ang/msgtplui/Edit.html
@@ -50,8 +50,8 @@
         </li>
       </ul>
       <div class="panel-body">
-        <msgtplui-edit-content options="{record: $ctrl.records[$ctrl.tab], disabled: true}" ng-if="$ctrl.tab==='original'"></msgtplui-edit-content>
-        <msgtplui-edit-content options="{record: $ctrl.records[$ctrl.tab]}" ng-if="$ctrl.tab!=='original'"></msgtplui-edit-content>
+        <msgtplui-edit-content options="{record: $ctrl.records[$ctrl.tab], tokenList: $ctrl.tokenList, disabled: true}" ng-if="$ctrl.tab==='original'"></msgtplui-edit-content>
+        <msgtplui-edit-content options="{record: $ctrl.records[$ctrl.tab], tokenList: $ctrl.tokenList}" ng-if="$ctrl.tab!=='original'"></msgtplui-edit-content>
         <div class="text-center">
           <div class="btn-group">
             <button type="button" class="btn btn-success" ng-if="$ctrl.tab.match('txActive|original') && !$ctrl.hasDraft()" ng-click="$ctrl.createDraft($ctrl.records[$ctrl.tab])"><i class="fa fa-clone"/> {{ts('Create draft')}}</button>
diff --git a/ext/msgtplui/ang/msgtplui/Edit.js b/ext/msgtplui/ang/msgtplui/Edit.js
index e64991e6e0..59294e2f9e 100644
--- a/ext/msgtplui/ang/msgtplui/Edit.js
+++ b/ext/msgtplui/ang/msgtplui/Edit.js
@@ -83,7 +83,6 @@
     return prefetch;
   }
 
-
   function pickFirsts(prefetch) {
     return _.reduce(prefetch, function(all, record, key){
       all[key] = record[0] || undefined;
@@ -142,13 +141,16 @@
             }
 
             return crmStatus({start: ts('Loading...'), success: ''}, crmApi4(requests).then(respMergeTranslations).then(pickFirsts));
+          },
+          tokenList: function () {
+            return CRM.crmMailing.mailTokens;
           }
         }
       });
     }
   );
 
-  angular.module('msgtplui').controller('MsgtpluiEdit', function($q, $scope, crmApi4, crmBlocker, crmStatus, crmUiAlert, crmUiHelp, $location, prefetch) {
+  angular.module('msgtplui').controller('MsgtpluiEdit', function($q, $scope, crmApi4, crmBlocker, crmStatus, crmUiAlert, crmUiHelp, $location, prefetch, tokenList) {
     var block = $scope.block = crmBlocker();
     var ts = $scope.ts = CRM.ts('msgtplui');
     var hs = $scope.hs = crmUiHelp({file: 'CRM/Msgtplui/Edit'}); // See: templates/CRM/Msgtplui/Edit.hlp
@@ -157,6 +159,7 @@
 
     $ctrl.locales = CRM.msgtplui.uiLanguages;
     $ctrl.records = prefetch;
+    $ctrl.tokenList = tokenList;
     if (args.lang) {
       $ctrl.lang = args.lang;
       $ctrl.tab = (args.status === 'draft' && $ctrl.records.txDraft && $ctrl.records.txDraft._exists) ? 'txDraft' : 'txActive';
diff --git a/ext/msgtplui/ang/msgtplui/EditContent.html b/ext/msgtplui/ang/msgtplui/EditContent.html
index 15609cecb4..f2bf87aee3 100644
--- a/ext/msgtplui/ang/msgtplui/EditContent.html
+++ b/ext/msgtplui/ang/msgtplui/EditContent.html
@@ -5,7 +5,13 @@
   <div class="panel panel-default">
     <div class="panel-heading">
       <a href="" ng-click="accordions.msg_subject = !accordions.msg_subject">{{::ts('Subject')}}</a>
-      <input crm-mailing-token on-select="$broadcast('insert:msg_subject', token.name)" tabindex="-1" style="z-index:1" class="pull-right" ng-show="accordions.msg_subject">
+      <input class="form-control pull-right crm-action-menu fa-code"
+             tabindex="-1"
+             style="z-index:1"
+             crm-ui-select="{placeholder: ts('Token'), data: $ctrl.options.tokenList, width: '12em', dropdownAutoWidth: true}"
+             on-crm-ui-select="$broadcast('insert:msg_subject', selection)"
+             ng-show="accordions.msg_subject"
+      />
       <div class="clearfix"></div>
     </div>
     <div class="panel-body" uib-collapse="!accordions.msg_subject">
@@ -20,7 +26,13 @@
   <div class="panel panel-default">
     <div class="panel-heading">
       <a href="" ng-click="accordions.msg_html = !accordions.msg_html">{{::ts('HTML Content')}}</a>
-      <input crm-mailing-token on-select="$broadcast('insert:msg_html', token.name)" tabindex="-1" style="z-index:1" class="pull-right" ng-show="accordions.msg_html">
+      <input class="form-control pull-right crm-action-menu fa-code"
+             tabindex="-1"
+             style="z-index:1"
+             crm-ui-select="{placeholder: ts('Token'), data: $ctrl.options.tokenList, width: '12em', dropdownAutoWidth: true}"
+             on-crm-ui-select="$broadcast('insert:msg_html', selection)"
+             ng-show="accordions.msg_html"
+      />
       &nbsp;
       <div class="btn-group btn-group-xs pull-right" role="toolbar" aria-label="{{::ts('HTML Content: Toolbar')}}" ng-show="accordions.msg_html">
         <button type="button" class="btn btn-default" title="{{::ts('Open large editor')}}" ng-click="$ctrl.openFull('msg_html')">
@@ -46,7 +58,13 @@
   <div class="panel panel-default">
     <div class="panel-heading">
       <a href="" ng-click="accordions.msg_text = !accordions.msg_text">{{::ts('Text Content')}}</a>
-      <input crm-mailing-token on-select="$broadcast('insert:msg_text', token.name)" tabindex="-1" style="z-index:1" class="pull-right" ng-show="accordions.msg_text">
+      <input class="form-control pull-right crm-action-menu fa-code"
+             tabindex="-1"
+             style="z-index:1"
+             crm-ui-select="{placeholder: ts('Token'), data: $ctrl.options.tokenList, width: '12em', dropdownAutoWidth: true}"
+             on-crm-ui-select="$broadcast('insert:msg_text', selection)"
+             ng-show="accordions.msg_text"
+      />
       &nbsp;
       <div class="btn-group btn-group-xs pull-right" role="toolbar" aria-label="{{::ts('Text Content: Toolbar')}}" ng-show="accordions.msg_text">
         <button type="button" class="btn btn-default" title="{{::ts('Open large editor')}}" ng-click="$ctrl.openFull('msg_text')">
diff --git a/ext/msgtplui/ang/msgtplui/EditContent.js b/ext/msgtplui/ang/msgtplui/EditContent.js
index 210dcde900..71544a8a2f 100644
--- a/ext/msgtplui/ang/msgtplui/EditContent.js
+++ b/ext/msgtplui/ang/msgtplui/EditContent.js
@@ -26,10 +26,6 @@
         crmUiAlert({type: 'error', title: ts('TODO: openPreview'), text: ts('Not yet implemented')});
       };
 
-      $ctrl.insertToken = function(fld) {
-        crmUiAlert({type: 'error', title: ts('TODO: insertToken'), text: ts('Not yet implemented')});
-      };
-
     }
   });
 })(angular, CRM.$, CRM._);
-- 
2.25.1