feat: show new session button in titlebar when sidebar is collapsed

packages/app/src/components/session/session-header.tsx

@@ -1,7 +1,7 @@
 import { createEffect, createMemo, onCleanup, Show } from "solid-js"
 import { createStore } from "solid-js/store"
 import { Portal } from "solid-js/web"
-import { useParams } from "@solidjs/router"
+import { useNavigate, useParams } from "@solidjs/router"
 import { useLayout } from "@/context/layout"
 import { useCommand } from "@/context/command"
 import { useLanguage } from "@/context/language"
@@ -34,6 +34,7 @@ export function SessionHeader() {
   const sync = useSync()
   const platform = usePlatform()
   const language = useLanguage()
+  const navigate = useNavigate()
 
   const projectDirectory = createMemo(() => decode64(params.dir) ?? "")
   const project = createMemo(() => {
@@ -288,11 +289,35 @@ export function SessionHeader() {
     platform.openLink(url)
   }
 
+  const leftMount = createMemo(() => document.getElementById("opencode-titlebar-left"))
   const centerMount = createMemo(() => document.getElementById("opencode-titlebar-center"))
   const rightMount = createMemo(() => document.getElementById("opencode-titlebar-right"))
 
   return (
     <>
+      <Show when={leftMount()}>
+        {(mount) => (
+          <Portal mount={mount()}>
+            <Show when={!layout.sidebar.opened()}>
+              <TooltipKeybind
+                class="hidden xl:flex shrink-0"
+                placement="bottom"
+                title={language.t("command.session.new")}
+                keybind={command.keybind("session.new")}
+              >
+                <Button
+                  variant="ghost"
+                  class="size-6 p-0"
+                  onClick={() => navigate(`/${params.dir}/session`)}
+                  aria-label={language.t("command.session.new")}
+                >
+                  <Icon size="small" name="plus-small" />
+                </Button>
+              </TooltipKeybind>
+            </Show>
+          </Portal>
+        )}
+      </Show>
       <Show when={centerMount()}>
         {(mount) => (
           <Portal mount={mount()}>