From 1faf0182cef52aaf001be4da091f9f85cd44531e Mon Sep 17 00:00:00 2001
From: Julie G <43496356+julieg18@users.noreply.github.com>
Date: Mon, 15 May 2023 19:15:54 -0500
Subject: [PATCH] Fix broken setup stories (#3896)

---
 webview/src/setup/components/App.tsx  |  2 +-
 webview/src/stories/Setup.stories.tsx | 24 ++++++++++++++++++++++--
 2 files changed, 23 insertions(+), 3 deletions(-)

diff --git a/webview/src/setup/components/App.tsx b/webview/src/setup/components/App.tsx
index 8ff4ce9a09..1afb6e069e 100644
--- a/webview/src/setup/components/App.tsx
+++ b/webview/src/setup/components/App.tsx
@@ -34,7 +34,7 @@ import {
   updateNeedsGitCommit
 } from '../state/experimentsSlice'
 
-const feedStore = (
+export const feedStore = (
   data: MessageToWebview<SetupData>,
   dispatch: SetupDispatch
 ) => {
diff --git a/webview/src/stories/Setup.stories.tsx b/webview/src/stories/Setup.stories.tsx
index 26097c3ad0..3fe350f794 100644
--- a/webview/src/stories/Setup.stories.tsx
+++ b/webview/src/stories/Setup.stories.tsx
@@ -1,9 +1,12 @@
 import type { StoryFn, Meta } from '@storybook/react'
 import React from 'react'
+import { Provider, useDispatch } from 'react-redux'
+import { configureStore } from '@reduxjs/toolkit'
 import { MessageToWebviewType } from 'dvc/src/webview/contract'
 import { SetupData, SetupSection } from 'dvc/src/setup/webview/contract'
 import { DISABLE_CHROMATIC_SNAPSHOTS } from './util'
-import { App } from '../setup/components/App'
+import { App, feedStore } from '../setup/components/App'
+import { setupReducers } from '../setup/store'
 
 const DEFAULT_DATA: SetupData = {
   canGitInitialize: false,
@@ -34,6 +37,17 @@ const getUpdatedArgs = (data: Partial<SetupData>): { data: SetupData } => ({
   }
 })
 
+const MockedState: React.FC<{ data: SetupData; children: React.ReactNode }> = ({
+  children,
+  data
+}) => {
+  const dispatch = useDispatch()
+  const message = { data, type: MessageToWebviewType.SET_DATA }
+  feedStore(message, dispatch)
+
+  return <>{children}</>
+}
+
 export default {
   args: {},
   component: App,
@@ -42,7 +56,13 @@ export default {
 } as Meta
 
 const Template: StoryFn = ({ data }) => {
-  const app = <App />
+  const app = (
+    <Provider store={configureStore({ reducer: setupReducers })}>
+      <MockedState data={data}>
+        <App />
+      </MockedState>
+    </Provider>
+  )
   window.postMessage(
     {
       data,