From baff349fa257a452f414d071422a9870f0233d89 Mon Sep 17 00:00:00 2001
From: Adorian Doran <adorian@esevo.ro>
Date: Sun, 9 Nov 2025 02:23:57 +0200
Subject: [PATCH] client: refactor

---
 apps/client/src/layouts/desktop_layout.tsx             |  2 +-
 apps/client/src/layouts/mobile_layout.tsx              |  2 +-
 apps/client/src/widgets/ReadOnlyNoteInfoBar.css        |  4 ----
 apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx        | 10 ++++++----
 .../src/widgets/{ => containers}/content-header.ts     |  8 ++++----
 5 files changed, 12 insertions(+), 14 deletions(-)
 rename apps/client/src/widgets/{ => containers}/content-header.ts (89%)

diff --git a/apps/client/src/layouts/desktop_layout.tsx b/apps/client/src/layouts/desktop_layout.tsx
index d5693ada7..b7d170bcf 100644
--- a/apps/client/src/layouts/desktop_layout.tsx
+++ b/apps/client/src/layouts/desktop_layout.tsx
@@ -3,7 +3,7 @@ import { DESKTOP_FLOATING_BUTTONS } from "../widgets/FloatingButtonsDefinitions.
 import ApiLog from "../widgets/api_log.jsx";
 import ClosePaneButton from "../widgets/buttons/close_pane_button.js";
 import CloseZenModeButton from "../widgets/close_zen_button.jsx";
-import ContentHeader from "../widgets/content-header.js";
+import ContentHeader from "../widgets/containers/content-header.js";
 import CreatePaneButton from "../widgets/buttons/create_pane_button.js";
 import FindWidget from "../widgets/find.js";
 import FlexContainer from "../widgets/containers/flex_container.js";
diff --git a/apps/client/src/layouts/mobile_layout.tsx b/apps/client/src/layouts/mobile_layout.tsx
index 8d1aeece8..1ac3bd55c 100644
--- a/apps/client/src/layouts/mobile_layout.tsx
+++ b/apps/client/src/layouts/mobile_layout.tsx
@@ -12,6 +12,7 @@ import MobileEditorToolbar from "../widgets/type_widgets/ckeditor/mobile_editor_
 import NoteDetailWidget from "../widgets/note_detail.js";
 import NoteList from "../widgets/collections/NoteList.jsx";
 import NoteTitleWidget from "../widgets/note_title.js";
+import ContentHeader from "../widgets/containers/content-header.js";
 import NoteTreeWidget from "../widgets/note_tree.js";
 import NoteWrapperWidget from "../widgets/note_wrapper.js";
 import PromotedAttributesWidget from "../widgets/promoted_attributes.js";
@@ -28,7 +29,6 @@ import StandaloneRibbonAdapter from "../widgets/ribbon/components/StandaloneRibb
 import TabRowWidget from "../widgets/tab_row.js";
 import ToggleSidebarButton from "../widgets/mobile_widgets/toggle_sidebar_button.jsx";
 import type AppContext from "../components/app_context.js";
-import ContentHeader from "../widgets/content-header.js";
 
 const MOBILE_CSS = `
 <style>
diff --git a/apps/client/src/widgets/ReadOnlyNoteInfoBar.css b/apps/client/src/widgets/ReadOnlyNoteInfoBar.css
index e7321ee42..2740cc9de 100644
--- a/apps/client/src/widgets/ReadOnlyNoteInfoBar.css
+++ b/apps/client/src/widgets/ReadOnlyNoteInfoBar.css
@@ -1,7 +1,3 @@
-div.read-only-note-info-bar-widget {
-    contain: none;
-}
-
 body.zen div.read-only-note-info-bar-widget {
     width: fit-content;
     max-width: var(--max-content-width);
diff --git a/apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx b/apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx
index 6d06ebee7..f10939d47 100644
--- a/apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx
+++ b/apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx
@@ -9,8 +9,10 @@ export default function ReadOnlyNoteInfoBar(props: {}) {
     const {isReadOnly, enableEditing} = useIsNoteReadOnly(note, noteContext);
     const isExplicitReadOnly = note?.isLabelTruthy("readOnly");
 
-    return <div class={`read-only-note-info-bar-widget ${(isReadOnly) ? "visible" : ""}`}>
-                {isReadOnly && <InfoBar type={(isExplicitReadOnly ? "subtle" : "prominent")}>
+    return <InfoBar className="read-only-note-info-bar-widget"
+                    type={(isExplicitReadOnly ? "subtle" : "prominent")}
+                    style={{display: (!isReadOnly) ? "none" : undefined}}>
+
                     <div class="read-only-note-info-bar-widget-content">
                         {(isExplicitReadOnly) ? (
                             <div>{t("read-only-info.read-only-note")}</div>
@@ -29,6 +31,6 @@ export default function ReadOnlyNoteInfoBar(props: {}) {
                         <Button text={t("read-only-info.edit-note")}
                                 icon="bx-pencil" onClick={() => enableEditing()} />
                     </div>
-                </InfoBar>}
-            </div>;
+                </InfoBar>
+
 }
\ No newline at end of file
diff --git a/apps/client/src/widgets/content-header.ts b/apps/client/src/widgets/containers/content-header.ts
similarity index 89%
rename from apps/client/src/widgets/content-header.ts
rename to apps/client/src/widgets/containers/content-header.ts
index 64d57ec42..54e789ce9 100644
--- a/apps/client/src/widgets/content-header.ts
+++ b/apps/client/src/widgets/containers/content-header.ts
@@ -1,7 +1,7 @@
-import { EventData } from "../components/app_context";
-import BasicWidget from "./basic_widget";
-import Container from "./containers/container";
-import NoteContext from "../components/note_context";
+import { EventData } from "../../components/app_context";
+import BasicWidget from "../basic_widget";
+import Container from "./container";
+import NoteContext from "../../components/note_context";
 
 export default class ContentHeader extends Container<BasicWidget> {