diff --git a/src/components/molecules/RunContent.tsx b/src/components/molecules/RunContent.tsx
index 8c493faf..5b219f16 100644
--- a/src/components/molecules/RunContent.tsx
+++ b/src/components/molecules/RunContent.tsx
@@ -7,7 +7,7 @@ import { TabPanel, TabContext } from "@mui/lab";
 import SettingsIcon from '@mui/icons-material/Settings';
 import ImageIcon from '@mui/icons-material/Image';
 import ArticleIcon from '@mui/icons-material/Article';
-import {Buffer} from 'buffer';
+import { Buffer } from 'buffer';
 import { useEffect } from "react";
 import AssignmentIcon from '@mui/icons-material/Assignment';
 
@@ -19,7 +19,7 @@ interface RunContentProps {
   abortRunHandler: () => void,
 }
 
-export const RunContent = ({row, currentLog, interpretationInProgress, logEndRef, abortRunHandler}: RunContentProps) => {
+export const RunContent = ({ row, currentLog, interpretationInProgress, logEndRef, abortRunHandler }: RunContentProps) => {
   const [tab, setTab] = React.useState<string>('log');
 
   useEffect(() => {
@@ -29,141 +29,142 @@ export const RunContent = ({row, currentLog, interpretationInProgress, logEndRef
   return (
     <Box sx={{ width: '100%' }}>
       <TabContext value={tab}>
-      <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
-        <Tabs value={tab} onChange={(e, newTab) => setTab(newTab)} aria-label="run-content-tabs">
-          <Tab label="Log" value='log' />
-          <Tab label="Input" value='input' />
-          <Tab label="Output" value='output' />
-        </Tabs>
-      </Box>
-      <TabPanel value='log'>
-        <Box sx={{ margin: 1,
-          background: '#19171c',
-          overflowY: 'scroll',
-          overflowX: 'scroll',
-          width: '700px',
-          height: 'fit-content',
-          maxHeight: '450px',
-        }}>
-          <div>
-            <Highlight className="javascript">
-              {interpretationInProgress ? currentLog : row.log}
-            </Highlight>
-            <div style={{ float:"left", clear: "both" }}
-                 ref={logEndRef}/>
-          </div>
+        <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
+          <Tabs value={tab} onChange={(e, newTab) => setTab(newTab)} aria-label="run-content-tabs">
+            <Tab label="Log" value='log' />
+            <Tab label="Input" value='input' />
+            <Tab label="Output" value='output' />
+          </Tabs>
         </Box>
-        {interpretationInProgress ? <Button
-          color="error"
-          onClick={abortRunHandler}
-        >
-          Stop
-        </Button> : null}
-      </TabPanel>
-      <TabPanel value='input' sx={{width: '700px'}}>
-        <Typography variant='h6' sx={{display:'flex', alignItems:'center'}}>
-          <SettingsIcon sx={{marginRight: '15px'}}/>
-          Interpreter settings
-        </Typography>
-        {
-          Object.keys(row.interpreterSettings).map((setting, index) => {
-            if (setting === 'params') {
-              return (
-                <div key={`settings-${setting}-${index}`}>
-                <Typography variant='h6' sx={{display:'flex', alignItems:'center'}} key={`setting-${index}`}>
-                  <AssignmentIcon sx={{marginRight: '15px'}}/>
-                  Recording parameters
-                </Typography>
-                  {
-                    Object.keys(row.interpreterSettings.params).map((param, index) => {
-                      return (
-                        <Typography key={`recording-params-item-${index}`} sx={{margin: '10px'}}>
-                          {/*@ts-ignore*/}
-                          {param}: {row.interpreterSettings.params[param].toString()}
-                        </Typography>
-                      )
-                    })
-                  }
-                </div>
-              )
-            }
-            return (
-              <Typography key={`interpreter-settings-item-${index}`} sx={{margin: '10px'}}>
-                {/*@ts-ignore*/}
-                {setting}: {row.interpreterSettings[setting].toString()}
-              </Typography>
-            )
-          })
-        }
-      </TabPanel>
-      <TabPanel value='output' sx={{width: '700px'}}>
-        { !row || !row.serializableOutput || !row.binaryOutput
-          || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0)
-          ? <Typography>The output is empty.</Typography> : null }
-
-        {row.serializableOutput &&
-          Object.keys(row.serializableOutput).length !== 0 &&
-          <div>
-              <Typography variant='h6' sx={{display:'flex', alignItems:'center'}}>
-                  <ArticleIcon sx={{marginRight: '15px'}}/>
-                  Serializable output</Typography>
-            { Object.keys(row.serializableOutput).map((key) => {
-              return (
-                <div key={`number-of-serializable-output-${key}`}>
-                  <Typography>
-                    {key}:
-                    <a href={`data:application/json;utf8,${JSON.stringify(row.serializableOutput[key], null, 2)}`}
-                       download={key} style={{margin:'10px'}}>Download</a>
-                  </Typography>
-                <Box sx={{
-                  width: 'fit-content',
-                  background: 'rgba(0,0,0,0.06)',
-                  maxHeight: '300px',
-                  overflow: 'scroll',
-                }}>
-                  <pre key={`serializable-output-${key}`}>
-                    {row.serializableOutput[key] ? JSON.stringify(row.serializableOutput[key], null, 2)
-                    : 'The output is empty.'}
-                  </pre>
-                </Box>
-                </div>
-              )
-            })}
-          </div>
-        }
-        {row.binaryOutput
-          && Object.keys(row.binaryOutput).length !== 0 &&
-          <div>
-            <Typography variant='h6' sx={{display:'flex', alignItems:'center'}}>
-                <ImageIcon sx={{marginRight:'15px'}}/>
-                Binary output</Typography>
-            { Object.keys(row.binaryOutput).map((key) => {
-              try {
-                const binaryBuffer = JSON.parse(row.binaryOutput[key].data);
-                const b64 = Buffer.from(binaryBuffer.data).toString('base64');
+        <TabPanel value='log'>
+          <Box sx={{
+            margin: 1,
+            background: '#19171c',
+            overflowY: 'scroll',
+            overflowX: 'scroll',
+            width: '700px',
+            height: 'fit-content',
+            maxHeight: '450px',
+          }}>
+            <div>
+              <Highlight className="javascript">
+                {interpretationInProgress ? currentLog : row.log}
+              </Highlight>
+              <div style={{ float: "left", clear: "both" }}
+                ref={logEndRef} />
+            </div>
+          </Box>
+          {interpretationInProgress ? <Button
+            color="error"
+            onClick={abortRunHandler}
+          >
+            Stop
+          </Button> : null}
+        </TabPanel>
+        <TabPanel value='input' sx={{ width: '700px' }}>
+          <Typography variant='h6' sx={{ display: 'flex', alignItems: 'center' }}>
+            <SettingsIcon sx={{ marginRight: '15px' }} />
+            Interpreter settings
+          </Typography>
+          {
+            Object.keys(row.interpreterSettings).map((setting, index) => {
+              if (setting === 'params') {
                 return (
-                  <Box key={`number-of-binary-output-${key}`} sx={{
-                    width: 'max-content',
-                  }}>
-                    <Typography key={`binary-output-key-${key}`}>
-                      {key}:
-                      <a href={`data:${row.binaryOutput[key].mimetype};base64,${b64}`}
-                         download={key} style={{margin:'10px'}}>Download</a>
+                  <div key={`settings-${setting}-${index}`}>
+                    <Typography variant='h6' sx={{ display: 'flex', alignItems: 'center' }} key={`setting-${index}`}>
+                      <AssignmentIcon sx={{ marginRight: '15px' }} />
+                      Recording parameters
                     </Typography>
-                    <img key={`image-${key}`} src={`data:${row.binaryOutput[key].mimetype};base64,${b64}`}
-                         alt={key} height='auto' width='700px'/>
-                  </Box>
+                    {
+                      Object.keys(row.interpreterSettings.params).map((param, index) => {
+                        return (
+                          <Typography key={`recording-params-item-${index}`} sx={{ margin: '10px' }}>
+                            {/*@ts-ignore*/}
+                            {param}: {row.interpreterSettings.params[param].toString()}
+                          </Typography>
+                        )
+                      })
+                    }
+                  </div>
                 )
-              } catch (e) {
-                console.log(e)
-                return <Typography key={`number-of-binary-output-${key}`}>
-                  {key}: The image failed to render
-                </Typography>
               }
+              return (
+                <Typography key={`interpreter-settings-item-${index}`} sx={{ margin: '10px' }}>
+                  {/*@ts-ignore*/}
+                  {setting}: {row.interpreterSettings[setting].toString()}
+                </Typography>
+              )
+            })
+          }
+        </TabPanel>
+        <TabPanel value='output' sx={{ width: '700px' }}>
+          {!row || !row.serializableOutput || !row.binaryOutput
+            || (Object.keys(row.serializableOutput).length === 0 && Object.keys(row.binaryOutput).length === 0)
+            ? <Typography>The output is empty.</Typography> : null}
+
+          {row.serializableOutput &&
+            Object.keys(row.serializableOutput).length !== 0 &&
+            <div>
+              <Typography variant='h6' sx={{ display: 'flex', alignItems: 'center' }}>
+                <ArticleIcon sx={{ marginRight: '15px' }} />
+                Serializable output</Typography>
+              {Object.keys(row.serializableOutput).map((key) => {
+                return (
+                  <div key={`number-of-serializable-output-${key}`}>
+                    <Typography>
+                      {key}:
+                      <a href={`data:application/json;utf8,${JSON.stringify(row.serializableOutput[key], null, 2)}`}
+                        download={key} style={{ margin: '10px' }}>Download</a>
+                    </Typography>
+                    <Box sx={{
+                      width: 'fit-content',
+                      background: 'rgba(0,0,0,0.06)',
+                      maxHeight: '300px',
+                      overflow: 'scroll',
+                    }}>
+                      <pre key={`serializable-output-${key}`}>
+                        {row.serializableOutput[key] ? JSON.stringify(row.serializableOutput[key], null, 2)
+                          : 'The output is empty.'}
+                      </pre>
+                    </Box>
+                  </div>
+                )
               })}
-          </div>
-        }
-      </TabPanel>
+            </div>
+          }
+          {row.binaryOutput
+            && Object.keys(row.binaryOutput).length !== 0 &&
+            <div>
+              <Typography variant='h6' sx={{ display: 'flex', alignItems: 'center' }}>
+                <ImageIcon sx={{ marginRight: '15px' }} />
+                Binary output</Typography>
+              {Object.keys(row.binaryOutput).map((key) => {
+                try {
+                  const binaryBuffer = JSON.parse(row.binaryOutput[key].data);
+                  const b64 = Buffer.from(binaryBuffer.data).toString('base64');
+                  return (
+                    <Box key={`number-of-binary-output-${key}`} sx={{
+                      width: 'max-content',
+                    }}>
+                      <Typography key={`binary-output-key-${key}`}>
+                        {key}:
+                        <a href={`data:${row.binaryOutput[key].mimetype};base64,${b64}`}
+                          download={key} style={{ margin: '10px' }}>Download</a>
+                      </Typography>
+                      <img key={`image-${key}`} src={`data:${row.binaryOutput[key].mimetype};base64,${b64}`}
+                        alt={key} height='auto' width='700px' />
+                    </Box>
+                  )
+                } catch (e) {
+                  console.log(e)
+                  return <Typography key={`number-of-binary-output-${key}`}>
+                    {key}: The image failed to render
+                  </Typography>
+                }
+              })}
+            </div>
+          }
+        </TabPanel>
       </TabContext>
     </Box>
   );