chore(admin-ui): Set the baseHref to /admin/

admin-ui/angular.json

@@ -17,6 +17,7 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
+            "baseHref": "/admin/",
             "outputPath": "dist/vendure-admin",
             "index": "src/index.html",
             "main": "src/main.ts",
@@ -57,7 +58,7 @@
               "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
-              "buildOptimizer": true
+              "buildOptimizer": true,
             }
           }
         },

admin-ui/src/app/app.module.ts

@@ -1,5 +1,6 @@
+import { APP_BASE_HREF, PlatformLocation } from '@angular/common';
 import { HttpClient } from '@angular/common/http';
-import { NgModule } from '@angular/core';
+import { Inject, Injectable, NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { RouterModule } from '@angular/router';
 import { TranslateCompiler, TranslateLoader, TranslateModule } from '@ngx-translate/core';
@@ -13,8 +14,15 @@ import { CustomHttpTranslationLoader } from './core/providers/i18n/custom-http-l
 import { I18nService } from './core/providers/i18n/i18n.service';
 import { DataService } from './data/providers/data.service';
 
-export function HttpLoaderFactory(http: HttpClient) {
-    return new CustomHttpTranslationLoader(http, '/i18n-messages/');
+@Injectable()
+export class BaseHrefHolder {
+    constructor(@Inject(APP_BASE_HREF) public addBaseHref: string) {}
+}
+
+export function HttpLoaderFactory(http: HttpClient, location: PlatformLocation) {
+    // Dynamically get the baseHref, which is configured in the angular.json file
+    const baseHref = location.getBaseHrefFromDOM();
+    return new CustomHttpTranslationLoader(http, baseHref + '/i18n-messages/');
 }
 
 @NgModule({
@@ -26,13 +34,13 @@ export function HttpLoaderFactory(http: HttpClient) {
             loader: {
                 provide: TranslateLoader,
                 useFactory: HttpLoaderFactory,
-                deps: [HttpClient],
+                deps: [HttpClient, PlatformLocation],
             },
             compiler: { provide: TranslateCompiler, useClass: TranslateMessageFormatCompiler },
         }),
         CoreModule,
     ],
-    providers: [],
+    providers: [BaseHrefHolder],
     bootstrap: [AppComponent],
 })
 export class AppModule {

admin-ui/src/app/core/components/app-shell/app-shell.component.html

@@ -6,7 +6,7 @@
     -->
     <clr-header>
         <div class="branding">
-            <a [routerLink]="['/']"><img src="/assets/cube-logo-75px.png" class="logo" /></a>
+            <a [routerLink]="['/']"><img src="assets/cube-logo-75px.png" class="logo" /></a>
         </div>
         <div class="header-nav"></div>
         <div class="header-actions">

admin-ui/src/app/login/components/login/login.component.html

@@ -1,6 +1,6 @@
 <div class="login-wrapper">
     <form class="login">
-        <label class="title"><img src="/assets/cube-logo-300px.png" /></label>
+        <label class="title"><img src="assets/cube-logo-300px.png" /></label>
         <div class="login-group">
             <input
                 class="username"