fix(dev-ui): remove terminal hint and collapse bottom panel by default

Remove the "Prefer your own terminal?" claude command hint from the
bottom panel and default the terminal panel to collapsed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: Askir

packages/core/dev-ui/src/App.tsx

@@ -22,7 +22,7 @@ export function App() {
   const connectionsApi = useConnections();
   const router = useHashRouter();
   const sidebar = useSidebarState();
-  const [bottomPanelOpen, setBottomPanelOpen] = useState(true);
+  const [bottomPanelOpen, setBottomPanelOpen] = useState(false);
   const [rightSidebarOpen, setRightSidebarOpen] = useState(true);
   const [rightTab, setRightTab] = useState<"test" | "runs">("test");
 

packages/core/dev-ui/src/components/BottomPanel.tsx

@@ -1,5 +1,4 @@
 import { useState, useCallback, useRef, useEffect, type ReactNode } from "react";
-import { SplitScreenHint } from "./SplitScreenHint";
 
 export interface TabDef {
   id: string;
@@ -19,9 +18,6 @@ const DEFAULT_HEIGHT = 400;
 export function BottomPanel({ tabs, defaultTab, onClose }: BottomPanelProps) {
   const [activeTab, setActiveTab] = useState(defaultTab ?? tabs[0]?.id ?? "");
   const [height, setHeight] = useState(DEFAULT_HEIGHT);
-  const [claudeCommand, setClaudeCommand] = useState<string | null>(null);
-  const [copied, setCopied] = useState(false);
-  const [showHint, setShowHint] = useState(false);
   const dragging = useRef(false);
   const startY = useRef(0);
   const startHeight = useRef(0);
@@ -54,29 +50,6 @@ export function BottomPanel({ tabs, defaultTab, onClose }: BottomPanelProps) {
     };
   }, []);
 
-  // Fetch claude command hint
-  useEffect(() => {
-    fetch("/dev/api/claude-command")
-      .then((res) => res.ok ? res.json() : null)
-      .then((data) => {
-        if (data?.isCloud) {
-          setClaudeCommand("crayon cloud claude --continue");
-        } else if (data?.projectRoot) {
-          setClaudeCommand(`cd ${data.projectRoot} && claude --continue`);
-        }
-      })
-      .catch(() => {});
-  }, []);
-
-  const copyCommand = useCallback(() => {
-    if (!claudeCommand) return;
-    navigator.clipboard.writeText(claudeCommand).then(() => {
-      setCopied(true);
-      setShowHint(true);
-      setTimeout(() => setCopied(false), 1500);
-    });
-  }, [claudeCommand]);
-
   const activeContent = tabs.find((t) => t.id === activeTab)?.content;
 
   return (
@@ -108,25 +81,6 @@ export function BottomPanel({ tabs, defaultTab, onClose }: BottomPanelProps) {
 
         <div className="flex-1" />
 
-        {claudeCommand && (
-          <button
-            onClick={copyCommand}
-            className="flex items-center gap-1.5 text-[10px] text-muted-foreground hover:text-foreground transition-colors cursor-pointer mr-2 max-w-[50%] group"
-            title="Copy to open in your terminal"
-          >
-            <span className="shrink-0">Prefer your own terminal?</span>
-            <span className="truncate font-mono">{claudeCommand}</span>
-            {copied ? (
-              <span className="text-[10px] text-emerald-600 shrink-0">Copied!</span>
-            ) : (
-              <svg className="w-3 h-3 shrink-0 opacity-0 group-hover:opacity-100 transition-opacity" viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth="1.5">
-                <rect x="5" y="5" width="9" height="9" rx="1.5" />
-                <path d="M5 11H3.5A1.5 1.5 0 012 9.5v-7A1.5 1.5 0 013.5 1h7A1.5 1.5 0 0112 2.5V5" />
-              </svg>
-            )}
-          </button>
-        )}
-
         <button
           onClick={onClose}
           className="text-muted-foreground hover:text-foreground text-sm px-1.5 py-0.5 cursor-pointer"
@@ -141,7 +95,6 @@ export function BottomPanel({ tabs, defaultTab, onClose }: BottomPanelProps) {
         {activeContent}
       </div>
 
-      {showHint && <SplitScreenHint onClose={() => setShowHint(false)} />}
     </div>
   );
 }