-
Notifications
You must be signed in to change notification settings - Fork 29
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
Give Setup webview a single section #3441
Changes from all commits
File filter
Filter by extension
Conversations
Jump to
Diff view
Diff view
There are no files selected for viewing
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,80 @@ | ||
import React from 'react' | ||
import { CliIncompatible } from './CliIncompatible' | ||
import { CliUnavailable } from './CliUnavailable' | ||
import { ProjectUninitialized } from './ProjectUninitialized' | ||
import { | ||
checkCompatibility, | ||
initializeDvc, | ||
initializeGit, | ||
installDvc, | ||
selectPythonInterpreter, | ||
setupWorkspace, | ||
showScmPanel | ||
} from './messages' | ||
import { NeedsGitCommit } from './NeedsGitCommit' | ||
import { NoData } from './NoData' | ||
import { EmptyState } from '../../shared/components/emptyState/EmptyState' | ||
|
||
export type SetupExperimentsProps = { | ||
canGitInitialize: boolean | undefined | ||
cliCompatible: boolean | undefined | ||
hasData: boolean | undefined | ||
isPythonExtensionInstalled: boolean | ||
needsGitInitialized: boolean | undefined | ||
needsGitCommit: boolean | ||
projectInitialized: boolean | ||
pythonBinPath: string | undefined | ||
} | ||
|
||
export const SetupExperiments: React.FC<SetupExperimentsProps> = ({ | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Function |
||
canGitInitialize, | ||
cliCompatible, | ||
hasData, | ||
isPythonExtensionInstalled, | ||
needsGitInitialized, | ||
needsGitCommit, | ||
projectInitialized, | ||
pythonBinPath | ||
// eslint-disable-next-line sonarjs/cognitive-complexity | ||
}) => { | ||
if (cliCompatible === false) { | ||
return <CliIncompatible checkCompatibility={checkCompatibility} /> | ||
} | ||
|
||
if (cliCompatible === undefined) { | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Similar blocks of code found in 2 locations. Consider refactoring. |
||
return ( | ||
<CliUnavailable | ||
installDvc={installDvc} | ||
isPythonExtensionInstalled={isPythonExtensionInstalled} | ||
pythonBinPath={pythonBinPath} | ||
selectPythonInterpreter={selectPythonInterpreter} | ||
setupWorkspace={setupWorkspace} | ||
/> | ||
) | ||
} | ||
|
||
if (!projectInitialized) { | ||
return ( | ||
<ProjectUninitialized | ||
canGitInitialize={canGitInitialize} | ||
initializeDvc={initializeDvc} | ||
initializeGit={initializeGit} | ||
needsGitInitialized={needsGitInitialized} | ||
/> | ||
) | ||
} | ||
|
||
if (needsGitCommit) { | ||
return <NeedsGitCommit showScmPanel={showScmPanel} /> | ||
} | ||
|
||
if (hasData === undefined) { | ||
return <EmptyState>Loading Project...</EmptyState> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Avoid too many |
||
} | ||
|
||
if (!hasData) { | ||
return <NoData /> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Avoid too many |
||
} | ||
|
||
return <EmptyState>{"You're all setup"}</EmptyState> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. Avoid too many |
||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
import { MessageFromWebviewType } from 'dvc/src/webview/contract' | ||
import { sendMessage } from '../../shared/vscode' | ||
|
||
export const checkCompatibility = () => { | ||
sendMessage({ type: MessageFromWebviewType.CHECK_CLI_COMPATIBLE }) | ||
} | ||
|
||
export const initializeGit = () => { | ||
sendMessage({ | ||
type: MessageFromWebviewType.INITIALIZE_GIT | ||
}) | ||
} | ||
|
||
export const initializeDvc = () => { | ||
sendMessage({ | ||
type: MessageFromWebviewType.INITIALIZE_DVC | ||
}) | ||
} | ||
|
||
export const showScmPanel = () => { | ||
sendMessage({ type: MessageFromWebviewType.SHOW_SCM_PANEL }) | ||
} | ||
|
||
export const installDvc = () => { | ||
sendMessage({ type: MessageFromWebviewType.INSTALL_DVC }) | ||
} | ||
|
||
export const selectPythonInterpreter = () => { | ||
sendMessage({ type: MessageFromWebviewType.SELECT_PYTHON_INTERPRETER }) | ||
} | ||
|
||
export const setupWorkspace = () => { | ||
sendMessage({ type: MessageFromWebviewType.SETUP_WORKSPACE }) | ||
} |
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,6 @@ | ||
import React, { MouseEvent } from 'react' | ||
import { Section as PlotsSection } from 'dvc/src/plots/webview/contract' | ||
import { Section as SetupSection } from 'dvc/src/setup/webview/contract' | ||
import styles from './styles.module.scss' | ||
import { Icon } from '../Icon' | ||
import { ChevronDown, ChevronRight, Info } from '../icons' | ||
|
@@ -54,12 +55,22 @@ export const SectionDescription = { | |
</a> | ||
. | ||
</span> | ||
), | ||
// Setup Experiments | ||
[SetupSection.EXPERIMENTS]: ( | ||
<span data-testid="tooltip-setup-experiments"> | ||
Configure the extension to start tracking and visualizing{' '} | ||
<a href="https://dvc.org/doc/start/experiment-management/experiments"> | ||
experiments | ||
</a> | ||
. | ||
</span> | ||
) | ||
} as const | ||
|
||
export interface SectionContainerProps<T extends PlotsSection> { | ||
export interface SectionContainerProps<T extends PlotsSection | SetupSection> { | ||
children: React.ReactNode | ||
menuItems: IconMenuItemProps[] | ||
menuItems?: IconMenuItemProps[] | ||
onToggleSection: () => void | ||
sectionCollapsed: boolean | ||
sectionKey: T | ||
|
@@ -71,10 +82,10 @@ const InfoIcon = () => ( | |
) | ||
|
||
export const SectionContainer: React.FC< | ||
SectionContainerProps<PlotsSection> | ||
SectionContainerProps<PlotsSection | SetupSection> | ||
> = ({ | ||
children, | ||
menuItems, | ||
menuItems = [], | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. [F] We don't need this right now but I thought maybe we could use it for a carousel-like action to move between the screens. There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more.
|
||
onToggleSection, | ||
sectionCollapsed, | ||
sectionKey, | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
[Q] Should I just match the plots and experiments
<App/>
s and bring redux in here now?There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think it's worth it yet for the few levels that we have and how simple the components are.