Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show DVC Cli Details in DVC Setup #3688

Merged
merged 25 commits into from
Apr 27, 2023
Merged

Conversation

julieg18
Copy link
Contributor

@julieg18 julieg18 commented Apr 14, 2023

Demo

For details on current design, see discussion in #3434

https://user-images.githubusercontent.com/43496356/234300243-444ba148-e626-450b-955a-bd28020cac78.mov

Screen.Recording.2023-04-27.at.1.22.54.PM.mov

Part of #3434

@julieg18 julieg18 added the product PR that affects product label Apr 14, 2023
@julieg18 julieg18 added this to In progress in VS Code Apr 10 via automation Apr 14, 2023
@julieg18 julieg18 self-assigned this Apr 14, 2023
Copy link
Contributor Author

@julieg18 julieg18 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Updating our extension button and toasts is going to be in a separate pr, but let me know if we want to hold merging this until that pr is ready to go!

} from 'dvc/src/setup/webview/contract'
import {
MessageFromWebviewType,
MessageToWebview
} from 'dvc/src/webview/contract'
import React, { useCallback, useState } from 'react'
import { Dvc } from './Dvc'
import { Dvc } from './dvc/Dvc'
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With DVC needing styles now, I moved DVC related components to a dvc folder.

webview/src/setup/components/dvc/Dvc.tsx Outdated Show resolved Hide resolved
webview/src/shared/variables.scss Outdated Show resolved Hide resolved
@julieg18 julieg18 marked this pull request as ready for review April 18, 2023 15:44
@julieg18 julieg18 requested a review from sroy3 April 18, 2023 21:08
@julieg18 julieg18 added this to In progress in VS Code Apr 17 via automation Apr 18, 2023
@julieg18
Copy link
Contributor Author

Converting this to a draft for now since how we are going to display these details still needs work!

@julieg18 julieg18 marked this pull request as draft April 18, 2023 22:03
@@ -19,6 +20,9 @@ export const App: React.FC = () => {
const [cliCompatible, setCliCompatible] = useState<boolean | undefined>(
undefined
)
const [dvcCliDetails, setDvcCliDetails] = useState<DvcCliDetails | undefined>(
Copy link
Contributor Author

@julieg18 julieg18 Apr 25, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Currently we're passing around an object, but we could also just have two new properties, dvcVersion and dvcExampleCommand.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Both CliIncompatible and CliUnavailable have been simplified.

webview/src/stories/Setup.stories.tsx Show resolved Hide resolved
@julieg18 julieg18 marked this pull request as ready for review April 25, 2023 14:22
@julieg18
Copy link
Contributor Author

Design has been discussed in #3434 and I think we're ready for another round of reviews!

extension/src/setup/index.ts Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/CliUnavailable.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/CliUnavailable.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/Dvc.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/DvcEnvDetails.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/DvcEnvDetails.tsx Outdated Show resolved Hide resolved
@@ -36,7 +40,6 @@ export const App: React.FC = () => {
const [sectionCollapsed, setSectionCollapsed] = useState(
DEFAULT_SECTION_COLLAPSED
)

const [isStudioConnected, setIsStudioConnected] = useState<boolean>(false)
const [shareLiveToStudio, setShareLiveToStudioValue] =
useState<boolean>(false)
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

As we're starting to have multiple levels of components and a rapidly growing state, it might be time to get Redux into that webview as well.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Will update #3434!

webview/src/setup/components/dvc/ProjectUninitialized.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/ProjectUninitialized.tsx Outdated Show resolved Hide resolved
webview/src/setup/components/dvc/styles.module.scss Outdated Show resolved Hide resolved
@julieg18 julieg18 added this to In progress in VS Code Apr 25 via automation Apr 25, 2023
}) => {
const versionText = `${
version || 'Not found'
} (required >= ${MIN_CLI_VERSION} and < ${MAX_CLI_VERSION}.0.0)`
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know I am going directly against this but I would but required between ${MIN_CLI_VERSION} and ${MAX_CLI_VERSION}.0.0 like

${MIN_CLI_VERSION} <= required < ${MAX_CLI_VERSION}.0.0

or

${MIN_CLI_VERSION} <= DVC < ${MAX_CLI_VERSION}.0.0

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Decided to go with ${MIN_CLI_VERSION} <= required < ${MAX_CLI_VERSION}.0.0

extension/src/setup/index.ts Outdated Show resolved Hide resolved
<button className={styles.buttonAsLink} onClick={setupWorkspace}>
Configure
</button>
{isPythonExtensionInstalled && (
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

[I] Bit of an edge case but if we are not using the python extension to "discover" the CLI then I don't think we want to display this as it can be confusing:

Screen.Recording.2023-04-26.at.12.13.27.pm.mov

This is why trying to jam everything into a single field is hard.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch! I'll only show it if the user is using the python extension or, if that's difficult to check, remove it entirely.

@@ -8,6 +8,10 @@ import { App } from '../setup/components/App'
const DEFAULT_DATA: SetupData = {
canGitInitialize: false,
cliCompatible: true,
dvcCliDetails: {
exampleCommand: 'path/to/python -m dvc',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

should this be invocation instead of exampleCommand? If not let's match it to the UI (command). Again, I know I am going directly against #3434 (comment) but I think we could find a better word in the UI for "Command".

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll update it to command for now!

@julieg18 julieg18 force-pushed the show-dvc-cli-details-in-setup branch from 11b8ea0 to d9662cc Compare April 27, 2023 18:19
Copy link
Contributor Author

@julieg18 julieg18 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Resolving #3688 (comment) ended up touching more code than I thought. Decided to comment on main changes before merging :)

<button className={styles.buttonAsLink} onClick={setupWorkspace}>
Configure
</button>
{isPythonExtensionUsed && (
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

With the changes to DVC setup, isPythonExtensionInstalled was only used here so I decided to replace isPythonExtensionInstalled with isPythonExtensionUsed.

projectInitialized: false
})

export const CliFoundManually = Template.bind({})
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Added a new story to show how things would look if python extension is not being used and replaced NoCLIPythonExtensionNotUsed and NoCLIPythonExtensionUsedwith NoCliPythonFound since the two previous stories look the same now.

@codeclimate
Copy link

codeclimate bot commented Apr 27, 2023

Code Climate has analyzed commit a303201 and detected 0 issues on this pull request.

The test coverage on the diff in this pull request is 100.0% (85% is the threshold).

This pull request will bring the total coverage in the repository to 94.7% (0.0% change).

View more on Code Climate.

@julieg18 julieg18 enabled auto-merge (squash) April 27, 2023 19:12
@julieg18 julieg18 merged commit 12221b1 into main Apr 27, 2023
3 checks passed
VS Code Apr 25 automation moved this from In progress to Done Apr 27, 2023
@julieg18 julieg18 deleted the show-dvc-cli-details-in-setup branch April 27, 2023 19:17
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
product PR that affects product
Projects
No open projects
Development

Successfully merging this pull request may close these issues.

None yet

3 participants