Use languages state

src/Squidex/app/features/content/module.ts

@@ -11,7 +11,7 @@ import { DndModule } from 'ng2-dnd';
 
 import {
     CanDeactivateGuard,
-    ResolveAppLanguagesGuard,
+    LoadLanguagesGuard,
     ResolveContentGuard,
     SchemaMustExistPublishedGuard,
     SqxFrameworkModule,
@@ -35,6 +35,7 @@ const routes: Routes = [
     {
         path: '',
         component: SchemasPageComponent,
+        canActivate: [LoadLanguagesGuard],
         children: [
             {
                 path: ''
@@ -42,9 +43,6 @@ const routes: Routes = [
             {
                 path: ':schemaName',
                 canActivate: [SchemaMustExistPublishedGuard],
-                resolve: {
-                    appLanguages: ResolveAppLanguagesGuard
-                },
                 children: [
                     {
                         path: '',

src/Squidex/app/features/content/pages/content/content-field.component.ts

@@ -11,7 +11,8 @@ import { AbstractControl, FormGroup } from '@angular/forms';
 import {
     AppLanguageDto,
     FieldDto,
-    fieldInvariant
+    fieldInvariant,
+    ImmutableArray
 } from '@app/shared';
 
 @Component({
@@ -30,7 +31,7 @@ export class ContentFieldComponent implements OnInit {
     public language: AppLanguageDto;
 
     @Input()
-    public languages: AppLanguageDto[];
+    public languages: ImmutableArray<AppLanguageDto>;
 
     @Input()
     public contentFormSubmitted: boolean;

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

@@ -20,6 +20,8 @@ import {
     ContentDto,
     ContentsService,
     fieldInvariant,
+    ImmutableArray,
+    LanguagesState,
     SchemaDetailsDto,
     SchemasState,
     Version
@@ -35,6 +37,7 @@ import {
 })
 export class ContentPageComponent implements CanComponentDeactivate, OnDestroy, OnInit {
     private contentVersionSelectedSubscription: Subscription;
+    private languagesSubscription: Subscription;
     private selectedSchemaSubscription: Subscription;
 
     public schema: SchemaDetailsDto;
@@ -46,9 +49,11 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
 
     public isNewMode = true;
 
-    public languages: AppLanguageDto[] = [];
+    public languages: ImmutableArray<AppLanguageDto>;
 
-    constructor(public readonly ctx: AppContext,
+    constructor(
+        public readonly ctx: AppContext,
+        public readonly languagesState: LanguagesState,
         private readonly contentsService: ContentsService,
         private readonly router: Router,
         private readonly schemasState: SchemasState
@@ -57,6 +62,7 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
 
     public ngOnDestroy() {
         this.contentVersionSelectedSubscription.unsubscribe();
+        this.languagesSubscription.unsubscribe();
         this.selectedSchemaSubscription.unsubscribe();
     }
 
@@ -67,6 +73,12 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
                     this.loadVersion(message.version);
                 });
 
+        this.languagesSubscription =
+            this.languagesState.languages
+                .subscribe(languages => {
+                    this.languages = languages.map(x => x.language);
+                });
+
         this.selectedSchemaSubscription =
             this.schemasState.selectedSchema
                 .subscribe(schema => {
@@ -206,7 +218,7 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
             const fieldForm = new FormGroup({});
 
             if (field.isLocalizable) {
-                for (let language of this.languages) {
+                for (let language of this.languages.values) {
                     fieldForm.setControl(language.iso2Code, new FormControl(undefined, field.createValidators(language.isOptional)));
                 }
             } else {
@@ -233,7 +245,7 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
                 const fieldForm = <FormGroup>this.contentForm.controls[field.name];
 
                 if (field.isLocalizable) {
-                    for (let language of this.languages) {
+                    for (let language of this.languages.values) {
                         fieldForm.controls[language.iso2Code].setValue(fieldValue[language.iso2Code]);
                     }
                 } else {
@@ -251,7 +263,7 @@ export class ContentPageComponent implements CanComponentDeactivate, OnDestroy,
                     const fieldForm = <FormGroup>this.contentForm.controls[field.name];
 
                     if (field.isLocalizable) {
-                        for (let language of this.languages) {
+                        for (let language of this.languages.values) {
                             fieldForm.controls[language.iso2Code].setValue(defaultValue);
                         }
                     } else {

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

@@ -87,7 +87,7 @@
                     <tbody>
                         <ng-template ngFor let-content [ngForOf]="contentItems" [ngForTrackBy]="trackByContent">
                             <tr [sqxContent]="content" [routerLink]="[content.id]" routerLinkActive="active"
-                                [language]="languageSelected"
+                                [language]="language"
                                 [schema]="schema"
                                 [selected]="isItemSelected(content)"
                                 (selectedChange)="selectItem(content, $event)"

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

@@ -9,13 +9,13 @@ import { Component, OnDestroy, OnInit } from '@angular/core';
 import { Observable, Subscription } from 'rxjs';
 
 import {
-    allData,
     AppContext,
     AppLanguageDto,
     ContentDto,
     ContentsService,
     DateTime,
     ImmutableArray,
+    LanguagesState,
     ModalView,
     Pager,
     SchemaDetailsDto,
@@ -33,6 +33,7 @@ import {
 })
 export class ContentsPageComponent implements OnDestroy, OnInit {
     private selectedSchemaSubscription: Subscription;
+    private languagesSubscription: Subscription;
 
     public schema: SchemaDetailsDto;
 
@@ -54,20 +55,22 @@ export class ContentsPageComponent implements OnDestroy, OnInit {
     public canUnpublish = false;
     public canPublish = false;
 
-    public languages: AppLanguageDto[] = [];
-    public languageSelected: AppLanguageDto;
+    public language: AppLanguageDto;
+    public languages: ImmutableArray<AppLanguageDto>;
     public languageParameter: string;
 
     public isAllSelected = false;
     public isArchive = false;
 
     constructor(public readonly ctx: AppContext,
+        private readonly languagesState: LanguagesState,
         private readonly contentsService: ContentsService,
         private readonly schemasState: SchemasState
     ) {
     }
 
     public ngOnDestroy() {
+        this.languagesSubscription.unsubscribe();
         this.selectedSchemaSubscription.unsubscribe();
     }
 
@@ -81,10 +84,12 @@ export class ContentsPageComponent implements OnDestroy, OnInit {
                     this.load();
                 });
 
-        const routeData = allData(this.ctx.route);
-
-        this.languages = routeData.appLanguages;
-        this.languageSelected = this.languages[0];
+        this.languagesSubscription =
+            this.languagesState.languages
+                .subscribe(languages => {
+                    this.languages = languages.map(x => x.language);
+                    this.language = this.languages.at(0);
+                });
     }
 
     public publishContent(content: ContentDto) {
@@ -301,7 +306,7 @@ export class ContentsPageComponent implements OnDestroy, OnInit {
     }
 
     public selectLanguage(language: AppLanguageDto) {
-        this.languageSelected = language;
+        this.language = language;
     }
 
     public trackByContent(content: ContentDto): string {

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

@@ -45,7 +45,7 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit {
     public language: AppLanguageDto;
 
     @Input()
-    public languages: AppLanguageDto[];
+    public languages: ImmutableArray<AppLanguageDto>;
 
     public isModalVisibible = false;
 

src/Squidex/app/shared/guards/load-languages.guard.spec.ts

@@ -0,0 +1,38 @@
+/*
+ * Squidex Headless CMS
+ *
+ * @license
+ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
+ */
+
+import { Observable } from 'rxjs';
+import { IMock, Mock, Times } from 'typemoq';
+
+import { LanguagesState } from '@app/shared';
+
+import { LoadLanguagesGuard } from './load-languages.guard';
+
+describe('LoadLanguagesGuard', () => {
+    let languagesState: IMock<LanguagesState>;
+    let languageGuard: LoadLanguagesGuard;
+
+    beforeEach(() => {
+        languagesState = Mock.ofType<LanguagesState>();
+        languageGuard = new LoadLanguagesGuard(languagesState.object);
+    });
+
+    it('should load languages', () => {
+        languagesState.setup(x => x.load())
+            .returns(() => Observable.of(null));
+
+        let result = false;
+
+        languageGuard.canActivate().subscribe(value => {
+            result = value;
+        });
+
+        expect(result).toBeTruthy();
+
+        languagesState.verify(x => x.load(), Times.once());
+    });
+});

src/Squidex/app/shared/guards/load-languages.guard.ts

@@ -0,0 +1,24 @@
+/*
+ * Squidex Headless CMS
+ *
+ * @license
+ * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
+ */
+
+import { Injectable } from '@angular/core';
+import { CanActivate } from '@angular/router';
+import { Observable } from 'rxjs';
+
+import { LanguagesState } from './../state/languages.state';
+
+@Injectable()
+export class LoadLanguagesGuard implements CanActivate {
+    constructor(
+        private readonly languagesState: LanguagesState
+    ) {
+    }
+
+    public canActivate(): Observable<boolean> {
+        return this.languagesState.load().map(a => true);
+    }
+}

src/Squidex/app/shared/guards/resolve-app-languages.guard.ts

@@ -1,42 +0,0 @@
-/*
- * Squidex Headless CMS
- *
- * @license
- * Copyright (c) Squidex UG (haftungsbeschränkt). All rights reserved.
- */
-
-import { Injectable } from '@angular/core';
-import { ActivatedRouteSnapshot, Resolve, Router } from '@angular/router';
-import { Observable } from 'rxjs';
-
-import { allParams } from '@app/framework';
-
-import { AppLanguageDto, AppLanguagesService } from './../services/app-languages.service';
-
-@Injectable()
-export class ResolveAppLanguagesGuard implements Resolve<AppLanguageDto[] | null> {
-    constructor(
-        private readonly appLanguagesService: AppLanguagesService,
-        private readonly router: Router
-    ) {
-    }
-
-    public resolve(route: ActivatedRouteSnapshot): Observable<AppLanguageDto[] | null> {
-        const appName = allParams(route)['appName'];
-
-        const result =
-            this.appLanguagesService.getLanguages(appName).map(d => d.languages)
-                .do(dto => {
-                    if (!dto) {
-                        this.router.navigate(['/404']);
-                    }
-                })
-                .catch(error => {
-                    this.router.navigate(['/404']);
-
-                    return Observable.of(null);
-                });
-
-        return result;
-    }
-}

src/Squidex/app/shared/internal.ts

@@ -7,9 +7,9 @@
 
 export * from './guards/app-must-exist.guard';
 export * from './guards/load-apps.guard';
+export * from './guards/load-languages.guard';
 export * from './guards/must-be-authenticated.guard';
 export * from './guards/must-be-not-authenticated.guard';
-export * from './guards/resolve-app-languages.guard';
 export * from './guards/resolve-content.guard';
 export * from './guards/schema-must-exist-published.guard';
 export * from './guards/schema-must-exist.guard';

src/Squidex/app/shared/module.ts

@@ -47,13 +47,13 @@ import {
     LanguagesService,
     LanguagesState,
     LoadAppsGuard,
+    LoadLanguagesGuard,
     MarkdownEditorComponent,
     MustBeAuthenticatedGuard,
     MustBeNotAuthenticatedGuard,
     PatternsState,
     PlansService,
     PlansState,
-    ResolveAppLanguagesGuard,
     ResolveContentGuard,
     RichEditorComponent,
     RulesService,
@@ -154,12 +154,12 @@ export class SqxSharedModule {
                 LanguagesService,
                 LanguagesState,
                 LoadAppsGuard,
+                LoadLanguagesGuard,
                 MustBeAuthenticatedGuard,
                 MustBeNotAuthenticatedGuard,
                 PatternsState,
                 PlansService,
                 PlansState,
-                ResolveAppLanguagesGuard,
                 ResolveContentGuard,
                 RulesService,
                 RulesState,