diff --git a/frontend/app/block/block.less b/frontend/app/block/block.less
index 93e4fa70..ba55d76b 100644
--- a/frontend/app/block/block.less
+++ b/frontend/app/block/block.less
@@ -85,7 +85,8 @@
 
                 .block-frame-default-header-iconview {
                     display: flex;
-                    flex: 0 1 auto;
+                    flex-shrink: 3;
+                    min-width: 17px;
                     align-items: center;
                     gap: 8px;
                     overflow-x: hidden;
@@ -100,10 +101,11 @@
                     }
 
                     .block-frame-view-type {
-                        font-weight: 700;
                         overflow-x: hidden;
                         text-wrap: nowrap;
                         text-overflow: ellipsis;
+                        flex-shrink: 1;
+                        min-width: 0;
                     }
 
                     .block-frame-blockid {
@@ -116,12 +118,12 @@
                     font: var(--fixed-font);
                     font-size: 11px;
                     opacity: 0.7;
-                    overflow-x: hidden;
                     flex-grow: 1;
 
                     &.preview-filename {
+                        direction: rtl;
+                        text-align: left;
                         span {
-                            height: 100%;
                             cursor: pointer;
 
                             &:hover {
@@ -168,7 +170,7 @@
                     }
 
                     .connection-name {
-                        flex: 1 100 auto;
+                        flex: 1 2 auto;
                         overflow: hidden;
                         padding-right: 4px;
                     }
@@ -176,11 +178,10 @@
 
                 .block-frame-textelems-wrapper {
                     display: flex;
-                    flex: 1 100 auto;
+                    flex: 1 2 auto;
                     min-width: 0;
                     gap: 8px;
                     align-items: center;
-                    overflow-x: hidden;
 
                     .block-frame-div {
                         display: flex;
diff --git a/frontend/app/block/blockframe.tsx b/frontend/app/block/blockframe.tsx
index 9e9818bc..8469a97b 100644
--- a/frontend/app/block/blockframe.tsx
+++ b/frontend/app/block/blockframe.tsx
@@ -178,24 +178,13 @@ const BlockFrame_Header = ({
         if (!util.isBlank(headerTextUnion)) {
             headerTextElems.push(
                 <div key="text" className="block-frame-text">
-                    {headerTextUnion}
+                    &lrm;{headerTextUnion}
                 </div>
             );
         }
     } else if (Array.isArray(headerTextUnion)) {
         headerTextElems.push(...renderHeaderElements(headerTextUnion, preview));
     }
-    if (manageConnection) {
-        const connButtonElem = (
-            <ConnectionButton
-                ref={connBtnRef}
-                key="connbutton"
-                connection={blockData?.meta?.connection}
-                changeConnModalAtom={changeConnModalAtom}
-            />
-        );
-        headerTextElems.unshift(connButtonElem);
-    }
     headerTextElems.unshift(<ControllerStatusIcon key="connstatus" blockId={nodeModel.blockId} />);
 
     return (
@@ -206,7 +195,14 @@ const BlockFrame_Header = ({
                 <div className="block-frame-view-type">{viewName}</div>
                 {showBlockIds && <div className="block-frame-blockid">[{nodeModel.blockId.substring(0, 8)}]</div>}
             </div>
-
+            {manageConnection && (
+                <ConnectionButton
+                    ref={connBtnRef}
+                    key="connbutton"
+                    connection={blockData?.meta?.connection}
+                    changeConnModalAtom={changeConnModalAtom}
+                />
+            )}
             <div className="block-frame-textelems-wrapper">{headerTextElems}</div>
             <div className="block-frame-end-icons">{endIconsElem}</div>
         </div>
@@ -222,7 +218,7 @@ const HeaderTextElem = React.memo(({ elem, preview }: { elem: HeaderElem; previe
         return (
             <div className={clsx("block-frame-text", elem.className)}>
                 <span ref={preview ? null : elem.ref} onClick={() => elem?.onClick()}>
-                    {elem.text}
+                    &lrm;{elem.text}
                 </span>
             </div>
         );
diff --git a/frontend/app/view/preview/preview.tsx b/frontend/app/view/preview/preview.tsx
index a62eaff7..264c875e 100644
--- a/frontend/app/view/preview/preview.tsx
+++ b/frontend/app/view/preview/preview.tsx
@@ -143,7 +143,6 @@ export class PreviewModel implements ViewModel {
         this.monacoRef = createRef();
         this.viewIcon = jotai.atom((get) => {
             const blockData = get(this.blockAtom);
-            const fileName = get(this.metaFilePath);
             const mimeTypeLoadable = get(this.fileMimeTypeLoadable);
             if (blockData?.meta?.icon) {
                 return blockData.meta.icon;