fix(admin-ui): Apply variant name auto-generation for new translations

Closes #600

packages/admin-ui/src/lib/catalog/src/providers/product-detail/product-detail.service.ts

@@ -163,9 +163,9 @@ export class ProductDetailService {
         if (productInput) {
             updateOperations.push(this.dataService.product.updateProduct(productInput));
 
-            const productOldName = findTranslation(product, languageCode)?.name;
+            const productOldName = findTranslation(product, languageCode)?.name ?? '';
             const productNewName = findTranslation(productInput, languageCode)?.name;
-            if (productOldName && productNewName && productOldName !== productNewName && autoUpdate) {
+            if (productNewName && productOldName !== productNewName && autoUpdate) {
                 for (const variant of product.variants) {
                     const currentVariantName = findTranslation(variant, languageCode)?.name || '';
                     let variantInput: UpdateProductVariantInput;
@@ -181,11 +181,21 @@ export class ProductDetailService {
                     }
                     const variantTranslation = findTranslation(variantInput, languageCode);
                     if (variantTranslation) {
-                        variantTranslation.name = replaceLast(
-                            variantTranslation.name,
-                            productOldName,
-                            productNewName,
-                        );
+                        if (variantTranslation.name) {
+                            variantTranslation.name = replaceLast(
+                                variantTranslation.name,
+                                productOldName,
+                                productNewName,
+                            );
+                        } else {
+                            // The variant translation was falsy, which occurs
+                            // when defining the product name for a new translation
+                            // language that had not yet been defined.
+                            variantTranslation.name = [
+                                productNewName,
+                                ...variant.options.map(o => o.name),
+                            ].join(' ');
+                        }
                     }
                 }
             }

packages/admin-ui/src/lib/core/src/app.component.ts

@@ -1,9 +1,11 @@
 import { DOCUMENT } from '@angular/common';
 import { Component, HostBinding, Inject, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
 import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 
 import { DataService } from './data/providers/data.service';
+import { LocalStorageService } from './providers/local-storage/local-storage.service';
 
 @Component({
     selector: 'vdr-root',
@@ -14,7 +16,11 @@ export class AppComponent implements OnInit {
     loading$: Observable<boolean>;
     private _document?: Document;
 
-    constructor(private dataService: DataService, @Inject(DOCUMENT) private document?: any) {
+    constructor(
+        private dataService: DataService,
+        private localStorageService: LocalStorageService,
+        @Inject(DOCUMENT) private document?: any,
+    ) {
         this._document = document;
     }
 
@@ -29,5 +35,12 @@ export class AppComponent implements OnInit {
             .subscribe(theme => {
                 this._document?.body.setAttribute('data-theme', theme);
             });
+
+        this.dataService.client
+            .uiState()
+            .mapStream(data => data.uiState.contentLanguage)
+            .subscribe(code => {
+                this.localStorageService.set('contentLanguageCode', code);
+            });
     }
 }

packages/admin-ui/src/lib/settings/src/components/global-settings/global-settings.component.ts

@@ -8,7 +8,6 @@ import {
     DataService,
     GlobalSettings,
     LanguageCode,
-    LocalStorageService,
     NotificationService,
     Permission,
     ServerConfigService,
@@ -35,7 +34,6 @@ export class GlobalSettingsComponent extends BaseDetailComponent<GlobalSettings>
         protected dataService: DataService,
         private formBuilder: FormBuilder,
         private notificationService: NotificationService,
-        private localStorageService: LocalStorageService,
     ) {
         super(route, router, serverConfigService, dataService);
         this.customFields = this.getCustomFieldConfig('GlobalSettings');
@@ -93,7 +91,6 @@ export class GlobalSettingsComponent extends BaseDetailComponent<GlobalSettings>
                 const availableLangs = globalSettings.availableLanguages;
                 if (availableLangs.length && !availableLangs.includes(uiState.contentLanguage)) {
                     this.dataService.client.setContentLanguage(availableLangs[0]).subscribe();
-                    this.localStorageService.set('contentLanguageCode', availableLangs[0]);
                 }
             });
     }