fix(admin-ui): Add channelTokenKey to AdminUiConfig (#2307)

docs/content/typescript-api/core-plugins/admin-ui-plugin/admin-ui-config.md

@@ -79,6 +79,13 @@ option.{{< /member-description >}}
 setting of the server's `authOptions.authTokenHeaderKey` config
 option.{{< /member-description >}}
 
+### channelTokenKey
+
+{{< member-info kind="property" type="string" default="'vendure-token'"  >}}
+
+{{< member-description >}}The name of the header which contains the channel token. Should match the
+setting of the server's `apiOptions.channelTokenKey` config option.{{< /member-description >}}
+
 ### defaultLanguage
 
 {{< member-info kind="property" type="<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>" default="<a href='/typescript-api/common/language-code#languagecode'>LanguageCode</a>.en"  >}}

packages/admin-ui-plugin/src/plugin.ts

@@ -1,5 +1,5 @@
 import { MiddlewareConsumer, NestModule } from '@nestjs/common';
-import { DEFAULT_AUTH_TOKEN_HEADER_KEY } from '@vendure/common/lib/shared-constants';
+import { DEFAULT_AUTH_TOKEN_HEADER_KEY, DEFAULT_CHANNEL_TOKEN_KEY } from '@vendure/common/lib/shared-constants';
 import {
     AdminUiAppConfig,
     AdminUiAppDevModeConfig,
@@ -251,7 +251,7 @@ export class AdminUiPlugin implements NestModule {
      * config object for writing to disk.
      */
     private getAdminUiConfig(partialConfig?: Partial<AdminUiConfig>): AdminUiConfig {
-        const { authOptions } = this.configService;
+        const { authOptions, apiOptions } = this.configService;
         // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         const options = AdminUiPlugin.options!;
         const propOrDefault = <Prop extends keyof AdminUiConfig>(
@@ -261,7 +261,7 @@ export class AdminUiPlugin implements NestModule {
             return partialConfig ? (partialConfig as AdminUiConfig)[prop] || defaultVal : defaultVal;
         };
         return {
-            adminApiPath: propOrDefault('adminApiPath', this.configService.apiOptions.adminApiPath),
+            adminApiPath: propOrDefault('adminApiPath', apiOptions.adminApiPath),
             apiHost: propOrDefault('apiHost', 'auto'),
             apiPort: propOrDefault('apiPort', 'auto'),
             tokenMethod: propOrDefault(
@@ -272,6 +272,10 @@ export class AdminUiPlugin implements NestModule {
                 'authTokenHeaderKey',
                 authOptions.authTokenHeaderKey || DEFAULT_AUTH_TOKEN_HEADER_KEY,
             ),
+            channelTokenKey: propOrDefault(
+                'channelTokenKey',
+                apiOptions.channelTokenKey || DEFAULT_CHANNEL_TOKEN_KEY
+            ),
             defaultLanguage: propOrDefault('defaultLanguage', defaultLanguage),
             defaultLocale: propOrDefault('defaultLocale', defaultLocale),
             availableLanguages: propOrDefault('availableLanguages', defaultAvailableLanguages),

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

@@ -1,15 +1,9 @@
 import { AdminUiConfig } from '@vendure/common/lib/shared-types';
 
-import { LanguageCode } from './common/generated-types';
-
 let vendureUiConfig: AdminUiConfig | undefined;
 
-export function loadAppConfig(): Promise<void> {
-    return fetch('./vendure-ui-config.json')
-        .then(res => res.json())
-        .then(config => {
-            vendureUiConfig = config;
-        });
+export async function loadAppConfig(): Promise<void> {
+    vendureUiConfig = await fetch('./vendure-ui-config.json').then(res => res.json());
 }
 
 export function getAppConfig(): AdminUiConfig {

packages/admin-ui/src/lib/core/src/data/data.module.ts

@@ -27,7 +27,7 @@ export function createApollo(
     fetchAdapter: FetchAdapter,
     injector: Injector,
 ): ApolloClientOptions<any> {
-    const { adminApiPath, tokenMethod } = getAppConfig();
+    const { adminApiPath, tokenMethod, channelTokenKey } = getAppConfig();
     const serverLocation = getServerLocation();
     const apolloCache = new InMemoryCache({
         possibleTypes: introspectionResult.possibleTypes,
@@ -66,7 +66,7 @@ export function createApollo(
                 const headers: Record<string, string> = {};
                 const channelToken = localStorageService.get('activeChannelToken');
                 if (channelToken) {
-                    headers['vendure-token'] = channelToken;
+                    headers[channelTokenKey] = channelToken;
                 }
                 if (tokenMethod === 'bearer') {
                     const authToken = localStorageService.get('authToken');

packages/common/src/shared-constants.ts

@@ -14,6 +14,7 @@ export const CUSTOMER_ROLE_CODE = '__customer_role__';
 export const CUSTOMER_ROLE_DESCRIPTION = 'Customer';
 export const ROOT_COLLECTION_NAME = '__root_collection__';
 export const DEFAULT_AUTH_TOKEN_HEADER_KEY = 'vendure-auth-token';
+export const DEFAULT_CHANNEL_TOKEN_KEY = 'vendure-token'
 
 // An environment variable which is set when the @vendure/create
 // script is run. Can be used to modify normal behaviour

packages/common/src/shared-types.ts

@@ -249,12 +249,19 @@ export interface AdminUiConfig {
     /**
      * @description
      * The header used when using the 'bearer' auth method. Should match the
-     * setting of the server's `authOptions.authTokenHeaderKey` config
-     * option.
+     * setting of the server's `authOptions.authTokenHeaderKey` config option.
      *
      * @default 'vendure-auth-token'
      */
     authTokenHeaderKey: string;
+    /**
+     * @description
+     * The name of the header which contains the channel token. Should match the
+     * setting of the server's `apiOptions.channelTokenKey` config option.
+     *
+     * @default 'vendure-token'
+     */
+    channelTokenKey: string;
     /**
      * @description
      * The default language for the Admin UI. Must be one of the

packages/core/src/config/default-config.ts

@@ -3,6 +3,7 @@ import {
     DEFAULT_AUTH_TOKEN_HEADER_KEY,
     SUPER_ADMIN_USER_IDENTIFIER,
     SUPER_ADMIN_USER_PASSWORD,
+    DEFAULT_CHANNEL_TOKEN_KEY,
 } from '@vendure/common/lib/shared-constants';
 
 import { TypeORMHealthCheckStrategy } from '../health-check/typeorm-health-check-strategy';
@@ -71,7 +72,7 @@ export const defaultConfig: RuntimeVendureConfig = {
         shopApiDebug: false,
         shopListQueryLimit: 100,
         shopApiValidationRules: [],
-        channelTokenKey: 'vendure-token',
+        channelTokenKey: DEFAULT_CHANNEL_TOKEN_KEY,
         cors: {
             origin: true,
             credentials: true,