Escaping ':' in search queries, except if advanced=true

Following up on the issue DSpace/DSpace#9670 - here is a first
proposal.

Per default, this sets the 'advanced' flag to false and will escape ':' characters in the search string.
Only with 'advanced = true' is the search string passed as-is.

TODO:
- add tests
- make sure this looks good

Author: ineiti

src/app/shared/search-form/search-form.component.html

@@ -11,6 +11,7 @@
       <input type="text" [(ngModel)]="query" name="query" class="form-control"
         [attr.aria-label]="searchPlaceholder" [attr.data-test]="'search-box' | dsBrowserOnly"
         [placeholder]="searchPlaceholder">
+      <input type="checkbox" [(ngModel)]="advanced" [attr.name]="{{ ('search.form.advanced' | translate ) }}" checked />
       <button type="submit" class="search-button btn btn-{{brandColor}}" [attr.data-test]="'search-button' | dsBrowserOnly"><i class="fas fa-search"></i> {{ ('search.form.search' | translate) }}</button>
     </div>
   </div>

src/app/shared/search-form/search-form.component.ts

@@ -48,6 +48,11 @@ export class SearchFormComponent implements OnChanges {
    */
   @Input() query: string;
 
+  /**
+   * True to pass the search query without esacping of special characters.
+   */
+  @Input() advanced: boolean;
+
   /**
    * True when the search component should show results on the current page
    */

src/app/shared/search/models/search-options.model.ts

@@ -18,11 +18,12 @@ export class SearchOptions {
   dsoTypes?: DSpaceObjectType[];
   filters?: SearchFilter[];
   fixedFilter?: string;
+  advanced?: boolean;
 
   constructor(
     options: {
       configuration?: string, scope?: string, query?: string, dsoTypes?: DSpaceObjectType[], filters?: SearchFilter[],
-      fixedFilter?: string
+      fixedFilter?: string, advanced?: boolean
     },
   ) {
     this.configuration = options.configuration;
@@ -31,6 +32,7 @@ export class SearchOptions {
     this.dsoTypes = options.dsoTypes;
     this.filters = options.filters;
     this.fixedFilter = options.fixedFilter;
+    this.advanced = options.advanced;
   }
 
   /**
@@ -47,6 +49,9 @@ export class SearchOptions {
       args.push(this.encodedFixedFilter);
     }
     if (isNotEmpty(this.query)) {
+      if (!this.advanced){
+        this.query.replace(":", "\:");
+      }
       args.push(`query=${encodeURIComponent(this.query)}`);
     }
     if (isNotEmpty(this.scope)) {

src/app/shared/search/search.component.ts

@@ -82,6 +82,7 @@ import { SelectionConfig } from './search-results/search-results.component';
 import { ThemedSearchResultsComponent } from './search-results/themed-search-results.component';
 import { ThemedSearchSidebarComponent } from './search-sidebar/themed-search-sidebar.component';
 import { SearchConfigurationOption } from './search-switch-configuration/search-configuration-option.model';
+import { compileOpaqueAsyncClassMetadata } from '@angular/compiler';
 
 @Component({
   selector: 'ds-base-search',
@@ -227,6 +228,11 @@ export class SearchComponent implements OnDestroy, OnInit {
    */
   @Input() query: string;
 
+  /**
+   * True to pass the query as-is without escaping of special characters.
+   */
+  @Input() advanced = false;
+
   /**
    * The fallback scope when no scope is defined in the url, if this is also undefined no scope will be set
    */
@@ -427,6 +433,7 @@ export class SearchComponent implements OnDestroy, OnInit {
         });
       if (combinedOptions.query === '') {
         combinedOptions.query = this.query;
+        combinedOptions.advanced = this.advanced;
       }
       if (isEmpty(combinedOptions.scope)) {
         combinedOptions.scope = scope;

src/assets/i18n/en.json5

@@ -4737,6 +4737,8 @@
 
   "search.form.search": "Search",
 
+  "search.form.search": "Advanced",
+
   "search.form.search_dspace": "All repository",
 
   "search.form.scope.all": "All of DSpace",