Fix for localized reference fields in query editor.

src/Squidex/app/features/content/pages/contents/contents-page.component.html

@@ -19,7 +19,8 @@
                     [query]="contentsState.contentsQuery | async"
                     [queries]="queries"
                     [queryModel]="queryModel"
-                    (queryChange)="search($event)" 
+                    (queryChange)="search($event)"
+                    [language]="languageMaster"
                     enableShortcut="true">
                 </sqx-search-form>
             </div>

src/Squidex/app/features/content/pages/contents/contents-page.component.ts

@@ -44,6 +44,7 @@ export class ContentsPageComponent extends ResourceOwner implements OnInit {
     public nextStatuses: ReadonlyArray<string> = [];
 
     public language: AppLanguageDto;
+    public languageMaster: AppLanguageDto;
     public languages: ReadonlyArray<AppLanguageDto>;
 
     public queryModel: QueryModel;
@@ -96,6 +97,7 @@ export class ContentsPageComponent extends ResourceOwner implements OnInit {
                 .subscribe(languages => {
                     this.languages = languages.map(x => x.language);
                     this.language = this.languages[0];
+                    this.languageMaster = this.languages.find(x => x.isMaster)!;
 
                     this.updateModel();
                 }));

src/Squidex/app/framework/angular/forms/confirm-click.directive.ts

@@ -5,12 +5,13 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
+// tslint:disable: readonly-array
+
 import { Directive, EventEmitter, HostListener, Input, OnDestroy, Output } from '@angular/core';
 
 import { DialogService } from '@app/framework/internal';
 
 class DelayEventEmitter<T> extends EventEmitter<T> {
-    // tslint:disable-next-line: readonly-array
     private delayedNexts: any[] | null = [];
 
     public delayEmit() {

src/Squidex/app/framework/angular/stateful.component.ts

@@ -5,6 +5,8 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
+// tslint:disable: readonly-array
+
 import { ChangeDetectorRef, OnDestroy } from '@angular/core';
 import { ControlValueAccessor } from '@angular/forms';
 import { Observable, Subscription } from 'rxjs';
@@ -17,7 +19,6 @@ import { State } from './../state';
 declare type UnsubscribeFunction = () => void;
 
 export class ResourceOwner implements OnDestroy {
-    // tslint:disable-next-line: readonly-array
     private subscriptions: (Subscription | UnsubscribeFunction)[] = [];
 
     public own<T>(subscription: Subscription | UnsubscribeFunction | Observable<T>) {

src/Squidex/app/shared/components/queries/filter-comparison.component.html

@@ -37,7 +37,8 @@
                         <sqx-references-dropdown [schemaId]="fieldModel.extra"
                             mode="Single"
                             [ngModel]="filter.value"
-                            (ngModelChange)="changeValue($event)">
+                            (ngModelChange)="changeValue($event)"
+                            [language]="language">
                         </sqx-references-dropdown>
                     </ng-container>
                     <ng-container *ngSwitchCase="'status'">

src/Squidex/app/shared/components/queries/filter-comparison.component.ts

@@ -10,10 +10,11 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, OnChanges, Out
 import {
     fadeAnimation,
     FilterComparison,
+    LanguageDto,
     QueryFieldModel,
-    QueryModel
+    QueryModel,
+    StatusInfo
 } from '@app/shared/internal';
-import { StatusInfo } from '@app/shared/services/contents.service';
 
  @Component({
     selector: 'sqx-filter-comparison',
@@ -31,6 +32,9 @@ export class FilterComparisonComponent implements OnChanges {
     @Output()
     public remove = new EventEmitter();
 
+    @Input()
+    public language: LanguageDto;
+
     @Input()
     public model: QueryModel;
 

src/Squidex/app/shared/components/queries/filter-logical.component.html

@@ -25,7 +25,7 @@
         <div class="filter mt-3" *ngFor="let filter of filters">
             <span class="filter-line-h"></span>
     
-            <sqx-filter-node [filter]="filter" [model]="model" [level]="level + 1"
+            <sqx-filter-node [filter]="filter" [language]="language" [level]="nestedLevel" [model]="model"
                 (remove)="removeFilter(filter)" (change)="emitChange()">
             </sqx-filter-node>
         </div>

src/Squidex/app/shared/components/queries/filter-logical.component.ts

@@ -5,12 +5,15 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
+ // tslint:disable: readonly-array
+
 import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
 
 import {
     fadeAnimation,
     FilterLogical,
     FilterNode,
+    LanguageDto,
     QueryModel
 } from '@app/shared/internal';
 
@@ -32,6 +35,9 @@ export class FilterLogicalComponent {
     @Output()
     public remove = new EventEmitter();
 
+    @Input()
+    public language: LanguageDto;
+
     @Input()
     public level = 0;
 
@@ -52,7 +58,10 @@ export class FilterLogicalComponent {
         return this.filterValue;
     }
 
-    // tslint:disable-next-line: readonly-array
+    public get nestedLevel() {
+        return this.level + 1;
+    }
+
     public filters: FilterNode[] = [];
 
     public addComparison() {

src/Squidex/app/shared/components/queries/filter-node.component.ts

@@ -11,6 +11,7 @@ import {
     FilterComparison,
     FilterLogical,
     FilterNode,
+    LanguageDto,
     QueryModel
 } from '@app/shared/internal';
 
@@ -18,13 +19,13 @@ import {
     selector: 'sqx-filter-node',
     template: `
         <ng-container *ngIf="logical">
-            <sqx-filter-logical [model]="model" [filter]="logical" [level]="level"
+            <sqx-filter-logical [model]="model" [filter]="logical" [language]="language" [level]="level"
                 (remove)="remove.emit()" (change)="change.emit()">
             </sqx-filter-logical>
         </ng-container>
 
         <ng-container *ngIf="comparison">
-            <sqx-filter-comparison [model]="model" [filter]="comparison"
+            <sqx-filter-comparison [model]="model" [filter]="comparison" [language]="language"
                 (remove)="remove.emit()" (change)="change.emit()">
             </sqx-filter-comparison>
         </ng-container>`,
@@ -39,6 +40,9 @@ export class FilterNodeComponent {
     @Output()
     public remove = new EventEmitter();
 
+    @Input()
+    public language: LanguageDto;
+
     @Input()
     public level: number;
 

src/Squidex/app/shared/components/queries/query.component.ts

@@ -1,6 +1,7 @@
 import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core';
 
 import {
+    LanguageDto,
     Query,
     QueryModel,
     QuerySorting
@@ -12,7 +13,7 @@ import {
         <div>
             <h4>Filter</h4>
 
-            <sqx-filter-logical isRoot="true" [filter]="queryValue.filter" [model]="model"
+            <sqx-filter-logical isRoot="true" [filter]="queryValue.filter" [model]="model" [language]="language"
                 (change)="emitQueryChange()">
             </sqx-filter-logical>
 
@@ -34,6 +35,9 @@ export class QueryComponent {
     @Output()
     public queryChange = new EventEmitter<Query>();
 
+    @Input()
+    public language: LanguageDto;
+
     @Input()
     public model: QueryModel;
 

src/Squidex/app/shared/components/references-dropdown.component.ts

@@ -103,7 +103,7 @@ export class ReferencesDropdownComponent extends StatefulControlComponent<State,
     }
 
     public ngOnInit() {
-        if (!this.schemaId) {
+        if (!this.schemaId || this.language) {
             this.selectionControl.disable();
             return;
         }
@@ -154,7 +154,7 @@ export class ReferencesDropdownComponent extends StatefulControlComponent<State,
             const name =
                 content.referenceFields
                     .map(f => getContentValue(content, this.languageField, f, false))
-                    .map(v => v.formatted)
+                    .map(v => v.formatted || 'No value')
                     .filter(v => !!v)
                     .join(', ');
 

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

@@ -55,7 +55,8 @@
             <sqx-query
                 [model]="queryModel" 
                 [query]="query"
-                (queryChange)="changeQuery($event)">
+                (queryChange)="changeQuery($event)"
+                [language]="language">
             </sqx-query>
 
             <div class="link">

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

@@ -13,6 +13,7 @@ import {
     DialogModel,
     fadeAnimation,
     hasFilter,
+    LanguageDto,
     Queries,
     Query,
     QueryModel,
@@ -37,6 +38,9 @@ export class SearchFormComponent implements OnChanges {
     @Input()
     public placeholder = '';
 
+    @Input()
+    public language: LanguageDto;
+
     @Input()
     public queryModel: QueryModel;