+ Get Started
+
+ New to the extension? Go through the walkthrough to familiarize yourself
+ with the different features.
+
+
+
+ )
+}
diff --git a/webview/src/setup/components/messages.ts b/webview/src/setup/components/messages.ts
index 698ac972f1..68a635701c 100644
--- a/webview/src/setup/components/messages.ts
+++ b/webview/src/setup/components/messages.ts
@@ -1,6 +1,10 @@
import { MessageFromWebviewType } from 'dvc/src/webview/contract'
import { sendMessage } from '../../shared/vscode'
+export const showWalkthrough = () => {
+ sendMessage({ type: MessageFromWebviewType.SHOW_WALKTHROUGH })
+}
+
export const checkCompatibility = () => {
sendMessage({ type: MessageFromWebviewType.CHECK_CLI_COMPATIBLE })
}
diff --git a/webview/src/setup/components/shared/util.ts b/webview/src/setup/components/shared/util.ts
index 33d5db9491..e1ae6799ae 100644
--- a/webview/src/setup/components/shared/util.ts
+++ b/webview/src/setup/components/shared/util.ts
@@ -3,6 +3,7 @@ import { updateSectionCollapsed } from '../../state/webviewSlice'
const getAllSections = (collapsed: boolean) => ({
[SetupSection.DVC]: collapsed,
+ [SetupSection.GET_STARTED]: collapsed,
[SetupSection.EXPERIMENTS]: collapsed,
[SetupSection.REMOTES]: collapsed,
[SetupSection.STUDIO]: collapsed
diff --git a/webview/src/shared/components/sectionContainer/SectionDescription.tsx b/webview/src/shared/components/sectionContainer/SectionDescription.tsx
index eb82a73ed3..ddc3b2cee2 100644
--- a/webview/src/shared/components/sectionContainer/SectionDescription.tsx
+++ b/webview/src/shared/components/sectionContainer/SectionDescription.tsx
@@ -12,6 +12,8 @@ const sectionDescriptionTestIds = {
[PlotsSection.TEMPLATE_PLOTS]: 'tooltip-template-plots',
// Setup DVC
[SetupSection.DVC]: 'tooltip-setup-dvc',
+ // Setup Get Started
+ [SetupSection.GET_STARTED]: 'tooltip-setup-get-started',
// Setup Experiments
[SetupSection.EXPERIMENTS]: 'tooltip-setup-experiments',
// Setup Remote
@@ -55,6 +57,8 @@ export const SectionDescriptionMainText = {
.
>
),
+ // Setup Get Started
+ [SetupSection.GET_STARTED]: <>Get started with the extension>,
// Setup DVC
[SetupSection.DVC]: <>Configure the extension to start working with DVC.>,
// Setup Experiments
diff --git a/webview/src/stories/Setup.stories.tsx b/webview/src/stories/Setup.stories.tsx
index 5be17782fc..a6fa890aa5 100644
--- a/webview/src/stories/Setup.stories.tsx
+++ b/webview/src/stories/Setup.stories.tsx
@@ -26,6 +26,7 @@ const DEFAULT_DATA: SetupData = {
remoteList: undefined,
sectionCollapsed: {
[SetupSection.DVC]: false,
+ [SetupSection.GET_STARTED]: false,
[SetupSection.EXPERIMENTS]: false,
[SetupSection.REMOTES]: false,
[SetupSection.STUDIO]: true
@@ -161,6 +162,7 @@ NoRemoteSetup.args = getUpdatedArgs({
},
sectionCollapsed: {
[SetupSection.DVC]: true,
+ [SetupSection.GET_STARTED]: true,
[SetupSection.EXPERIMENTS]: true,
[SetupSection.REMOTES]: false,
[SetupSection.STUDIO]: true
@@ -178,6 +180,7 @@ ProjectRemoteSetup.args = getUpdatedArgs({
},
sectionCollapsed: {
[SetupSection.DVC]: true,
+ [SetupSection.GET_STARTED]: true,
[SetupSection.EXPERIMENTS]: true,
[SetupSection.REMOTES]: false,
[SetupSection.STUDIO]: true
@@ -198,6 +201,7 @@ MultiProjectRemoteSetup.args = getUpdatedArgs({
},
sectionCollapsed: {
[SetupSection.DVC]: true,
+ [SetupSection.GET_STARTED]: true,
[SetupSection.EXPERIMENTS]: true,
[SetupSection.REMOTES]: false,
[SetupSection.STUDIO]: true