From ab1b4b37f4d0ba9bb7055a5cf0a86dbb693da227 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Wed, 10 Dec 2025 22:51:47 +0200
Subject: [PATCH] feat(global_menu): add an option to switch layouts

---
 .../src/services/experimental_features.ts     | 12 ++++++++++++
 .../src/widgets/buttons/global_menu.tsx       | 19 ++++++++++++++++++-
 2 files changed, 30 insertions(+), 1 deletion(-)

diff --git a/apps/client/src/services/experimental_features.ts b/apps/client/src/services/experimental_features.ts
index 76cca8461..9295aa8c7 100644
--- a/apps/client/src/services/experimental_features.ts
+++ b/apps/client/src/services/experimental_features.ts
@@ -27,6 +27,18 @@ export function getEnabledExperimentalFeatureIds() {
     return getEnabledFeatures().values();
 }
 
+export async function toggleExperimentalFeature(featureId: ExperimentalFeatureId, enable: boolean) {
+    let features = Array.from(getEnabledFeatures());
+    if (enable) {
+        if (!features.includes(featureId)) {
+            features.push(featureId);
+        }
+    } else {
+        features = features.filter(f => f !== featureId);
+    }
+    await options.save("experimentalFeatures", JSON.stringify(features));
+}
+
 function getEnabledFeatures() {
     if (!enabledFeatures) {
         let features: ExperimentalFeatureId[] = [];
diff --git a/apps/client/src/widgets/buttons/global_menu.tsx b/apps/client/src/widgets/buttons/global_menu.tsx
index 12cd870eb..cc73b4af0 100644
--- a/apps/client/src/widgets/buttons/global_menu.tsx
+++ b/apps/client/src/widgets/buttons/global_menu.tsx
@@ -10,7 +10,8 @@ import { KeyboardActionNames } from "@triliumnext/commons";
 import { ComponentChildren } from "preact";
 import Component from "../../components/component";
 import { ParentComponent } from "../react/react_utils";
-import utils, { dynamicRequire, isElectron, isMobile } from "../../services/utils";
+import utils, { dynamicRequire, isElectron, isMobile, reloadFrontendApp } from "../../services/utils";
+import { isExperimentalFeatureEnabled, toggleExperimentalFeature } from "../../services/experimental_features";
 
 interface MenuItemProps<T> {
     icon: string,
@@ -70,6 +71,7 @@ export default function GlobalMenu({ isHorizontalLayout }: { isHorizontalLayout:
             </>}
 
             {!isElectron() && <BrowserOnlyOptions />}
+            {glob.isDev && <DevelopmentOptions />}
         </Dropdown>
     )
 }
@@ -99,6 +101,21 @@ function BrowserOnlyOptions() {
     </>;
 }
 
+function DevelopmentOptions() {
+    const newLayoutEnabled = isExperimentalFeatureEnabled("new-layout");
+
+    return <>
+        <FormDropdownDivider />
+        <FormListItem
+            icon={newLayoutEnabled ? "bx bx-layout" : "bx bxs-layout"}
+            onClick={() => {
+                toggleExperimentalFeature("new-layout", !newLayoutEnabled);
+                reloadFrontendApp();
+            }}
+        >{!newLayoutEnabled ? "Switch to new layout" : "Switch to old layout"}</FormListItem>
+    </>;
+}
+
 function SwitchToOptions() {
     if (isElectron()) {
         return;