mrva/vscode-codeql
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

Merge pull request #2995 from github/robertbrignull/model-table-multirow

Browse Source 
Use one grid cell per model input, and have the method name span multiple rows
This commit is contained in:
Robert
2023-10-19 12:40:03 +01:00
committed by GitHub
parent 947f495d0b 50f77e7918
commit 86b50560a4
1 changed files with 28 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
extensions/ql-vscode/src/view/model-editor/MethodRow.tsx
View File

@@ -4,7 +4,14 @@ import {
VSCodeProgressRing,
} from "@vscode/webview-ui-toolkit/react";
import * as React from "react";
import { forwardRef, useCallback, useEffect, useMemo, useRef } from "react";
import {
Fragment,
forwardRef,
useCallback,
useEffect,
useMemo,
useRef,
} from "react";
import { styled } from "styled-components";
import { vscode } from "../vscode-api";
@@ -25,12 +32,6 @@ import { Codicon } from "../common";
import { canAddNewModeledMethod } from "../../model-editor/shared/multiple-modeled-methods";
import { DataGridCell, DataGridRow } from "../common/DataGrid";
const MultiModelColumn = styled(DataGridCell)`
display: flex;
flex-direction: column;
gap: 0.5em;
`;
const ApiOrMethodRow = styled.div`
min-height: calc(var(--input-height) * 1px);
display: flex;
@@ -162,7 +163,7 @@ const ModelableMethodRow = forwardRef<HTMLElement | undefined, MethodRowProps>(
ref={ref}
focused={revealedMethodSignature === method.signature}
>
<DataGridCell>
<DataGridCell gridRow={`span ${modeledMethods.length}`}>
<ApiOrMethodRow>
<ModelingStatusIndicator status={modelingStatus} />
<MethodClassifications method={method} />
@@ -199,54 +200,41 @@ const ModelableMethodRow = forwardRef<HTMLElement | undefined, MethodRowProps>(
)}
</>
)}
{!props.modelingInProgress && (
<>
<MultiModelColumn>
{modeledMethods.map((modeledMethod, index) => (
{!props.modelingInProgress &&
modeledMethods.map((modeledMethod, index) => (
<Fragment key={index}>
<DataGridCell>
<ModelTypeDropdown
key={index}
method={method}
modeledMethod={modeledMethod}
onChange={modeledMethodChangedHandlers[index]}
/>
))}
</MultiModelColumn>
<MultiModelColumn>
{modeledMethods.map((modeledMethod, index) => (
</DataGridCell>
<DataGridCell>
<ModelInputDropdown
key={index}
method={method}
modeledMethod={modeledMethod}
onChange={modeledMethodChangedHandlers[index]}
/>
))}
</MultiModelColumn>
<MultiModelColumn>
{modeledMethods.map((modeledMethod, index) => (
</DataGridCell>
<DataGridCell>
<ModelOutputDropdown
key={index}
method={method}
modeledMethod={modeledMethod}
onChange={modeledMethodChangedHandlers[index]}
/>
))}
</MultiModelColumn>
<MultiModelColumn>
{modeledMethods.map((modeledMethod, index) => (
</DataGridCell>
<DataGridCell>
<ModelKindDropdown
key={index}
method={method}
modeledMethod={modeledMethod}
onChange={modeledMethodChangedHandlers[index]}
/>
))}
</MultiModelColumn>
{viewState.showMultipleModels && (
<MultiModelColumn>
{modeledMethods.map((_, index) =>
index === modeledMethods.length - 1 ? (
</DataGridCell>
{viewState.showMultipleModels && (
<DataGridCell>
{index === modeledMethods.length - 1 ? (
<CodiconRow
key={index}
appearance="icon"
aria-label="Add new model"
onClick={handleAddModelClick}
@@ -256,19 +244,17 @@ const ModelableMethodRow = forwardRef<HTMLElement | undefined, MethodRowProps>(
</CodiconRow>
) : (
<CodiconRow
key={index}
appearance="icon"
aria-label="Remove model"
onClick={removeModelClickedHandlers[index]}
>
<Codicon name="trash" />
</CodiconRow>
),
)}
</MultiModelColumn>
)}
</>
)}
)}
</DataGridCell>
)}
</Fragment>
))}
</DataGridRow>
);
},