From a83f20e454feaff45d5be9209bed78459bd5259b Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Thu, 4 Dec 2025 14:46:23 +0200
Subject: [PATCH] refactor(react/launch_bar): extract dropdown & button style

---
 .../widgets/launch_bar/BookmarkButtons.tsx    | 17 +++--------
 .../widgets/launch_bar/launch_bar_widget.ts   |  3 --
 .../widgets/launch_bar/launch_bar_widgets.tsx | 28 +++++++++++++++++++
 3 files changed, 32 insertions(+), 16 deletions(-)
 delete mode 100644 apps/client/src/widgets/launch_bar/launch_bar_widget.ts
 create mode 100644 apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx

diff --git a/apps/client/src/widgets/launch_bar/BookmarkButtons.tsx b/apps/client/src/widgets/launch_bar/BookmarkButtons.tsx
index 493031877..ec9982b67 100644
--- a/apps/client/src/widgets/launch_bar/BookmarkButtons.tsx
+++ b/apps/client/src/widgets/launch_bar/BookmarkButtons.tsx
@@ -1,16 +1,13 @@
 import { useMemo } from "preact/hooks";
-import type { LaunchBarWidgetProps } from "./launch_bar_widget";
+import { LaunchBarActionButton, LaunchBarDropdownButton, type LaunchBarWidgetProps } from "./launch_bar_widgets";
 import { CSSProperties } from "preact";
 import type FNote from "../../entities/fnote";
 import { useChildNotes, useNoteLabel, useNoteLabelBoolean, useNoteProperty } from "../react/hooks";
-import ActionButton from "../react/ActionButton";
 import appContext from "../../components/app_context";
 import { escapeHtml, isCtrlKey } from "../../services/utils";
 import link_context_menu from "../../menus/link_context_menu";
 import "./BookmarkButtons.css";
-import Dropdown from "../react/Dropdown";
 import Icon from "../react/Icon";
-import NoteList from "../react/NoteList";
 import NoteLink from "../react/NoteLink";
 
 const PARENT_NOTE_ID = "_lbBookmarks";
@@ -57,12 +54,9 @@ function OpenNoteButtonWidget({ note }: { note: FNote }) {
     }
 
     return title && iconClass && (
-        <ActionButton
+        <LaunchBarActionButton
             icon={iconClass}
             text={escapeHtml(title)}
-            className="button-widget launcher-button"
-            noIconActionClass
-            titlePosition="right"
             onClick={launch}
             onAuxClick={launch}
             onContextMenu={evt => {
@@ -79,10 +73,7 @@ function BookmarkFolder({ note }: { note: FNote }) {
     const childNotes = useChildNotes(note.noteId);
 
     return title && iconClass && (
-        <Dropdown
-            className="right-dropdown-widget"
-            buttonClassName="right-dropdown-button launcher-button"
-            hideToggleArrow
+        <LaunchBarDropdownButton
             title={escapeHtml(title)}
             text={<Icon icon={iconClass} />}
         >
@@ -99,7 +90,7 @@ function BookmarkFolder({ note }: { note: FNote }) {
                     ))}
                 </ul>
             </div>
-        </Dropdown>
+        </LaunchBarDropdownButton>
     )
 }
 
diff --git a/apps/client/src/widgets/launch_bar/launch_bar_widget.ts b/apps/client/src/widgets/launch_bar/launch_bar_widget.ts
deleted file mode 100644
index 36284797d..000000000
--- a/apps/client/src/widgets/launch_bar/launch_bar_widget.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export interface LaunchBarWidgetProps {
-    isHorizontalLayout: boolean;
-}
diff --git a/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx b/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx
new file mode 100644
index 000000000..d00937baf
--- /dev/null
+++ b/apps/client/src/widgets/launch_bar/launch_bar_widgets.tsx
@@ -0,0 +1,28 @@
+import ActionButton, { ActionButtonProps } from "../react/ActionButton";
+import Dropdown, { DropdownProps } from "../react/Dropdown";
+
+export interface LaunchBarWidgetProps {
+    isHorizontalLayout: boolean;
+}
+
+export function LaunchBarActionButton(props: Omit<ActionButtonProps, "className" | "noIconActionClass" | "titlePosition">) {
+    return (
+        <ActionButton
+            className="button-widget launcher-button"
+            noIconActionClass
+            titlePosition="right"
+            {...props}
+        />
+    )
+}
+
+export function LaunchBarDropdownButton({ children, ...props }: Pick<DropdownProps, "title" | "text" | "children">) {
+    return (
+        <Dropdown
+            className="right-dropdown-widget"
+            buttonClassName="right-dropdown-button launcher-button"
+            hideToggleArrow
+            {...props}
+        >{children}</Dropdown>
+    )
+}