hot patch

web/src/components/IdeCascadeStudio/IdeCascadeStudio.js

@@ -4,8 +4,6 @@ import CascadeController from 'src/helpers/cascadeController'
 import IdeToolbar from 'src/components/IdeToolbar'
 import { useEffect, useState } from 'react'
 
-const domNode = document.createElement('div').setAttribute('id', 'sickId')
-
 const IdeCascadeStudio = ({ part, saveCode, loading, error }) => {
   const [code, setCode] = useState(part.code)
   const { currentUser } = useAuth()
@@ -15,7 +13,7 @@ const IdeCascadeStudio = ({ part, saveCode, loading, error }) => {
     // "opening" and "closing" it for the ide part of the app by displaying none or block. Which is why this useEffect
     // returns a clean up function that hides the div again.
     const onCodeChange = (code) => setCode(code)
-    CascadeController.initialise(onCodeChange, part.code, domNode)
+    CascadeController.initialise(onCodeChange, part.code)
     const element = document.getElementById('cascade-container')
     element.setAttribute('style', 'display: block; opacity: 100%; overflow: hidden; height: calc(100vh - 8rem)') // eslint-disable-line
     return () => {

web/src/components/IdePartCell/IdePartCell.js

@@ -14,6 +14,7 @@ export const QUERY = gql`
       user {
         id
         userName
+        image
       }
     }
   }

web/src/helpers/cascadeController.js

@@ -8,17 +8,19 @@ class CascadeController {
   }
 
   initialise(onCodeChange, code) {
+    const onInit = () => {
+      const editor = getEditor()
+      editor.setValue(code)
+      editor.evaluateCode(false)
+    }
     // only inits on first call, after that it just updates the editor and revaluates code, maybe should rename?
     this.incomingOnCodeChang = onCodeChange
     if (!this._hasInitialised) {
-      initialize(this.controllerOnCodeChange, code)
+      initialize(this.controllerOnCodeChange, code, onInit)
       this._hasInitialised = true
       return
     }
-    const editor = getEditor()
+    onInit()
-    editor.setValue(code)
-    editor.evaluateCode(false)
-    return this.domNode
   }
 }