Add som more on hover info when quotes appear in search input. Warn for unmatched quotes.

Author: pbartusch

build.sbt

@@ -1,7 +1,7 @@
 import com.typesafe.sbt.GitBranchPrompt
 
 name := "search-management-ui"
-version := "4.1.0"
+version := "4.1.1"
 maintainer := "Contact productful.io <hello@productful.io>"
 
 scalaVersion := "2.12.17"

frontend/src/app/components/details/rule-management/rule-management.component.html

@@ -44,24 +44,24 @@
                     disabled="disabled"
                   />
               </ng-container>
-              <div class="input-group-append" *ngIf="warnSearchinputExact()">
+              <div class="input-group-append" *ngIf="shouldWarnSearchinputExact()">
                 <span class="input-group-text smui-clean-input-group-append">
                   <span class="badge badge-warning">
-                    <i class="fa fa-info-circle">&nbsp;</i>
-                    {{ warnSearchinputExact() }}
+                    <i class="fa fa-info-circle" title="{{warnSearchinputExact()![1]}}">&nbsp;</i>
+                    {{ warnSearchinputExact()![0] }}
                   </span>
                 </span>
               </div>
-              
+
               <div *ngIf="detailSearchInput && showPreviewLinks()">
                 <app-smui-preview-link
                   [previewSections]="previewLinks(detailSearchInput.term)"
                 >
                 </app-smui-preview-link>
               </div>
-  
+
             </div>
-            
+
             </td>
             <td
               [style.display]="showTags ? 'table-cell' : 'none'"
@@ -364,14 +364,25 @@
           <td
             ng-style="{'width' : (featureToggleService.getSyncToggleUiConceptAllRulesWithSolrFields()) ? '35%' : '55%'}"
           >
-            <input
-              type="text"
-              class="form-control"
-              id="inputUpDownTerm"
-              placeholder="Edit UP/DOWN Rule Term ..."
-              [(ngModel)]="upDownRule.term"
-              (keyup.enter)="saveSearchInputDetails()"
-            />
+            <div class="input-group">
+              <input
+                type="text"
+                class="form-control"
+                id="inputUpDownTerm"
+                placeholder="Edit UP/DOWN Rule Term ..."
+                [(ngModel)]="upDownRule.term"
+                (keyup.enter)="saveSearchInputDetails()"
+              />
+              <div class="input-group-append" *ngIf="shouldWarnForUnescapedQuotesInTerm(upDownRule.term)">
+                  <span class="input-group-text smui-clean-input-group-append">
+                    <span class="badge badge-warning">
+                      <i class="fa fa-info-circle"
+                         title="Solr/Lucene query syntax requires matching starting and closing quotes, escape them with \ if you want to match the quote character">&nbsp;</i>
+                      Unmatched quotes!
+                    </span>
+                  </span>
+              </div>
+            </div>
           </td>
           <td style="width:5%">
             <button
@@ -426,14 +437,27 @@
           <td
             ng-style="{'width' : (featureToggleService.getSyncToggleUiConceptAllRulesWithSolrFields()) ? '55%' : '75%'}"
           >
-            <input
-              type="text"
-              class="form-control"
-              id="inputFilterTerm"
-              placeholder="Edit FILTER Rule Term ..."
-              [(ngModel)]="filterRule.term"
-              (keyup.enter)="saveSearchInputDetails()"
-            />
+
+            <div class="input-group">
+              <input
+                type="text"
+                class="form-control"
+                id="inputFilterTerm"
+                placeholder="Edit FILTER Rule Term ..."
+                [(ngModel)]="filterRule.term"
+                (keyup.enter)="saveSearchInputDetails()"
+              />
+
+              <div class="input-group-append" *ngIf="shouldWarnForUnescapedQuotesInTerm(filterRule.term)">
+                  <span class="input-group-text smui-clean-input-group-append">
+                    <span class="badge badge-warning">
+                      <i class="fa fa-info-circle"
+                         title="Solr/Lucene query syntax requires matching starting and closing quotes, escape them with \ if you want to match the quote character">&nbsp;</i>
+                      Unmatched quotes!
+                    </span>
+                  </span>
+              </div>
+            </div>
           </td>
           <td style="width:5%">
             <button

frontend/src/app/components/details/rule-management/rule-management.component.ts

@@ -636,33 +636,59 @@ export class RuleManagementComponent implements OnChanges, OnInit, AfterContentC
     );
   }
 
-  warnSearchinputExact(): (string | undefined) {
+  warnSearchinputExact(): ([string, string] | null) {
     if(!this.detailSearchInput) {
-      return undefined
+      return null
     } else {
       if( SearchInput.isTermExact(this.detailSearchInput.term) ) {
-        return "exact match"
+        return ["exact match", "Matches only when a user enters the exact same query"]
       } else {
         if( SearchInput.isTermLeftExact(this.detailSearchInput.term) ) {
-          return "left exact"
+          return ["left exact", "Matches only queries starting with this input"]
         }
         else if( SearchInput.isTermRightExact(this.detailSearchInput.term) ) {
-          return "right exact"
+          return ["right exact", "Matches only queries ending with this input"]
         } else {
-          return undefined
+          return null
         }
       }
     }
   }
 
-  warnForExactMatchingSyntax(inSynonymTerm: string): boolean {
+  shouldWarnSearchinputExact(): boolean {
+    return this.detailSearchInput != undefined && this.warnForExactMatchingSyntax(this.detailSearchInput.term);
+  }
+
+  warnForExactMatchingSyntax(term: string): boolean {
     return (
-      SearchInput.isTermExact(inSynonymTerm)
-      || SearchInput.isTermLeftExact(inSynonymTerm)
-      || SearchInput.isTermRightExact(inSynonymTerm)
+      SearchInput.isTermExact(term)
+      || SearchInput.isTermLeftExact(term)
+      || SearchInput.isTermRightExact(term)
     )
   }
 
+  shouldWarnForUnescapedQuotesInTerm(term: string): boolean {
+    // if this is a term value used as a (Lucene) filter we should warn when there are unescaped quotes
+    const isSolrTarget = this.featureToggleService.getSyncToggleUiConceptAllRulesWithSolrFields();
+    if (isSolrTarget) {
+      let withinQuotes = false;
+      let escapeNext = false;
+      for (let i = 0; i < term.length; i++) {
+        const char = term[i];
+        if (escapeNext) {
+          escapeNext = false;
+        } else if (char === '\\') {
+          escapeNext = true;
+        } else if (char === '"') {
+          withinQuotes = !withinQuotes;
+        }
+      }
+      return withinQuotes;
+    } else {
+      return false;
+    }
+  }
+
   showPreviewLinks(): boolean {
     return this.previewLinkService.previewLinksAvailable()
   }