remove duplication

webview/src/setup/components/dvc/Dvc.tsx

@@ -7,8 +7,8 @@ import { ProjectUninitialized } from './ProjectUninitialized'
 import { CliUnavailable } from './CliUnavailable'
 import { EmptyState } from '../../../shared/components/emptyState/EmptyState'
 import { usePrevious } from '../../hooks/usePrevious'
-import { updateSectionCollapsed } from '../../state/webviewSlice'
 import { SetupState } from '../../store'
+import { closeSection } from '../shared/util'
 
 export const Dvc: React.FC = () => {
   const dispatch = useDispatch()
@@ -29,14 +29,7 @@ export const Dvc: React.FC = () => {
     }
 
     if (previousIsComplete === false && isComplete) {
-      dispatch(
-        updateSectionCollapsed({
-          [SetupSection.DVC]: true,
-          [SetupSection.EXPERIMENTS]: false,
-          [SetupSection.REMOTES]: false,
-          [SetupSection.STUDIO]: false
-        })
-      )
+      dispatch(closeSection(SetupSection.DVC))
     }
   }, [
     dispatch,

webview/src/setup/components/shared/FocusDvcSection.tsx

@@ -1,24 +1,15 @@
 import React from 'react'
 import { useDispatch } from 'react-redux'
 import { SetupSection } from 'dvc/src/setup/webview/contract'
-import { updateSectionCollapsed } from '../../state/webviewSlice'
+import { focusSection } from './util'
 import { Button } from '../../../shared/components/button/Button'
 
 export const FocusDvcSection = () => {
   const dispatch = useDispatch()
   return (
     <Button
       text="Setup DVC"
-      onClick={() =>
-        dispatch(
-          updateSectionCollapsed({
-            [SetupSection.DVC]: false,
-            [SetupSection.EXPERIMENTS]: true,
-            [SetupSection.REMOTES]: true,
-            [SetupSection.STUDIO]: true
-          })
-        )
-      }
+      onClick={() => dispatch(focusSection(SetupSection.DVC))}
     />
   )
 }

webview/src/setup/components/shared/util.ts

@@ -0,0 +1,21 @@
+import { SetupSection } from 'dvc/src/setup/webview/contract'
+import { updateSectionCollapsed } from '../../state/webviewSlice'
+
+const getAllSections = (collaspsed: boolean) => ({
+  [SetupSection.DVC]: collaspsed,
+  [SetupSection.EXPERIMENTS]: collaspsed,
+  [SetupSection.REMOTES]: collaspsed,
+  [SetupSection.STUDIO]: collaspsed
+})
+
+export const focusSection = (section: SetupSection) =>
+  updateSectionCollapsed({
+    ...getAllSections(true),
+    [section]: false
+  })
+
+export const closeSection = (section: SetupSection) =>
+  updateSectionCollapsed({
+    ...getAllSections(false),
+    [section]: true
+  })