Skip to content

Commit

Permalink
fix(admin-ui-plugin): Enable metricsSummary query without serving UI app
Browse files Browse the repository at this point in the history
Closes #2261
  • Loading branch information
michaelbromley committed Jul 3, 2023
1 parent ebaff3a commit fba0739
Show file tree
Hide file tree
Showing 2 changed files with 51 additions and 10 deletions.
17 changes: 17 additions & 0 deletions docs/content/deployment/deploying-admin-ui.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,23 @@ If you have customized the Admin UI with extensions, you should [compile your ex

Usually, the Admin UI is served from the Vendure server via the AdminUiPlugin. However, you may wish to deploy the Admin UI app elsewhere. Since it is just a static Angular app, it can be deployed to any static hosting service such as Vercel or Netlify.

#### Metrics

The AdminUiPlugin not only serves the Admin UI app, but also provides a `metricSummary` query which is used to display the order metrics on the dashboard. If you wish to deploy the Admin UI app stand-alone (not served by the AdminUiPlugin), but still want to display the metrics on the dashboard, you'll need to include the AdminUiPlugin in your server's plugins array, but do not call `init()`:

```TypeScript
import { AdminUiPlugin } from '\@vendure/admin-ui-plugin';

const config: VendureConfig = {
plugins: [
AdminUiPlugin, // <== include the plugin, but don't call init()
],
// ...
};
```

#### Example Script

Here's an example script that can be run as part of your host's `build` command, which will generate a stand-alone app bundle and configure it to point to your remote server API.

This example is for Vercel, and assumes:
Expand Down
44 changes: 34 additions & 10 deletions packages/admin-ui-plugin/src/plugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,25 @@ export interface AdminUiPluginOptions {
* };
* ```
*
* ## Metrics
*
* This plugin also defines a `metricSummary` query which is used by the Admin UI to display the order metrics on the dashboard.
*
* If you are building a stand-alone version of the Admin UI app, and therefore don't need this plugin to server the Admin UI,
* you can still use the `metricSummary` query by adding the `AdminUiPlugin` to the `plugins` array, but without calling the `init()` method:
*
* @example
* ```TypeScript
* import { AdminUiPlugin } from '\@vendure/admin-ui-plugin';
*
* const config: VendureConfig = {
* plugins: [
* AdminUiPlugin, // <-- no call to .init()
* ],
* // ...
* };
* ```
*
* @docsCategory core plugins/AdminUiPlugin
*/
@VendurePlugin({
Expand All @@ -113,7 +132,7 @@ export interface AdminUiPluginOptions {
compatibility: '^2.0.0',
})
export class AdminUiPlugin implements NestModule {
private static options: AdminUiPluginOptions;
private static options: AdminUiPluginOptions | undefined;

constructor(private configService: ConfigService, private processContext: ProcessContext) {}

Expand All @@ -130,6 +149,13 @@ export class AdminUiPlugin implements NestModule {
if (this.processContext.isWorker) {
return;
}
if (!AdminUiPlugin.options) {
Logger.info(
`AdminUiPlugin's init() method was not called. The Admin UI will not be served.`,
loggerCtx,
);
return;
}
const { app, hostname, route, adminUiConfig } = AdminUiPlugin.options;
const adminUiAppPath = AdminUiPlugin.isDevModeApp(app)
? path.join(app.sourcePath, 'src')
Expand Down Expand Up @@ -226,7 +252,8 @@ export class AdminUiPlugin implements NestModule {
*/
private getAdminUiConfig(partialConfig?: Partial<AdminUiConfig>): AdminUiConfig {
const { authOptions } = this.configService;

// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const options = AdminUiPlugin.options!;
const propOrDefault = <Prop extends keyof AdminUiConfig>(
prop: Prop,
defaultVal: AdminUiConfig[Prop],
Expand All @@ -248,17 +275,14 @@ export class AdminUiPlugin implements NestModule {
defaultLanguage: propOrDefault('defaultLanguage', defaultLanguage),
defaultLocale: propOrDefault('defaultLocale', defaultLocale),
availableLanguages: propOrDefault('availableLanguages', defaultAvailableLanguages),
loginUrl: AdminUiPlugin.options.adminUiConfig?.loginUrl,
brand: AdminUiPlugin.options.adminUiConfig?.brand,
loginUrl: options.adminUiConfig?.loginUrl,
brand: options.adminUiConfig?.brand,
hideVendureBranding: propOrDefault(
'hideVendureBranding',
AdminUiPlugin.options.adminUiConfig?.hideVendureBranding || false,
),
hideVersion: propOrDefault(
'hideVersion',
AdminUiPlugin.options.adminUiConfig?.hideVersion || false,
options.adminUiConfig?.hideVendureBranding || false,
),
loginImageUrl: AdminUiPlugin.options.adminUiConfig?.loginImageUrl,
hideVersion: propOrDefault('hideVersion', options.adminUiConfig?.hideVersion || false),
loginImageUrl: options.adminUiConfig?.loginImageUrl,
cancellationReasons: propOrDefault('cancellationReasons', undefined),
};
}
Expand Down

0 comments on commit fba0739

Please sign in to comment.