From 81e9ef6e976133b6d41967aa450d463ec3a0abda Mon Sep 17 00:00:00 2001 From: Ruben Date: Wed, 13 Sep 2023 17:44:16 +0200 Subject: [PATCH 1/2] Proposal for handling of missing/removed modules --- frontend/src/framework/Module.tsx | 5 +- frontend/src/framework/ModuleRegistry.ts | 21 ++++++- .../internal/ModuleNotFoundPlaceholder.tsx | 61 +++++++++++++++++++ 3 files changed, 81 insertions(+), 6 deletions(-) create mode 100644 frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx diff --git a/frontend/src/framework/Module.tsx b/frontend/src/framework/Module.tsx index c58fd420e..770447afe 100644 --- a/frontend/src/framework/Module.tsx +++ b/frontend/src/framework/Module.tsx @@ -36,7 +36,7 @@ export class Module { private _defaultTitle: string; public viewFC: ModuleFC; public settingsFC: ModuleFC; - private _importState: ImportState; + protected _importState: ImportState; private _moduleInstances: ModuleInstance[]; private _defaultState: StateType | null; private _stateOptions: StateOptions | undefined; @@ -99,14 +99,11 @@ export class Module { return this._syncableSettingKeys; } - hasSyncableSettingKey(key: SyncSettingKey): boolean { return this._syncableSettingKeys.includes(key); } - makeInstance(instanceNumber: number): ModuleInstance { - if (!this._workbench) { throw new Error("Module must be added to a workbench before making an instance"); } diff --git a/frontend/src/framework/ModuleRegistry.ts b/frontend/src/framework/ModuleRegistry.ts index 113f3eb08..b3c470b0d 100644 --- a/frontend/src/framework/ModuleRegistry.ts +++ b/frontend/src/framework/ModuleRegistry.ts @@ -3,6 +3,7 @@ import { Module } from "./Module"; import { DrawPreviewFunc } from "./Preview"; import { StateBaseType, StateOptions } from "./StateStore"; import { SyncSettingKey } from "./SyncSettings"; +import { ModuleNotFoundPlaceholder } from "./internal/ModuleNotFoundPlaceholder"; export type RegisterModuleOptions = { moduleName: string; @@ -12,8 +13,19 @@ export type RegisterModuleOptions = { preview?: DrawPreviewFunc; }; +export class ModuleNotFoundError extends Error { + readonly moduleName: string; + constructor(moduleName: string) { + super( + `Module '${moduleName}' not found. Did you forget to register your module in 'src/modules/registerAllModules.ts'?` + ); + this.moduleName = moduleName; + } +} + export class ModuleRegistry { private static _registeredModules: Record> = {}; + private static _moduleNotFoundPlaceholders: Record> = {}; /* eslint-disable-next-line @typescript-eslint/no-empty-function */ private constructor() {} @@ -42,7 +54,7 @@ export class ModuleRegistry { module.setDefaultState(defaultState, options); return module as Module; } - throw "Did you forget to register your module in 'src/modules/registerAllModules.ts'?"; + throw new ModuleNotFoundError(moduleName); } static getModule(moduleName: string): Module { @@ -50,7 +62,12 @@ export class ModuleRegistry { if (module) { return module as Module; } - throw "Did you forget to register your module in 'src/modules/registerAllModules.ts'?"; + const placeholder = this._moduleNotFoundPlaceholders[moduleName]; + if (placeholder) { + return placeholder as Module; + } + this._moduleNotFoundPlaceholders[moduleName] = new ModuleNotFoundPlaceholder(moduleName); + return this._moduleNotFoundPlaceholders[moduleName] as Module; } static getRegisteredModules(): Record> { diff --git a/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx b/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx new file mode 100644 index 000000000..bf3fc2b35 --- /dev/null +++ b/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx @@ -0,0 +1,61 @@ +import { ImportState, Module } from "@framework/Module"; +import { ModuleInstance } from "@framework/ModuleInstance"; +import { BugAntIcon, ChatBubbleLeftRightIcon, NoSymbolIcon } from "@heroicons/react/20/solid"; +import { Button } from "@lib/components/Button"; +import { Tag } from "@lib/components/Tag"; + +export class ModuleNotFoundPlaceholder extends Module> { + constructor(moduleName: string) { + super(moduleName, moduleName, [], {}, null); + this._importState = ImportState.Imported; + } + + makeInstance(instanceNumber: number): ModuleInstance> { + const instance = super.makeInstance(instanceNumber); + instance.setDefaultState({}); + return instance; + } + + viewFC = () => { + function reportIssue() { + window.open("https://github.com/equinor/webviz/issues/new", "_blank"); + } + + function startDiscussion() { + window.open( + "https://github.com/equinor/webviz/discussions/new?category=announcements&welcome_text=true", + "_blank" + ); + } + + return ( +
+ + + Module not found. + + + The module is no longer available and might have been removed from the application. You can safely + remove the module instance by clicking on the cross in its header. If you are wondering why this + module has been removed, please get in touch with us on GitHub. + +
+ + +
+
+ ); + }; + + settingsFC = () => { + return ( +
+ Module not found. +
+ ); + }; +} From 0ba8ceb0134745e0a503eb42c145006aac3bed65 Mon Sep 17 00:00:00 2001 From: Ruben Thoms Date: Mon, 25 Sep 2023 11:52:43 +0200 Subject: [PATCH 2/2] Adjusted icons --- .../src/framework/internal/ModuleNotFoundPlaceholder.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx b/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx index bf3fc2b35..a79251ba8 100644 --- a/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx +++ b/frontend/src/framework/internal/ModuleNotFoundPlaceholder.tsx @@ -1,8 +1,8 @@ import { ImportState, Module } from "@framework/Module"; import { ModuleInstance } from "@framework/ModuleInstance"; -import { BugAntIcon, ChatBubbleLeftRightIcon, NoSymbolIcon } from "@heroicons/react/20/solid"; import { Button } from "@lib/components/Button"; import { Tag } from "@lib/components/Tag"; +import { BugReport, Forum, WebAssetOff } from "@mui/icons-material"; export class ModuleNotFoundPlaceholder extends Module> { constructor(moduleName: string) { @@ -30,7 +30,7 @@ export class ModuleNotFoundPlaceholder extends Module> { return (
- + Module not found. @@ -40,10 +40,10 @@ export class ModuleNotFoundPlaceholder extends Module> { module has been removed, please get in touch with us on GitHub.
- -