feat: compact snippet list option (#1339)

A "Show Commands" toggle in the snippets settings menu hides the command
text under each snippet name, for people who dock the panel on the
narrow right rail and only need the names. Local preference, on by
default.

src/ui/locales/en.json

@@ -4286,6 +4286,8 @@
         "expandAppRailOnHoverDesc": "Allow the left sidebar app rail to expand when the pointer moves over it",
         "settingsNavigation": "Navigation",
         "navigationTabsDesc": "Choose which tabs appear in the app rail",
+        "showSnippetCommands": "Show Commands",
+        "showSnippetCommandsDesc": "Show each snippet's command under its name. Turn off for a compact list.",
         "foldersCollapsed": "Folders Collapsed",
         "foldersCollapsedDesc": "Collapse folders by default",
         "confirmExecution": "Confirm Execution",

src/ui/sidebar/SnippetsPanel.tsx

@@ -862,6 +862,7 @@ function ShareSnippetDialog({
 
 function SnippetCard({
   snippet,
+  showCommands,
   selectedTabIds,
   terminalTabs,
   activeTabId,
@@ -879,6 +880,7 @@ function SnippetCard({
   t,
 }: {
   snippet: Snippet;
+  showCommands: boolean;
   selectedTabIds: Set<string>;
   terminalTabs: Tab[];
   activeTabId: string;
@@ -966,9 +968,11 @@ function SnippetCard({
             />
           )}
         </div>
-        <span className="text-xs text-muted-foreground font-mono px-1 min-w-0 break-all whitespace-pre-wrap">
-          {snippet.content}
-        </span>
+        {showCommands && (
+          <span className="text-xs text-muted-foreground font-mono px-1 min-w-0 break-all whitespace-pre-wrap">
+            {snippet.content}
+          </span>
+        )}
         {targetHosts.length > 0 && (
           <div className="flex flex-wrap gap-1 px-1">
             {targetHosts.map((host) => (
@@ -1246,6 +1250,7 @@ function ExecutionResultDialog({
 
 function VirtualFolderGroup({
   folderName,
+  showCommands,
   snippets: folderSnippets,
   selectedTabIds,
   terminalTabs,
@@ -1266,6 +1271,7 @@ function VirtualFolderGroup({
   open,
   onToggleOpen,
 }: {
+  showCommands: boolean;
   folderName: string;
   snippets: Snippet[];
   selectedTabIds: Set<string>;
@@ -1312,6 +1318,7 @@ function VirtualFolderGroup({
         >
           {folderSnippets.map((snippet) => (
             <SnippetCard
+              showCommands={showCommands}
               key={snippet.id}
               snippet={snippet}
               selectedTabIds={selectedTabIds}
@@ -1381,6 +1388,10 @@ export function SnippetsPanel({
   const [foldersCollapsedDefault, setFoldersCollapsedDefault] = useState(
     () => localStorage.getItem("defaultSnippetFoldersCollapsed") !== "false",
   );
+  // Compact list: names only, the command stays in the tooltip/editor.
+  const [showCommands, setShowCommands] = useState(
+    () => localStorage.getItem("snippetShowCommands") !== "false",
+  );
   const [confirmExecution, setConfirmExecution] = useState(
     () => localStorage.getItem("confirmSnippetExecution") === "true",
   );
@@ -1961,6 +1972,20 @@ export function SnippetsPanel({
                 </button>
               </DropdownMenuTrigger>
               <DropdownMenuContent align="end" className="text-xs w-64 p-2">
+                <SettingRow
+                  label={t("newUi.sidebar.userProfile.showSnippetCommands")}
+                  description={t(
+                    "newUi.sidebar.userProfile.showSnippetCommandsDesc",
+                  )}
+                >
+                  <FakeSwitch
+                    checked={showCommands}
+                    onChange={(v) => {
+                      setShowCommands(v);
+                      localStorage.setItem("snippetShowCommands", v.toString());
+                    }}
+                  />
+                </SettingRow>
                 <SettingRow
                   label={t("newUi.sidebar.userProfile.foldersCollapsed")}
                   description={t(
@@ -2154,6 +2179,7 @@ export function SnippetsPanel({
                 >
                   {uncategorizedSnippets.map((snippet) => (
                     <SnippetCard
+                      showCommands={showCommands}
                       key={snippet.id}
                       snippet={snippet}
                       selectedTabIds={selectedTabIds}
@@ -2251,6 +2277,7 @@ export function SnippetsPanel({
                   >
                     {folderSnippets.map((snippet) => (
                       <SnippetCard
+                        showCommands={showCommands}
                         key={snippet.id}
                         snippet={snippet}
                         selectedTabIds={selectedTabIds}
@@ -2291,6 +2318,7 @@ export function SnippetsPanel({
             if (folderSnippets.length === 0) return null;
             return (
               <VirtualFolderGroup
+                showCommands={showCommands}
                 key={`virtual-${folderName}`}
                 folderName={folderName}
                 snippets={folderSnippets}

src/ui/sidebar/UserProfilePanel.tsx

@@ -850,6 +850,7 @@ export function UserProfilePanel({
         "pinAppRail",
         "expandAppRailOnHover",
         "defaultSnippetFoldersCollapsed",
+        "snippetShowCommands",
         "confirmSnippetExecution",
         "disableUpdateCheck",
         "confirmTabClose",