From 44f7db4ca3782a9264d50f658dd59003d9e047ae Mon Sep 17 00:00:00 2001
From: Tim Otten <totten@civicrm.org>
Date: Tue, 17 Nov 2020 17:29:56 -0800
Subject: [PATCH] afform - Get default field `<label>` from `label` instead of
 `title`

---
 ext/afform/auditor/backlog.md                          |  1 +
 ext/afform/core/afform.php                             |  2 +-
 ext/afform/core/ang/af/afField.html                    |  4 ++--
 .../core/tests/phpunit/Civi/Afform/FilterTest.php      |  8 ++++----
 ext/afform/gui/afform_gui.php                          |  2 +-
 ext/afform/gui/ang/afGuiEditor.js                      | 10 +++++-----
 ext/afform/gui/ang/afGuiEditor/entity.html             |  4 ++--
 ext/afform/gui/ang/afGuiEditor/field.html              |  6 +++---
 8 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/ext/afform/auditor/backlog.md b/ext/afform/auditor/backlog.md
index c5230b4150..5ea347bd03 100644
--- a/ext/afform/auditor/backlog.md
+++ b/ext/afform/auditor/backlog.md
@@ -10,6 +10,7 @@ validator to catch. Loosely/informally:
 * `<af-form>`, `<af-entity>`, `<af-fieldset>`, `<af-field>` should have suitable relationships.
 * `<af-entity>` should reference legit entities.
 * `<af-field>` should reference legit fields.
+    * The optional override `defn='{label:...}` changed to `defn={title:...}`
     * Future consideration: how to validate when it's part of a subform?
 * `<af-fieldset>` should reference a declared model.
 * `<af-field defn="...">` should contain an object.
diff --git a/ext/afform/core/afform.php b/ext/afform/core/afform.php
index c78170823b..e9bceafed7 100644
--- a/ext/afform/core/afform.php
+++ b/ext/afform/core/afform.php
@@ -351,7 +351,7 @@ function _af_fill_field_metadata($entityType, DOMElement $afField) {
   $params = [
     'action' => 'create',
     'where' => [['name', '=', $afField->getAttribute('name')]],
-    'select' => ['title', 'input_type', 'input_attrs', 'options'],
+    'select' => ['label', 'input_type', 'input_attrs', 'options'],
     'loadOptions' => TRUE,
   ];
   if (in_array($entityType, CRM_Contact_BAO_ContactType::basicTypes(TRUE))) {
diff --git a/ext/afform/core/ang/af/afField.html b/ext/afform/core/ang/af/afField.html
index 709a7cbefb..6fb2f55f85 100644
--- a/ext/afform/core/ang/af/afField.html
+++ b/ext/afform/core/ang/af/afField.html
@@ -1,5 +1,5 @@
-<label class="crm-af-field-label" ng-if="defn.title" for="{{ fieldId }}">
-  {{ defn.title }}
+<label class="crm-af-field-label" ng-if="defn.label" for="{{ fieldId }}">
+  {{ defn.label }}
 </label>
 <p class="crm-af-field-help-pre" ng-if="defn.help_pre">{{ defn.help_pre }}</p>
 <div class="crm-af-field" ng-include="'~/af/fields/' + defn.input_type + '.html'"></div>
diff --git a/ext/afform/core/tests/phpunit/Civi/Afform/FilterTest.php b/ext/afform/core/tests/phpunit/Civi/Afform/FilterTest.php
index fba7e5e028..4e84b5592d 100644
--- a/ext/afform/core/tests/phpunit/Civi/Afform/FilterTest.php
+++ b/ext/afform/core/tests/phpunit/Civi/Afform/FilterTest.php
@@ -43,7 +43,7 @@ class FilterTest extends \PHPUnit\Framework\TestCase implements HeadlessInterfac
 
     $myField = $parsed[0]['#children'][1]['#children'][0];
     $this->assertEquals('af-field', $myField['#tag']);
-    $this->assertEquals('First Name', $myField['defn']['title']);
+    $this->assertEquals('First Name', $myField['defn']['label']);
   }
 
   public function testDefnInjectionNested() {
@@ -55,19 +55,19 @@ class FilterTest extends \PHPUnit\Framework\TestCase implements HeadlessInterfac
 
     $myField = $parsed[0]['#children'][1]['#children'][0]['#children'][0]['#children'][0];
     $this->assertEquals('af-field', $myField['#tag']);
-    $this->assertEquals('First Name', $myField['defn']['title']);
+    $this->assertEquals('First Name', $myField['defn']['label']);
   }
 
   public function testDefnOverrideTitle() {
     $inputHtml = sprintf(self::PERSON_TPL,
-      '<div af-fieldset="person"><af-field name="first_name" defn="{title: \'Given name\'}" /></div>');
+      '<div af-fieldset="person"><af-field name="first_name" defn="{label: \'Given name\'}" /></div>');
     $filteredHtml = $this->htmlFilter('~/afform/MyForm.aff.html', $inputHtml);
     $converter = new \CRM_Afform_ArrayHtml(TRUE);
     $parsed = $converter->convertHtmlToArray($filteredHtml);
 
     $myField = $parsed[0]['#children'][1]['#children'][0];
     $this->assertEquals('af-field', $myField['#tag']);
-    $this->assertEquals('Given name', $myField['defn']['title']);
+    $this->assertEquals('Given name', $myField['defn']['label']);
     $this->assertEquals('Text', $myField['defn']['input_type']);
   }
 
diff --git a/ext/afform/gui/afform_gui.php b/ext/afform/gui/afform_gui.php
index c5fe4e3091..4a10bf342b 100644
--- a/ext/afform/gui/afform_gui.php
+++ b/ext/afform/gui/afform_gui.php
@@ -167,7 +167,7 @@ function afform_gui_civicrm_buildAsset($asset, $params, &$mimeType, &$content) {
     'includeCustom' => TRUE,
     'loadOptions' => TRUE,
     'action' => 'create',
-    'select' => ['name', 'title', 'input_type', 'input_attrs', 'required', 'options', 'help_pre', 'help_post', 'serialize', 'data_type'],
+    'select' => ['name', 'label', 'input_type', 'input_attrs', 'required', 'options', 'help_pre', 'help_post', 'serialize', 'data_type'],
     'where' => [['input_type', 'IS NOT NULL']],
   ];
 
diff --git a/ext/afform/gui/ang/afGuiEditor.js b/ext/afform/gui/ang/afGuiEditor.js
index d0c760f4f8..a0cf7992a5 100644
--- a/ext/afform/gui/ang/afGuiEditor.js
+++ b/ext/afform/gui/ang/afGuiEditor.js
@@ -266,7 +266,7 @@
 
         $scope.valuesFields = function() {
           var fields = _.transform($scope.getMeta().fields, function(fields, field) {
-            fields.push({id: field.name, text: field.title, disabled: $scope.fieldInUse(field.name)});
+            fields.push({id: field.name, text: field.label, disabled: $scope.fieldInUse(field.name)});
           }, []);
           return {results: fields};
         };
@@ -304,7 +304,7 @@
 
           function filterFields(fields) {
             return _.transform(fields, function(fieldList, field) {
-              if (!search || _.contains(field.name, search) || _.contains(field.title.toLowerCase(), search)) {
+              if (!search || _.contains(field.name, search) || _.contains(field.label.toLowerCase(), search)) {
                 fieldList.push({
                   "#tag": "af-field",
                   name: field.name
@@ -806,10 +806,10 @@
 
         $scope.toggleLabel = function() {
           $scope.node.defn = $scope.node.defn || {};
-          if ($scope.node.defn.title === false) {
-            delete $scope.node.defn.title;
+          if ($scope.node.defn.label === false) {
+            delete $scope.node.defn.label;
           } else {
-            $scope.node.defn.title = false;
+            $scope.node.defn.label = false;
           }
         };
 
diff --git a/ext/afform/gui/ang/afGuiEditor/entity.html b/ext/afform/gui/ang/afGuiEditor/entity.html
index f709cff6bd..150f5e7ba4 100644
--- a/ext/afform/gui/ang/afGuiEditor/entity.html
+++ b/ext/afform/gui/ang/afGuiEditor/entity.html
@@ -2,7 +2,7 @@
   <fieldset class="af-gui-entity-values">
     <legend>{{ ts('Values:') }}</legend>
     <div class="form-inline" ng-if="getMeta().fields[fieldName]" ng-repeat="(fieldName, value) in entity.data">
-      <label>{{ getMeta().fields[fieldName].title }}:</label><br />
+      <label>{{ getMeta().fields[fieldName].label }}:</label><br />
       <input class="form-control" af-gui-field-value="editor.getField(entity.type, fieldName)" ng-model="entity.data[fieldName]" />
       <a href ng-click="removeValue(entity, fieldName)">
         <i class="crm-i fa-times"></i>
@@ -41,7 +41,7 @@
           <label>{{ fieldGroup.label }}</label>
           <div ui-sortable="{update: buildPaletteLists, items: '&gt; div:not(.disabled)', connectWith: '[data-entity=' + fieldGroup.entityName + '] &gt; [ui-sortable]', placeholder: 'af-gui-dropzone'}" ui-sortable-update="editor.onDrop" ng-model="fieldGroup.fields">
             <div ng-repeat="field in fieldGroup.fields" ng-class="{disabled: fieldInUse(field.name)}">
-              {{ editor.getField(fieldGroup.entityType, field.name).title }}
+              {{ editor.getField(fieldGroup.entityType, field.name).label }}
             </div>
           </div>
         </div>
diff --git a/ext/afform/gui/ang/afGuiEditor/field.html b/ext/afform/gui/ang/afGuiEditor/field.html
index 04f9c97ecc..4b5ce5f08a 100644
--- a/ext/afform/gui/ang/afGuiEditor/field.html
+++ b/ext/afform/gui/ang/afGuiEditor/field.html
@@ -1,6 +1,6 @@
 <div af-gui-edit-options ng-if="editingOptions" class="af-gui-content-editing-area"></div>
 <div ng-if="!editingOptions" class="af-gui-element af-gui-field" >
-  <div class="af-gui-bar" title="{{ getEntity().label + ': ' + getDefn().title }}">
+  <div class="af-gui-bar" title="{{ getEntity().label + ': ' + getDefn().label }}">
     <div class="form-inline pull-right">
       <div class="btn-group" af-gui-menu >
         <button type="button" class="btn btn-default btn-xs dropdown-toggle af-gui-add-element-button" data-toggle="dropdown" title="{{ ts('Configure') }}">
@@ -10,8 +10,8 @@
       </div>
     </div>
   </div>
-  <label ng-style="{visibility: node.defn.title === false ? 'hidden' : 'visible'}" ng-class="{'af-gui-field-required': getProp('required')}" class="af-gui-node-title">
-    <span af-gui-editable ng-model="getSet('title')" ng-model-options="{getterSetter: true}" default-value="getDefn().title">{{ getProp('title') }}</span>
+  <label ng-style="{visibility: node.defn.label === false ? 'hidden' : 'visible'}" ng-class="{'af-gui-field-required': getProp('required')}" class="af-gui-node-title">
+    <span af-gui-editable ng-model="getSet('label')" ng-model-options="{getterSetter: true}" default-value="getDefn().label">{{ getProp('label') }}</span>
   </label>
   <div class="af-gui-field-help" ng-if="propIsset('help_pre')">
     <span af-gui-editable ng-model="getSet('help_pre')" ng-model-options="{getterSetter: true}" default-value="getDefn().help_pre">{{ getProp('help_pre') }}</span>
-- 
2.25.1