fix: display of multiple blocks per region

Author: jungmair

frontend/packages/common/MLIRViewer.js

@@ -81,14 +81,20 @@ const renderType = ({data, selectionState, onOpClick}) => {
 }
 
 const renderBlock = ({data, selectionState, onOpClick}) => {
+    let children=data.children
+    if (data.eCB){
+        children=children.slice(1,-1)
+    }else{
+        children=children.slice(1)
+    }
     return (<div style={{display: "inline"}}>
-        {"{"}
+        {data.sCB?"{":<Render data={data.children[0]} selectionState={selectionState} onOpClick={onOpClick}/>}
         <div style={{paddingLeft: "10px"}}>
-            {data.children.slice(1, -1).map((child, index) => {
+            {children.map((child, index) => {
                 return (<Render data={child} selectionState={selectionState} onOpClick={onOpClick}></Render>)
             })}
         </div>
-        {"}"}
+        {data.eCB?"}":""}
     </div>)
 }
 

frontend/packages/insights/src/App.js

@@ -208,9 +208,6 @@ const App = () => {
                     <Col className="p-3" style={{backgroundColor: '#f8f9fa'}}>
                         {hasLayers && <div><Tabs activeKey={activeRightTab} onSelect={handleRightTabSelect}>
                             <Tab eventKey="mlir_relalg" title="RelAlg">
-                                <MLIRViewer height={2 * (window.innerHeight - 90) / 3}
-                                            width={(window.innerWidth - 100) / 2}
-                                            layer={relalgMLIRData} selectedOps={selectedOps}></MLIRViewer>
                             </Tab>
                             <Tab eventKey="mlir_subop" title="SubOp">