fix: support command panel only in design mode (#4624)

We do not want users to mess with command panel in content or design mode.
webstudio-is · Dec 23, 2024 · e3baeec · e3baeec
1 parent fb67334
commit e3baeec
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 7 deletions.
diff --git a/apps/builder/app/builder/features/topbar/menu/menu.tsx b/apps/builder/app/builder/features/topbar/menu/menu.tsx
@@ -25,6 +25,7 @@ import {
   $authPermit,
   $authToken,
   $authTokenPermissions,
+  $isDesignMode,
   $userPlanFeatures,
 } from "~/shared/nano-states";
 import { emitCommand } from "~/builder/shared/commands";
@@ -60,6 +61,7 @@ export const Menu = () => {
   const authPermit = useStore($authPermit);
   const authTokenPermission = useStore($authTokenPermissions);
   const authToken = useStore($authToken);
+  const isDesignMode = useStore($isDesignMode);
 
   const isPublishEnabled = authPermit === "own" || authPermit === "admin";
 
@@ -240,12 +242,14 @@ export const Menu = () => {
 
           <DropdownMenuSeparator />
 
-          <DropdownMenuItem onSelect={() => emitCommand("openCommandPanel")}>
-            Search & Commands
-            <DropdownMenuItemRightSlot>
-              <Kbd value={["cmd", "k"]} />
-            </DropdownMenuItemRightSlot>
-          </DropdownMenuItem>
+          {isDesignMode && (
+            <DropdownMenuItem onSelect={() => emitCommand("openCommandPanel")}>
+              Search & Commands
+              <DropdownMenuItemRightSlot>
+                <Kbd value={["cmd", "k"]} />
+              </DropdownMenuItemRightSlot>
+            </DropdownMenuItem>
+          )}
 
           <DropdownMenuItem
             onSelect={() => {

diff --git a/apps/builder/app/builder/shared/commands.ts b/apps/builder/app/builder/shared/commands.ts
@@ -501,7 +501,9 @@ export const { emitCommand, subscribeCommands } = createCommandsEmitter({
       hidden: true,
       defaultHotkeys: ["meta+k", "ctrl+k"],
       handler: () => {
-        openCommandPanel();
+        if ($isDesignMode.get()) {
+          openCommandPanel();
+        }
       },
     },
   ],