Use new language definitions for the view

Author: koesie10

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

@@ -15,6 +15,7 @@ import { ModelEditorViewTracker } from "../model-editor-view-tracker";
 import { ModelConfigListener } from "../../config";
 import { DatabaseItem } from "../../databases/local-databases";
 import { ModelingEvents } from "../modeling-events";
+import { isQueryLanguage, QueryLanguage } from "../../common/query-language";
 
 export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
   ToMethodModelingMessage,
@@ -24,6 +25,7 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
 
   private method: Method | undefined = undefined;
   private databaseItem: DatabaseItem | undefined = undefined;
+  private language: QueryLanguage | undefined = undefined;
 
   constructor(
     app: App,
@@ -45,6 +47,7 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
     await this.postMessage({
       t: "setMethodModelingPanelViewState",
       viewState: {
+        language: this.language,
         showMultipleModels: this.modelConfig.showMultipleModels,
       },
     });
@@ -56,6 +59,10 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
   ): Promise<void> {
     this.method = method;
     this.databaseItem = databaseItem;
+    this.language =
+      databaseItem && isQueryLanguage(databaseItem?.language)
+        ? databaseItem.language
+        : undefined;
 
     if (this.isShowingView) {
       await this.postMessage({
@@ -70,6 +77,9 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
       const selectedMethod = this.modelingStore.getSelectedMethodDetails();
       if (selectedMethod) {
         this.databaseItem = selectedMethod.databaseItem;
+        this.language = isQueryLanguage(selectedMethod.databaseItem.language)
+          ? selectedMethod.databaseItem.language
+          : undefined;
         this.method = selectedMethod.method;
 
         await this.postMessage({
@@ -185,6 +195,9 @@ export class MethodModelingViewProvider extends AbstractWebviewViewProvider<
         if (this.webviewView) {
           this.method = e.method;
           this.databaseItem = e.databaseItem;
+          this.language = isQueryLanguage(e.databaseItem.language)
+            ? e.databaseItem.language
+            : undefined;
 
           await this.postMessage({
             t: "setSelectedMethod",

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

@@ -373,6 +373,7 @@ export class ModelEditorView extends AbstractWebview<
       t: "setModelEditorViewState",
       viewState: {
         extensionPack: this.extensionPack,
+        language: this.language,
         showFlowGeneration: this.modelConfig.flowGeneration,
         showLlmButton,
         showMultipleModels: this.modelConfig.showMultipleModels,

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

@@ -1,8 +1,10 @@
 import { ExtensionPack } from "./extension-pack";
 import { Mode } from "./mode";
+import { QueryLanguage } from "../../common/query-language";
 
 export interface ModelEditorViewState {
   extensionPack: ExtensionPack;
+  language: QueryLanguage;
   showFlowGeneration: boolean;
   showLlmButton: boolean;
   showMultipleModels: boolean;
@@ -11,5 +13,6 @@ export interface ModelEditorViewState {
 }
 
 export interface MethodModelingPanelViewState {
+  language: QueryLanguage | undefined;
   showMultipleModels: boolean;
 }

extensions/ql-vscode/src/stories/model-editor/LibraryRow.stories.tsx

@@ -2,10 +2,9 @@ import * as React from "react";
 
 import { Meta, StoryFn } from "@storybook/react";
 
-import { Mode } from "../../model-editor/shared/mode";
 import { LibraryRow as LibraryRowComponent } from "../../view/model-editor/LibraryRow";
 import { CallClassification } from "../../model-editor/method";
-import { createMockExtensionPack } from "../../../test/factories/model-editor/extension-pack";
+import { createMockModelEditorViewState } from "../../../test/factories/model-editor/view-state";
 
 export default {
   title: "CodeQL Model Editor/Library Row",
@@ -219,13 +218,10 @@ LibraryRow.args = {
   },
   modifiedSignatures: new Set(["org.sql2o.Sql2o#Sql2o(String)"]),
   inProgressMethods: new Set(),
-  viewState: {
-    extensionPack: createMockExtensionPack(),
+  viewState: createMockModelEditorViewState({
     showFlowGeneration: true,
     showLlmButton: true,
     showMultipleModels: true,
-    mode: Mode.Application,
-    sourceArchiveAvailable: true,
-  },
+  }),
   hideModeledMethods: false,
 };

extensions/ql-vscode/src/stories/model-editor/MethodRow.stories.tsx

@@ -10,10 +10,8 @@ import {
   MULTIPLE_MODELS_GRID_TEMPLATE_COLUMNS,
   SINGLE_MODEL_GRID_TEMPLATE_COLUMNS,
 } from "../../view/model-editor/ModeledMethodDataGrid";
-import { ModelEditorViewState } from "../../model-editor/shared/view-state";
-import { createMockExtensionPack } from "../../../test/factories/model-editor/extension-pack";
-import { Mode } from "../../model-editor/shared/mode";
 import { DataGrid } from "../../view/common/DataGrid";
+import { createMockModelEditorViewState } from "../../../test/factories/model-editor/view-state";
 
 export default {
   title: "CodeQL Model Editor/Method Row",
@@ -99,14 +97,11 @@ const modeledMethod: ModeledMethod = {
   methodParameters: "()",
 };
 
-const viewState: ModelEditorViewState = {
-  extensionPack: createMockExtensionPack(),
+const viewState = createMockModelEditorViewState({
   showFlowGeneration: true,
   showLlmButton: true,
   showMultipleModels: true,
-  mode: Mode.Application,
-  sourceArchiveAvailable: true,
-};
+});
 
 export const Unmodeled = Template.bind({});
 Unmodeled.args = {

extensions/ql-vscode/src/stories/model-editor/ModelEditor.stories.tsx

@@ -2,9 +2,9 @@ import * as React from "react";
 
 import { Meta, StoryFn } from "@storybook/react";
 
-import { Mode } from "../../model-editor/shared/mode";
 import { ModelEditor as ModelEditorComponent } from "../../view/model-editor/ModelEditor";
 import { CallClassification } from "../../model-editor/method";
+import { createMockModelEditorViewState } from "../../../test/factories/model-editor/view-state";
 
 export default {
   title: "CodeQL Model Editor/CodeQL Model Editor",
@@ -17,7 +17,7 @@ const Template: StoryFn<typeof ModelEditorComponent> = (args) => (
 
 export const ModelEditor = Template.bind({});
 ModelEditor.args = {
-  initialViewState: {
+  initialViewState: createMockModelEditorViewState({
     extensionPack: {
       path: "/home/user/vscode-codeql-starter/codeql-custom-queries-java/sql2o",
       yamlPath:
@@ -31,9 +31,7 @@ ModelEditor.args = {
     showFlowGeneration: true,
     showLlmButton: true,
     showMultipleModels: true,
-    mode: Mode.Application,
-    sourceArchiveAvailable: true,
-  },
+  }),
   initialMethods: [
     {
       library: "sql2o",

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

@@ -8,6 +8,7 @@ import { ModeledMethod } from "../../model-editor/modeled-method";
 import { VSCodeTag } from "@vscode/webview-ui-toolkit/react";
 import { ReviewInEditorButton } from "./ReviewInEditorButton";
 import { ModeledMethodsPanel } from "./ModeledMethodsPanel";
+import { QueryLanguage } from "../../common/query-language";
 
 const Container = styled.div`
   padding-top: 0.5rem;
@@ -49,6 +50,7 @@ const UnsavedTag = ({ modelingStatus }: { modelingStatus: ModelingStatus }) => (
 );
 
 export type MethodModelingProps = {
+  language: QueryLanguage;
   modelingStatus: ModelingStatus;
   method: Method;
   modeledMethods: ModeledMethod[];
@@ -58,6 +60,7 @@ export type MethodModelingProps = {
 };
 
 export const MethodModeling = ({
+  language,
   modelingStatus,
   modeledMethods,
   method,
@@ -77,6 +80,7 @@ export const MethodModeling = ({
         <MethodName {...method} />
       </DependencyContainer>
       <ModeledMethodsPanel
+        language={language}
         method={method}
         modeledMethods={modeledMethods}
         showMultipleModels={showMultipleModels}

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

@@ -7,6 +7,7 @@ import { ModelInputDropdown } from "../model-editor/ModelInputDropdown";
 import { ModelOutputDropdown } from "../model-editor/ModelOutputDropdown";
 import { ModelKindDropdown } from "../model-editor/ModelKindDropdown";
 import { InProgressDropdown } from "../model-editor/InProgressDropdown";
+import { QueryLanguage } from "../../common/query-language";
 
 const Container = styled.div`
   padding-top: 0.5rem;
@@ -23,13 +24,15 @@ const Name = styled.span`
 `;
 
 export type MethodModelingInputsProps = {
+  language: QueryLanguage;
   method: Method;
   modeledMethod: ModeledMethod | undefined;
   isModelingInProgress: boolean;
   onChange: (modeledMethod: ModeledMethod) => void;
 };
 
 export const MethodModelingInputs = ({
+  language,
   method,
   modeledMethod,
   isModelingInProgress,
@@ -79,7 +82,7 @@ export const MethodModelingInputs = ({
           {isModelingInProgress ? (
             <InProgressDropdown />
           ) : (
-            <ModelKindDropdown {...inputProps} />
+            <ModelKindDropdown language={language} {...inputProps} />
           )}
         </Input>
       </Container>

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

@@ -80,7 +80,7 @@ export function MethodModelingView({ initialViewState }: Props): JSX.Element {
     };
   }, []);
 
-  if (!inModelingMode) {
+  if (!inModelingMode || !viewState?.language) {
     return <NotInModelingMode />;
   }
 
@@ -105,6 +105,7 @@ export function MethodModelingView({ initialViewState }: Props): JSX.Element {
 
   return (
     <MethodModeling
+      language={viewState?.language}
       modelingStatus={modelingStatus}
       method={method}
       modeledMethods={modeledMethods}

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

@@ -6,8 +6,10 @@ import { Method } from "../../model-editor/method";
 import { styled } from "styled-components";
 import { MultipleModeledMethodsPanel } from "./MultipleModeledMethodsPanel";
 import { convertToLegacyModeledMethod } from "../../model-editor/shared/modeled-methods-legacy";
+import { QueryLanguage } from "../../common/query-language";
 
 export type ModeledMethodsPanelProps = {
+  language: QueryLanguage;
   method: Method;
   modeledMethods: ModeledMethod[];
   isModelingInProgress: boolean;
@@ -20,6 +22,7 @@ const SingleMethodModelingInputs = styled(MethodModelingInputs)`
 `;
 
 export const ModeledMethodsPanel = ({
+  language,
   method,
   modeledMethods,
   isModelingInProgress,
@@ -36,6 +39,7 @@ export const ModeledMethodsPanel = ({
   if (!showMultipleModels) {
     return (
       <SingleMethodModelingInputs
+        language={language}
         method={method}
         modeledMethod={convertToLegacyModeledMethod(modeledMethods)}
         isModelingInProgress={isModelingInProgress}
@@ -46,6 +50,7 @@ export const ModeledMethodsPanel = ({
 
   return (
     <MultipleModeledMethodsPanel
+      language={language}
       method={method}
       modeledMethods={modeledMethods}
       isModelingInProgress={isModelingInProgress}