Lazy load static objects

2 files changed, 31 insertions, 15 deletions

diff --git a/client/src/app/+about/about-instance/about-instance.component.ts b/client/src/app/+about/about-instance/about-instance.component.ts
index 16ccae2e2..87beb13da 100644
--- a/client/src/app/+about/about-instance/about-instance.component.ts
+++ b/client/src/app/+about/about-instance/about-instance.component.ts
@@ -5,7 +5,8 @@ import { ContactAdminModalComponent } from '@app/+about/about-instance/contact-a
 import { InstanceService } from '@app/shared/instance/instance.service'
 import { MarkdownService } from '@app/shared/renderer'
 import { forkJoin } from 'rxjs'
-import { first } from 'rxjs/operators'
+import { map, switchMap } from 'rxjs/operators'
+import { ServerConfig } from '@shared/models'
 
 @Component({
   selector: 'my-about-instance',
@@ -33,6 +34,8 @@ export class AboutInstanceComponent implements OnInit {
   languages: string[] = []
   categories: string[] = []
 
+  serverConfig: ServerConfig
+
   constructor (
     private notifier: Notifier,
     private serverService: ServerService,
@@ -42,25 +45,35 @@ export class AboutInstanceComponent implements OnInit {
   ) {}
 
   get instanceName () {
-    return this.serverService.getConfig().instance.name
+    return this.serverConfig.instance.name
   }
 
   get isContactFormEnabled () {
-    return this.serverService.getConfig().email.enabled && this.serverService.getConfig().contactForm.enabled
+    return this.serverConfig.email.enabled && this.serverConfig.contactForm.enabled
   }
 
   get isNSFW () {
-    return this.serverService.getConfig().instance.isNSFW
+    return this.serverConfig.instance.isNSFW
   }
 
   ngOnInit () {
-    forkJoin([
-      this.instanceService.getAbout(),
-      this.serverService.localeObservable.pipe(first()),
-      this.serverService.videoLanguagesLoaded.pipe(first()),
-      this.serverService.videoCategoriesLoaded.pipe(first())
-    ]).subscribe(
-      async ([ about, translations ]) => {
+    this.serverConfig = this.serverService.getTmpConfig()
+    this.serverService.getConfig()
+        .subscribe(config => this.serverConfig = config)
+
+    this.instanceService.getAbout()
+        .pipe(
+          switchMap(about => {
+            return forkJoin([
+              this.instanceService.buildTranslatedLanguages(about),
+              this.instanceService.buildTranslatedCategories(about)
+            ]).pipe(map(([ languages, categories ]) => ({ about, languages, categories })))
+          })
+        ).subscribe(
+      async ({ about, languages, categories }) => {
+        this.languages = languages
+        this.categories = categories
+
         this.shortDescription = about.instance.shortDescription
 
         this.creationReason = about.instance.creationReason
@@ -68,9 +81,6 @@ export class AboutInstanceComponent implements OnInit {
         this.businessModel = about.instance.businessModel
 
         this.html = await this.instanceService.buildHtml(about)
-
-        this.languages = this.instanceService.buildTranslatedLanguages(about, translations)
-        this.categories = this.instanceService.buildTranslatedCategories(about, translations)
       },
 
       () => this.notifier.error(this.i18n('Cannot get about information from server'))
diff --git a/client/src/app/+about/about-instance/contact-admin-modal.component.ts b/client/src/app/+about/about-instance/contact-admin-modal.component.ts
index 878d49b55..2ed41e741 100644
--- a/client/src/app/+about/about-instance/contact-admin-modal.component.ts
+++ b/client/src/app/+about/about-instance/contact-admin-modal.component.ts
@@ -6,6 +6,7 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
 import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
 import { FormReactive, InstanceValidatorsService } from '@app/shared'
 import { InstanceService } from '@app/shared/instance/instance.service'
+import { ServerConfig } from '@shared/models'
 
 @Component({
   selector: 'my-contact-admin-modal',
@@ -18,6 +19,7 @@ export class ContactAdminModalComponent extends FormReactive implements OnInit {
   error: string
 
   private openedModal: NgbModalRef
+  private serverConfig: ServerConfig
 
   constructor (
     protected formValidatorService: FormValidatorService,
@@ -32,10 +34,14 @@ export class ContactAdminModalComponent extends FormReactive implements OnInit {
   }
 
   get instanceName () {
-    return this.serverService.getConfig().instance.name
+    return this.serverConfig.instance.name
   }
 
   ngOnInit () {
+    this.serverConfig = this.serverService.getTmpConfig()
+    this.serverService.getConfig()
+        .subscribe(config => this.serverConfig = config)
+
     this.buildForm({
       fromName: this.instanceValidatorsService.FROM_NAME,
       fromEmail: this.instanceValidatorsService.FROM_EMAIL,