Fix web component tabbed view (#1114)

Small fix to stop web component switching to the pre-set split/tabbed
view on every code run

I thought this was related to the `pyodide` switch but it turned out not
to be - this is actually an annoying bug that is live on production 😅

---------

Co-authored-by: MagdalenaJadach <[email protected]>

Author: loiswells97

CHANGELOG.md

@@ -29,6 +29,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 - Build to include public files (#1112)
 - Dynamic runner switching with more than one `python` file (#1097)
 - Pyodide running the correct file (`main.py`) when there are multiple `python` files (#1097)
+- Persisting choice of tabbed/split view when running `python` code (#1114)
 
 ## [0.27.1] - 2024-10-01
 

src/components/WebComponentProject/WebComponentProject.jsx

@@ -52,9 +52,11 @@ const WebComponentProject = ({
   const [codeHasRun, setCodeHasRun] = useState(codeHasBeenRun);
   const dispatch = useDispatch();
 
-  dispatch(setIsSplitView(outputSplitView));
-  dispatch(setWebComponent(true));
-  dispatch(setIsOutputOnly(outputOnly));
+  useEffect(() => {
+    dispatch(setIsSplitView(outputSplitView));
+    dispatch(setWebComponent(true));
+    dispatch(setIsOutputOnly(outputOnly));
+  }, [outputSplitView, outputOnly, dispatch]);
 
   useEffect(() => {
     setCodeHasRun(false);