Only show selected schema.

src/Squidex/app/features/content/shared/content-selector-item.component.ts

@@ -20,7 +20,7 @@ import {
     selector: '[sqxContentSelectorItem]',
     template: `
         <tr (click)="toggle()">
-            <td class="cell-select">
+            <td class="cell-select" sqxStopClick>
                 <input type="checkbox" class="form-check"
                     [disabled]="!selectable"
                     [ngModel]="selected || !selectable"

src/Squidex/app/features/content/shared/contents-selector.component.html

@@ -5,7 +5,7 @@
                 <select class="form-control form-control-dark"
                     [ngModel]="schema?.id"
                     (ngModelChange)="selectSchema($event)">
-                    <option *ngFor="let schema of schemasState.schemas | async; let i = index" [ngValue]="schema.id">
+                    <option *ngFor="let schema of schemas" [ngValue]="schema.id">
                         Select {{schema.displayName}}
                     </option>
                 </select>

src/Squidex/app/features/content/shared/contents-selector.component.ts

@@ -5,7 +5,7 @@
  * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
  */
 
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { ChangeDetectorRef, Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
 
 import {
     ContentDto,
@@ -26,14 +26,16 @@ import {
     styleUrls: ['./contents-selector.component.scss'],
     templateUrl: './contents-selector.component.html',
     providers: [
-        ManualContentsState,
-        SchemasState
+        ManualContentsState
     ]
 })
 export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
     @Output()
     public select = new EventEmitter<ContentDto[]>();
 
+    @Input()
+    public schemaIds: string[];
+
     @Input()
     public language: LanguageDto;
 
@@ -47,6 +49,7 @@ export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
     public alreadySelected: ContentDto[];
 
     public schema: SchemaDetailsDto;
+    public schemas: SchemaDto[] = [];
 
     public queryModel: QueryModel;
 
@@ -58,7 +61,8 @@ export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
 
     constructor(
         public readonly contentsState: ManualContentsState,
-        public readonly schemasState: SchemasState
+        public readonly schemasState: SchemasState,
+        private readonly changeDetector: ChangeDetectorRef
     ) {
         super();
     }
@@ -70,9 +74,25 @@ export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
                     this.updateModel();
                 }));
 
-        this.own(
-            this.schemasState.selectedSchema
-                .subscribe(schema => {
+        this.schemas = this.schemasState.snapshot.schemas.values;
+
+        if (this.schemaIds && this.schemaIds.length > 0) {
+            this.schemas = this.schemas.filter(x => this.schemaIds.indexOf(x.id) >= 0);
+        }
+
+        this.selectSchema(this.schemas[0]);
+
+        this.changeDetector.detectChanges();
+    }
+
+    public selectSchema(selected: string | SchemaDto) {
+        if (Types.is(selected, SchemaDto)) {
+            selected = selected.id;
+        }
+
+        this.schemasState.loadSchema(selected)
+            .subscribe(schema => {
+                if (schema) {
                     this.schema = schema;
 
                     this.minWidth = `${200 + (200 * schema.referenceFields.length)}px`;
@@ -81,22 +101,12 @@ export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
                     this.contentsState.load();
 
                     this.updateModel();
-                }));
 
-        this.schemasState.load()
-            .subscribe(() => {
-                this.selectSchema(this.schemasState.snapshot.schemas.at(0));
+                    this.changeDetector.detectChanges();
+                }
             });
     }
 
-    public selectSchema(selected: string | SchemaDto) {
-        if (Types.is(selected, SchemaDto)) {
-            this.schemasState.select(selected.id).subscribe();
-        } else {
-            this.schemasState.select(selected).subscribe();
-        }
-    }
-
     public reload() {
         this.contentsState.load(true);
     }
@@ -138,7 +148,9 @@ export class ContentsSelectorComponent extends ResourceOwner implements OnInit {
 
         if (isSelected) {
             for (let content of this.contentsState.snapshot.contents.values) {
-                this.selectedItems[content.id] = content;
+                if (!this.isItemAlreadySelected(content)) {
+                    this.selectedItems[content.id] = content;
+                }
             }
         }
 

src/Squidex/app/features/content/shared/references-editor.component.html

@@ -26,6 +26,7 @@
         [alreadySelected]="snapshot.contentItems"
         [language]="language"
         [languages]="languages"
+        [schemaIds]="schemaIds"
         (select)="select($event)">
     </sqx-contents-selector>
 </ng-container>

src/Squidex/app/shared/state/schemas.state.ts

@@ -110,7 +110,7 @@ export class SchemasState extends State<Snapshot> {
             }));
     }
 
-    private loadSchema(idOrName: string | null) {
+    public loadSchema(idOrName: string | null) {
         return !idOrName ? of(null) :
             this.schemasService.getSchema(this.appName, idOrName).pipe(
                 catchError(() => of(null)));