Add view state to method modeling panel

This adds a view state to the method modeling panel similar to the
model editor. This will be used to send the state of the show multiple
models feature flag to the webview so this can be used to selectively
show/hide components in the method modeling panel.

Author: koesie10

extensions/ql-vscode/src/common/interface-types.ts

@@ -19,7 +19,10 @@ import { ErrorLike } from "../common/errors";
 import { DataFlowPaths } from "../variant-analysis/shared/data-flow-paths";
 import { Method, Usage } from "../model-editor/method";
 import { ModeledMethod } from "../model-editor/modeled-method";
-import { ModelEditorViewState } from "../model-editor/shared/view-state";
+import {
+  MethodModelingPanelViewState,
+  ModelEditorViewState,
+} from "../model-editor/shared/view-state";
 import { Mode } from "../model-editor/shared/mode";
 import { QueryLanguage } from "./query-language";
 
@@ -625,6 +628,11 @@ export type FromMethodModelingMessage =
   | RevealInEditorMessage
   | StartModelingMessage;
 
+interface SetMethodModelingPanelViewStateMessage {
+  t: "setMethodModelingPanelViewState";
+  viewState: MethodModelingPanelViewState;
+}
+
 interface SetMethodMessage {
   t: "setMethod";
   method: Method;
@@ -643,6 +651,7 @@ interface SetSelectedMethodMessage {
 }
 
 export type ToMethodModelingMessage =
+  | SetMethodModelingPanelViewStateMessage
   | SetMethodMessage
   | SetModeledMethodMessage
   | SetMethodModifiedMessage

extensions/ql-vscode/src/model-editor/method-modeling/method-modeling-view-provider.ts

@@ -12,6 +12,7 @@ import { DbModelingState, ModelingStore } from "../modeling-store";
 import { AbstractWebviewViewProvider } from "../../common/vscode/abstract-webview-view-provider";
 import { assertNever } from "../../common/helpers-pure";
 import { ModelEditorViewTracker } from "../model-editor-view-tracker";
+import { showMultipleModels } from "../../config";
 
 export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
   ToMethodModelingMessage,
@@ -29,11 +30,20 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
     super(app, "method-modeling");
   }
 
-  protected override onWebViewLoaded(): void {
-    this.setInitialState();
+  protected override async onWebViewLoaded(): Promise<void> {
+    await Promise.all([this.setViewState(), this.setInitialState()]);
     this.registerToModelingStoreEvents();
   }
 
+  private async setViewState(): Promise<void> {
+    await this.postMessage({
+      t: "setMethodModelingPanelViewState",
+      viewState: {
+        showMultipleModels: showMultipleModels(),
+      },
+    });
+  }
+
   public async setMethod(method: Method): Promise<void> {
     this.method = method;
 
@@ -45,11 +55,11 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
     }
   }
 
-  private setInitialState(): void {
+  private async setInitialState(): Promise<void> {
     if (this.modelingStore.hasStateForActiveDb()) {
       const selectedMethod = this.modelingStore.getSelectedMethodDetails();
       if (selectedMethod) {
-        void this.postMessage({
+        await this.postMessage({
           t: "setSelectedMethod",
           method: selectedMethod.method,
           modeledMethod: selectedMethod.modeledMethod,
@@ -64,7 +74,7 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
   ): Promise<void> {
     switch (msg.t) {
       case "viewLoaded":
-        this.onWebViewLoaded();
+        await this.onWebViewLoaded();
         break;
 
       case "telemetry":

extensions/ql-vscode/src/model-editor/shared/view-state.ts

@@ -8,3 +8,7 @@ export interface ModelEditorViewState {
   showMultipleModels: boolean;
   mode: Mode;
 }
+
+export interface MethodModelingPanelViewState {
+  showMultipleModels: boolean;
+}

extensions/ql-vscode/src/view/method-modeling/MethodModeling.tsx

@@ -40,6 +40,7 @@ export type MethodModelingProps = {
   modelingStatus: ModelingStatus;
   method: Method;
   modeledMethod: ModeledMethod | undefined;
+  showMultipleModels?: boolean;
   onChange: (modeledMethod: ModeledMethod) => void;
 };
 

extensions/ql-vscode/src/view/method-modeling/MethodModelingView.tsx

@@ -9,8 +9,16 @@ import { ModeledMethod } from "../../model-editor/modeled-method";
 import { vscode } from "../vscode-api";
 import { NotInModelingMode } from "./NotInModelingMode";
 import { NoMethodSelected } from "./NoMethodSelected";
+import { MethodModelingPanelViewState } from "../../model-editor/shared/view-state";
 
-export function MethodModelingView(): JSX.Element {
+type Props = {
+  initialViewState?: MethodModelingPanelViewState;
+};
+
+export function MethodModelingView({ initialViewState }: Props): JSX.Element {
+  const [viewState, setViewState] = useState<
+    MethodModelingPanelViewState | undefined
+  >(initialViewState);
   const [inModelingMode, setInModelingMode] = useState<boolean>(false);
 
   const [method, setMethod] = useState<Method | undefined>(undefined);
@@ -31,6 +39,9 @@ export function MethodModelingView(): JSX.Element {
       if (evt.origin === window.origin) {
         const msg: ToMethodModelingMessage = evt.data;
         switch (msg.t) {
+          case "setMethodModelingPanelViewState":
+            setViewState(msg.viewState);
+            break;
           case "setInModelingMode":
             setInModelingMode(msg.inModelingMode);
             break;
@@ -84,6 +95,7 @@ export function MethodModelingView(): JSX.Element {
       modelingStatus={modelingStatus}
       method={method}
       modeledMethod={modeledMethod}
+      showMultipleModels={viewState?.showMultipleModels}
       onChange={onChange}
     />
   );