Model packs

Repo states

diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsActions.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsActions.tsx new file mode 100644 index 00000000000..e99689634d2 --- /dev/null +++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsActions.tsx @@ -0,0 +1,39 @@ +import { styled } from "styled-components"; +import { VSCodeButton } from "@vscode/webview-ui-toolkit/react"; +import { VariantAnalysisStatus } from "../../variant-analysis/shared/variant-analysis"; + +type ModelAlertsActionsProps = { + variantAnalysisStatus: VariantAnalysisStatus; + + onStopRunClick: () => void; +}; + +const Container = styled.div` + margin-left: auto; + display: flex; + gap: 1em; +`; + +const Button = styled(VSCodeButton)` + white-space: nowrap; +`; + +export const ModelAlertsActions = ({ + variantAnalysisStatus, + onStopRunClick, +}: ModelAlertsActionsProps) => { + return ( + + {variantAnalysisStatus === VariantAnalysisStatus.InProgress && ( + + )} + {variantAnalysisStatus === VariantAnalysisStatus.Canceling && ( + + )} + + ); +}; diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx index 4dad006b003..097ba05e814 100644 --- a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx +++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx @@ -1,26 +1,50 @@ +import { styled } from "styled-components"; import type { ModelAlertsViewState } from "../../model-editor/shared/view-state"; import type { VariantAnalysis } from "../../variant-analysis/shared/variant-analysis"; import { ViewTitle } from "../common"; +import { ModelAlertsActions } from "./ModelAlertsActions"; import { ModelPacks } from "./ModelPacks"; type Props = { viewState: ModelAlertsViewState; variantAnalysis: VariantAnalysis; openModelPackClick: (path: string) => void; + stopRunClick: () => void; }; +const Container = styled.div` + display: flex; + flex-direction: column; +`; + +const Row = styled.div` + display: flex; + align-items: flex-start; +`; + export const ModelAlertsHeader = ({ viewState, variantAnalysis, openModelPackClick, + stopRunClick, }: Props) => { return ( <> - Model evaluation results for {viewState.title} - + + + Model evaluation results for {viewState.title} + + + + + + ); }; diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelPacks.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelPacks.tsx index 89e65664b86..13a8c0d0505 100644 --- a/extensions/ql-vscode/src/view/model-alerts/ModelPacks.tsx +++ b/extensions/ql-vscode/src/view/model-alerts/ModelPacks.tsx @@ -2,6 +2,10 @@ import { styled } from "styled-components"; import { LinkIconButton } from "../common/LinkIconButton"; import type { ModelPackDetails } from "../../common/model-pack-details"; +const Container = styled.div` + display: block; +`; + const Title = styled.h3` font-size: medium; font-weight: 500; @@ -26,7 +30,7 @@ export const ModelPacks = ({ } return ( - <> + Model packs {modelPacks.map((modelPack) => ( @@ -38,6 +42,6 @@ export const ModelPacks = ({ ))} - + ); }; diff --git a/extensions/ql-vscode/test/factories/variant-analysis/shared/variant-analysis.ts b/extensions/ql-vscode/test/factories/variant-analysis/shared/variant-analysis.ts index 4ccde9eac83..82e4da11305 100644 --- a/extensions/ql-vscode/test/factories/variant-analysis/shared/variant-analysis.ts +++ b/extensions/ql-vscode/test/factories/variant-analysis/shared/variant-analysis.ts @@ -9,6 +9,7 @@ import { createMockScannedRepos } from "./scanned-repositories"; import { createMockSkippedRepos } from "./skipped-repositories"; import { createMockRepository } from "./repository"; import { QueryLanguage } from "../../../../src/common/query-language"; +import type { ModelPackDetails } from "../../../../src/common/model-pack-details"; export function createMockVariantAnalysis({ status = VariantAnalysisStatus.InProgress, @@ -16,12 +17,14 @@ export function createMockVariantAnalysis({ skippedRepos = createMockSkippedRepos(), executionStartTime = faker.number.int(), language = QueryLanguage.Javascript, + modelPacks = undefined, }: { status?: VariantAnalysisStatus; scannedRepos?: VariantAnalysisScannedRepository[]; skippedRepos?: VariantAnalysisSkippedRepositories; executionStartTime?: number | undefined; language?: QueryLanguage; + modelPacks?: ModelPackDetails[] | undefined; }): VariantAnalysis { return { id: faker.number.int(), @@ -37,6 +40,7 @@ export function createMockVariantAnalysis({ filePath: "a-query-file-path", text: "a-query-text", }, + modelPacks, databases: { repositories: ["1", "2", "3"], }, From 3f817b3c0f202367e1a20b4d4cbf9bcd05903535 Mon Sep 17 00:00:00 2001 From: Charis Kyriakou Date: Mon, 18 Mar 2024 15:57:21 +0000 Subject: [PATCH 0165/1237] Don't show notification after local query cancellation (#3489) * Don't show notification after local query cancellation * Update CHANGELOG --- extensions/ql-vscode/CHANGELOG.md | 1 + .../ql-vscode/src/local-queries/local-queries.ts | 12 ++++++++++-- 2 files changed, 11 insertions(+), 2 deletions(-) diff --git a/extensions/ql-vscode/CHANGELOG.md b/extensions/ql-vscode/CHANGELOG.md index 1e00852a730..680dbb3f20c 100644 --- a/extensions/ql-vscode/CHANGELOG.md +++ b/extensions/ql-vscode/CHANGELOG.md @@ -2,6 +2,7 @@ ## [UNRELEASED] +- Don't show notification after local query cancellation. [#3489](https://github.com/github/vscode-codeql/pull/3489) - Databases created from [CodeQL test cases](https://docs.github.com/en/code-security/codeql-cli/using-the-advanced-functionality-of-the-codeql-cli/testing-custom-queries) are now copied into a shared VS Code storage location. This avoids a bug where re-running test cases would fail if the test's database is already imported into the workspace. [#3433](https://github.com/github/vscode-codeql/pull/3433) ## 1.12.3 - 29 February 2024 diff --git a/extensions/ql-vscode/src/local-queries/local-queries.ts b/extensions/ql-vscode/src/local-queries/local-queries.ts index c1a5dac785c..54dd4beffe3 100644 --- a/extensions/ql-vscode/src/local-queries/local-queries.ts +++ b/extensions/ql-vscode/src/local-queries/local-queries.ts @@ -2,7 +2,10 @@ import type { ProgressCallback, ProgressUpdate, } from "../common/vscode/progress"; -import { withProgress } from "../common/vscode/progress"; +import { + UserCancellationException, + withProgress, +} from "../common/vscode/progress"; import type { CancellationToken, Range, TabInputText } from "vscode"; import { CancellationTokenSource, Uri, window } from "vscode"; import { @@ -492,7 +495,12 @@ export class LocalQueries extends DisposableObject { // to unify both error handling paths. const err = asError(e); await localQueryRun.fail(err); - throw e; + + if (token.isCancellationRequested) { + throw new UserCancellationException(err.message, true); + } else { + throw e; + } } } finally { source.dispose(); From 724370fb40ba949a1983f0ddff9e82c1e39115b5 Mon Sep 17 00:00:00 2001 From: Charis Kyriakou Date: Tue, 19 Mar 2024 16:07:39 +0000 Subject: [PATCH 0166/1237] Fix ModelAlerts view stories (#3490) --- .../model-alerts/ModelAlerts.stories.tsx | 13 +++++++++++ .../src/view/model-alerts/ModelAlerts.tsx | 22 ++++++++++++------- 2 files changed, 27 insertions(+), 8 deletions(-) diff --git a/extensions/ql-vscode/src/stories/model-alerts/ModelAlerts.stories.tsx b/extensions/ql-vscode/src/stories/model-alerts/ModelAlerts.stories.tsx index 6bdee3e1ba3..a732e65a464 100644 --- a/extensions/ql-vscode/src/stories/model-alerts/ModelAlerts.stories.tsx +++ b/extensions/ql-vscode/src/stories/model-alerts/ModelAlerts.stories.tsx @@ -1,6 +1,7 @@ import type { Meta, StoryFn } from "@storybook/react"; import { ModelAlerts as ModelAlertsComponent } from "../../view/model-alerts/ModelAlerts"; +import { createMockVariantAnalysis } from "../../../test/factories/variant-analysis/shared/variant-analysis"; export default { title: "Model Alerts/Model Alerts", @@ -14,4 +15,16 @@ const Template: StoryFn = (args) => ( export const ModelAlerts = Template.bind({}); ModelAlerts.args = { initialViewState: { title: "codeql/sql2o-models" }, + variantAnalysis: createMockVariantAnalysis({ + modelPacks: [ + { + name: "Model pack 1", + path: "/path/to/model-pack-1", + }, + { + name: "Model pack 2", + path: "/path/to/model-pack-2", + }, + ], + }), }; diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx index 5d833387811..c7ee32c82f4 100644 --- a/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx +++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx @@ -11,9 +11,17 @@ import { vscode } from "../vscode-api"; type Props = { initialViewState?: ModelAlertsViewState; + variantAnalysis?: VariantAnalysis; + repoStates?: VariantAnalysisScannedRepositoryState[]; + repoResults?: VariantAnalysisScannedRepositoryResult[]; }; -export function ModelAlerts({ initialViewState }: Props): React.JSX.Element { +export function ModelAlerts({ + initialViewState, + variantAnalysis: initialVariantAnalysis, + repoStates: initialRepoStates = [], + repoResults: initialRepoResults = [], +}: Props): React.JSX.Element { const onOpenModelPackClick = useCallback((path: string) => { vscode.postMessage({ t: "openModelPack", @@ -33,13 +41,11 @@ export function ModelAlerts({ initialViewState }: Props): React.JSX.Element { const [variantAnalysis, setVariantAnalysis] = useState< VariantAnalysis | undefined - >(undefined); - const [repoStates, setRepoStates] = useState< - VariantAnalysisScannedRepositoryState[] - >([]); - const [repoResults, setRepoResults] = useState< - VariantAnalysisScannedRepositoryResult[] - >([]); + >(initialVariantAnalysis); + const [repoStates, setRepoStates] = + useState(initialRepoStates); + const [repoResults, setRepoResults] = + useState(initialRepoResults); useEffect(() => { const listener = (evt: MessageEvent) => { From 3519139e68e42d7ea7795cc5eddb658d91842ace Mon Sep 17 00:00:00 2001 From: Charis Kyriakou Date: Wed, 20 Mar 2024 09:03:13 +0000 Subject: [PATCH 0167/1237] Update MethodName component to receive specific props (#3491) --- .../src/view/model-editor/MethodName.tsx | 37 +++++++++++++------ 1 file changed, 26 insertions(+), 11 deletions(-) diff --git a/extensions/ql-vscode/src/view/model-editor/MethodName.tsx b/extensions/ql-vscode/src/view/model-editor/MethodName.tsx index bf189239472..76e0ef51479 100644 --- a/extensions/ql-vscode/src/view/model-editor/MethodName.tsx +++ b/extensions/ql-vscode/src/view/model-editor/MethodName.tsx @@ -1,33 +1,48 @@ import { styled } from "styled-components"; -import type { Method } from "../../model-editor/method"; const Name = styled.span` font-family: var(--vscode-editor-font-family); word-break: break-all; `; -const TypeMethodName = (method: Method) => { - if (!method.typeName) { - return <>{method.methodName}; +const TypeMethodName = ({ + typeName, + methodName, +}: { + typeName?: string; + methodName?: string; +}) => { + if (!typeName) { + return <>{methodName}; } - if (!method.methodName) { - return <>{method.typeName}; + if (!methodName) { + return <>{typeName}; } return ( <> - {method.typeName}.{method.methodName} + {typeName}.{methodName} ); }; -export const MethodName = (method: Method): React.JSX.Element => { +export const MethodName = ({ + packageName, + typeName, + methodName, + methodParameters, +}: { + packageName: string; + typeName?: string; + methodName?: string; + methodParameters?: string; +}): React.JSX.Element => { return ( - {method.packageName && <>{method.packageName}.} - - {method.methodParameters} + {packageName && <>{packageName}.} + + {methodParameters} ); }; From 876af669cb6410463e898f880de241709d170bd0 Mon Sep 17 00:00:00 2001 From: Koen Vlaswinkel Date: Wed, 20 Mar 2024 10:28:24 +0100 Subject: [PATCH 0168/1237] v1.12.4 --- extensions/ql-vscode/CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/extensions/ql-vscode/CHANGELOG.md b/extensions/ql-vscode/CHANGELOG.md index 680dbb3f20c..6a7e2cce376 100644 --- a/extensions/ql-vscode/CHANGELOG.md +++ b/extensions/ql-vscode/CHANGELOG.md @@ -1,6 +1,6 @@ # CodeQL for Visual Studio Code: Changelog -## [UNRELEASED] +## 1.12.4 - 20 March 2024 - Don't show notification after local query cancellation. [#3489](https://github.com/github/vscode-codeql/pull/3489) - Databases created from [CodeQL test cases](https://docs.github.com/en/code-security/codeql-cli/using-the-advanced-functionality-of-the-codeql-cli/testing-custom-queries) are now copied into a shared VS Code storage location. This avoids a bug where re-running test cases would fail if the test's database is already imported into the workspace. [#3433](https://github.com/github/vscode-codeql/pull/3433) From 36236680a4b580ba3758a85143d1382b53c279ec Mon Sep 17 00:00:00 2001 From: Shati Patel <42641846+shati-patel@users.noreply.github.com> Date: Wed, 20 Mar 2024 10:14:39 +0000 Subject: [PATCH 0169/1237] Add model alerts stats to the view (#3481) --- .../ql-vscode/src/common/interface-types.ts | 6 +++ .../model-alerts/model-alerts-view.ts | 6 +++ .../ModelAlertsHeader.stories.tsx | 6 +++ .../src/view/model-alerts/ModelAlerts.tsx | 13 +++++- .../view/model-alerts/ModelAlertsHeader.tsx | 44 +++++++++++++++++++ 5 files changed, 74 insertions(+), 1 deletion(-) diff --git a/extensions/ql-vscode/src/common/interface-types.ts b/extensions/ql-vscode/src/common/interface-types.ts index 87e7e785ea3..30d11c7b0f7 100644 --- a/extensions/ql-vscode/src/common/interface-types.ts +++ b/extensions/ql-vscode/src/common/interface-types.ts @@ -737,6 +737,11 @@ interface OpenModelPackMessage { path: string; } +interface OpenActionsLogsMessage { + t: "openActionsLogs"; + variantAnalysisId: number; +} + interface StopEvaluationRunMessage { t: "stopEvaluationRun"; } @@ -750,4 +755,5 @@ export type ToModelAlertsMessage = export type FromModelAlertsMessage = | CommonFromViewMessages | OpenModelPackMessage + | OpenActionsLogsMessage | StopEvaluationRunMessage; diff --git a/extensions/ql-vscode/src/model-editor/model-alerts/model-alerts-view.ts b/extensions/ql-vscode/src/model-editor/model-alerts/model-alerts-view.ts index 57e5c7decd5..098bf4b263a 100644 --- a/extensions/ql-vscode/src/model-editor/model-alerts/model-alerts-view.ts +++ b/extensions/ql-vscode/src/model-editor/model-alerts/model-alerts-view.ts @@ -91,6 +91,12 @@ export class ModelAlertsView extends AbstractWebview< case "openModelPack": await this.app.commands.execute("revealInExplorer", Uri.file(msg.path)); break; + case "openActionsLogs": + await this.app.commands.execute( + "codeQL.openVariantAnalysisLogs", + msg.variantAnalysisId, + ); + break; case "stopEvaluationRun": await this.stopEvaluationRun(); break; diff --git a/extensions/ql-vscode/src/stories/model-alerts/ModelAlertsHeader.stories.tsx b/extensions/ql-vscode/src/stories/model-alerts/ModelAlertsHeader.stories.tsx index d110ed16d42..1dbd2bb0e88 100644 --- a/extensions/ql-vscode/src/stories/model-alerts/ModelAlertsHeader.stories.tsx +++ b/extensions/ql-vscode/src/stories/model-alerts/ModelAlertsHeader.stories.tsx @@ -13,6 +13,12 @@ export default { disable: true, }, }, + onViewLogsClick: { + action: "view-logs-clicked", + table: { + disable: true, + }, + }, stopRunClick: { action: "stop-run-clicked", table: { diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx index c7ee32c82f4..b327b76974b 100644 --- a/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx +++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlerts.tsx @@ -1,5 +1,4 @@ import { useCallback, useEffect, useState } from "react"; -import { ModelAlertsHeader } from "./ModelAlertsHeader"; import type { ModelAlertsViewState } from "../../model-editor/shared/view-state"; import type { ToModelAlertsMessage } from "../../common/interface-types"; import type { @@ -8,6 +7,7 @@ import type { VariantAnalysisScannedRepositoryState, } from "../../variant-analysis/shared/variant-analysis"; import { vscode } from "../vscode-api"; +import { ModelAlertsHeader } from "./ModelAlertsHeader"; type Props = { initialViewState?: ModelAlertsViewState; @@ -102,12 +102,23 @@ export function ModelAlerts({ return <>; } + const openLogs = () => { + vscode.postMessage({ + t: "openActionsLogs", + variantAnalysisId: variantAnalysis.id, + }); + }; + + const onViewLogsClick = + variantAnalysis.actionsWorkflowRunId === undefined ? undefined : openLogs; + return ( <>

diff --git a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx index 097ba05e814..0e36431ed04 100644 --- a/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx +++ b/extensions/ql-vscode/src/view/model-alerts/ModelAlertsHeader.tsx @@ -1,14 +1,24 @@ +import { useMemo } from "react"; +import { parseDate } from "../../common/date"; import { styled } from "styled-components"; import type { ModelAlertsViewState } from "../../model-editor/shared/view-state"; +import { + getSkippedRepoCount, + getTotalResultCount, + hasRepoScanCompleted, + isRepoScanSuccessful, +} from "../../variant-analysis/shared/variant-analysis"; import type { VariantAnalysis } from "../../variant-analysis/shared/variant-analysis"; import { ViewTitle } from "../common"; import { ModelAlertsActions } from "./ModelAlertsActions"; import { ModelPacks } from "./ModelPacks"; +import { VariantAnalysisStats } from "../variant-analysis/VariantAnalysisStats"; type Props = { viewState: ModelAlertsViewState; variantAnalysis: VariantAnalysis; openModelPackClick: (path: string) => void; + onViewLogsClick?: () => void; stopRunClick: () => void; }; @@ -26,8 +36,31 @@ export const ModelAlertsHeader = ({ viewState, variantAnalysis, openModelPackClick, + onViewLogsClick, stopRunClick, }: Props) => { + const totalScannedRepositoryCount = useMemo(() => { + return variantAnalysis.scannedRepos?.length ?? 0; + }, [variantAnalysis.scannedRepos]); + const completedRepositoryCount = useMemo(() => { + return ( + variantAnalysis.scannedRepos?.filter((repo) => hasRepoScanCompleted(repo)) + ?.length ?? 0 + ); + }, [variantAnalysis.scannedRepos]); + const successfulRepositoryCount = useMemo(() => { + return ( + variantAnalysis.scannedRepos?.filter((repo) => isRepoScanSuccessful(repo)) + ?.length ?? 0 + ); + }, [variantAnalysis.scannedRepos]); + const resultCount = useMemo(() => { + return getTotalResultCount(variantAnalysis.scannedRepos); + }, [variantAnalysis.scannedRepos]); + const skippedRepositoryCount = useMemo(() => { + return getSkippedRepoCount(variantAnalysis.skippedRepos); + }, [variantAnalysis.skippedRepos]); + return ( <> @@ -44,6 +77,17 @@ export const ModelAlertsHeader = ({ onStopRunClick={stopRunClick} /> + ); From 1982ad45b86e1261a2a9bd22c7f06f882c6ef3ff Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" Date: Wed, 20 Mar 2024 10:54:17 +0000 Subject: [PATCH 0170/1237] Bump version to v1.12.5 --- extensions/ql-vscode/CHANGELOG.md | 2 ++ extensions/ql-vscode/package-lock.json | 4 ++-- extensions/ql-vscode/package.json | 2 +- 3 files changed, 5 insertions(+), 3 deletions(-) diff --git a/extensions/ql-vscode/CHANGELOG.md b/extensions/ql-vscode/CHANGELOG.md index 6a7e2cce376..ef082262b42 100644 --- a/extensions/ql-vscode/CHANGELOG.md +++ b/extensions/ql-vscode/CHANGELOG.md @@ -1,5 +1,7 @@ # CodeQL for Visual Studio Code: Changelog +## [UNRELEASED] + ## 1.12.4 - 20 March 2024 - Don't show notification after local query cancellation. [#3489](https://github.com/github/vscode-codeql/pull/3489) diff --git a/extensions/ql-vscode/package-lock.json b/extensions/ql-vscode/package-lock.json index d58b1adb58e..b670122056c 100644 --- a/extensions/ql-vscode/package-lock.json +++ b/extensions/ql-vscode/package-lock.json @@ -1,12 +1,12 @@ { "name": "vscode-codeql", - "version": "1.12.4", + "version": "1.12.5", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "vscode-codeql", - "version": "1.12.4", + "version": "1.12.5", "hasInstallScript": true, "license": "MIT", "dependencies": { diff --git a/extensions/ql-vscode/package.json b/extensions/ql-vscode/package.json index 3320605da44..6acbcaad2ed 100644 --- a/extensions/ql-vscode/package.json +++ b/extensions/ql-vscode/package.json @@ -4,7 +4,7 @@ "description": "CodeQL for Visual Studio Code", "author": "GitHub", "private": true, - "version": "1.12.4", + "version": "1.12.5", "publisher": "GitHub", "license": "MIT", "icon": "media/VS-marketplace-CodeQL-icon.png", From ee4b13c9e95ebec9df2d950ff25b06a2e9957509 Mon Sep 17 00:00:00 2001 From: Koen Vlaswinkel Date: Wed, 20 Mar 2024 12:06:08 +0100 Subject: [PATCH 0171/1237] Fix deprecation warning --- .../ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx | 4 ++-- extensions/ql-vscode/package-lock.json | 2 +- extensions/ql-vscode/package.json | 1 + 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/extensions/ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx b/extensions/ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx index d37bb4c2e0e..71df8b27100 100644 --- a/extensions/ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx +++ b/extensions/ql-vscode/.storybook/vscode-theme-addon/ThemeSelector.tsx @@ -5,10 +5,10 @@ import { useCallback } from "react"; import { useGlobals } from "@storybook/manager-api"; import { IconButton, - Icons, TooltipLinkList, WithTooltip, } from "@storybook/components"; +import { DashboardIcon } from "@storybook/icons"; import { themeNames, VSCodeTheme } from "./theme"; @@ -53,7 +53,7 @@ export const ThemeSelector: FunctionComponent = () => { title="Change the theme of the preview" active={vscodeTheme !== VSCodeTheme.Dark} > - + ); diff --git a/extensions/ql-vscode/package-lock.json b/extensions/ql-vscode/package-lock.json index 1a374bffaf8..3708cffdea5 100644 --- a/extensions/ql-vscode/package-lock.json +++ b/extensions/ql-vscode/package-lock.json @@ -13,6 +13,7 @@ "@floating-ui/react": "^0.26.9", "@octokit/plugin-retry": "^6.0.1", "@octokit/rest": "^20.0.2", + "@storybook/icons": "^1.2.9", "@vscode/codicons": "^0.0.35", "@vscode/debugadapter": "^1.59.0", "@vscode/debugprotocol": "^1.59.0", @@ -5480,7 +5481,6 @@ "version": "1.2.9", "resolved": "https://registry.npmjs.org/@storybook/icons/-/icons-1.2.9.tgz", "integrity": "sha512-cOmylsz25SYXaJL/gvTk/dl3pyk7yBFRfeXTsHvTA3dfhoU/LWSq0NKL9nM7WBasJyn6XPSGnLS4RtKXLw5EUg==", - "dev": true, "engines": { "node": ">=14.0.0" }, diff --git a/extensions/ql-vscode/package.json b/extensions/ql-vscode/package.json index efe691d67a2..01a9ac97f2c 100644 --- a/extensions/ql-vscode/package.json +++ b/extensions/ql-vscode/package.json @@ -1954,6 +1954,7 @@ "@floating-ui/react": "^0.26.9", "@octokit/plugin-retry": "^6.0.1", "@octokit/rest": "^20.0.2", + "@storybook/icons": "^1.2.9", "@vscode/codicons": "^0.0.35", "@vscode/debugadapter": "^1.59.0", "@vscode/debugprotocol": "^1.59.0", From c553b1cb1d3336e4a41084a650339d113e8b5643 Mon Sep 17 00:00:00 2001 From: Koen Vlaswinkel Date: Wed, 20 Mar 2024 12:08:36 +0100 Subject: [PATCH 0172/1237] Run storybook migrate mdx-to-csf --- extensions/ql-vscode/.storybook/main.ts | 2 +- extensions/ql-vscode/package-lock.json | 470 +++++++++++++++++- extensions/ql-vscode/package.json | 1 + .../{Overview.stories.mdx => Overview.mdx} | 14 +- 4 files changed, 470 insertions(+), 17 deletions(-) rename extensions/ql-vscode/src/stories/{Overview.stories.mdx => Overview.mdx} (92%) diff --git a/extensions/ql-vscode/.storybook/main.ts b/extensions/ql-vscode/.storybook/main.ts index 9cceeeb5e22..9b7cf72cfa6 100644 --- a/extensions/ql-vscode/.storybook/main.ts +++ b/extensions/ql-vscode/.storybook/main.ts @@ -1,7 +1,7 @@ import type { StorybookConfig } from "@storybook/react-webpack5"; const config: StorybookConfig = { - stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], + stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"], addons: [ "@storybook/addon-links", "@storybook/addon-essentials", diff --git a/extensions/ql-vscode/package-lock.json b/extensions/ql-vscode/package-lock.json index 3708cffdea5..7ac19f51c2d 100644 --- a/extensions/ql-vscode/package-lock.json +++ b/extensions/ql-vscode/package-lock.json @@ -60,6 +60,7 @@ "@storybook/addon-essentials": "^8.0.0", "@storybook/addon-interactions": "^8.0.0", "@storybook/addon-links": "^8.0.0", + "@storybook/blocks": "^8.0.2", "@storybook/components": "^8.0.0", "@storybook/csf": "^0.1.1", "@storybook/manager-api": "^8.0.0", @@ -4587,6 +4588,54 @@ "url": "https://opencollective.com/storybook" } }, + "node_modules/@storybook/addon-controls/node_modules/@storybook/blocks": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.0.0.tgz", + "integrity": "sha512-Sxy7pOa6B3ci/XhfKca6u97Kz6pGZV5ieQBUWRYByUZTjiOp12RVLFptexxrJHyNBA00BHJPek4fvFSJfn6nOQ==", + "dev": true, + "dependencies": { + "@storybook/channels": "8.0.0", + "@storybook/client-logger": "8.0.0", + "@storybook/components": "8.0.0", + "@storybook/core-events": "8.0.0", + "@storybook/csf": "^0.1.2", + "@storybook/docs-tools": "8.0.0", + "@storybook/global": "^5.0.0", + "@storybook/icons": "^1.2.5", + "@storybook/manager-api": "8.0.0", + "@storybook/preview-api": "8.0.0", + "@storybook/theming": "8.0.0", + "@storybook/types": "8.0.0", + "@types/lodash": "^4.14.167", + "color-convert": "^2.0.1", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "markdown-to-jsx": "7.3.2", + "memoizerific": "^1.11.3", + "polished": "^4.2.2", + "react-colorful": "^5.1.2", + "telejson": "^7.2.0", + "tocbot": "^4.20.1", + "ts-dedent": "^2.0.0", + "util-deprecate": "^1.0.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/@storybook/addon-docs": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/@storybook/addon-docs/-/addon-docs-8.0.0.tgz", @@ -4619,6 +4668,54 @@ "url": "https://opencollective.com/storybook" } }, + "node_modules/@storybook/addon-docs/node_modules/@storybook/blocks": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.0.0.tgz", + "integrity": "sha512-Sxy7pOa6B3ci/XhfKca6u97Kz6pGZV5ieQBUWRYByUZTjiOp12RVLFptexxrJHyNBA00BHJPek4fvFSJfn6nOQ==", + "dev": true, + "dependencies": { + "@storybook/channels": "8.0.0", + "@storybook/client-logger": "8.0.0", + "@storybook/components": "8.0.0", + "@storybook/core-events": "8.0.0", + "@storybook/csf": "^0.1.2", + "@storybook/docs-tools": "8.0.0", + "@storybook/global": "^5.0.0", + "@storybook/icons": "^1.2.5", + "@storybook/manager-api": "8.0.0", + "@storybook/preview-api": "8.0.0", + "@storybook/theming": "8.0.0", + "@storybook/types": "8.0.0", + "@types/lodash": "^4.14.167", + "color-convert": "^2.0.1", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "markdown-to-jsx": "7.3.2", + "memoizerific": "^1.11.3", + "polished": "^4.2.2", + "react-colorful": "^5.1.2", + "telejson": "^7.2.0", + "tocbot": "^4.20.1", + "ts-dedent": "^2.0.0", + "util-deprecate": "^1.0.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, "node_modules/@storybook/addon-essentials": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/@storybook/addon-essentials/-/addon-essentials-8.0.0.tgz", @@ -4750,23 +4847,23 @@ } }, "node_modules/@storybook/blocks": { - "version": "8.0.0", - "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.0.0.tgz", - "integrity": "sha512-Sxy7pOa6B3ci/XhfKca6u97Kz6pGZV5ieQBUWRYByUZTjiOp12RVLFptexxrJHyNBA00BHJPek4fvFSJfn6nOQ==", + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/blocks/-/blocks-8.0.2.tgz", + "integrity": "sha512-nVOyQV/d+MpfAXLadbTuxkyUa9rco6EjMW3eb49JrfmenViNlZ+YYcO1J0zHXvM3GYYNP5yBXXhiGVg0uM8trA==", "dev": true, "dependencies": { - "@storybook/channels": "8.0.0", - "@storybook/client-logger": "8.0.0", - "@storybook/components": "8.0.0", - "@storybook/core-events": "8.0.0", + "@storybook/channels": "8.0.2", + "@storybook/client-logger": "8.0.2", + "@storybook/components": "8.0.2", + "@storybook/core-events": "8.0.2", "@storybook/csf": "^0.1.2", - "@storybook/docs-tools": "8.0.0", + "@storybook/docs-tools": "8.0.2", "@storybook/global": "^5.0.0", "@storybook/icons": "^1.2.5", - "@storybook/manager-api": "8.0.0", - "@storybook/preview-api": "8.0.0", - "@storybook/theming": "8.0.0", - "@storybook/types": "8.0.0", + "@storybook/manager-api": "8.0.2", + "@storybook/preview-api": "8.0.2", + "@storybook/theming": "8.0.2", + "@storybook/types": "8.0.2", "@types/lodash": "^4.14.167", "color-convert": "^2.0.1", "dequal": "^2.0.2", @@ -4797,6 +4894,355 @@ } } }, + "node_modules/@storybook/blocks/node_modules/@storybook/channels": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/channels/-/channels-8.0.2.tgz", + "integrity": "sha512-r7TMUlALWc8sTXzyRZ1wSngvDWGhRLfhU9VJ0ouMyk2oSNEgcKBGvq7FkMmHINKHr3gte9+Ab0iG7TAoQ7pPsg==", + "dev": true, + "dependencies": { + "@storybook/client-logger": "8.0.2", + "@storybook/core-events": "8.0.2", + "@storybook/global": "^5.0.0", + "telejson": "^7.2.0", + "tiny-invariant": "^1.3.1" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/client-logger": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/client-logger/-/client-logger-8.0.2.tgz", + "integrity": "sha512-/GvjkCHk5LyiJ0EzoJ3kV+tqCGVarxYSnhD8ciszbWBUH4ZX104So+uZjwwGKCEZxh17HLppQa5bzOayGcdRDg==", + "dev": true, + "dependencies": { + "@storybook/global": "^5.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/components": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/components/-/components-8.0.2.tgz", + "integrity": "sha512-U/mm/cVL9NSM0pFYiZv7BS9U8KpZ0e9RkB45nKOIKzrtDBfec3cv9U3zIvYeIh3jQXusVZtjt9X9qhIoJkWl+w==", + "dev": true, + "dependencies": { + "@radix-ui/react-slot": "^1.0.2", + "@storybook/client-logger": "8.0.2", + "@storybook/csf": "^0.1.2", + "@storybook/global": "^5.0.0", + "@storybook/icons": "^1.2.5", + "@storybook/theming": "8.0.2", + "@storybook/types": "8.0.2", + "memoizerific": "^1.11.3", + "util-deprecate": "^1.0.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/core-common": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/core-common/-/core-common-8.0.2.tgz", + "integrity": "sha512-0LkQn2dCVzFepLqqlt82ouIuc11UCsDzPtRVHp4p18JA0xs2dmD6d8vJUfEAYAgoeEaH3bFjb57IhMbYT5adhw==", + "dev": true, + "dependencies": { + "@storybook/core-events": "8.0.2", + "@storybook/csf-tools": "8.0.2", + "@storybook/node-logger": "8.0.2", + "@storybook/types": "8.0.2", + "@yarnpkg/fslib": "2.10.3", + "@yarnpkg/libzip": "2.3.0", + "chalk": "^4.1.0", + "cross-spawn": "^7.0.3", + "esbuild": "^0.18.0 || ^0.19.0 || ^0.20.0", + "esbuild-register": "^3.5.0", + "execa": "^5.0.0", + "file-system-cache": "2.3.0", + "find-cache-dir": "^3.0.0", + "find-up": "^5.0.0", + "fs-extra": "^11.1.0", + "glob": "^10.0.0", + "handlebars": "^4.7.7", + "lazy-universal-dotenv": "^4.0.0", + "node-fetch": "^2.0.0", + "picomatch": "^2.3.0", + "pkg-dir": "^5.0.0", + "pretty-hrtime": "^1.0.3", + "resolve-from": "^5.0.0", + "semver": "^7.3.7", + "tempy": "^1.0.1", + "tiny-invariant": "^1.3.1", + "ts-dedent": "^2.0.0", + "util": "^0.12.4" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/core-events": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/core-events/-/core-events-8.0.2.tgz", + "integrity": "sha512-1rtecdU3eyWGMT3U27ldF6ApdakvmmcS8E+1PqLGd5K9v5T0W82n+QyXft3kb434N8KYSwNFf08NfrU0VZeC4w==", + "dev": true, + "dependencies": { + "ts-dedent": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/csf-tools": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/csf-tools/-/csf-tools-8.0.2.tgz", + "integrity": "sha512-NZ7aYPslaCxciq2lKA5q4YsQYtIb7AeYdYqgjuVPdlwkqBuyeiym1OP7wF1X0iFwZVG3/UogqBCALnKQmROo2A==", + "dev": true, + "dependencies": { + "@babel/generator": "^7.23.0", + "@babel/parser": "^7.23.0", + "@babel/traverse": "^7.23.2", + "@babel/types": "^7.23.0", + "@storybook/csf": "^0.1.2", + "@storybook/types": "8.0.2", + "fs-extra": "^11.1.0", + "recast": "^0.23.5", + "ts-dedent": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/docs-tools": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/docs-tools/-/docs-tools-8.0.2.tgz", + "integrity": "sha512-N49fnqqqzW+/GMoQ23DQ4a2DaN2jarVBtweN8gWPocLkDq3oEm4ufa13lYMBNrrMJuNe0F/MOK1OIRcUrA79sA==", + "dev": true, + "dependencies": { + "@storybook/core-common": "8.0.2", + "@storybook/preview-api": "8.0.2", + "@storybook/types": "8.0.2", + "@types/doctrine": "^0.0.3", + "assert": "^2.1.0", + "doctrine": "^3.0.0", + "lodash": "^4.17.21" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/manager-api": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/manager-api/-/manager-api-8.0.2.tgz", + "integrity": "sha512-Bq+idvePWtaGIGgv6kBniVAjxRQU+TaqLqbxPG8j2HI8xi+Hc10dTaOfYQ9WVp6uRAum4BeoLsAqFDEcBt3kew==", + "dev": true, + "dependencies": { + "@storybook/channels": "8.0.2", + "@storybook/client-logger": "8.0.2", + "@storybook/core-events": "8.0.2", + "@storybook/csf": "^0.1.2", + "@storybook/global": "^5.0.0", + "@storybook/router": "8.0.2", + "@storybook/theming": "8.0.2", + "@storybook/types": "8.0.2", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "memoizerific": "^1.11.3", + "store2": "^2.14.2", + "telejson": "^7.2.0", + "ts-dedent": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/node-logger": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/node-logger/-/node-logger-8.0.2.tgz", + "integrity": "sha512-UG6v5PCXYblNCZUlbC+D+NisvSn1caC+q3yNSVAW3Z2MDfWmrkThFVzI7LDj1c9DAkbMr2v9beMHdD+suSQe4g==", + "dev": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/preview-api": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/preview-api/-/preview-api-8.0.2.tgz", + "integrity": "sha512-b321QTjSw6k50eKTPYeB1rlCso9frHADMeudpcQcRdf8ezYQzd/mUZx9DcJnmTS+WuW9LJ435GvJ7b5O1oA6kg==", + "dev": true, + "dependencies": { + "@storybook/channels": "8.0.2", + "@storybook/client-logger": "8.0.2", + "@storybook/core-events": "8.0.2", + "@storybook/csf": "^0.1.2", + "@storybook/global": "^5.0.0", + "@storybook/types": "8.0.2", + "@types/qs": "^6.9.5", + "dequal": "^2.0.2", + "lodash": "^4.17.21", + "memoizerific": "^1.11.3", + "qs": "^6.10.0", + "tiny-invariant": "^1.3.1", + "ts-dedent": "^2.0.0", + "util-deprecate": "^1.0.2" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/router": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/router/-/router-8.0.2.tgz", + "integrity": "sha512-6RB+BaiQ6asVWvBsED4I2fjEv8rfKQv0CBJxIq24B9PY2YcQzO6O6eBG6FMSlDvFPX+y9+Ut0dAseACwKuDaTg==", + "dev": true, + "dependencies": { + "@storybook/client-logger": "8.0.2", + "memoizerific": "^1.11.3", + "qs": "^6.10.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/theming": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/theming/-/theming-8.0.2.tgz", + "integrity": "sha512-llF6Pht11aJrWWuoBa3yyTFgKgA0lyRilfqhx7oWnjgImrl99tzuJNNAyunMMkepYbfvsWevpNegXu3TkqkJxQ==", + "dev": true, + "dependencies": { + "@emotion/use-insertion-effect-with-fallbacks": "^1.0.1", + "@storybook/client-logger": "8.0.2", + "@storybook/global": "^5.0.0", + "memoizerific": "^1.11.3" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + }, + "peerDependencies": { + "react": "^16.8.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "react": { + "optional": true + }, + "react-dom": { + "optional": true + } + } + }, + "node_modules/@storybook/blocks/node_modules/@storybook/types": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/@storybook/types/-/types-8.0.2.tgz", + "integrity": "sha512-vVBNUZFf8v8qxm/FYtg06K5T6dEqHtGZjm4DH/fPc59XvqGpAIl6XEkOwgfTqv30QqXDV2PAaaPDO/21VtXjrQ==", + "dev": true, + "dependencies": { + "@storybook/channels": "8.0.2", + "@types/express": "^4.7.0", + "file-system-cache": "2.3.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/storybook" + } + }, + "node_modules/@storybook/blocks/node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/@storybook/blocks/node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/@storybook/blocks/node_modules/cross-spawn": { + "version": "7.0.3", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", + "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", + "dev": true, + "dependencies": { + "path-key": "^3.1.0", + "shebang-command": "^2.0.0", + "which": "^2.0.1" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/@storybook/blocks/node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, + "engines": { + "node": ">=8" + } + }, + "node_modules/@storybook/blocks/node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/@storybook/blocks/node_modules/which": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", + "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", + "dev": true, + "dependencies": { + "isexe": "^2.0.0" + }, + "bin": { + "node-which": "bin/node-which" + }, + "engines": { + "node": ">= 8" + } + }, "node_modules/@storybook/builder-manager": { "version": "8.0.0", "resolved": "https://registry.npmjs.org/@storybook/builder-manager/-/builder-manager-8.0.0.tgz", diff --git a/extensions/ql-vscode/package.json b/extensions/ql-vscode/package.json index 01a9ac97f2c..02aa990b5e1 100644 --- a/extensions/ql-vscode/package.json +++ b/extensions/ql-vscode/package.json @@ -2001,6 +2001,7 @@ "@storybook/addon-essentials": "^8.0.0", "@storybook/addon-interactions": "^8.0.0", "@storybook/addon-links": "^8.0.0", + "@storybook/blocks": "^8.0.2", "@storybook/components": "^8.0.0", "@storybook/csf": "^0.1.1", "@storybook/manager-api": "^8.0.0", diff --git a/extensions/ql-vscode/src/stories/Overview.stories.mdx b/extensions/ql-vscode/src/stories/Overview.mdx similarity index 92% rename from extensions/ql-vscode/src/stories/Overview.stories.mdx rename to extensions/ql-vscode/src/stories/Overview.mdx index 6400457dfa9..cc06ee5cfca 100644 --- a/extensions/ql-vscode/src/stories/Overview.stories.mdx +++ b/extensions/ql-vscode/src/stories/Overview.mdx @@ -1,4 +1,4 @@ -import { Canvas, Meta, Story } from '@storybook/addon-docs'; +import { Canvas, Meta, Story } from '@storybook/blocks'; import { VSCodeButton } from '@vscode/webview-ui-toolkit/react'; @@ -39,23 +39,29 @@ updated manually if new variables are added to VSCode. It can also be updated if these variables, follow these steps: 1. Make sure you have selected the correct theme. If you want to use a variable which is currently not available and will be committed, please -select the **Dark+** theme. You can use **Preferences: Color Theme** in the *Command Palette* to select the theme. + select the **Dark+** theme. You can use **Preferences: Color Theme** in the *Command Palette* to select the theme. + 2. Open a WebView in VSCode (for example the results of a query) + 3. Open the *Command Palette* (Ctrl/Cmd+Shift+P) + 4. Select **Developer: Open WebView Developer Tools** + 5. Now, you will need to find the `` element in the lowest-level `

Repo states

Repo results

Repo states