From 26ae0e0e40e0fe24523c71ef51ecceaf7cdc415c Mon Sep 17 00:00:00 2001
From: colemanw <coleman@civicrm.org>
Date: Sat, 11 Nov 2023 15:45:25 -0500
Subject: [PATCH] SearchKit - Add inputMode setting to allow clauses to
 reference column values

Before: The WHERE or ON clauses could only use literal values e.g. first_name = 'Bob'
After: Clauses have a mode to allow colum references e.g. first_name = nick_name
---
 .../ang/crmSearchAdmin/crmSearchClause.html   |  2 +-
 .../crmSearchCondition.component.js           | 27 +++++++++++++++++++
 .../crmSearchAdmin/crmSearchCondition.html    |  9 ++++++-
 3 files changed, 36 insertions(+), 2 deletions(-)

diff --git a/ext/search_kit/ang/crmSearchAdmin/crmSearchClause.html b/ext/search_kit/ang/crmSearchAdmin/crmSearchClause.html
index 5f4902f998..6acdeb50e7 100644
--- a/ext/search_kit/ang/crmSearchAdmin/crmSearchClause.html
+++ b/ext/search_kit/ang/crmSearchAdmin/crmSearchClause.html
@@ -22,7 +22,7 @@
         <span ng-if="!$ctrl.hasFunction(clause[0])">
           <input class="form-control collapsible-optgroups" ng-model="clause[0]" crm-ui-select="{data: $ctrl.fields, allowClear: true, placeholder: 'Field'}" ng-change="$ctrl.changeClauseField(clause, index)" />
         </span>
-        <crm-search-condition clause="clause" field="$ctrl.getFieldOrFunction(clause[0])" offset="1" option-key="$ctrl.getOptionKey(clause[0])" format="$ctrl.format" class="form-group"></crm-search-condition>
+        <crm-search-condition clause="clause" field="$ctrl.getFieldOrFunction(clause[0])" fields="$ctrl.fields" offset="1" option-key="$ctrl.getOptionKey(clause[0])" format="$ctrl.format" class="form-group"></crm-search-condition>
       </div>
       <fieldset class="clearfix" ng-if="$ctrl.conjunctions[clause[0]]">
         <crm-search-clause allow-functions="$ctrl.allowFunctions" clauses="clause[1]" format="{{ $ctrl.format }}" op="{{ clause[0] }}" fields="$ctrl.fields" delete-group="$ctrl.deleteRow(index)" ></crm-search-clause>
diff --git a/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.component.js b/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.component.js
index aa90a53f26..ac682c5b13 100644
--- a/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.component.js
+++ b/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.component.js
@@ -7,6 +7,7 @@
       clause: '<',
       format: '<',
       optionKey: '<',
+      fields: '<',
       offset: '<'
     },
     templateUrl: '~/crmSearchAdmin/crmSearchCondition.html',
@@ -16,6 +17,20 @@
       this.operators = {};
 
       this.$onInit = function() {
+        if (this.fields) {
+          let val = getValue();
+          // WHERE clause has an explicit flag if input type is a field
+          if (this.format !== 'json') {
+            this.inputMode = this.clause[2 + ctrl.offset] ? 'field' : 'value';
+          }
+          // ON clause will be quoted json-style if not a field
+          else {
+            if (typeof val === 'string' && /^[a-zA-Z]/.test(val)) {
+              this.inputMode = 'field';
+            }
+          }
+        }
+        this.inputMode = this.inputMode || 'value';
         $scope.$watch('$ctrl.field', updateOperators);
       };
 
@@ -54,6 +69,18 @@
         return getValue();
       };
 
+      // ngChange handler for the field/value mode toggle
+      this.changeInputMode = function() {
+        setValue('');
+        if (ctrl.format !== 'json') {
+          if (ctrl.inputMode === 'field') {
+            this.clause[2 + ctrl.offset] = true;
+          } else {
+            delete this.clause[2 + ctrl.offset];
+          }
+        }
+      };
+
       // Return a list of operators allowed for the current field
       this.getOperators = function() {
         var field = ctrl.field || {},
diff --git a/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.html b/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.html
index ed54a75a28..be6ac8ff7b 100644
--- a/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.html
+++ b/ext/search_kit/ang/crmSearchAdmin/crmSearchCondition.html
@@ -1,2 +1,9 @@
 <select class="form-control api4-operator" ng-model="$ctrl.getSetOperator" ng-if="$ctrl.getOperators().length > 1" ng-model-options="{getterSetter: true}" ng-options="o.key as o.value for o in $ctrl.getOperators()" ng-change="$ctrl.changeClauseOperator()" ></select>
-<crm-search-input ng-if="$ctrl.operatorTakesInput()" ng-model="$ctrl.getSetValue" ng-model-options="{getterSetter: true}" field="$ctrl.field" option-key="$ctrl.optionKey" op="$ctrl.getSetOperator()" format="$ctrl.format" class="form-group"></crm-search-input>
+<select class="form-control crm-search-input-mode" ng-if="$ctrl.fields" ng-model="$ctrl.inputMode" ng-change="$ctrl.changeInputMode(clause, index)" >
+  <option value="value">{{:: ts('Value') }}</option>
+  <option value="field">{{:: ts('Field') }}</option>
+</select>
+<crm-search-input ng-if="$ctrl.inputMode === 'value' && $ctrl.operatorTakesInput()" ng-model="$ctrl.getSetValue" ng-model-options="{getterSetter: true}" field="$ctrl.field" option-key="$ctrl.optionKey" op="$ctrl.getSetOperator()" format="$ctrl.format" class="form-group"></crm-search-input>
+<span ng-if="$ctrl.inputMode === 'field' && $ctrl.operatorTakesInput()">
+  <input class="form-control collapsible-optgroups" ng-model="$ctrl.getSetValue" ng-model-options="{getterSetter: true}" crm-ui-select="{data: $ctrl.fields, allowClear: true, placeholder: 'Field'}" />
+</span>
-- 
2.25.1