fix(app): update status modal header and tab typography

fix(app): refine status modal layout and spacing
fix(ui): use 1px active indicator for alt tabs
2026-03-13 18:24:25 +00:00 · 2026-03-13 13:01:39 +00:00 · 2026-03-13 12:51:23 +00:00 · 2026-03-13 12:37:57 +00:00 · 2026-03-13 12:30:58 +00:00 · 2026-03-13 12:30:48 +00:00
37 changed files with 1203 additions and 778 deletions
--- a/packages/app/src/components/prompt-input.tsx
+++ b/packages/app/src/components/prompt-input.tsx
@@ -26,7 +26,6 @@ import { ProviderIcon } from "@opencode-ai/ui/provider-icon"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Select } from "@opencode-ai/ui/select"
-import { RadioGroup } from "@opencode-ai/ui/radio-group"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { ModelSelectorPopover } from "@/components/dialog-select-model"
 import { DialogSelectModelUnpaid } from "@/components/dialog-select-model-unpaid"
@@ -1488,36 +1487,6 @@ export const PromptInput: Component<PromptInputProps> = (props) => {
                </TooltipKeybind>
              </div>
            </div>
-            <div class="shrink-0">
-              <RadioGroup
-                options={["shell", "normal"] as const}
-                current={store.mode}
-                value={(mode) => mode}
-                label={(mode) => (
-                  <TooltipKeybind
-                    placement="top"
-                    gutter={4}
-                    openDelay={2000}
-                    title={language.t(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
-                    keybind={command.keybind(mode === "shell" ? "prompt.mode.shell" : "prompt.mode.normal")}
-                    class="size-full flex items-center justify-center"
-                  >
-                    <Icon
-                      name={mode === "shell" ? "console" : "prompt"}
-                      class="size-[18px]"
-                      classList={{
-                        "text-icon-strong-base": store.mode === mode,
-                        "text-icon-weak": store.mode !== mode,
-                      }}
-                    />
-                  </TooltipKeybind>
-                )}
-                onSelect={(mode) => mode && setMode(mode)}
-                fill
-                pad="none"
-                class="w-[68px]"
-              />
-            </div>
          </div>
        </DockTray>
      </Show>
--- a/packages/app/src/components/server/server-row.tsx
+++ b/packages/app/src/components/server/server-row.tsx
@@ -65,22 +65,26 @@ export function ServerRow(props: ServerRowProps) {

  return (
    <Tooltip
-      class="flex-1"
+      class="flex-1 min-w-0"
      value={tooltipValue()}
+      contentStyle={{ "max-width": "none", "white-space": "nowrap" }}
      placement="top-start"
      inactive={!truncated() && !props.conn.displayName}
    >
      <div class={props.class} classList={{ "opacity-50": props.dimmed }}>
-        <div class="flex flex-col items-start">
-          <div class="flex flex-row items-center gap-2">
-            <span ref={nameRef} class={props.nameClass ?? "truncate"}>
+        <div class="flex flex-col items-start min-w-0 w-full">
+          <div class="flex flex-row items-center gap-2 min-w-0 w-full">
+            <span ref={nameRef} class={`${props.nameClass ?? "truncate"} min-w-0`}>
              {name()}
            </span>
            <Show
              when={badge()}
              fallback={
                <Show when={props.status?.version}>
-                  <span ref={versionRef} class={props.versionClass ?? "text-text-weak text-14-regular truncate"}>
+                  <span
+                    ref={versionRef}
+                    class={`${props.versionClass ?? "text-text-weak text-14-regular truncate"} min-w-0`}
+                  >
                    v{props.status?.version}
                  </span>
                </Show>
--- a/packages/app/src/components/session/session-header.tsx
+++ b/packages/app/src/components/session/session-header.tsx
@@ -4,9 +4,7 @@ import { DropdownMenu } from "@opencode-ai/ui/dropdown-menu"
 import { Icon } from "@opencode-ai/ui/icon"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Keybind } from "@opencode-ai/ui/keybind"
-import { Popover } from "@opencode-ai/ui/popover"
 import { Spinner } from "@opencode-ai/ui/spinner"
-import { TextField } from "@opencode-ai/ui/text-field"
 import { showToast } from "@opencode-ai/ui/toast"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { getFilename } from "@opencode-ai/util/path"
@@ -14,18 +12,15 @@ import { createEffect, createMemo, For, onCleanup, Show } from "solid-js"
 import { createStore } from "solid-js/store"
 import { Portal } from "solid-js/web"
 import { useCommand } from "@/context/command"
-import { useGlobalSDK } from "@/context/global-sdk"
 import { useLanguage } from "@/context/language"
 import { useLayout } from "@/context/layout"
 import { usePlatform } from "@/context/platform"
 import { useServer } from "@/context/server"
-import { useSync } from "@/context/sync"
 import { useTerminal } from "@/context/terminal"
 import { focusTerminalById } from "@/pages/session/helpers"
 import { useSessionLayout } from "@/pages/session/session-layout"
 import { decode64 } from "@/utils/base64"
 import { Persist, persisted } from "@/utils/persist"
-import { StatusPopover } from "../status-popover"

 const OPEN_APPS = [
  "vscode",
@@ -112,12 +107,6 @@ const LINUX_APPS = [
  },
 ] as const

-type OpenOption = (typeof MAC_APPS)[number] | (typeof WINDOWS_APPS)[number] | (typeof LINUX_APPS)[number]
-type OpenIcon = OpenApp | "file-explorer"
-const OPEN_ICON_BASE = new Set<OpenIcon>(["finder", "vscode", "cursor", "zed"])
-
-const openIconSize = (id: OpenIcon) => (OPEN_ICON_BASE.has(id) ? "size-4" : "size-[19px]")
-
 const detectOS = (platform: ReturnType<typeof usePlatform>): OS => {
  if (platform.platform === "desktop" && platform.os) return platform.os
  if (typeof navigator !== "object") return "unknown"
@@ -136,98 +125,10 @@ const showRequestError = (language: ReturnType<typeof useLanguage>, err: unknown
  })
 }

-function useSessionShare(args: {
-  globalSDK: ReturnType<typeof useGlobalSDK>
-  currentSession: () =>
-    | {
-        share?: {
-          url?: string
-        }
-      }
-    | undefined
-  sessionID: () => string | undefined
-  projectDirectory: () => string
-  platform: ReturnType<typeof usePlatform>
-}) {
-  const [state, setState] = createStore({
-    share: false,
-    unshare: false,
-    copied: false,
-    timer: undefined as number | undefined,
-  })
-  const shareUrl = createMemo(() => args.currentSession()?.share?.url)
-
-  createEffect(() => {
-    const url = shareUrl()
-    if (url) return
-    if (state.timer) window.clearTimeout(state.timer)
-    setState({ copied: false, timer: undefined })
-  })
-
-  onCleanup(() => {
-    if (state.timer) window.clearTimeout(state.timer)
-  })
-
-  const shareSession = () => {
-    const sessionID = args.sessionID()
-    if (!sessionID || state.share) return
-    setState("share", true)
-    args.globalSDK.client.session
-      .share({ sessionID, directory: args.projectDirectory() })
-      .catch((error) => {
-        console.error("Failed to share session", error)
-      })
-      .finally(() => {
-        setState("share", false)
-      })
-  }
-
-  const unshareSession = () => {
-    const sessionID = args.sessionID()
-    if (!sessionID || state.unshare) return
-    setState("unshare", true)
-    args.globalSDK.client.session
-      .unshare({ sessionID, directory: args.projectDirectory() })
-      .catch((error) => {
-        console.error("Failed to unshare session", error)
-      })
-      .finally(() => {
-        setState("unshare", false)
-      })
-  }
-
-  const copyLink = (onError: (error: unknown) => void) => {
-    const url = shareUrl()
-    if (!url) return
-    navigator.clipboard
-      .writeText(url)
-      .then(() => {
-        if (state.timer) window.clearTimeout(state.timer)
-        setState("copied", true)
-        const timer = window.setTimeout(() => {
-          setState("copied", false)
-          setState("timer", undefined)
-        }, 3000)
-        setState("timer", timer)
-      })
-      .catch(onError)
-  }
-
-  const viewShare = () => {
-    const url = shareUrl()
-    if (!url) return
-    args.platform.openLink(url)
-  }
-
-  return { state, shareUrl, shareSession, unshareSession, copyLink, viewShare }
-}
-
 export function SessionHeader() {
-  const globalSDK = useGlobalSDK()
  const layout = useLayout()
  const command = useCommand()
  const server = useServer()
-  const sync = useSync()
  const platform = usePlatform()
  const language = useLanguage()
  const terminal = useTerminal()
@@ -245,10 +146,6 @@ export function SessionHeader() {
    return getFilename(projectDirectory())
  })
  const hotkey = createMemo(() => command.keybind("file.open"))
-
-  const currentSession = createMemo(() => (params.id ? sync.session.get(params.id) : undefined))
-  const shareEnabled = createMemo(() => sync.data.config.share !== "disabled")
-  const showShare = createMemo(() => shareEnabled() && !!params.id)
  const os = createMemo(() => detectOS(platform))

  const [exists, setExists] = createStore<Partial<Record<OpenApp, boolean>>>({
@@ -356,14 +253,6 @@ export function SessionHeader() {
      .catch((err: unknown) => showRequestError(language, err))
  }

-  const share = useSessionShare({
-    globalSDK,
-    currentSession,
-    sessionID: () => params.id,
-    projectDirectory,
-    platform,
-  })
-
  const centerMount = createMemo(() => document.getElementById("opencode-titlebar-center"))
  const rightMount = createMemo(() => document.getElementById("opencode-titlebar-right"))

@@ -391,7 +280,9 @@ export function SessionHeader() {

              <Show when={hotkey()}>
                {(keybind) => (
-                  <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0">{keybind()}</Keybind>
+                  <Keybind class="shrink-0 !border-0 !bg-transparent !shadow-none px-0 text-text-weaker">
+                    {keybind()}
+                  </Keybind>
                )}
              </Show>
            </Button>
@@ -402,7 +293,6 @@ export function SessionHeader() {
        {(mount) => (
          <Portal mount={mount()}>
            <div class="flex items-center gap-2">
-              <StatusPopover />
              <Show when={projectDirectory()}>
                <div class="hidden xl:flex items-center">
                  <Show
@@ -427,7 +317,7 @@ export function SessionHeader() {
                      <div class="flex h-[24px] box-border items-center rounded-md border border-border-weak-base bg-surface-panel overflow-hidden">
                        <Button
                          variant="ghost"
-                          class="rounded-none h-full py-0 pr-3 pl-0.5 gap-1.5 border-none shadow-none disabled:!cursor-default"
+                          class="rounded-none h-full py-0 pr-1.5 pl-px gap-1.5 border-none shadow-none disabled:!cursor-default"
                          classList={{
                            "bg-surface-raised-base-active": opening(),
                          }}
@@ -435,17 +325,13 @@ export function SessionHeader() {
                          disabled={opening()}
                          aria-label={language.t("session.header.open.ariaLabel", { app: current().label })}
                        >
-                          <div class="flex size-5 shrink-0 items-center justify-center">
-                            <Show
-                              when={opening()}
-                              fallback={<AppIcon id={current().icon} class={openIconSize(current().icon)} />}
-                            >
+                          <div class="flex size-5 shrink-0 items-center justify-center [&_[data-component=app-icon]]:size-5">
+                            <Show when={opening()} fallback={<AppIcon id={current().icon} />}>
                              <Spinner class="size-3.5 text-icon-base" />
                            </Show>
                          </div>
                          <span class="text-12-regular text-text-strong">{language.t("common.open")}</span>
                        </Button>
-                        <div class="self-stretch w-px bg-border-weak-base" />
                        <DropdownMenu
                          gutter={4}
                          placement="bottom-end"
@@ -457,17 +343,20 @@ export function SessionHeader() {
                            icon="chevron-down"
                            variant="ghost"
                            disabled={opening()}
-                            class="rounded-none h-full w-[24px] p-0 border-none shadow-none data-[expanded]:bg-surface-raised-base-active disabled:!cursor-default"
+                            class="rounded-none h-full w-[20px] p-0 border-none shadow-none data-[expanded]:bg-surface-raised-base-active disabled:!cursor-default"
                            classList={{
                              "bg-surface-raised-base-active": opening(),
                            }}
                            aria-label={language.t("session.header.open.menu")}
                          />
                          <DropdownMenu.Portal>
-                            <DropdownMenu.Content>
+                            <DropdownMenu.Content class="[&_[data-slot=dropdown-menu-item]]:pl-1 [&_[data-slot=dropdown-menu-radio-item]]:pl-1 [&_[data-slot=dropdown-menu-radio-item]+[data-slot=dropdown-menu-radio-item]]:mt-1">
                              <DropdownMenu.Group>
-                                <DropdownMenu.GroupLabel>{language.t("session.header.openIn")}</DropdownMenu.GroupLabel>
+                                <DropdownMenu.GroupLabel class="!px-1 !py-1">
+                                  {language.t("session.header.openIn")}
+                                </DropdownMenu.GroupLabel>
                                <DropdownMenu.RadioGroup
+                                  class="mt-1"
                                  value={current().id}
                                  onChange={(value) => {
                                    if (!OPEN_APPS.includes(value as OpenApp)) return
@@ -484,8 +373,8 @@ export function SessionHeader() {
                                          openDir(o.id)
                                        }}
                                      >
-                                        <div class="flex size-5 shrink-0 items-center justify-center">
-                                          <AppIcon id={o.icon} class={openIconSize(o.icon)} />
+                                        <div class="flex size-5 shrink-0 items-center justify-center [&_[data-component=app-icon]]:size-5">
+                                          <AppIcon id={o.icon} />
                                        </div>
                                        <DropdownMenu.ItemLabel>{o.label}</DropdownMenu.ItemLabel>
                                        <DropdownMenu.ItemIndicator>
@@ -518,112 +407,6 @@ export function SessionHeader() {
                  </Show>
                </div>
              </Show>
-              <Show when={showShare()}>
-                <div class="flex items-center">
-                  <Popover
-                    title={language.t("session.share.popover.title")}
-                    description={
-                      share.shareUrl()
-                        ? language.t("session.share.popover.description.shared")
-                        : language.t("session.share.popover.description.unshared")
-                    }
-                    gutter={4}
-                    placement="bottom-end"
-                    shift={-64}
-                    class="rounded-xl [&_[data-slot=popover-close-button]]:hidden"
-                    triggerAs={Button}
-                    triggerProps={{
-                      variant: "ghost",
-                      class:
-                        "rounded-md h-[24px] px-3 border border-border-weak-base bg-surface-panel shadow-none data-[expanded]:bg-surface-base-active",
-                      classList: {
-                        "rounded-r-none": share.shareUrl() !== undefined,
-                        "border-r-0": share.shareUrl() !== undefined,
-                      },
-                      style: { scale: 1 },
-                    }}
-                    trigger={<span class="text-12-regular">{language.t("session.share.action.share")}</span>}
-                  >
-                    <div class="flex flex-col gap-2">
-                      <Show
-                        when={share.shareUrl()}
-                        fallback={
-                          <div class="flex">
-                            <Button
-                              size="large"
-                              variant="primary"
-                              class="w-1/2"
-                              onClick={share.shareSession}
-                              disabled={share.state.share}
-                            >
-                              {share.state.share
-                                ? language.t("session.share.action.publishing")
-                                : language.t("session.share.action.publish")}
-                            </Button>
-                          </div>
-                        }
-                      >
-                        <div class="flex flex-col gap-2">
-                          <TextField
-                            value={share.shareUrl() ?? ""}
-                            readOnly
-                            copyable
-                            copyKind="link"
-                            tabIndex={-1}
-                            class="w-full"
-                          />
-                          <div class="grid grid-cols-2 gap-2">
-                            <Button
-                              size="large"
-                              variant="secondary"
-                              class="w-full shadow-none border border-border-weak-base"
-                              onClick={share.unshareSession}
-                              disabled={share.state.unshare}
-                            >
-                              {share.state.unshare
-                                ? language.t("session.share.action.unpublishing")
-                                : language.t("session.share.action.unpublish")}
-                            </Button>
-                            <Button
-                              size="large"
-                              variant="primary"
-                              class="w-full"
-                              onClick={share.viewShare}
-                              disabled={share.state.unshare}
-                            >
-                              {language.t("session.share.action.view")}
-                            </Button>
-                          </div>
-                        </div>
-                      </Show>
-                    </div>
-                  </Popover>
-                  <Show when={share.shareUrl()} fallback={<div aria-hidden="true" />}>
-                    <Tooltip
-                      value={
-                        share.state.copied
-                          ? language.t("session.share.copy.copied")
-                          : language.t("session.share.copy.copyLink")
-                      }
-                      placement="top"
-                      gutter={8}
-                    >
-                      <IconButton
-                        icon={share.state.copied ? "check" : "link"}
-                        variant="ghost"
-                        class="rounded-l-none h-[24px] border border-border-weak-base bg-surface-panel shadow-none"
-                        onClick={() => share.copyLink((error) => showRequestError(language, error))}
-                        disabled={share.state.unshare}
-                        aria-label={
-                          share.state.copied
-                            ? language.t("session.share.copy.copied")
-                            : language.t("session.share.copy.copyLink")
-                        }
-                      />
-                    </Tooltip>
-                  </Show>
-                </div>
-              </Show>
              <div class="flex items-center gap-1">
                <TooltipKeybind
                  title={language.t("command.terminal.toggle")}
@@ -637,23 +420,7 @@ export function SessionHeader() {
                    aria-expanded={view().terminal.opened()}
                    aria-controls="terminal-panel"
                  >
-                    <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">
-                      <Icon
-                        size="small"
-                        name={view().terminal.opened() ? "layout-bottom-partial" : "layout-bottom"}
-                        class="group-hover/terminal-toggle:hidden"
-                      />
-                      <Icon
-                        size="small"
-                        name="layout-bottom-partial"
-                        class="hidden group-hover/terminal-toggle:inline-block"
-                      />
-                      <Icon
-                        size="small"
-                        name={view().terminal.opened() ? "layout-bottom" : "layout-bottom-partial"}
-                        class="hidden group-active/terminal-toggle:inline-block"
-                      />
-                    </div>
+                    <Icon size="small" name={view().terminal.opened() ? "terminal-active" : "terminal"} />
                  </Button>
                </TooltipKeybind>

@@ -670,23 +437,7 @@ export function SessionHeader() {
                      aria-expanded={view().reviewPanel.opened()}
                      aria-controls="review-panel"
                    >
-                      <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">
-                        <Icon
-                          size="small"
-                          name={view().reviewPanel.opened() ? "layout-right-partial" : "layout-right"}
-                          class="group-hover/review-toggle:hidden"
-                        />
-                        <Icon
-                          size="small"
-                          name="layout-right-partial"
-                          class="hidden group-hover/review-toggle:inline-block"
-                        />
-                        <Icon
-                          size="small"
-                          name={view().reviewPanel.opened() ? "layout-right" : "layout-right-partial"}
-                          class="hidden group-active/review-toggle:inline-block"
-                        />
-                      </div>
+                      <Icon size="small" name={view().reviewPanel.opened() ? "review-active" : "review"} />
                    </Button>
                  </TooltipKeybind>

--- a/packages/app/src/components/status-popover.tsx
+++ b/packages/app/src/components/status-popover.tsx
@@ -1,7 +1,7 @@
 import { Button } from "@opencode-ai/ui/button"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
+import { Dialog } from "@opencode-ai/ui/dialog"
 import { Icon } from "@opencode-ai/ui/icon"
-import { Popover } from "@opencode-ai/ui/popover"
 import { Switch } from "@opencode-ai/ui/switch"
 import { Tabs } from "@opencode-ai/ui/tabs"
 import { showToast } from "@opencode-ai/ui/toast"
@@ -11,9 +11,9 @@ import { createStore, reconcile } from "solid-js/store"
 import { ServerHealthIndicator, ServerRow } from "@/components/server/server-row"
 import { useLanguage } from "@/context/language"
 import { usePlatform } from "@/context/platform"
-import { useSDK } from "@/context/sdk"
+import { useGlobalSDK } from "@/context/global-sdk"
+import { useGlobalSync } from "@/context/global-sync"
 import { normalizeServerUrl, ServerConnection, useServer } from "@/context/server"
-import { useSync } from "@/context/sync"
 import { useCheckServerHealth, type ServerHealth } from "@/utils/server-health"
 import { DialogSelectServer } from "./dialog-select-server"

@@ -129,8 +129,10 @@ const useDefaultServerKey = (
 }

 const useMcpToggle = (input: {
-  sync: ReturnType<typeof useSync>
-  sdk: ReturnType<typeof useSDK>
+  get: () =>
+    | { store: ReturnType<ReturnType<typeof useGlobalSync>["child"]>[0]; set: (...args: unknown[]) => void }
+    | undefined
+  client: () => ReturnType<ReturnType<typeof useGlobalSDK>["createClient"]> | undefined
  language: ReturnType<typeof useLanguage>
 }) => {
  const [loading, setLoading] = createSignal<string | null>(null)
@@ -139,13 +141,18 @@ const useMcpToggle = (input: {
    if (loading()) return
    setLoading(name)

+    const child = input.get()
+    const cli = input.client()
+    if (!child || !cli) {
+      setLoading(null)
+      return
+    }
+
    try {
-      const status = input.sync.data.mcp[name]
-      await (status?.status === "connected"
-        ? input.sdk.client.mcp.disconnect({ name })
-        : input.sdk.client.mcp.connect({ name }))
-      const result = await input.sdk.client.mcp.status()
-      if (result.data) input.sync.set("mcp", result.data)
+      const status = child.store.mcp[name]
+      await (status?.status === "connected" ? cli.mcp.disconnect({ name }) : cli.mcp.connect({ name }))
+      const result = await cli.mcp.status()
+      if (result.data) child.set("mcp", result.data)
    } catch (err) {
      showToast({
        variant: "error",
@@ -160,15 +167,235 @@ const useMcpToggle = (input: {
  return { loading, toggle }
 }

-export function StatusPopover() {
-  const sync = useSync()
-  const sdk = useSDK()
+export function StatusModal(props: { directory: string }) {
+  const globalSDK = useGlobalSDK()
+  const globalSync = useGlobalSync()
  const server = useServer()
  const platform = usePlatform()
  const dialog = useDialog()
  const language = useLanguage()
  const navigate = useNavigate()

+  const child = createMemo(() => {
+    if (!props.directory) return
+    const [store, set] = globalSync.child(props.directory)
+    return { store, set }
+  })
+
+  const client = createMemo(() => {
+    if (!props.directory) return
+    return globalSDK.createClient({ directory: props.directory, throwOnError: true })
+  })
+
+  const open = () =>
+    dialog.show(() => (
+      <Dialog
+        title={<span class="text-12-medium text-text-weak">{language.t("status.popover.trigger")}</span>}
+        position="top"
+        style={{ "--dialog-top": "33vh" } as any}
+        fit
+        class="!max-h-[33vh] [&_[data-slot=dialog-header]]:bg-background-base [&_[data-slot=dialog-header]]:pb-2"
+        transition
+      >
+        <Tabs
+          aria-label={language.t("status.popover.ariaLabel")}
+          class="tabs !bg-surface-raised-stronger-non-alpha rounded-xl overflow-hidden"
+          data-component="tabs"
+          data-active="servers"
+          defaultValue="servers"
+          variant="alt"
+        >
+          <Tabs.List
+            data-slot="tablist"
+            class="bg-background-base border-b border-border-weak-base px-5 pt-0 pb-0 gap-7 h-10"
+          >
+            <Tabs.Trigger value="servers" data-slot="tab" class="text-14-medium" classes={{ button: "!px-0" }}>
+              {sortedServers().length > 0 ? `${sortedServers().length} ` : ""}
+              {language.t("status.popover.tab.servers")}
+            </Tabs.Trigger>
+            <Tabs.Trigger value="mcp" data-slot="tab" class="text-14-medium" classes={{ button: "!px-0" }}>
+              {mcpConnected() > 0 ? `${mcpConnected()} ` : ""}
+              {language.t("status.popover.tab.mcp")}
+            </Tabs.Trigger>
+            <Tabs.Trigger value="lsp" data-slot="tab" class="text-14-medium" classes={{ button: "!px-0" }}>
+              {lspCount() > 0 ? `${lspCount()} ` : ""}
+              {language.t("status.popover.tab.lsp")}
+            </Tabs.Trigger>
+            <Tabs.Trigger value="plugins" data-slot="tab" class="text-14-medium" classes={{ button: "!px-0" }}>
+              {pluginCount() > 0 ? `${pluginCount()} ` : ""}
+              {language.t("status.popover.tab.plugins")}
+            </Tabs.Trigger>
+          </Tabs.List>
+
+          <Tabs.Content value="servers">
+            <div class="flex flex-col p-2">
+              <div class="flex flex-col p-3 rounded-sm min-h-[160px]">
+                <div class="flex flex-col gap-0.5">
+                  <For each={sortedServers()}>
+                    {(s) => {
+                      const key = ServerConnection.key(s)
+                      const isBlocked = () => health[key]?.healthy === false
+                      return (
+                        <button
+                          type="button"
+                          class="flex items-center gap-2 w-full h-8 pl-3 pr-1.5 py-1.5 rounded-md transition-colors text-left"
+                          classList={{
+                            "hover:bg-surface-raised-base-hover": !isBlocked(),
+                            "cursor-not-allowed": isBlocked(),
+                          }}
+                          aria-disabled={isBlocked()}
+                          onClick={() => {
+                            if (isBlocked()) return
+                            server.setActive(key)
+                            navigate("/")
+                            dialog.close()
+                          }}
+                        >
+                          <ServerHealthIndicator health={health[key]} />
+                          <ServerRow
+                            conn={s}
+                            dimmed={isBlocked()}
+                            status={health[key]}
+                            class="flex items-center gap-2 w-full min-w-0"
+                            nameClass="text-14-regular text-text-base truncate"
+                            versionClass="text-12-regular text-text-weak truncate"
+                            badge={
+                              <Show when={key === defaultServer.key()}>
+                                <span class="text-11-regular text-text-base bg-surface-base px-1.5 py-0.5 rounded-md">
+                                  {language.t("common.default")}
+                                </span>
+                              </Show>
+                            }
+                          >
+                            <div class="flex-1" />
+                            <Show when={server.current && key === ServerConnection.key(server.current)}>
+                              <Icon name="check" size="small" class="text-icon-weak shrink-0" />
+                            </Show>
+                          </ServerRow>
+                        </button>
+                      )
+                    }}
+                  </For>
+                </div>
+
+                <Button
+                  variant="secondary"
+                  class="mt-5 self-start h-8 px-3 py-1.5"
+                  onClick={() => dialog.show(() => <DialogSelectServer />, defaultServer.refresh)}
+                >
+                  {language.t("status.popover.action.manageServers")}
+                </Button>
+              </div>
+            </div>
+          </Tabs.Content>
+
+          <Tabs.Content value="mcp">
+            <div class="flex flex-col p-2">
+              <div class="flex flex-col p-3 rounded-sm min-h-[160px]">
+                <Show
+                  when={mcpNames().length > 0}
+                  fallback={
+                    <div class="text-14-regular text-text-base text-center my-auto">
+                      {language.t("dialog.mcp.empty")}
+                    </div>
+                  }
+                >
+                  <div class="flex flex-col gap-0.5">
+                    <For each={mcpNames()}>
+                      {(name) => {
+                        const status = () => mcpStatus(name)
+                        const enabled = () => status() === "connected"
+                        return (
+                          <button
+                            type="button"
+                            class="flex items-center gap-2 w-full h-8 pl-3 pr-2 py-1 rounded-md hover:bg-surface-raised-base-hover transition-colors text-left"
+                            onClick={() => mcp.toggle(name)}
+                            disabled={mcp.loading() === name}
+                          >
+                            <div
+                              classList={{
+                                "size-1.5 rounded-full shrink-0": true,
+                                "bg-icon-success-base": status() === "connected",
+                                "bg-icon-critical-base": status() === "failed",
+                                "bg-border-weak-base": status() === "disabled",
+                                "bg-icon-warning-base":
+                                  status() === "needs_auth" || status() === "needs_client_registration",
+                              }}
+                            />
+                            <span class="text-14-regular text-text-base truncate flex-1">{name}</span>
+                            <div onClick={(event) => event.stopPropagation()}>
+                              <Switch
+                                checked={enabled()}
+                                disabled={mcp.loading() === name}
+                                onChange={() => mcp.toggle(name)}
+                              />
+                            </div>
+                          </button>
+                        )
+                      }}
+                    </For>
+                  </div>
+                </Show>
+              </div>
+            </div>
+          </Tabs.Content>
+
+          <Tabs.Content value="lsp">
+            <div class="flex flex-col p-2">
+              <div class="flex flex-col p-3 rounded-sm min-h-[160px]">
+                <Show
+                  when={lspItems().length > 0}
+                  fallback={
+                    <div class="text-14-regular text-text-base text-center my-auto">
+                      {language.t("dialog.lsp.empty")}
+                    </div>
+                  }
+                >
+                  <div class="flex flex-col gap-0.5">
+                    <For each={lspItems()}>
+                      {(item) => (
+                        <div class="flex items-center gap-2 w-full px-2 py-1">
+                          <div
+                            classList={{
+                              "size-1.5 rounded-full shrink-0": true,
+                              "bg-icon-success-base": item.status === "connected",
+                              "bg-icon-critical-base": item.status === "error",
+                            }}
+                          />
+                          <span class="text-14-regular text-text-base truncate">{item.name || item.id}</span>
+                        </div>
+                      )}
+                    </For>
+                  </div>
+                </Show>
+              </div>
+            </div>
+          </Tabs.Content>
+
+          <Tabs.Content value="plugins">
+            <div class="flex flex-col p-2">
+              <div class="flex flex-col p-3 rounded-sm min-h-[160px]">
+                <Show
+                  when={plugins().length > 0}
+                  fallback={<div class="text-14-regular text-text-base text-center my-auto">{pluginEmpty()}</div>}
+                >
+                  <div class="flex flex-col gap-0.5">
+                    <For each={plugins()}>
+                      {(plugin) => (
+                        <div class="flex items-center gap-2 w-full px-2 py-1">
+                          <div class="size-1.5 rounded-full shrink-0 bg-icon-success-base" />
+                          <span class="text-14-regular text-text-base truncate">{plugin}</span>
+                        </div>
+                      )}
+                    </For>
+                  </div>
+                </Show>
+              </div>
+            </div>
+          </Tabs.Content>
+        </Tabs>
+      </Dialog>
+    ))
  const servers = createMemo(() => {
    const current = server.current
    const list = server.list
@@ -178,14 +405,18 @@ export function StatusPopover() {
  })
  const health = useServerHealth(servers)
  const sortedServers = createMemo(() => listServersByHealth(servers(), server.key, health))
-  const mcp = useMcpToggle({ sync, sdk, language })
+  const mcp = useMcpToggle({
+    language,
+    get: () => child(),
+    client: () => client(),
+  })
  const defaultServer = useDefaultServerKey(platform.getDefaultServer)
-  const mcpNames = createMemo(() => Object.keys(sync.data.mcp ?? {}).sort((a, b) => a.localeCompare(b)))
-  const mcpStatus = (name: string) => sync.data.mcp?.[name]?.status
+  const mcpNames = createMemo(() => Object.keys(child()?.store.mcp ?? {}).sort((a, b) => a.localeCompare(b)))
+  const mcpStatus = (name: string) => child()?.store.mcp?.[name]?.status
  const mcpConnected = createMemo(() => mcpNames().filter((name) => mcpStatus(name) === "connected").length)
-  const lspItems = createMemo(() => sync.data.lsp ?? [])
+  const lspItems = createMemo(() => child()?.store.lsp ?? [])
  const lspCount = createMemo(() => lspItems().length)
-  const plugins = createMemo(() => sync.data.config.plugin ?? [])
+  const plugins = createMemo(() => child()?.store.config.plugin ?? [])
  const pluginCount = createMemo(() => plugins().length)
  const pluginEmpty = createMemo(() => pluginEmptyMessage(language.t("dialog.plugins.empty"), "opencode.json"))
  const overallHealthy = createMemo(() => {
@@ -198,218 +429,34 @@ export function StatusPopover() {
  })

  return (
-    <Popover
-      triggerAs={Button}
-      triggerProps={{
-        variant: "ghost",
-        class: "titlebar-icon w-6 h-6 p-0 box-border",
-        "aria-label": language.t("status.popover.trigger"),
-        style: { scale: 1 },
-      }}
-      trigger={
-        <div class="flex size-4 items-center justify-center">
-          <div
-            classList={{
-              "size-1.5 rounded-full": true,
-              "bg-icon-success-base": overallHealthy(),
-              "bg-icon-critical-base": !overallHealthy() && server.healthy() !== undefined,
-              "bg-border-weak-base": server.healthy() === undefined,
-            }}
-          />
-        </div>
-      }
-      class="[&_[data-slot=popover-body]]:p-0 w-[360px] max-w-[calc(100vw-40px)] bg-transparent border-0 shadow-none rounded-xl"
-      gutter={4}
-      placement="bottom-end"
-      shift={-168}
+    <button
+      type="button"
+      data-component="icon-button"
+      data-icon="status"
+      data-variant="ghost"
+      data-size="large"
+      aria-label={language.t("status.popover.trigger")}
+      onClick={open}
    >
-      <div class="flex items-center gap-1 w-[360px] rounded-xl shadow-[var(--shadow-lg-border-base)]">
-        <Tabs
-          aria-label={language.t("status.popover.ariaLabel")}
-          class="tabs bg-background-strong rounded-xl overflow-hidden"
-          data-component="tabs"
-          data-active="servers"
-          defaultValue="servers"
-          variant="alt"
+      <div class="relative size-full flex items-center justify-center">
+        <div
+          class="size-full flex items-center justify-center"
+          style={{
+            "-webkit-mask-image": "radial-gradient(circle 5px at calc(100% - 8px) 8px, transparent 5px, black 5.5px)",
+            "mask-image": "radial-gradient(circle 5px at calc(100% - 8px) 8px, transparent 5px, black 5.5px)",
+          }}
        >
-          <Tabs.List data-slot="tablist" class="bg-transparent border-b-0 px-4 pt-2 pb-0 gap-4 h-10">
-            <Tabs.Trigger value="servers" data-slot="tab" class="text-12-regular">
-              {sortedServers().length > 0 ? `${sortedServers().length} ` : ""}
-              {language.t("status.popover.tab.servers")}
-            </Tabs.Trigger>
-            <Tabs.Trigger value="mcp" data-slot="tab" class="text-12-regular">
-              {mcpConnected() > 0 ? `${mcpConnected()} ` : ""}
-              {language.t("status.popover.tab.mcp")}
-            </Tabs.Trigger>
-            <Tabs.Trigger value="lsp" data-slot="tab" class="text-12-regular">
-              {lspCount() > 0 ? `${lspCount()} ` : ""}
-              {language.t("status.popover.tab.lsp")}
-            </Tabs.Trigger>
-            <Tabs.Trigger value="plugins" data-slot="tab" class="text-12-regular">
-              {pluginCount() > 0 ? `${pluginCount()} ` : ""}
-              {language.t("status.popover.tab.plugins")}
-            </Tabs.Trigger>
-          </Tabs.List>
-
-          <Tabs.Content value="servers">
-            <div class="flex flex-col px-2 pb-2">
-              <div class="flex flex-col p-3 bg-background-base rounded-sm min-h-14">
-                <For each={sortedServers()}>
-                  {(s) => {
-                    const key = ServerConnection.key(s)
-                    const isBlocked = () => health[key]?.healthy === false
-                    return (
-                      <button
-                        type="button"
-                        class="flex items-center gap-2 w-full h-8 pl-3 pr-1.5 py-1.5 rounded-md transition-colors text-left"
-                        classList={{
-                          "hover:bg-surface-raised-base-hover": !isBlocked(),
-                          "cursor-not-allowed": isBlocked(),
-                        }}
-                        aria-disabled={isBlocked()}
-                        onClick={() => {
-                          if (isBlocked()) return
-                          server.setActive(key)
-                          navigate("/")
-                        }}
-                      >
-                        <ServerHealthIndicator health={health[key]} />
-                        <ServerRow
-                          conn={s}
-                          dimmed={isBlocked()}
-                          status={health[key]}
-                          class="flex items-center gap-2 w-full min-w-0"
-                          nameClass="text-14-regular text-text-base truncate"
-                          versionClass="text-12-regular text-text-weak truncate"
-                          badge={
-                            <Show when={key === defaultServer.key()}>
-                              <span class="text-11-regular text-text-base bg-surface-base px-1.5 py-0.5 rounded-md">
-                                {language.t("common.default")}
-                              </span>
-                            </Show>
-                          }
-                        >
-                          <div class="flex-1" />
-                          <Show when={server.current && key === ServerConnection.key(server.current)}>
-                            <Icon name="check" size="small" class="text-icon-weak shrink-0" />
-                          </Show>
-                        </ServerRow>
-                      </button>
-                    )
-                  }}
-                </For>
-
-                <Button
-                  variant="secondary"
-                  class="mt-3 self-start h-8 px-3 py-1.5"
-                  onClick={() => dialog.show(() => <DialogSelectServer />, defaultServer.refresh)}
-                >
-                  {language.t("status.popover.action.manageServers")}
-                </Button>
-              </div>
-            </div>
-          </Tabs.Content>
-
-          <Tabs.Content value="mcp">
-            <div class="flex flex-col px-2 pb-2">
-              <div class="flex flex-col p-3 bg-background-base rounded-sm min-h-14">
-                <Show
-                  when={mcpNames().length > 0}
-                  fallback={
-                    <div class="text-14-regular text-text-base text-center my-auto">
-                      {language.t("dialog.mcp.empty")}
-                    </div>
-                  }
-                >
-                  <For each={mcpNames()}>
-                    {(name) => {
-                      const status = () => mcpStatus(name)
-                      const enabled = () => status() === "connected"
-                      return (
-                        <button
-                          type="button"
-                          class="flex items-center gap-2 w-full h-8 pl-3 pr-2 py-1 rounded-md hover:bg-surface-raised-base-hover transition-colors text-left"
-                          onClick={() => mcp.toggle(name)}
-                          disabled={mcp.loading() === name}
-                        >
-                          <div
-                            classList={{
-                              "size-1.5 rounded-full shrink-0": true,
-                              "bg-icon-success-base": status() === "connected",
-                              "bg-icon-critical-base": status() === "failed",
-                              "bg-border-weak-base": status() === "disabled",
-                              "bg-icon-warning-base":
-                                status() === "needs_auth" || status() === "needs_client_registration",
-                            }}
-                          />
-                          <span class="text-14-regular text-text-base truncate flex-1">{name}</span>
-                          <div onClick={(event) => event.stopPropagation()}>
-                            <Switch
-                              checked={enabled()}
-                              disabled={mcp.loading() === name}
-                              onChange={() => mcp.toggle(name)}
-                            />
-                          </div>
-                        </button>
-                      )
-                    }}
-                  </For>
-                </Show>
-              </div>
-            </div>
-          </Tabs.Content>
-
-          <Tabs.Content value="lsp">
-            <div class="flex flex-col px-2 pb-2">
-              <div class="flex flex-col p-3 bg-background-base rounded-sm min-h-14">
-                <Show
-                  when={lspItems().length > 0}
-                  fallback={
-                    <div class="text-14-regular text-text-base text-center my-auto">
-                      {language.t("dialog.lsp.empty")}
-                    </div>
-                  }
-                >
-                  <For each={lspItems()}>
-                    {(item) => (
-                      <div class="flex items-center gap-2 w-full px-2 py-1">
-                        <div
-                          classList={{
-                            "size-1.5 rounded-full shrink-0": true,
-                            "bg-icon-success-base": item.status === "connected",
-                            "bg-icon-critical-base": item.status === "error",
-                          }}
-                        />
-                        <span class="text-14-regular text-text-base truncate">{item.name || item.id}</span>
-                      </div>
-                    )}
-                  </For>
-                </Show>
-              </div>
-            </div>
-          </Tabs.Content>
-
-          <Tabs.Content value="plugins">
-            <div class="flex flex-col px-2 pb-2">
-              <div class="flex flex-col p-3 bg-background-base rounded-sm min-h-14">
-                <Show
-                  when={plugins().length > 0}
-                  fallback={<div class="text-14-regular text-text-base text-center my-auto">{pluginEmpty()}</div>}
-                >
-                  <For each={plugins()}>
-                    {(plugin) => (
-                      <div class="flex items-center gap-2 w-full px-2 py-1">
-                        <div class="size-1.5 rounded-full shrink-0 bg-icon-success-base" />
-                        <span class="text-14-regular text-text-base truncate">{plugin}</span>
-                      </div>
-                    )}
-                  </For>
-                </Show>
-              </div>
-            </div>
-          </Tabs.Content>
-        </Tabs>
+          <Icon name="status" size="normal" />
+        </div>
+        <div
+          classList={{
+            "absolute top-[5px] right-[5px] size-1.5 rounded-full z-10": true,
+            "bg-icon-success-base": overallHealthy(),
+            "bg-icon-critical-base": !overallHealthy() && server.healthy() !== undefined,
+            "bg-border-weak-base": server.healthy() === undefined,
+          }}
+        />
      </div>
-    </Popover>
+    </button>
  )
 }
--- a/packages/app/src/components/titlebar.tsx
+++ b/packages/app/src/components/titlebar.tsx
@@ -58,6 +58,12 @@ export function Titlebar() {
  })

  const path = () => `${location.pathname}${location.search}${location.hash}`
+  const creating = createMemo(() => {
+    if (!params.dir) return false
+    if (params.id) return false
+    const parts = location.pathname.replace(/\/+$/, "").split("/")
+    return parts.at(-1) === "session"
+  })

  createEffect(() => {
    const current = path()
@@ -206,19 +212,7 @@ export function Titlebar() {
              aria-label={language.t("command.sidebar.toggle")}
              aria-expanded={layout.sidebar.opened()}
            >
-              <div class="relative flex items-center justify-center size-4 [&>*]:absolute [&>*]:inset-0">
-                <Icon
-                  size="small"
-                  name={layout.sidebar.opened() ? "layout-left-partial" : "layout-left"}
-                  class="group-hover/sidebar-toggle:hidden"
-                />
-                <Icon size="small" name="layout-left-partial" class="hidden group-hover/sidebar-toggle:inline-block" />
-                <Icon
-                  size="small"
-                  name={layout.sidebar.opened() ? "layout-left" : "layout-left-partial"}
-                  class="hidden group-active/sidebar-toggle:inline-block"
-                />
-              </div>
+              <Icon size="small" name={layout.sidebar.opened() ? "sidebar-active" : "sidebar"} />
            </Button>
          </TooltipKeybind>
          <div class="hidden xl:flex items-center shrink-0">
@@ -231,13 +225,14 @@ export function Titlebar() {
              >
                <Button
                  variant="ghost"
-                  icon="new-session"
+                  icon={creating() ? "new-session-active" : "new-session"}
                  class="titlebar-icon w-8 h-6 p-0 box-border"
                  onClick={() => {
                    if (!params.dir) return
                    navigate(`/${params.dir}/session`)
                  }}
                  aria-label={language.t("command.session.new")}
+                  aria-current={creating() ? "page" : undefined}
                />
              </TooltipKeybind>
            </Show>
--- a/packages/app/src/pages/layout.tsx
+++ b/packages/app/src/pages/layout.tsx
@@ -2181,6 +2181,7 @@ export default function Layout(props: ParentProps) {
  const sidebarContent = (mobile?: boolean) => (
    <SidebarContent
      mobile={mobile}
+      dir={currentDir()}
      opened={() => layout.sidebar.opened()}
      aimMove={aim.move}
      projects={projects}
@@ -2199,6 +2200,7 @@ export default function Layout(props: ParentProps) {
      onOpenSettings={openSettings}
      helpLabel={() => language.t("sidebar.help")}
      onOpenHelp={() => platform.openLink("https://opencode.ai/desktop-feedback")}
+      statusLabel={() => language.t("status.popover.trigger")}
      renderPanel={() =>
        mobile ? (
          <SidebarPanel project={currentProject()} mobile />
--- a/packages/app/src/pages/layout/sidebar-items.tsx
+++ b/packages/app/src/pages/layout/sidebar-items.tsx
@@ -10,7 +10,6 @@ import { base64Encode } from "@opencode-ai/util/encode"
 import { getFilename } from "@opencode-ai/util/path"
 import { A, useNavigate, useParams } from "@solidjs/router"
 import { type Accessor, createMemo, For, type JSX, Match, onCleanup, Show, Switch } from "solid-js"
-import { getSessionPrefetch, SESSION_PREFETCH_TTL } from "@/context/global-sync/session-prefetch"
 import { useGlobalSync } from "@/context/global-sync"
 import { useLanguage } from "@/context/language"
 import { getAvatarColors, type LocalProject, useLayout } from "@/context/layout"
@@ -228,13 +227,7 @@ export const SessionItem = (props: SessionItemProps): JSX.Element => {
  const hoverMessages = createMemo(() =>
    sessionStore.message[props.session.id]?.filter((message): message is UserMessage => message.role === "user"),
  )
-  const hoverReady = createMemo(() => {
-    if (sessionStore.message[props.session.id] === undefined) return false
-    if (props.session.id === params.id) return true
-    const info = getSessionPrefetch(props.session.directory, props.session.id)
-    if (!info) return false
-    return Date.now() - info.at < SESSION_PREFETCH_TTL
-  })
+  const hoverReady = createMemo(() => hoverMessages() !== undefined)
  const hoverAllowed = createMemo(() => !props.mobile && props.sidebarExpanded())
  const hoverEnabled = createMemo(() => (props.popover ?? true) && hoverAllowed())
  const isActive = createMemo(() => props.session.id === params.id)
--- a/packages/app/src/pages/layout/sidebar-shell.tsx
+++ b/packages/app/src/pages/layout/sidebar-shell.tsx
@@ -11,9 +11,11 @@ import { ConstrainDragXAxis } from "@/utils/solid-dnd"
 import { IconButton } from "@opencode-ai/ui/icon-button"
 import { Tooltip, TooltipKeybind } from "@opencode-ai/ui/tooltip"
 import { type LocalProject } from "@/context/layout"
+import { StatusModal } from "@/components/status-popover"

 export const SidebarContent = (props: {
  mobile?: boolean
+  dir: string
  opened: Accessor<boolean>
  aimMove: (event: MouseEvent) => void
  projects: Accessor<LocalProject[]>
@@ -30,6 +32,7 @@ export const SidebarContent = (props: {
  onOpenSettings: () => void
  helpLabel: Accessor<string>
  onOpenHelp: () => void
+  statusLabel: Accessor<string>
  renderPanel: () => JSX.Element
 }): JSX.Element => {
  const expanded = createMemo(() => !!props.mobile || props.opened())
@@ -90,6 +93,11 @@ export const SidebarContent = (props: {
          </DragDropProvider>
        </div>
        <div class="shrink-0 w-full pt-3 pb-6 flex flex-col items-center gap-2">
+          <Show when={!!props.dir}>
+            <Tooltip placement={placement()} value={props.statusLabel()}>
+              <StatusModal directory={props.dir} />
+            </Tooltip>
+          </Show>
          <TooltipKeybind placement={placement()} title={props.settingsLabel()} keybind={props.settingsKeybind() ?? ""}>
            <IconButton
              icon="settings-gear"
--- a/packages/app/src/pages/session/message-timeline.tsx
+++ b/packages/app/src/pages/session/message-timeline.tsx
@@ -11,15 +11,19 @@ import { InlineInput } from "@opencode-ai/ui/inline-input"
 import { Spinner } from "@opencode-ai/ui/spinner"
 import { SessionTurn } from "@opencode-ai/ui/session-turn"
 import { ScrollView } from "@opencode-ai/ui/scroll-view"
+import { TextField } from "@opencode-ai/ui/text-field"
 import type { AssistantMessage, Message as MessageType, Part, TextPart, UserMessage } from "@opencode-ai/sdk/v2"
 import { showToast } from "@opencode-ai/ui/toast"
 import { Binary } from "@opencode-ai/util/binary"
 import { getFilename } from "@opencode-ai/util/path"
+import { Popover as KobaltePopover } from "@kobalte/core/popover"
 import { shouldMarkBoundaryGesture, normalizeWheelDelta } from "@/pages/session/message-gesture"
 import { SessionContextUsage } from "@/components/session-context-usage"
 import { useDialog } from "@opencode-ai/ui/context/dialog"
 import { useLanguage } from "@/context/language"
 import { useSessionKey } from "@/pages/session/session-layout"
+import { useGlobalSDK } from "@/context/global-sdk"
+import { usePlatform } from "@/context/platform"
 import { useSettings } from "@/context/settings"
 import { useSDK } from "@/context/sdk"
 import { useSync } from "@/context/sync"
@@ -215,12 +219,14 @@ export function MessageTimeline(props: {
  let touchGesture: number | undefined

  const navigate = useNavigate()
+  const globalSDK = useGlobalSDK()
  const sdk = useSDK()
  const sync = useSync()
  const settings = useSettings()
  const dialog = useDialog()
  const language = useLanguage()
  const { params, sessionKey } = useSessionKey()
+  const platform = usePlatform()

  const rendered = createMemo(() => props.renderedUserMessages.map((message) => message.id))
  const sessionID = createMemo(() => params.id)
@@ -298,6 +304,8 @@ export function MessageTimeline(props: {
    return sync.session.get(id)
  })
  const titleValue = createMemo(() => info()?.title)
+  const shareUrl = createMemo(() => info()?.share?.url)
+  const shareEnabled = createMemo(() => sync.data.config.share !== "disabled")
  const parentID = createMemo(() => info()?.parentID)
  const showHeader = createMemo(() => !!(titleValue() || parentID()))
  const stageCfg = { init: 1, batch: 3 }
@@ -314,9 +322,55 @@ export function MessageTimeline(props: {
    saving: false,
    menuOpen: false,
    pendingRename: false,
+    pendingShare: false,
  })
  let titleRef: HTMLInputElement | undefined

+  const [share, setShare] = createStore({
+    open: false,
+    dismiss: null as "escape" | "outside" | null,
+  })
+
+  let more: HTMLButtonElement | undefined
+
+  const [req, setReq] = createStore({ share: false, unshare: false })
+
+  const shareSession = () => {
+    const id = sessionID()
+    if (!id || req.share) return
+    if (!shareEnabled()) return
+    setReq("share", true)
+    globalSDK.client.session
+      .share({ sessionID: id, directory: sdk.directory })
+      .catch((err: unknown) => {
+        console.error("Failed to share session", err)
+      })
+      .finally(() => {
+        setReq("share", false)
+      })
+  }
+
+  const unshareSession = () => {
+    const id = sessionID()
+    if (!id || req.unshare) return
+    if (!shareEnabled()) return
+    setReq("unshare", true)
+    globalSDK.client.session
+      .unshare({ sessionID: id, directory: sdk.directory })
+      .catch((err: unknown) => {
+        console.error("Failed to unshare session", err)
+      })
+      .finally(() => {
+        setReq("unshare", false)
+      })
+  }
+
+  const viewShare = () => {
+    const url = shareUrl()
+    if (!url) return
+    platform.openLink(url)
+  }
+
  const errorMessage = (err: unknown) => {
    if (err && typeof err === "object" && "data" in err) {
      const data = (err as { data?: { message?: string } }).data
@@ -329,7 +383,15 @@ export function MessageTimeline(props: {
  createEffect(
    on(
      sessionKey,
-      () => setTitle({ draft: "", editing: false, saving: false, menuOpen: false, pendingRename: false }),
+      () =>
+        setTitle({
+          draft: "",
+          editing: false,
+          saving: false,
+          menuOpen: false,
+          pendingRename: false,
+          pendingShare: false,
+        }),
      { defer: true },
    ),
  )
@@ -678,23 +740,42 @@ export function MessageTimeline(props: {
                          gutter={4}
                          placement="bottom-end"
                          open={title.menuOpen}
-                          onOpenChange={(open) => setTitle("menuOpen", open)}
+                          onOpenChange={(open) => {
+                            setTitle("menuOpen", open)
+                            if (open) return
+                          }}
                        >
                          <DropdownMenu.Trigger
                            as={IconButton}
                            icon="dot-grid"
                            variant="ghost"
                            class="size-6 rounded-md data-[expanded]:bg-surface-base-active"
+                            classList={{
+                              "bg-surface-base-active": share.open || title.pendingShare,
+                            }}
                            aria-label={language.t("common.moreOptions")}
+                            aria-expanded={title.menuOpen || share.open || title.pendingShare}
+                            ref={(el: HTMLButtonElement) => {
+                              more = el
+                            }}
                          />
                          <DropdownMenu.Portal>
                            <DropdownMenu.Content
                              style={{ "min-width": "104px" }}
                              onCloseAutoFocus={(event) => {
-                                if (!title.pendingRename) return
-                                event.preventDefault()
-                                setTitle("pendingRename", false)
-                                openTitleEditor()
+                                if (title.pendingRename) {
+                                  event.preventDefault()
+                                  setTitle("pendingRename", false)
+                                  openTitleEditor()
+                                  return
+                                }
+                                if (title.pendingShare) {
+                                  event.preventDefault()
+                                  requestAnimationFrame(() => {
+                                    setShare({ open: true, dismiss: null })
+                                    setTitle("pendingShare", false)
+                                  })
+                                }
                              }}
                            >
                              <DropdownMenu.Item
@@ -705,6 +786,17 @@ export function MessageTimeline(props: {
                              >
                                <DropdownMenu.ItemLabel>{language.t("common.rename")}</DropdownMenu.ItemLabel>
                              </DropdownMenu.Item>
+                              <Show when={shareEnabled()}>
+                                <DropdownMenu.Item
+                                  onSelect={() => {
+                                    setTitle({ pendingShare: true, menuOpen: false })
+                                  }}
+                                >
+                                  <DropdownMenu.ItemLabel>
+                                    {language.t("session.share.action.share")}
+                                  </DropdownMenu.ItemLabel>
+                                </DropdownMenu.Item>
+                              </Show>
                              <DropdownMenu.Item onSelect={() => void archiveSession(id())}>
                                <DropdownMenu.ItemLabel>{language.t("common.archive")}</DropdownMenu.ItemLabel>
                              </DropdownMenu.Item>
@@ -717,6 +809,104 @@ export function MessageTimeline(props: {
                            </DropdownMenu.Content>
                          </DropdownMenu.Portal>
                        </DropdownMenu>
+
+                        <KobaltePopover
+                          open={share.open}
+                          anchorRef={() => more}
+                          placement="bottom-end"
+                          gutter={4}
+                          modal={false}
+                          onOpenChange={(open) => {
+                            if (open) setShare("dismiss", null)
+                            setShare("open", open)
+                          }}
+                        >
+                          <KobaltePopover.Portal>
+                            <KobaltePopover.Content
+                              data-component="popover-content"
+                              style={{ "min-width": "320px" }}
+                              onEscapeKeyDown={(event) => {
+                                setShare({ dismiss: "escape", open: false })
+                                event.preventDefault()
+                                event.stopPropagation()
+                              }}
+                              onPointerDownOutside={() => {
+                                setShare({ dismiss: "outside", open: false })
+                              }}
+                              onFocusOutside={() => {
+                                setShare({ dismiss: "outside", open: false })
+                              }}
+                              onCloseAutoFocus={(event) => {
+                                if (share.dismiss === "outside") event.preventDefault()
+                                setShare("dismiss", null)
+                              }}
+                            >
+                              <div class="flex flex-col p-3">
+                                <div class="flex flex-col gap-1">
+                                  <div class="text-13-medium text-text-strong">
+                                    {language.t("session.share.popover.title")}
+                                  </div>
+                                  <div class="text-12-regular text-text-weak">
+                                    {shareUrl()
+                                      ? language.t("session.share.popover.description.shared")
+                                      : language.t("session.share.popover.description.unshared")}
+                                  </div>
+                                </div>
+                                <div class="mt-3 flex flex-col gap-2">
+                                  <Show
+                                    when={shareUrl()}
+                                    fallback={
+                                      <Button
+                                        size="large"
+                                        variant="primary"
+                                        class="w-full"
+                                        onClick={shareSession}
+                                        disabled={req.share}
+                                      >
+                                        {req.share
+                                          ? language.t("session.share.action.publishing")
+                                          : language.t("session.share.action.publish")}
+                                      </Button>
+                                    }
+                                  >
+                                    <div class="flex flex-col gap-2">
+                                      <TextField
+                                        value={shareUrl() ?? ""}
+                                        readOnly
+                                        copyable
+                                        copyKind="link"
+                                        tabIndex={-1}
+                                        class="w-full"
+                                      />
+                                      <div class="grid grid-cols-2 gap-2">
+                                        <Button
+                                          size="large"
+                                          variant="secondary"
+                                          class="w-full shadow-none border border-border-weak-base"
+                                          onClick={unshareSession}
+                                          disabled={req.unshare}
+                                        >
+                                          {req.unshare
+                                            ? language.t("session.share.action.unpublishing")
+                                            : language.t("session.share.action.unpublish")}
+                                        </Button>
+                                        <Button
+                                          size="large"
+                                          variant="primary"
+                                          class="w-full"
+                                          onClick={viewShare}
+                                          disabled={req.unshare}
+                                        >
+                                          {language.t("session.share.action.view")}
+                                        </Button>
+                                      </div>
+                                    </div>
+                                  </Show>
+                                </div>
+                              </div>
+                            </KobaltePopover.Content>
+                          </KobaltePopover.Portal>
+                        </KobaltePopover>
                      </div>
                    )}
                  </Show>
--- a/packages/console/app/src/routes/index.css
+++ b/packages/console/app/src/routes/index.css
@@ -389,10 +389,9 @@ body {
      gap: 40px;
      align-items: center;
      border: 1px solid var(--color-border-weak);
-      border-bottom: none;
+      border-bottom: 1px solid var(--color-border-weak);
      border-top-left-radius: 6px;
      border-top-right-radius: 6px;
-      background: var(--color-background-weak);
      padding: 0 20px;

      @media (max-width: 60rem) {
@@ -425,6 +424,7 @@ body {
    [data-slot="panels"] {
      background: var(--color-background-weak);
      border: 1px solid var(--color-border-weak);
+      border-top: none;
      border-bottom-left-radius: 6px;
      border-bottom-right-radius: 6px;
      padding: 16px;
--- a/packages/console/core/src/model.ts
+++ b/packages/console/core/src/model.ts
@@ -36,6 +36,7 @@ export namespace ZenData {
        weight: z.number().optional(),
        disabled: z.boolean().optional(),
        storeModel: z.string().optional(),
+        payloadModifier: z.record(z.string(), z.any()).optional(),
      }),
    ),
  })
--- a/packages/opencode/src/util/effect-log.ts
+++ b/packages/opencode/src/util/effect-log.ts
@@ -1,56 +0,0 @@
-import { Cause, Logger } from "effect"
-import { CurrentLogAnnotations, CurrentLogSpans } from "effect/References"
-
-import { Log } from "./log"
-
-function text(input: unknown): string {
-  if (Array.isArray(input)) return input.map(text).join(" ")
-  if (input instanceof Error) return input.message
-  if (typeof input === "string") return input
-  if (typeof input === "object" && input !== null) {
-    try {
-      return JSON.stringify(input)
-    } catch {
-      return String(input)
-    }
-  }
-  return String(input)
-}
-
-export function make(tags?: Record<string, unknown>) {
-  const log = Log.create(tags)
-
-  return Logger.make<unknown, void>((options) => {
-    const annotations = options.fiber.getRef(CurrentLogAnnotations as never) as Readonly<Record<string, unknown>>
-    const spans = options.fiber.getRef(CurrentLogSpans as never) as ReadonlyArray<readonly [string, number]>
-    const extra = {
-      ...annotations,
-      fiber: options.fiber.id,
-      spans: spans.length
-        ? spans.map(([label, start]) => ({
-            label,
-            duration: options.date.getTime() - start,
-          }))
-        : undefined,
-      cause: options.cause.reasons.length ? Cause.pretty(options.cause) : undefined,
-    }
-
-    if (options.logLevel === "Debug" || options.logLevel === "Trace") {
-      return log.debug(text(options.message), extra)
-    }
-
-    if (options.logLevel === "Info") {
-      return log.info(text(options.message), extra)
-    }
-
-    if (options.logLevel === "Warn") {
-      return log.warn(text(options.message), extra)
-    }
-
-    return log.error(text(options.message), extra)
-  })
-}
-
-export function layer(tags?: Record<string, unknown>, options?: { mergeWithExisting?: boolean }) {
-  return Logger.layer([make(tags)], options)
-}
--- a/packages/opencode/test/util/effect-log.test.ts
+++ b/packages/opencode/test/util/effect-log.test.ts
@@ -1,99 +0,0 @@
-import { afterEach, expect, mock, spyOn, test } from "bun:test"
-import { Cause, Effect } from "effect"
-import { CurrentLogAnnotations, CurrentLogSpans } from "effect/References"
-
-import * as EffectLog from "../../src/util/effect-log"
-import { Log } from "../../src/util/log"
-
-const debug = mock(() => {})
-const info = mock(() => {})
-const warn = mock(() => {})
-const error = mock(() => {})
-
-const logger = {
-  debug,
-  info,
-  warn,
-  error,
-  tag() {
-    return logger
-  },
-  clone() {
-    return logger
-  },
-  time() {
-    return {
-      stop() {},
-      [Symbol.dispose]() {},
-    }
-  },
-}
-
-afterEach(() => {
-  debug.mockClear()
-  info.mockClear()
-  warn.mockClear()
-  error.mockClear()
-})
-
-test("EffectLog.layer routes info logs through util/log", async () => {
-  using create = spyOn(Log, "create").mockReturnValue(logger)
-
-  await Effect.runPromise(Effect.logInfo("hello").pipe(Effect.provide(EffectLog.layer({ service: "effect-test" }))))
-
-  expect(create).toHaveBeenCalledWith({ service: "effect-test" })
-  expect(info).toHaveBeenCalledWith("hello", expect.any(Object))
-})
-
-test("EffectLog.layer forwards annotations and spans to util/log", async () => {
-  using create = spyOn(Log, "create").mockReturnValue(logger)
-
-  await Effect.runPromise(
-    Effect.logInfo("hello").pipe(
-      Effect.annotateLogs({ requestId: "req-123" }),
-      Effect.withLogSpan("provider-auth"),
-      Effect.provide(EffectLog.layer({ service: "effect-test-meta" })),
-    ),
-  )
-
-  expect(create).toHaveBeenCalledWith({ service: "effect-test-meta" })
-  expect(info).toHaveBeenCalledWith(
-    "hello",
-    expect.objectContaining({
-      requestId: "req-123",
-      spans: expect.arrayContaining([
-        expect.objectContaining({
-          label: "provider-auth",
-        }),
-      ]),
-    }),
-  )
-})
-
-test("EffectLog.make formats structured messages and causes for legacy logger", () => {
-  using create = spyOn(Log, "create").mockReturnValue(logger)
-  const effect = EffectLog.make({ service: "effect-test-struct" })
-
-  effect.log({
-    message: { hello: "world" },
-    logLevel: "Warn",
-    cause: Cause.fail(new Error("boom")),
-    fiber: {
-      id: 123n,
-      getRef(ref: unknown) {
-        if (ref === CurrentLogAnnotations) return {}
-        if (ref === CurrentLogSpans) return []
-        return undefined
-      },
-    },
-    date: new Date(),
-  } as never)
-
-  expect(create).toHaveBeenCalledWith({ service: "effect-test-struct" })
-  expect(warn).toHaveBeenCalledWith(
-    '{"hello":"world"}',
-    expect.objectContaining({
-      fiber: 123n,
-    }),
-  )
-})
--- a/packages/ui/src/assets/icons/app/android-studio.svg
+++ b/packages/ui/src/assets/icons/app/android-studio.svg
--- a/packages/ui/src/assets/icons/app/antigravity.svg
+++ b/packages/ui/src/assets/icons/app/antigravity.svg
--- a/packages/ui/src/assets/icons/app/cursor.svg
+++ b/packages/ui/src/assets/icons/app/cursor.svg
@@ -1 +1,16 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><g clip-path="url(#prefix__clip0_5_17)"><rect width="512" height="512" rx="122" fill="#000"/><g clip-path="url(#prefix__clip1_5_17)"><mask id="prefix__a" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="85" y="89" width="343" height="334"><path d="M85 89h343v334H85V89z" fill="#fff"/></mask><g mask="url(#prefix__a)"><path d="M255.428 423l148.991-83.5L255.428 256l-148.99 83.5 148.99 83.5z" fill="url(#prefix__paint0_linear_5_17)"/><path d="M404.419 339.5v-167L255.428 89v167l148.991 83.5z" fill="url(#prefix__paint1_linear_5_17)"/><path d="M255.428 89l-148.99 83.5v167l148.99-83.5V89z" fill="url(#prefix__paint2_linear_5_17)"/><path d="M404.419 172.5L255.428 423V256l148.991-83.5z" fill="#E4E4E4"/><path d="M404.419 172.5L255.428 256l-148.99-83.5h297.981z" fill="#fff"/></g></g></g><defs><linearGradient id="prefix__paint0_linear_5_17" x1="255.428" y1="256" x2="255.428" y2="423" gradientUnits="userSpaceOnUse"><stop offset=".16" stop-color="#fff" stop-opacity=".39"/><stop offset=".658" stop-color="#fff" stop-opacity=".8"/></linearGradient><linearGradient id="prefix__paint1_linear_5_17" x1="404.419" y1="173.015" x2="257.482" y2="261.497" gradientUnits="userSpaceOnUse"><stop offset=".182" stop-color="#fff" stop-opacity=".31"/><stop offset=".715" stop-color="#fff" stop-opacity="0"/></linearGradient><linearGradient id="prefix__paint2_linear_5_17" x1="255.428" y1="89" x2="112.292" y2="342.802" gradientUnits="userSpaceOnUse"><stop stop-color="#fff" stop-opacity=".6"/><stop offset=".667" stop-color="#fff" stop-opacity=".22"/></linearGradient><clipPath id="prefix__clip0_5_17"><path fill="#fff" d="M0 0h512v512H0z"/></clipPath><clipPath id="prefix__clip1_5_17"><path fill="#fff" transform="translate(85 89)" d="M0 0h343v334H0z"/></clipPath></defs></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5436_78947)">
+<mask id="mask0_5436_78947" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="4" y="4" width="32" height="32">
+<path d="M4 4H36V36H4V4Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_5436_78947)">
+<path d="M28.375 4H11.625C7.41383 4 4 7.41383 4 11.625V28.375C4 32.5862 7.41383 36 11.625 36H28.375C32.5862 36 36 32.5862 36 28.375V11.625C36 7.41383 32.5862 4 28.375 4Z" fill="black"/>
+</g>
+<path d="M29.6214 14.2072L20.9502 9.12249C20.6718 8.95917 20.3282 8.95917 20.0498 9.12249L11.3786 14.2072C11.1445 14.3445 11 14.5984 11 14.8733V25.1267C11 25.4012 11.1445 25.6555 11.3786 25.7928L20.0498 30.8775C20.3282 31.0408 20.6718 31.0408 20.9502 30.8775L29.6214 25.7928C29.8555 25.6555 30 25.4016 30 25.1267V14.8733C30 14.5988 29.8555 14.3445 29.6214 14.2072ZM29.0767 15.2843L20.706 30.0101C20.6494 30.1093 20.5 30.0688 20.5 29.9538V20.3115C20.5 20.1189 20.3986 19.9407 20.2342 19.8439L12.0124 15.0226C11.9147 14.9651 11.9546 14.8134 12.0678 14.8134H28.8093C29.047 14.8134 29.1956 15.0751 29.0767 15.2843Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_5436_78947">
+<rect width="32" height="32" fill="white" transform="translate(4 4)"/>
+</clipPath>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/file-explorer.svg
+++ b/packages/ui/src/assets/icons/app/file-explorer.svg
@@ -1 +1,20 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256" xml:space="preserve"><g style="stroke:none;stroke-width:0;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;fill:none;fill-rule:nonzero;opacity:1" transform="translate(1.407 1.407)scale(2.81)"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="44.348" y1="16.53" x2="42.921" y2="8.538"><stop offset="0%" style="stop-color:#ce9918;stop-opacity:1"/><stop offset="59.02%" style="stop-color:#df9e00;stop-opacity:1"/></linearGradient><path d="m34.429 12.182-3.618-3.93a5.72 5.72 0 0 0-4.208-1.846H2.438A2.437 2.437 0 0 0 0 8.844V25.75l.121.013a2.845 2.845 0 0 1 2.733-2.074h22.99c3.267 0 6.442-1.43 8.377-4.063a10.57 10.57 0 0 1 8.515-4.309h44.41A2.854 2.854 0 0 1 90 18.171v-3.354a2.323 2.323 0 0 0-2.323-2.323H35.143a.97.97 0 0 1-.714-.312" style="stroke:none;stroke-width:1;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;fill:url(#a);fill-rule:nonzero;opacity:1"/><linearGradient id="b" gradientUnits="userSpaceOnUse" x1="62.876" y1="69.664" x2="25.487" y2="26.567"><stop offset="0%" style="stop-color:#f5b509;stop-opacity:1"/><stop offset="100%" style="stop-color:#fece49;stop-opacity:1"/></linearGradient><path d="M34.313 18.71a10.57 10.57 0 0 1-8.423 4.186H2.854A2.854 2.854 0 0 0 0 25.751V80.74a2.854 2.854 0 0 0 2.854 2.854h84.292A2.854 2.854 0 0 0 90 80.74V17.378a2.854 2.854 0 0 0-2.854-2.854h-44.41a10.57 10.57 0 0 0-8.423 4.186" style="stroke:none;stroke-width:1;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;fill:url(#b);fill-rule:nonzero;opacity:1"/><linearGradient id="c" gradientUnits="userSpaceOnUse" x1="66.058" y1="81.144" x2="10.973" y2="54.886"><stop offset="0%" style="stop-color:#0161b2;stop-opacity:1"/><stop offset="100%" style="stop-color:#1291dd;stop-opacity:1"/></linearGradient><path d="M66.834 55.053H23.166a9.67 9.67 0 0 0-9.672 9.672v18.869h63.013V64.725c-.001-5.342-4.331-9.672-9.673-9.672" style="stroke:none;stroke-width:1;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;fill:url(#c);fill-rule:nonzero;opacity:1"/><path d="M63.552 73.306H26.448a2 2 0 0 1 0-4h37.104a2 2 0 0 1 0 4" style="stroke:none;stroke-width:1;stroke-dasharray:none;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:10;fill:#10498a;fill-rule:nonzero;opacity:1"/></g></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.2414 8.05369L14.955 6.65636C14.7646 6.44946 14.5333 6.2843 14.2757 6.17133C14.0182 6.05836 13.7401 6.00002 13.4588 6H4.86684C4.753 5.99995 4.64025 6.02234 4.53506 6.06589C4.42987 6.10944 4.33429 6.17329 4.25379 6.25379C4.17329 6.33429 4.10944 6.42987 4.06589 6.53506C4.02234 6.64025 3.99995 6.753 4 6.86684V12.8779L4.04302 12.8825C4.10268 12.6706 4.22985 12.4839 4.40523 12.3508C4.5806 12.2177 4.7946 12.1455 5.01476 12.1451H13.189C14.3506 12.1451 15.4795 11.6366 16.1675 10.7004C16.5166 10.2255 16.9726 9.83942 17.4985 9.57327C18.0244 9.30713 18.6056 9.16842 19.195 9.16836H34.9852C35.2544 9.16836 35.5125 9.27527 35.7028 9.46557C35.8931 9.65587 36 9.91398 36 10.1831V8.99058C36 8.77152 35.913 8.56144 35.7581 8.40654C35.6032 8.25164 35.3931 8.16462 35.174 8.16462H16.4953C16.4476 8.16469 16.4004 8.15486 16.3567 8.13577C16.313 8.11667 16.2738 8.08873 16.2414 8.05369Z" fill="url(#paint0_linear_5437_79060)"/>
+<path d="M16.2002 10.3751C15.8497 10.8375 15.397 11.2125 14.8774 11.4707C14.3579 11.7289 13.7855 11.8634 13.2053 11.8634H5.01476C4.88147 11.8634 4.74948 11.8897 4.62634 11.9407C4.5032 11.9917 4.39132 12.0665 4.29709 12.1608C4.20286 12.255 4.12812 12.3669 4.07714 12.4901C4.02617 12.6133 3.99995 12.7453 4 12.8785V32.4302C4 32.6993 4.10691 32.9574 4.29722 33.1477C4.48752 33.338 4.74563 33.4449 5.01476 33.4449H34.9852C35.2544 33.4449 35.5125 33.338 35.7028 33.1477C35.8931 32.9574 36 32.6993 36 32.4302V9.90147C36 9.63234 35.8931 9.37424 35.7028 9.18393C35.5125 8.99363 35.2544 8.88672 34.9852 8.88672H19.195C18.6148 8.88679 18.0425 9.0212 17.5229 9.27942C17.0033 9.53764 16.5506 9.91265 16.2002 10.3751Z" fill="url(#paint1_linear_5437_79060)"/>
+<path d="M27.7632 23.2969H12.2368C11.7852 23.2968 11.3379 23.3857 10.9207 23.5585C10.5034 23.7312 10.1242 23.9846 9.80488 24.3039C9.48553 24.6233 9.23222 25.0024 9.05943 25.4197C8.88664 25.8369 8.79776 26.2842 8.79785 26.7358V33.4448H31.2025V26.7358C31.2021 24.8364 29.6626 23.2969 27.7632 23.2969Z" fill="url(#paint2_linear_5437_79060)"/>
+<path d="M26.5965 29.7865H13.404C13.2154 29.7865 13.0345 29.7116 12.9012 29.5782C12.7678 29.4448 12.6929 29.264 12.6929 29.0754C12.6929 28.8868 12.7678 28.7059 12.9012 28.5725C13.0345 28.4392 13.2154 28.3643 13.404 28.3643H26.5965C26.7851 28.3643 26.966 28.4392 27.0993 28.5725C27.2327 28.7059 27.3076 28.8868 27.3076 29.0754C27.3076 29.264 27.2327 29.4448 27.0993 29.5782C26.966 29.7116 26.7851 29.7865 26.5965 29.7865Z" fill="#10498A"/>
+<defs>
+<linearGradient id="paint0_linear_5437_79060" x1="19.7682" y1="9.59964" x2="19.2608" y2="6.75804" gradientUnits="userSpaceOnUse">
+<stop stop-color="#CE9918"/>
+<stop offset="0.5902" stop-color="#DF9E00"/>
+</linearGradient>
+<linearGradient id="paint1_linear_5437_79060" x1="26.3559" y1="28.492" x2="13.062" y2="13.1687" gradientUnits="userSpaceOnUse">
+<stop stop-color="#F5B509"/>
+<stop offset="1" stop-color="#FECE49"/>
+</linearGradient>
+<linearGradient id="paint2_linear_5437_79060" x1="27.4873" y1="32.5737" x2="7.9015" y2="23.2375" gradientUnits="userSpaceOnUse">
+<stop stop-color="#0161B2"/>
+<stop offset="1" stop-color="#1291DD"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/finder.png
+++ b/packages/ui/src/assets/icons/app/finder.png
--- a/packages/ui/src/assets/icons/app/ghostty.svg
+++ b/packages/ui/src/assets/icons/app/ghostty.svg
@@ -1 +1,13 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 27 32"><path fill="#3551F3" d="M20.395 32a6.35 6.35 0 0 1-3.516-1.067A6.355 6.355 0 0 1 13.362 32c-1.249 0-2.48-.375-3.516-1.067A6.265 6.265 0 0 1 6.372 32h-.038a6.255 6.255 0 0 1-4.5-1.906 6.377 6.377 0 0 1-1.836-4.482v-12.25C0 5.995 5.994 0 13.362 0c7.369 0 13.363 5.994 13.363 13.363v12.253c0 3.393-2.626 6.192-5.978 6.375-.117.007-.234.009-.352.009Z"/><path fill="#000" d="M20.395 30.593a4.932 4.932 0 0 1-3.08-1.083.656.656 0 0 0-.42-.145.784.784 0 0 0-.487.176 4.939 4.939 0 0 1-3.046 1.055 4.939 4.939 0 0 1-3.045-1.055.751.751 0 0 0-.942 0 4.883 4.883 0 0 1-3.01 1.055h-.033a4.852 4.852 0 0 1-3.49-1.482 4.982 4.982 0 0 1-1.436-3.498V13.367c0-6.597 5.364-11.96 11.957-11.96 6.592 0 11.956 5.363 11.956 11.956v12.253c0 2.645-2.042 4.827-4.65 4.97a5.342 5.342 0 0 1-.274.007Z"/><path fill="#fff" d="M23.912 13.363v12.253c0 1.876-1.447 3.463-3.32 3.566a3.503 3.503 0 0 1-2.398-.769c-.778-.626-1.873-.598-2.658.021a3.5 3.5 0 0 1-2.176.753 3.494 3.494 0 0 1-2.173-.753 2.153 2.153 0 0 0-2.684 0 3.498 3.498 0 0 1-2.15.753c-1.948.014-3.54-1.627-3.54-3.575v-12.25c0-5.825 4.724-10.549 10.55-10.549 5.825 0 10.549 4.724 10.549 10.55Z"/><path fill="#000" d="m11.28 12.437-3.93-2.27a1.072 1.072 0 0 0-1.463.392 1.072 1.072 0 0 0 .391 1.463l2.326 1.343-2.326 1.343a1.072 1.072 0 0 0 1.071 1.855l3.932-2.27a1.071 1.071 0 0 0 0-1.854v-.002ZM20.182 12.291h-5.164a1.071 1.071 0 1 0 0 2.143h5.164a1.071 1.071 0 1 0 0-2.143Z"/></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5437_79067)">
+<path d="M27.395 36C26.1435 35.9986 24.9203 35.6274 23.879 34.933C22.8374 35.6273 21.6139 35.9985 20.362 36C19.113 36 17.882 35.625 16.846 34.933C15.8189 35.6241 14.61 35.9954 13.372 36H13.334C12.4944 36.0006 11.6633 35.8321 10.8902 35.5047C10.1171 35.1772 9.41781 34.6975 8.83405 34.094C7.65642 32.8996 6.99679 31.2893 6.99805 29.612V17.362C7.00005 9.995 12.994 4 20.362 4C27.731 4 33.725 9.994 33.725 17.363V29.616C33.725 33.009 31.099 35.808 27.747 35.991C27.63 35.998 27.513 36 27.395 36Z" fill="#3551F3"/>
+<path d="M27.395 34.5932C26.2752 34.5924 25.1889 34.2104 24.315 33.5102C24.1961 33.4145 24.0476 33.3632 23.895 33.3652C23.7174 33.367 23.5457 33.4291 23.408 33.5412C22.5392 34.2237 21.4668 34.5951 20.362 34.5962C19.2576 34.5949 18.1855 34.2234 17.317 33.5412C17.1835 33.4338 17.0174 33.3752 16.846 33.3752C16.6747 33.3752 16.5085 33.4338 16.375 33.5412C15.518 34.2199 14.4581 34.5914 13.365 34.5962H13.332C12.6806 34.5961 12.0359 34.4649 11.4362 34.2102C10.8366 33.9556 10.2945 33.5829 9.84201 33.1142C8.92225 32.1822 8.40639 30.9256 8.40601 29.6162V17.3672C8.40601 10.7702 13.77 5.40723 20.363 5.40723C26.955 5.40723 32.319 10.7702 32.319 17.3632V29.6162C32.319 32.2612 30.277 34.4432 27.669 34.5862C27.5777 34.5909 27.4864 34.5932 27.395 34.5932Z" fill="black"/>
+<path d="M30.912 17.3635V29.6165C30.912 31.4925 29.465 33.0795 27.592 33.1825C26.725 33.2323 25.8704 32.9582 25.194 32.4135C24.416 31.7875 23.321 31.8155 22.536 32.4345C21.9163 32.9237 21.1495 33.1891 20.36 33.1875C19.5714 33.1889 18.8056 32.9235 18.187 32.4345C17.8057 32.1306 17.3326 31.9651 16.845 31.9651C16.3574 31.9651 15.8843 32.1306 15.503 32.4345C14.8904 32.9183 14.1336 33.1834 13.353 33.1875C11.405 33.2015 9.81299 31.5605 9.81299 29.6125V17.3625C9.81299 11.5375 14.537 6.81348 20.363 6.81348C26.188 6.81348 30.912 11.5375 30.912 17.3635Z" fill="white"/>
+<path d="M18.28 16.4366L14.35 14.1666C14.104 14.0248 13.8117 13.9865 13.5374 14.06C13.2632 14.1335 13.0292 14.3128 12.887 14.5586C12.7452 14.8045 12.7067 15.0966 12.78 15.3709C12.8533 15.6452 13.0324 15.8792 13.278 16.0216L15.604 17.3646L13.278 18.7076C13.045 18.8559 12.8783 19.0886 12.8126 19.3569C12.7469 19.6252 12.7873 19.9085 12.9255 20.1478C13.0636 20.387 13.2887 20.5637 13.554 20.641C13.8192 20.7183 14.104 20.6902 14.349 20.5626L18.281 18.2926C18.4436 18.1985 18.5786 18.0633 18.6724 17.9006C18.7662 17.7379 18.8156 17.5534 18.8156 17.3656C18.8156 17.1777 18.7662 16.9932 18.6724 16.8305C18.5786 16.6678 18.4436 16.5326 18.281 16.4386V16.4366H18.28ZM27.182 16.2906H22.018C21.7338 16.2906 21.4613 16.4034 21.2604 16.6044C21.0594 16.8053 20.9465 17.0779 20.9465 17.3621C20.9465 17.6462 21.0594 17.9188 21.2604 18.1197C21.4613 18.3207 21.7338 18.4336 22.018 18.4336H27.182C27.4662 18.4336 27.7387 18.3207 27.9397 18.1197C28.1406 17.9188 28.2535 17.6462 28.2535 17.3621C28.2535 17.0779 28.1406 16.8053 27.9397 16.6044C27.7387 16.4034 27.4662 16.2906 27.182 16.2906Z" fill="black"/>
+</g>
+<defs>
+<clipPath id="clip0_5437_79067">
+<rect width="27" height="32" fill="white" transform="translate(7 4)"/>
+</clipPath>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/iterm2.svg
+++ b/packages/ui/src/assets/icons/app/iterm2.svg
@@ -1,23 +1,11 @@
-<svg width="1024" height="1024" viewBox="0 0 1024 1024" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g filter="url(#filter0_d)">
-<rect x="100" y="100" width="824" height="824" rx="179" fill="url(#paint0_linear)"/>
-</g>
-<rect x="121.788" y="121.789" width="780.423" height="780.423" rx="156" fill="black"/>
-<rect x="183.192" y="183.192" width="657.615" height="657.615" rx="94" fill="#202A2F"/>
-<rect x="367.404" y="226.769" width="89.1346" height="178.269" fill="#0EE827" fill-opacity="0.35"/>
-<path d="M274.468 374.622C269.807 374.227 265.438 373.568 261.36 372.645C257.427 371.59 253.786 370.47 250.436 369.284C247.232 368.097 244.392 366.977 241.916 365.922C239.586 364.736 237.838 363.813 236.673 363.154L246.067 345.754C247.086 346.413 248.834 347.335 251.31 348.522C253.786 349.708 256.553 350.96 259.612 352.279C262.816 353.465 266.093 354.52 269.443 355.442C272.793 356.365 275.924 356.827 278.837 356.827C293.402 356.827 300.684 351.356 300.684 340.415C300.684 337.778 300.174 335.603 299.154 333.89C298.281 332.176 296.897 330.726 295.004 329.54C293.256 328.221 291.071 327.101 288.45 326.178C285.974 325.124 283.134 324.069 279.929 323.015C273.812 320.905 268.351 318.73 263.544 316.489C258.884 314.117 254.878 311.48 251.529 308.58C248.179 305.68 245.63 302.385 243.882 298.694C242.135 295.003 241.261 290.784 241.261 286.039C241.261 282.348 242.062 278.789 243.664 275.361C245.266 271.934 247.523 268.902 250.436 266.266C253.349 263.498 256.845 261.191 260.923 259.345C265.001 257.368 269.516 255.984 274.468 255.193V226.769H292.382V254.797C296.169 255.193 299.81 255.786 303.305 256.577C306.801 257.368 309.932 258.225 312.699 259.147C315.467 260.07 317.797 260.993 319.69 261.916C321.729 262.707 323.186 263.3 324.06 263.695L315.321 279.909C314.156 279.382 312.481 278.723 310.296 277.932C308.257 277.009 305.927 276.086 303.305 275.164C300.684 274.241 297.844 273.45 294.785 272.791C291.727 272.132 288.668 271.802 285.61 271.802C280.658 271.802 276.215 272.725 272.283 274.57C268.496 276.284 266.603 279.25 266.603 283.468C266.603 286.105 267.113 288.478 268.132 290.587C269.297 292.564 270.899 294.344 272.938 295.925C275.123 297.507 277.745 299.023 280.803 300.473C284.007 301.791 287.649 303.11 291.727 304.428C297.115 306.405 301.922 308.448 306.145 310.558C310.369 312.667 313.937 315.039 316.85 317.676C319.763 320.312 321.948 323.344 323.404 326.771C325.006 330.199 325.807 334.219 325.807 338.833C325.807 342.788 325.079 346.61 323.623 350.301C322.312 353.992 320.2 357.42 317.287 360.583C314.52 363.747 311.025 366.515 306.801 368.888C302.723 371.129 297.916 372.777 292.382 373.831V403.058H274.468V374.622Z" fill="#0EE827"/>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="4" y="4" width="32" height="32" rx="6.4" fill="url(#paint0_linear_5437_79079)"/>
+<rect x="4.80005" y="4.7998" width="30.4" height="30.4" rx="5.6" fill="black"/>
+<rect x="7.19995" y="7.2002" width="25.6" height="25.6" rx="3.2" fill="#202A2F"/>
+<path d="M25.2454 8.85742H19.2454V20.8574H25.2454V8.85742Z" fill="#0EE827" fill-opacity="0.35"/>
+<path d="M11.7895 18.9218C11.4758 18.8949 11.1817 18.85 10.9072 18.7872C10.6424 18.7154 10.3973 18.6392 10.1718 18.5584C9.95613 18.4776 9.76496 18.4014 9.59829 18.3296C9.44145 18.2488 9.32378 18.186 9.24536 18.1412L9.87771 16.9567C9.94631 17.0016 10.064 17.0644 10.2306 17.1452C10.3973 17.2259 10.5836 17.3111 10.7895 17.4009C11.0052 17.4816 11.2257 17.5534 11.4513 17.6162C11.6768 17.679 11.8875 17.7105 12.0836 17.7105C13.064 17.7105 13.5542 17.3381 13.5542 16.5933C13.5542 16.4138 13.5199 16.2658 13.4512 16.1492C13.3925 16.0325 13.2993 15.9338 13.1719 15.853C13.0542 15.7633 12.9071 15.687 12.7307 15.6242C12.564 15.5525 12.3729 15.4806 12.1571 15.4089C11.7453 15.2653 11.3777 15.1172 11.0542 14.9647C10.7405 14.8032 10.4708 14.6237 10.2454 14.4263C10.0199 14.2289 9.8483 14.0046 9.73063 13.7534C9.61303 13.5021 9.5542 13.2149 9.5542 12.8919C9.5542 12.6407 9.60812 12.3984 9.71596 12.1651C9.82379 11.9318 9.97572 11.7254 10.1718 11.546C10.3679 11.3576 10.6032 11.2005 10.8777 11.0749C11.1522 10.9403 11.4562 10.8461 11.7895 10.7922V8.85742H12.9954V10.7653C13.2503 10.7922 13.4954 10.8326 13.7307 10.8865C13.966 10.9403 14.1767 10.9986 14.363 11.0614C14.5493 11.1242 14.7062 11.1871 14.8336 11.2499C14.9709 11.3037 15.0689 11.3441 15.1278 11.371L14.5395 12.4747C14.4611 12.4388 14.3483 12.3939 14.2012 12.3401C14.064 12.2773 13.9072 12.2144 13.7307 12.1517C13.5542 12.0888 13.363 12.035 13.1571 11.9901C12.9513 11.9453 12.7454 11.9228 12.5395 11.9228C12.2062 11.9228 11.9071 11.9856 11.6424 12.1112C11.3875 12.2279 11.2601 12.4298 11.2601 12.7169C11.2601 12.8964 11.2944 13.058 11.363 13.2015C11.4414 13.3361 11.5493 13.4573 11.6865 13.5649C11.8336 13.6726 12.0101 13.7758 12.2159 13.8745C12.4316 13.9642 12.6768 14.054 12.9513 14.1437C13.314 14.2782 13.6376 14.4173 13.9218 14.5609C14.2062 14.7045 14.4463 14.866 14.6424 15.0455C14.8385 15.2249 14.9856 15.4313 15.0836 15.6646C15.1914 15.8979 15.2454 16.1715 15.2454 16.4856C15.2454 16.7548 15.1964 17.015 15.0983 17.2662C15.0101 17.5175 14.8679 17.7508 14.6718 17.9661C14.4856 18.1815 14.2503 18.3699 13.966 18.5315C13.6915 18.684 13.3679 18.7962 12.9954 18.8679V20.8574H11.7895V18.9218Z" fill="#0EE827"/>
 <defs>
-<filter id="filter0_d" x="78" y="86" width="868" height="868" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-<feFlood flood-opacity="0" result="BackgroundImageFix"/>
-<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/>
-<feMorphology radius="2" operator="dilate" in="SourceAlpha" result="effect1_dropShadow"/>
-<feOffset dy="8"/>
-<feGaussianBlur stdDeviation="10"/>
-<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
-<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow"/>
-<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow" result="shape"/>
-</filter>
-<linearGradient id="paint0_linear" x1="512" y1="100" x2="512" y2="924" gradientUnits="userSpaceOnUse">
+<linearGradient id="paint0_linear_5437_79079" x1="20" y1="4" x2="20" y2="36" gradientUnits="userSpaceOnUse">
 <stop stop-color="#D4E6E8"/>
 <stop offset="1" stop-color="#767573"/>
 </linearGradient>
--- a/packages/ui/src/assets/icons/app/powershell.svg
+++ b/packages/ui/src/assets/icons/app/powershell.svg
@@ -1 +1,14 @@
-<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 128 128"><linearGradient id="powershell__a" x1="96.306" x2="25.454" y1="35.144" y2="98.431" gradientTransform="matrix(1 0 0 -1 0 128)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a9c8ff"/><stop offset="1" stop-color="#c7e6ff"/></linearGradient><path fill="url(#powershell__a)" fill-rule="evenodd" d="M7.2 110.5c-1.7 0-3.1-.7-4.1-1.9-1-1.2-1.3-2.9-.9-4.6l18.6-80.5c.8-3.4 4-6 7.4-6h92.6c1.7 0 3.1.7 4.1 1.9 1 1.2 1.3 2.9.9 4.6l-18.6 80.5c-.8 3.4-4 6-7.4 6H7.2z" clip-rule="evenodd" opacity=".8"/><linearGradient id="powershell__b" x1="25.336" x2="94.569" y1="98.33" y2="36.847" gradientTransform="matrix(1 0 0 -1 0 128)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#2d4664"/><stop offset=".169" stop-color="#29405b"/><stop offset=".445" stop-color="#1e2f43"/><stop offset=".79" stop-color="#0c131b"/><stop offset="1"/></linearGradient><path fill="url(#powershell__b)" fill-rule="evenodd" d="M120.3 18.5H28.5c-2.9 0-5.7 2.3-6.4 5.2L3.7 104.3c-.7 2.9 1.1 5.2 4 5.2h91.8c2.9 0 5.7-2.3 6.4-5.2l18.4-80.5c.7-2.9-1.1-5.3-4-5.3z" clip-rule="evenodd"/><path fill="#2C5591" fill-rule="evenodd" d="M64.2 88.3h22.3c2.6 0 4.7 2.2 4.7 4.9s-2.1 4.9-4.7 4.9H64.2c-2.6 0-4.7-2.2-4.7-4.9s2.1-4.9 4.7-4.9zM78.7 66.5c-.4.8-1.2 1.6-2.6 2.6L34.6 98.9c-2.3 1.6-5.5 1-7.3-1.4-1.7-2.4-1.3-5.7.9-7.3l37.4-27.1v-.6l-23.5-25c-1.9-2-1.7-5.3.4-7.4 2.2-2 5.5-2 7.4 0l28.2 30c1.7 1.9 1.8 4.5.6 6.4z" clip-rule="evenodd"/><path fill="#FFF" fill-rule="evenodd" d="M77.6 65.5c-.4.8-1.2 1.6-2.6 2.6L33.6 97.9c-2.3 1.6-5.5 1-7.3-1.4-1.7-2.4-1.3-5.7.9-7.3l37.4-27.1v-.6l-23.5-25c-1.9-2-1.7-5.3.4-7.4 2.2-2 5.5-2 7.4 0l28.2 30c1.7 1.8 1.8 4.4.5 6.4zM63.5 87.8h22.3c2.6 0 4.7 2.1 4.7 4.6 0 2.6-2.1 4.6-4.7 4.6H63.5c-2.6 0-4.7-2.1-4.7-4.6 0-2.6 2.1-4.6 4.7-4.6z" clip-rule="evenodd"/></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M34.9013 7.2002H10.604C9.83641 7.2002 9.09532 7.84723 8.91004 8.66305L4.03999 31.3373C3.85472 32.1532 4.33113 32.8002 5.0987 32.8002H29.396C30.1636 32.8002 30.9047 32.1532 31.09 31.3373L35.96 8.69118C36.1453 7.87536 35.6689 7.2002 34.9013 7.2002Z" fill="url(#paint0_linear_5437_79143)"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M19.7489 26.5009H25.2421C25.8826 26.5009 26.3999 27.0942 26.3999 27.8223C26.3999 28.5505 25.8826 29.1438 25.2421 29.1438H19.7489C19.1085 29.1438 18.5912 28.5505 18.5912 27.8223C18.5912 27.0942 19.1085 26.5009 19.7489 26.5009ZM23.3208 20.6216C23.2222 20.8374 23.0252 21.0531 22.6803 21.3228L12.4575 29.3596C11.8909 29.7911 11.1027 29.6293 10.6593 28.982C10.2405 28.3347 10.339 27.4448 10.881 27.0133L20.0938 19.7047V19.5429L14.305 12.8006C13.837 12.2612 13.8862 11.3713 14.4035 10.8049C14.9455 10.2655 15.7584 10.2655 16.2264 10.8049L23.173 18.8956C23.5917 19.408 23.6163 20.1092 23.3208 20.6216Z" fill="#2C5591"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M23.2368 20.6216C23.1387 20.8374 22.9426 21.0531 22.5993 21.3228L12.448 29.3596C11.8841 29.7911 11.0994 29.6293 10.6581 28.982C10.2412 28.3347 10.3393 27.4448 10.8788 27.0133L20.0492 19.7047V19.5429L14.287 12.8006C13.8212 12.2612 13.8702 11.3713 14.3851 10.8049C14.9246 10.2655 15.7337 10.2655 16.1996 10.8049L23.1142 18.8956C23.5311 19.3811 23.5556 20.0822 23.2368 20.6216ZM19.7795 26.6357H25.2475C25.885 26.6357 26.3999 27.202 26.3999 27.8763C26.3999 28.5775 25.885 29.1168 25.2475 29.1168H19.7795C19.142 29.1168 18.6271 28.5505 18.6271 27.8763C18.6271 27.1751 19.142 26.6357 19.7795 26.6357Z" fill="white"/>
+<defs>
+<linearGradient id="paint0_linear_5437_79143" x1="9.76654" y1="10.3425" x2="29.068" y2="26.4694" gradientUnits="userSpaceOnUse">
+<stop stop-color="#2D4664"/>
+<stop offset="0.169" stop-color="#29405B"/>
+<stop offset="0.445" stop-color="#1E2F43"/>
+<stop offset="0.79" stop-color="#0C131B"/>
+<stop offset="1"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/sublimetext.svg
+++ b/packages/ui/src/assets/icons/app/sublimetext.svg
@@ -1 +1,17 @@
-<svg viewBox="0 0 256 332" width="256" height="332" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><defs><linearGradient x1="55.117%" y1="58.68%" x2="63.68%" y2="39.597%" id="sublimetext__a"><stop stop-color="#FF9700" offset="0%"/><stop stop-color="#F48E00" offset="53%"/><stop stop-color="#D06F00" offset="100%"/></linearGradient></defs><path d="M255.288 166.795c0-3.887-2.872-6.128-6.397-5.015L6.397 238.675C2.865 239.796 0 243.86 0 247.74v78.59c0 3.887 2.865 6.135 6.397 5.015l242.494-76.888c3.525-1.12 6.397-5.185 6.397-9.071v-78.59Z" fill="url(#sublimetext__a)"/><path d="M0 164.291c0 3.887 2.865 7.95 6.397 9.071l242.53 76.902c3.531 1.12 6.397-1.127 6.397-5.007V166.66c0-3.88-2.866-7.944-6.397-9.064L6.397 80.694C2.865 79.574 0 81.814 0 85.7v78.59Z" fill="#FF9800"/><path d="M255.288 5.302c0-3.886-2.872-6.135-6.397-5.014L6.397 77.176C2.865 78.296 0 82.36 0 86.247v78.59c0 3.887 2.865 6.128 6.397 5.014l242.494-76.895c3.525-1.12 6.397-5.184 6.397-9.064V5.302Z" fill="#FF9800"/></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5436_78897)">
+<path d="M35.911 20.0773C35.911 19.7026 35.552 19.4866 35.1114 19.5939L4.79962 27.0055C4.35812 27.1135 4 27.5052 4 27.8792V35.4541C4 35.8288 4.35812 36.0455 4.79962 35.9375L35.1114 28.5266C35.552 28.4187 35.911 28.0269 35.911 27.6523V20.0774V20.0773Z" fill="url(#paint0_linear_5436_78897)"/>
+<path d="M4 19.8353C4 20.21 4.35812 20.6016 4.79962 20.7097L35.1159 28.1219C35.5573 28.2299 35.9155 28.0133 35.9155 27.6393V20.0637C35.9155 19.6897 35.5573 19.298 35.1159 19.19L4.79962 11.7778C4.35812 11.6699 4 11.8858 4 12.2603V19.8353V19.8353Z" fill="#FF9800"/>
+<path d="M35.911 4.51106C35.911 4.1365 35.552 3.91973 35.1114 4.02778L4.79962 11.4387C4.35812 11.5466 4 11.9383 4 12.313V19.8879C4 20.2626 4.35812 20.4786 4.79962 20.3712L35.1114 12.9596C35.552 12.8517 35.911 12.46 35.911 12.086V4.51106Z" fill="#FF9800"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_5436_78897" x1="1762.84" y1="981.852" x2="1845.15" y2="624.882" gradientUnits="userSpaceOnUse">
+<stop stop-color="#FF9700"/>
+<stop offset="0.53" stop-color="#F48E00"/>
+<stop offset="1" stop-color="#D06F00"/>
+</linearGradient>
+<clipPath id="clip0_5436_78897">
+<rect width="32" height="32" fill="white" transform="translate(4 4)"/>
+</clipPath>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/terminal.png
+++ b/packages/ui/src/assets/icons/app/terminal.png
--- a/packages/ui/src/assets/icons/app/textmate.png
+++ b/packages/ui/src/assets/icons/app/textmate.png
--- a/packages/ui/src/assets/icons/app/vscode.svg
+++ b/packages/ui/src/assets/icons/app/vscode.svg
@@ -1 +1,39 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 100 100"><mask id="vscode__a" width="100" height="100" x="0" y="0" mask-type="alpha" maskUnits="userSpaceOnUse"><path fill="#fff" fill-rule="evenodd" d="M70.912 99.317a6.223 6.223 0 0 0 4.96-.19l20.589-9.907A6.25 6.25 0 0 0 100 83.587V16.413a6.25 6.25 0 0 0-3.54-5.632L75.874.874a6.226 6.226 0 0 0-7.104 1.21L29.355 38.04 12.187 25.01a4.162 4.162 0 0 0-5.318.236l-5.506 5.009a4.168 4.168 0 0 0-.004 6.162L16.247 50 1.36 63.583a4.168 4.168 0 0 0 .004 6.162l5.506 5.01a4.162 4.162 0 0 0 5.318.236l17.168-13.032L68.77 97.917a6.217 6.217 0 0 0 2.143 1.4ZM75.015 27.3 45.11 50l29.906 22.701V27.3Z" clip-rule="evenodd"/></mask><g mask="url(#vscode__a)"><path fill="#0065A9" d="M96.461 10.796 75.857.876a6.23 6.23 0 0 0-7.107 1.207l-67.451 61.5a4.167 4.167 0 0 0 .004 6.162l5.51 5.009a4.167 4.167 0 0 0 5.32.236l81.228-61.62c2.725-2.067 6.639-.124 6.639 3.297v-.24a6.25 6.25 0 0 0-3.539-5.63Z"/><g filter="url(#vscode__b)"><path fill="#007ACC" d="m96.461 89.204-20.604 9.92a6.229 6.229 0 0 1-7.107-1.207l-67.451-61.5a4.167 4.167 0 0 1 .004-6.162l5.51-5.009a4.167 4.167 0 0 1 5.32-.236l81.228 61.62c2.725 2.067 6.639.124 6.639-3.297v.24a6.25 6.25 0 0 1-3.539 5.63Z"/></g><g filter="url(#vscode__c)"><path fill="#1F9CF0" d="M75.858 99.126a6.232 6.232 0 0 1-7.108-1.21c2.306 2.307 6.25.674 6.25-2.588V4.672c0-3.262-3.944-4.895-6.25-2.589a6.232 6.232 0 0 1 7.108-1.21l20.6 9.908A6.25 6.25 0 0 1 100 16.413v67.174a6.25 6.25 0 0 1-3.541 5.633l-20.601 9.906Z"/></g><path fill="url(#vscode__d)" fill-rule="evenodd" d="M70.851 99.317a6.224 6.224 0 0 0 4.96-.19L96.4 89.22a6.25 6.25 0 0 0 3.54-5.633V16.413a6.25 6.25 0 0 0-3.54-5.632L75.812.874a6.226 6.226 0 0 0-7.104 1.21L29.294 38.04 12.126 25.01a4.162 4.162 0 0 0-5.317.236l-5.507 5.009a4.168 4.168 0 0 0-.004 6.162L16.186 50 1.298 63.583a4.168 4.168 0 0 0 .004 6.162l5.507 5.009a4.162 4.162 0 0 0 5.317.236L29.294 61.96l39.414 35.958a6.218 6.218 0 0 0 2.143 1.4ZM74.954 27.3 45.048 50l29.906 22.701V27.3Z" clip-rule="evenodd" opacity=".25" style="mix-blend-mode:overlay"/></g><defs><filter id="vscode__b" width="116.727" height="92.246" x="-8.394" y="15.829" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset/><feGaussianBlur stdDeviation="4.167"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/><feBlend in2="BackgroundImageFix" mode="overlay" result="effect1_dropShadow"/><feBlend in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter><filter id="vscode__c" width="47.917" height="116.151" x="60.417" y="-8.076" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset/><feGaussianBlur stdDeviation="4.167"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/><feBlend in2="BackgroundImageFix" mode="overlay" result="effect1_dropShadow"/><feBlend in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter><linearGradient id="vscode__d" x1="49.939" x2="49.939" y1=".258" y2="99.742" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#fff" stop-opacity="0"/></linearGradient></defs></svg>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_5437_79124" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="5" y="5" width="30" height="30">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M26.0227 34.1285C26.2519 34.2179 26.4969 34.2592 26.7427 34.2497C26.9884 34.2403 27.2296 34.1804 27.4512 34.0738L33.3809 31.2206C33.6863 31.0736 33.9439 30.8433 34.1243 30.5563C34.3046 30.2693 34.4002 29.9372 34.4001 29.5983V10.2522C34.4001 9.91323 34.3044 9.58119 34.1241 9.29424C33.9437 9.00729 33.686 8.77709 33.3806 8.63014L27.4518 5.77692C27.1167 5.6157 26.7398 5.56263 26.3733 5.62507C26.0067 5.6875 25.6687 5.86235 25.4059 6.1254L14.0543 16.4807L9.10994 12.7281C8.88691 12.5587 8.61163 12.4728 8.33186 12.4852C8.05209 12.4976 7.78549 12.6076 7.57835 12.7961L5.99262 14.2387C5.86908 14.3511 5.77035 14.488 5.70276 14.6408C5.63517 14.7935 5.60021 14.9587 5.6001 15.1257C5.59999 15.2928 5.63474 15.458 5.70213 15.6108C5.76952 15.7636 5.86807 15.9007 5.99147 16.0133L10.2792 19.9252L5.99176 23.8371C5.86836 23.9497 5.76981 24.0868 5.70242 24.2396C5.63503 24.3925 5.60028 24.5577 5.60039 24.7247C5.60049 24.8917 5.63546 25.0569 5.70305 25.2097C5.77064 25.3624 5.86936 25.4994 5.99291 25.6118L7.57864 27.0547C7.78578 27.2431 8.05237 27.3531 8.33214 27.3655C8.61191 27.3779 8.8872 27.292 9.11022 27.1226L14.0546 23.3694L25.4059 33.7253C25.5814 33.9011 25.7913 34.0384 26.0227 34.1285ZM27.2044 13.3876L18.5918 19.9252L27.2047 26.4631L27.2044 13.3876Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_5437_79124)">
+<path d="M33.3807 8.6342L27.4467 5.77724C27.1116 5.61588 26.7346 5.56266 26.368 5.62494C26.0013 5.68722 25.663 5.86191 25.3999 6.12486L5.97403 23.8369C5.85059 23.9494 5.75201 24.0865 5.68459 24.2393C5.61718 24.3922 5.58241 24.5574 5.58252 24.7245C5.58263 24.8915 5.61761 25.0567 5.68522 25.2094C5.75284 25.3622 5.8516 25.4991 5.97518 25.6115L7.56206 27.0541C7.76938 27.2425 8.03605 27.3524 8.31587 27.3648C8.59569 27.3772 8.87105 27.2913 9.09422 27.1221L32.4879 9.37551C33.2727 8.78022 34.3999 9.3398 34.3999 10.3251V10.2559C34.3999 9.91713 34.3042 9.58524 34.1239 9.2984C33.9436 9.01157 33.686 8.78145 33.3807 8.63449V8.6342Z" fill="#0065A9"/>
+<g filter="url(#filter0_d_5437_79124)">
+<path d="M33.3807 31.2161L27.4467 34.0731C27.1116 34.2345 26.7346 34.2877 26.3679 34.2255C26.0012 34.1632 25.663 33.9885 25.3999 33.7255L5.97403 16.0135C5.85059 15.9009 5.75201 15.7638 5.68459 15.611C5.61718 15.4582 5.58241 15.2929 5.58252 15.1259C5.58263 14.9588 5.61761 14.7937 5.68522 14.6409C5.75284 14.4882 5.8516 14.3512 5.97518 14.2388L7.56206 12.7962C7.76938 12.6079 8.03605 12.498 8.31587 12.4856C8.59569 12.4731 8.87105 12.559 9.09422 12.7282L32.4879 30.4748C33.2727 31.0701 34.3999 30.5105 34.3999 29.5253V29.5944C34.3999 29.9332 34.3042 30.2651 34.1239 30.5519C33.9436 30.8388 33.686 31.0692 33.3807 31.2161Z" fill="#007ACC"/>
+</g>
+<g filter="url(#filter1_d_5437_79124)">
+<path d="M27.447 34.0738C27.1118 34.235 26.7347 34.2881 26.3679 34.2257C26.0012 34.1633 25.6629 33.9884 25.3999 33.7253C26.064 34.3898 27.1999 33.9194 27.1999 32.98V6.87104C27.1999 5.93159 26.064 5.46128 25.3999 6.12541C25.6629 5.86234 26.0012 5.68749 26.3679 5.62506C26.7347 5.56263 27.1118 5.6157 27.447 5.77693L33.3798 8.63044C33.6853 8.77731 33.9432 9.00748 34.1236 9.29443C34.3041 9.58139 34.3999 9.91347 34.3999 10.2525V29.5986C34.3999 29.9376 34.3042 30.2697 34.1238 30.5567C33.9434 30.8437 33.6856 31.0739 33.3801 31.2209L27.447 34.0738Z" fill="#1F9CF0"/>
+</g>
+<path opacity="0.25" fill-rule="evenodd" clip-rule="evenodd" d="M26.0052 34.1285C26.2343 34.2179 26.4793 34.2591 26.7251 34.2497C26.9709 34.2403 27.212 34.1804 27.4336 34.0738L33.3633 31.2206C33.6687 31.0736 33.9265 30.8434 34.1068 30.5564C34.2872 30.2694 34.3829 29.9372 34.3828 29.5983V10.2522C34.3828 9.91323 34.2871 9.58119 34.1068 9.29424C33.9264 9.00729 33.6687 8.77709 33.3633 8.63014L27.4339 5.77692C27.0989 5.6157 26.722 5.56263 26.3554 5.62507C25.9889 5.6875 25.6508 5.86235 25.388 6.1254L14.0367 16.4807L9.09236 12.7281C8.86936 12.5588 8.59413 12.4729 8.31442 12.4853C8.03472 12.4977 7.76818 12.6077 7.56106 12.7961L5.97504 14.2387C5.8515 14.3511 5.75277 14.488 5.68518 14.6408C5.6176 14.7935 5.58263 14.9587 5.58252 15.1257C5.58241 15.2928 5.61716 15.458 5.68456 15.6108C5.75195 15.7636 5.85049 15.9007 5.97389 16.0133L10.2616 19.9252L5.97389 23.8371C5.85049 23.9497 5.75195 24.0868 5.68456 24.2396C5.61716 24.3925 5.58241 24.5577 5.58252 24.7247C5.58263 24.8917 5.6176 25.0569 5.68518 25.2097C5.75277 25.3624 5.8515 25.4994 5.97504 25.6118L7.56106 27.0544C7.76818 27.2428 8.03472 27.3527 8.31442 27.3651C8.59413 27.3775 8.86936 27.2916 9.09236 27.1223L14.0367 23.3697L25.388 33.7256C25.5635 33.9014 25.7737 34.0384 26.0052 34.1285ZM27.1868 13.3876L18.5739 19.9252L27.1868 26.4631V13.3876Z" fill="url(#paint0_linear_5437_79124)" style="mix-blend-mode:overlay"/>
+</g>
+<defs>
+<filter id="filter0_d_5437_79124" x="-7.75188" y="-0.850024" width="55.4862" height="48.4354" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset/>
+<feGaussianBlur stdDeviation="6.6672"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="overlay" in2="BackgroundImageFix" result="effect1_dropShadow_5437_79124"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_5437_79124" result="shape"/>
+</filter>
+<filter id="filter1_d_5437_79124" x="12.0655" y="-7.73479" width="35.6688" height="55.3202" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset/>
+<feGaussianBlur stdDeviation="6.6672"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
+<feBlend mode="overlay" in2="BackgroundImageFix" result="effect1_dropShadow_5437_79124"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_5437_79124" result="shape"/>
+</filter>
+<linearGradient id="paint0_linear_5437_79124" x1="19.9825" y1="5.59951" x2="19.9825" y2="34.2509" gradientUnits="userSpaceOnUse">
+<stop stop-color="white"/>
+<stop offset="1" stop-color="white" stop-opacity="0"/>
+</linearGradient>
+</defs>
+</svg>
--- a/packages/ui/src/assets/icons/app/warp.png
+++ b/packages/ui/src/assets/icons/app/warp.png
--- a/packages/ui/src/assets/icons/app/xcode.png
+++ b/packages/ui/src/assets/icons/app/xcode.png
--- a/packages/ui/src/assets/icons/app/zed-dark.svg
+++ b/packages/ui/src/assets/icons/app/zed-dark.svg
@@ -1,15 +1,15 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" fill="none" viewBox="0 0 96 96">
-  <g clip-path="url(#zed_logo-dark-a)">
-    <path
-      fill="#fff"
-      fill-rule="evenodd"
-      d="M9 6a3 3 0 0 0-3 3v66H0V9a9 9 0 0 1 9-9h80.379c4.009 0 6.016 4.847 3.182 7.682L43.055 57.187H57V51h6v7.688a4.5 4.5 0 0 1-4.5 4.5H37.055L26.743 73.5H73.5V36h6v37.5a6 6 0 0 1-6 6H20.743L10.243 90H87a3 3 0 0 0 3-3V21h6v66a9 9 0 0 1-9 9H6.621c-4.009 0-6.016-4.847-3.182-7.682L52.757 39H39v6h-6v-7.5a4.5 4.5 0 0 1 4.5-4.5h21.257l10.5-10.5H22.5V60h-6V22.5a6 6 0 0 1 6-6h52.757L85.757 6H9Z"
-      clip-rule="evenodd"
-    />
-  </g>
-  <defs>
-    <clipPath id="zed_logo-dark-a">
-      <path fill="#fff" d="M0 0h96v96H0z" />
-    </clipPath>
-  </defs>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5437_79100)">
+<mask id="mask0_5437_79100" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="5" y="5" width="30" height="30">
+<path d="M5.6001 5.59961H34.4001V34.3996H5.6001V5.59961Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_5437_79100)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.3001 7.39961C8.0614 7.39961 7.83248 7.49443 7.6637 7.66321C7.49492 7.832 7.4001 8.06091 7.4001 8.29961V28.0996H5.6001V8.29961C5.6001 7.58352 5.88456 6.89677 6.39091 6.39042C6.89726 5.88407 7.58401 5.59961 8.3001 5.59961H32.4138C33.6165 5.59961 34.2186 7.05371 33.3684 7.90421L18.5166 22.7557H22.7001V20.8996H24.5001V23.206C24.5001 23.5641 24.3579 23.9074 24.1047 24.1606C23.8515 24.4138 23.5081 24.556 23.1501 24.556H16.7166L13.623 27.6496H27.6501V16.3996H29.4501V27.6496C29.4501 28.127 29.2605 28.5848 28.9229 28.9224C28.5853 29.26 28.1275 29.4496 27.6501 29.4496H11.823L8.673 32.5996H31.7001C31.9388 32.5996 32.1677 32.5048 32.3365 32.336C32.5053 32.1672 32.6001 31.9383 32.6001 31.6996V11.8996H34.4001V31.6996C34.4001 32.4157 34.1156 33.1024 33.6093 33.6088C33.1029 34.1151 32.4162 34.3996 31.7001 34.3996H7.5864C6.3837 34.3996 5.7816 32.9455 6.6318 32.095L21.4272 17.2996H17.3001V19.0996H15.5001V16.8496C15.5001 16.4916 15.6423 16.1482 15.8955 15.895C16.1487 15.6418 16.4921 15.4996 16.8501 15.4996H23.2272L26.3772 12.3496H12.3501V23.5996H10.5501V12.3496C10.5501 11.8722 10.7397 11.4144 11.0773 11.0768C11.4149 10.7393 11.8727 10.5496 12.3501 10.5496H28.1772L31.3272 7.39961H8.3001Z" fill="white"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_5437_79100">
+<rect width="28.8" height="28.8" fill="white" transform="translate(5.6001 5.59961)"/>
+</clipPath>
+</defs>
 </svg>
--- a/packages/ui/src/assets/icons/app/zed.svg
+++ b/packages/ui/src/assets/icons/app/zed.svg
@@ -1,15 +1,15 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="96" height="96" fill="none" viewBox="0 0 96 96">
-  <g clip-path="url(#zed_logo-a)">
-    <path
-      fill="#000"
-      fill-rule="evenodd"
-      d="M9 6a3 3 0 0 0-3 3v66H0V9a9 9 0 0 1 9-9h80.379c4.009 0 6.016 4.847 3.182 7.682L43.055 57.187H57V51h6v7.688a4.5 4.5 0 0 1-4.5 4.5H37.055L26.743 73.5H73.5V36h6v37.5a6 6 0 0 1-6 6H20.743L10.243 90H87a3 3 0 0 0 3-3V21h6v66a9 9 0 0 1-9 9H6.621c-4.009 0-6.016-4.847-3.182-7.682L52.757 39H39v6h-6v-7.5a4.5 4.5 0 0 1 4.5-4.5h21.257l10.5-10.5H22.5V60h-6V22.5a6 6 0 0 1 6-6h52.757L85.757 6H9Z"
-      clip-rule="evenodd"
-    />
-  </g>
-  <defs>
-    <clipPath id="zed_logo-a">
-      <path fill="#fff" d="M0 0h96v96H0z" />
-    </clipPath>
-  </defs>
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_5437_79109)">
+<mask id="mask0_5437_79109" style="mask-type:luminance" maskUnits="userSpaceOnUse" x="5" y="5" width="30" height="30">
+<path d="M5.6001 5.59961H34.4001V34.3996H5.6001V5.59961Z" fill="white"/>
+</mask>
+<g mask="url(#mask0_5437_79109)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.3001 7.39961C8.0614 7.39961 7.83248 7.49443 7.6637 7.66321C7.49492 7.832 7.4001 8.06091 7.4001 8.29961V28.0996H5.6001V8.29961C5.6001 7.58352 5.88456 6.89677 6.39091 6.39042C6.89726 5.88407 7.58401 5.59961 8.3001 5.59961H32.4138C33.6165 5.59961 34.2186 7.05371 33.3684 7.90421L18.5166 22.7557H22.7001V20.8996H24.5001V23.206C24.5001 23.5641 24.3579 23.9074 24.1047 24.1606C23.8515 24.4138 23.5081 24.556 23.1501 24.556H16.7166L13.623 27.6496H27.6501V16.3996H29.4501V27.6496C29.4501 28.127 29.2605 28.5848 28.9229 28.9224C28.5853 29.26 28.1275 29.4496 27.6501 29.4496H11.823L8.673 32.5996H31.7001C31.9388 32.5996 32.1677 32.5048 32.3365 32.336C32.5053 32.1672 32.6001 31.9383 32.6001 31.6996V11.8996H34.4001V31.6996C34.4001 32.4157 34.1156 33.1024 33.6093 33.6088C33.1029 34.1151 32.4162 34.3996 31.7001 34.3996H7.5864C6.3837 34.3996 5.7816 32.9455 6.6318 32.095L21.4272 17.2996H17.3001V19.0996H15.5001V16.8496C15.5001 16.4916 15.6423 16.1482 15.8955 15.895C16.1487 15.6418 16.4921 15.4996 16.8501 15.4996H23.2272L26.3772 12.3496H12.3501V23.5996H10.5501V12.3496C10.5501 11.8722 10.7397 11.4144 11.0773 11.0768C11.4149 10.7393 11.8727 10.5496 12.3501 10.5496H28.1772L31.3272 7.39961H8.3001Z" fill="black"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_5437_79109">
+<rect width="28.8" height="28.8" fill="white" transform="translate(5.6001 5.59961)"/>
+</clipPath>
+</defs>
 </svg>
--- a/packages/ui/src/components/button.css
+++ b/packages/ui/src/components/button.css
@@ -180,3 +180,15 @@
 [data-component="button"].titlebar-icon[data-variant="ghost"][aria-expanded="true"]:hover:not(:disabled) {
  background-color: var(--surface-base-active);
 }
+
+[data-component="button"].titlebar-icon[data-variant="ghost"][aria-current="page"] {
+  background-color: var(--surface-base-active);
+}
+
+[data-component="button"].titlebar-icon[data-variant="ghost"][aria-current="page"] [data-slot="icon-svg"] {
+  color: var(--icon-strong-base);
+}
+
+[data-component="button"].titlebar-icon[data-variant="ghost"][aria-current="page"]:hover:not(:disabled) {
+  background-color: var(--surface-base-active);
+}
--- a/packages/ui/src/components/dialog.css
+++ b/packages/ui/src/components/dialog.css
@@ -16,6 +16,11 @@
  justify-content: center;
  pointer-events: none;

+  &[data-position="top"] {
+    align-items: flex-start;
+    padding-top: var(--dialog-top, 16px);
+  }
+
  [data-slot="dialog-container"] {
    position: relative;
    z-index: 50;
--- a/packages/ui/src/components/dialog.tsx
+++ b/packages/ui/src/components/dialog.tsx
@@ -8,6 +8,8 @@ export interface DialogProps extends ParentProps {
  description?: JSXElement
  action?: JSXElement
  size?: "normal" | "large" | "x-large"
+  position?: "center" | "top"
+  style?: ComponentProps<"div">["style"]
  class?: ComponentProps<"div">["class"]
  classList?: ComponentProps<"div">["classList"]
  fit?: boolean
@@ -21,7 +23,9 @@ export function Dialog(props: DialogProps) {
      data-component="dialog"
      data-fit={props.fit ? true : undefined}
      data-size={props.size || "normal"}
+      data-position={props.position && props.position !== "center" ? props.position : undefined}
      data-transition={props.transition ? true : undefined}
+      style={props.style}
    >
      <div data-slot="dialog-container">
        <Kobalte.Content
--- a/packages/ui/src/components/dropdown-menu.css
+++ b/packages/ui/src/components/dropdown-menu.css
@@ -58,6 +58,11 @@
    }
  }

+  [data-slot="dropdown-menu-checkbox-item"],
+  [data-slot="dropdown-menu-radio-item"] {
+    padding-right: 28px;
+  }
+
  [data-slot="dropdown-menu-sub-trigger"] {
    &[data-expanded] {
      background: var(--surface-raised-base-hover);
@@ -70,6 +75,10 @@
    justify-content: center;
    width: 16px;
    height: 16px;
+    position: absolute;
+    right: 8px;
+    top: 50%;
+    transform: translateY(-50%);
  }

  [data-slot="dropdown-menu-item-label"] {
@@ -88,6 +97,7 @@
  }

  [data-slot="dropdown-menu-group-label"] {
+    display: block;
    padding: 4px 8px;
    font-family: var(--font-family-sans);
    font-size: var(--font-size-x-small);
--- a/packages/ui/src/components/icon.tsx
+++ b/packages/ui/src/components/icon.tsx
@@ -22,6 +22,12 @@ const icons = {
  "close-small": `<path d="M6 6L14 14M14 6L6 14" stroke="currentColor" stroke-linecap="square"/>`,
  checklist: `<path d="M9.58342 13.7498H17.0834M9.58342 6.24984H17.0834M2.91675 6.6665L4.58341 7.9165L7.08341 4.1665M2.91675 14.1665L4.58341 15.4165L7.08341 11.6665" stroke="currentColor" stroke-linecap="square"/>`,
  console: `<path d="M3.75 5.4165L8.33333 9.99984L3.75 14.5832M10.4167 14.5832H16.25" stroke="currentColor" stroke-linecap="square"/>`,
+  terminal: `<path d="M6.5 8L8.64286 10L6.5 12M10.9286 12H13.5M2 18H18V2H2V18Z" stroke="currentColor" stroke-linecap="square"/>`,
+  "terminal-active": `<path d="M2 18H18V2H2V18Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M6.5 8L8.64286 10L6.5 12M10.9286 12H13.5M2 18H18V2H2V18Z" stroke="currentColor" stroke-linecap="square"/>`,
+  review: `<path d="M7 14.5H13M7 7.99512H10.0049M10.0049 7.99512H13M10.0049 7.99512V5M10.0049 7.99512V11M18 18V2L2 2L2 18H18Z" stroke="currentColor"/>`,
+  "review-active": `<path d="M18 18V2L2 2L2 18H18Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M7 14.5H13M7 7.99512H10.0049M10.0049 7.99512H13M10.0049 7.99512V5M10.0049 7.99512V11M18 18V2L2 2L2 18H18Z" stroke="currentColor"/>`,
  expand: `<path d="M4.58301 10.4163V15.4163H9.58301M10.4163 4.58301H15.4163V9.58301" stroke="currentColor" stroke-linecap="square"/>`,
  collapse: `<path d="M16.666 8.33398H11.666V3.33398" stroke="currentColor" stroke-linecap="square"/><path d="M8.33398 16.666V11.666H3.33398" stroke="currentColor" stroke-linecap="square"/>`,
  code: `<path d="M8.7513 7.5013L6.2513 10.0013L8.7513 12.5013M11.2513 7.5013L13.7513 10.0013L11.2513 12.5013M2.91797 2.91797H17.0846V17.0846H2.91797V2.91797Z" stroke="currentColor"/>`,
@@ -31,12 +37,15 @@ const icons = {
  eye: `<path d="M10 4.58325C5.83333 4.58325 2.5 9.99992 2.5 9.99992C2.5 9.99992 5.83333 15.4166 10 15.4166C14.1667 15.4166 17.5 9.99992 17.5 9.99992C17.5 9.99992 14.1667 4.58325 10 4.58325Z" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round"/><circle cx="10" cy="10" r="2.5" stroke="currentColor"/>`,
  enter: `<path d="M5.83333 15.8334L2.5 12.5L5.83333 9.16671M3.33333 12.5H17.9167V4.58337H10" stroke="currentColor" stroke-linecap="square"/>`,
  folder: `<path d="M2.08301 2.91675V16.2501H17.9163V5.41675H9.99967L8.33301 2.91675H2.08301Z" stroke="currentColor" stroke-linecap="round"/>`,
-  "file-tree": `<path d="M4.58203 16.6693L6.66536 9.58594H17.082M4.58203 16.6693H16.457L18.5404 9.58594H17.082M4.58203 16.6693H2.08203V3.33594H8.33203L9.9987 5.83594H17.082V9.58594" stroke="currentColor" stroke-linecap="round"/>`,
-  "file-tree-active": `<path d="M6.66536 9.58594L4.58203 16.6693H16.457L18.5404 9.58594H17.082H6.66536Z" fill="currentColor" fill-opacity="16%"/><path d="M4.58203 16.6693L6.66536 9.58594H17.082M4.58203 16.6693H16.457L18.5404 9.58594H17.082M4.58203 16.6693H2.08203V3.33594H8.33203L9.9987 5.83594H17.082V9.58594" stroke="currentColor" stroke-linecap="round"/>`,
+  "file-tree": `<path d="M18 18V5H9.5L7.5 2H2L2 18H5M18 18H5M18 18V8.5H5V18" stroke="currentColor" stroke-linecap="square"/>`,
+  "file-tree-active": `<path d="M2 2L2 18H5L6.5 8.5H18V5H9.5L7.5 2H2Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M5 18H18L19.5 8.5H18M5 18H2L2 2H7.5L9.5 5H18V8.5M5 18L6.5 8.5H18" stroke="currentColor" stroke-linecap="square"/>`,
  "magnifying-glass": `<path d="M13 13L10.6418 10.6418M11.9552 7.47761C11.9552 9.95053 9.95053 11.9552 7.47761 11.9552C5.0047 11.9552 3 9.95053 3 7.47761C3 5.0047 5.0047 3 7.47761 3C9.95053 3 11.9552 5.0047 11.9552 7.47761Z" stroke="currentColor" stroke-linecap="square" vector-effect="non-scaling-stroke"/>`,
  "plus-small": `<path d="M9.99984 5.41699V10.0003M9.99984 10.0003V14.5837M9.99984 10.0003H5.4165M9.99984 10.0003H14.5832" stroke="currentColor" stroke-linecap="square"/>`,
  plus: `<path d="M9.9987 2.20703V9.9987M9.9987 9.9987V17.7904M9.9987 9.9987H2.20703M9.9987 9.9987H17.7904" stroke="currentColor" stroke-linecap="square"/>`,
-  "new-session": `<path d="M17.0827 17.0807V17.5807H17.5827V17.0807H17.0827ZM2.91602 17.0807H2.41602L2.41602 17.5807H2.91602L2.91602 17.0807ZM2.91602 2.91406V2.41406H2.41602V2.91406H2.91602ZM9.58268 3.41406H10.0827V2.41406L9.58268 2.41406V2.91406V3.41406ZM17.5827 10.4141V9.91406L16.5827 9.91406V10.4141H17.0827H17.5827ZM6.24935 11.2474L5.8958 10.8938L5.74935 11.0403V11.2474H6.24935ZM6.24935 13.7474H5.74935V14.2474H6.24935V13.7474ZM8.74935 13.7474V14.2474H8.95646L9.1029 14.101L8.74935 13.7474ZM15.2077 2.28906L15.5612 1.93551L15.2077 1.58196L14.8541 1.93551L15.2077 2.28906ZM17.7077 4.78906L18.0612 5.14262L18.4148 4.78906L18.0612 4.43551L17.7077 4.78906ZM17.0827 17.0807V16.5807H2.91602V17.0807L2.91602 17.5807H17.0827V17.0807ZM2.91602 17.0807H3.41602L3.41602 2.91406H2.91602H2.41602L2.41602 17.0807H2.91602ZM2.91602 2.91406V3.41406L9.58268 3.41406V2.91406V2.41406L2.91602 2.41406V2.91406ZM17.0827 10.4141H16.5827V17.0807H17.0827H17.5827V10.4141H17.0827ZM6.24935 11.2474H5.74935V13.7474H6.24935H6.74935V11.2474H6.24935ZM6.24935 13.7474V14.2474L8.74935 14.2474V13.7474V13.2474L6.24935 13.2474V13.7474ZM6.24935 11.2474L6.6029 11.6009L15.5612 2.64262L15.2077 2.28906L14.8541 1.93551L5.8958 10.8938L6.24935 11.2474ZM15.2077 2.28906L14.8541 2.64262L17.3541 5.14262L17.7077 4.78906L18.0612 4.43551L15.5612 1.93551L15.2077 2.28906ZM17.7077 4.78906L17.3541 4.43551L8.3958 13.3938L8.74935 13.7474L9.1029 14.101L18.0612 5.14262L17.7077 4.78906Z" fill="currentColor"/>`,
+  "new-session": `<path d="M12 2H2V18H18V8M6 11.3818V14H8.61818L18 4.61818L15.3818 2L6 11.3818Z" stroke="currentColor"/>`,
+  "new-session-active": `<path d="M6 11.3818V14H8.61818L18 4.61818L15.3818 2L6 11.3818Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M12 2H2V18H18V8M6 11.3818V14H8.61818L18 4.61818L15.3818 2L6 11.3818Z" stroke="currentColor"/>`,
  "pencil-line": `<path d="M9.58301 17.9166H17.9163M17.9163 5.83325L14.1663 2.08325L2.08301 14.1666V17.9166H5.83301L17.9163 5.83325Z" stroke="currentColor" stroke-linecap="square"/>`,
  mcp: `<g><path d="M0.972656 9.37176L9.5214 1.60019C10.7018 0.527151 12.6155 0.527151 13.7957 1.60019C14.9761 2.67321 14.9761 4.41295 13.7957 5.48599L7.3397 11.3552" stroke="currentColor" stroke-linecap="round"/><path d="M7.42871 11.2747L13.7957 5.48643C14.9761 4.41338 16.8898 4.41338 18.0702 5.48643L18.1147 5.52688C19.2951 6.59993 19.2951 8.33966 18.1147 9.4127L10.3831 16.4414C9.98966 16.7991 9.98966 17.379 10.3831 17.7366L11.9707 19.1799" stroke="currentColor" stroke-linecap="round"/><path d="M11.6587 3.54346L5.33619 9.29119C4.15584 10.3642 4.15584 12.1039 5.33619 13.177C6.51649 14.25 8.43019 14.25 9.61054 13.177L15.9331 7.42923" stroke="currentColor" stroke-linecap="round"/></g>`,
  glasses: `<path d="M0.416626 7.91667H1.66663M19.5833 7.91667H18.3333M11.866 7.57987C11.3165 7.26398 10.6793 7.08333 9.99996 7.08333C9.32061 7.08333 8.68344 7.26398 8.13389 7.57987M8.74996 10C8.74996 12.0711 7.07103 13.75 4.99996 13.75C2.92889 13.75 1.24996 12.0711 1.24996 10C1.24996 7.92893 2.92889 6.25 4.99996 6.25C7.07103 6.25 8.74996 7.92893 8.74996 10ZM18.75 10C18.75 12.0711 17.071 13.75 15 13.75C12.9289 13.75 11.25 12.0711 11.25 10C11.25 7.92893 12.9289 6.25 15 6.25C17.071 6.25 18.75 7.92893 18.75 10Z" stroke="currentColor" stroke-linecap="square"/>`,
@@ -44,6 +53,13 @@ const icons = {
  "window-cursor": `<path d="M17.9166 10.4167V3.75H2.08325V17.0833H10.4166M17.9166 13.5897L11.6666 11.6667L13.5897 17.9167L15.032 15.0321L17.9166 13.5897Z" stroke="currentColor" stroke-width="1.07143" stroke-linecap="square"/><path d="M5.00024 6.125C5.29925 6.12518 5.54126 6.36795 5.54126 6.66699C5.54108 6.96589 5.29914 7.20783 5.00024 7.20801C4.7012 7.20801 4.45843 6.966 4.45825 6.66699C4.45825 6.36784 4.70109 6.125 5.00024 6.125ZM7.91626 6.125C8.21541 6.125 8.45825 6.36784 8.45825 6.66699C8.45808 6.966 8.21531 7.20801 7.91626 7.20801C7.61736 7.20783 7.37542 6.96589 7.37524 6.66699C7.37524 6.36795 7.61726 6.12518 7.91626 6.125ZM10.8333 6.125C11.1324 6.125 11.3752 6.36784 11.3752 6.66699C11.3751 6.966 11.1323 7.20801 10.8333 7.20801C10.5342 7.20801 10.2914 6.966 10.2913 6.66699C10.2913 6.36784 10.5341 6.125 10.8333 6.125Z" fill="currentColor" stroke="currentColor" stroke-width="0.25" stroke-linecap="square"/>`,
  task: `<path d="M9.99992 2.0835V17.9168M7.08325 3.75016H2.08325V16.2502H7.08325M12.9166 16.2502H17.9166V3.75016H12.9166" stroke="currentColor" stroke-linecap="square"/>`,
  stop: `<rect x="5" y="5" width="10" height="10" fill="currentColor"/>`,
+  status: `<path d="M2 10V18H18V10M2 10V2H18V10M2 10H18M5 6H9M5 14H9" stroke="currentColor"/>`,
+  "status-active": `<path d="M18 2H2V10H18V2Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M2 18H18V10H2V18Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M2 10V18H18V10M2 10V2H18V10M2 10H18M5 6H9M5 14H9" stroke="currentColor"/>`,
+  sidebar: `<path d="M7.86667 2H5.2H2V18H5.2H7.86667M7.86667 2H18V18H7.86667M7.86667 2V18" stroke="currentColor"/>`,
+  "sidebar-active": `<path d="M2 2V18H5.2H7.86667V2H5.2H2Z" fill="currentColor" fill-opacity="0.1"/>
+<path d="M7.86667 2H5.2H2V18H5.2H7.86667M7.86667 2H18V18H7.86667M7.86667 2V18" stroke="currentColor"/>`,
  "layout-left": `<path d="M2.91675 2.91699L2.91675 2.41699L2.41675 2.41699L2.41675 2.91699L2.91675 2.91699ZM17.0834 2.91699L17.5834 2.91699L17.5834 2.41699L17.0834 2.41699L17.0834 2.91699ZM17.0834 17.0837L17.0834 17.5837L17.5834 17.5837L17.5834 17.0837L17.0834 17.0837ZM2.91675 17.0837L2.41675 17.0837L2.41675 17.5837L2.91675 17.5837L2.91675 17.0837ZM7.41674 17.0837L7.41674 17.5837L8.41674 17.5837L8.41674 17.0837L7.91674 17.0837L7.41674 17.0837ZM8.41674 2.91699L8.41674 2.41699L7.41674 2.41699L7.41674 2.91699L7.91674 2.91699L8.41674 2.91699ZM2.91675 2.91699L2.91675 3.41699L17.0834 3.41699L17.0834 2.91699L17.0834 2.41699L2.91675 2.41699L2.91675 2.91699ZM17.0834 2.91699L16.5834 2.91699L16.5834 17.0837L17.0834 17.0837L17.5834 17.0837L17.5834 2.91699L17.0834 2.91699ZM17.0834 17.0837L17.0834 16.5837L2.91675 16.5837L2.91675 17.0837L2.91675 17.5837L17.0834 17.5837L17.0834 17.0837ZM2.91675 17.0837L3.41675 17.0837L3.41675 2.91699L2.91675 2.91699L2.41675 2.91699L2.41675 17.0837L2.91675 17.0837ZM7.91674 17.0837L8.41674 17.0837L8.41674 2.91699L7.91674 2.91699L7.41674 2.91699L7.41674 17.0837L7.91674 17.0837Z" fill="currentColor"/>`,
  "layout-left-partial": `<path d="M2.91732 2.91602L7.91732 2.91602L7.91732 17.0827H2.91732L2.91732 2.91602Z" fill="currentColor" fill-opacity="16%" /><path d="M2.91732 2.91602L17.084 2.91602M2.91732 2.91602L2.91732 17.0827M2.91732 2.91602L7.91732 2.91602M17.084 2.91602L17.084 17.0827M17.084 2.91602L7.91732 2.91602M17.084 17.0827L2.91732 17.0827M17.084 17.0827L7.91732 17.0827M2.91732 17.0827H7.91732M7.91732 17.0827L7.91732 2.91602" stroke="currentColor" stroke-linecap="square"/>`,
  "layout-left-full": `<path d="M2.91732 2.91602L7.91732 2.91602L7.91732 17.0827H2.91732L2.91732 2.91602Z" fill="currentColor"/><path d="M2.91732 2.91602L17.084 2.91602M2.91732 2.91602L2.91732 17.0827M2.91732 2.91602L7.91732 2.91602M17.084 2.91602L17.084 17.0827M17.084 2.91602L7.91732 2.91602M17.084 17.0827L2.91732 17.0827M17.084 17.0827L7.91732 17.0827M2.91732 17.0827H7.91732M7.91732 17.0827L7.91732 2.91602" stroke="currentColor" stroke-linecap="square"/>`,
@@ -71,8 +87,8 @@ const icons = {
  server: `<rect x="3.35547" y="1.92969" width="13.2857" height="16.1429" stroke="currentColor"/><rect x="3.35547" y="11.9297" width="13.2857" height="6.14286" stroke="currentColor"/><rect x="12.8555" y="14.2852" width="1.42857" height="1.42857" fill="currentColor"/><rect x="10" y="14.2852" width="1.42857" height="1.42857" fill="currentColor"/>`,
  branch: `<path d="M14.2036 7.19987L14.2079 6.69989L13.2079 6.69132L13.2036 7.1913L13.7036 7.19559L14.2036 7.19987ZM8.14804 5.09032H7.64804C7.64804 5.75797 7.06861 6.34471 6.29619 6.34471V6.84471V7.34471C7.56926 7.34471 8.64804 6.36051 8.64804 5.09032H8.14804ZM6.29619 6.84471V6.34471C5.52376 6.34471 4.94434 5.75797 4.94434 5.09032H4.44434H3.94434C3.94434 6.36051 5.02311 7.34471 6.29619 7.34471V6.84471ZM4.44434 5.09032H4.94434C4.94434 4.42267 5.52376 3.83594 6.29619 3.83594V3.33594V2.83594C5.02311 2.83594 3.94434 3.82013 3.94434 5.09032H4.44434ZM6.29619 3.33594V3.83594C7.06861 3.83594 7.64804 4.42267 7.64804 5.09032H8.14804H8.64804C8.64804 3.82013 7.56926 2.83594 6.29619 2.83594V3.33594ZM8.14804 14.9149H7.64804C7.64804 15.5825 7.06861 16.1693 6.29619 16.1693V16.6693V17.1693C7.56926 17.1693 8.64804 16.1851 8.64804 14.9149H8.14804ZM6.29619 16.6693V16.1693C5.52376 16.1693 4.94434 15.5825 4.94434 14.9149H4.44434H3.94434C3.94434 16.1851 5.02311 17.1693 6.29619 17.1693V16.6693ZM4.44434 14.9149H4.94434C4.94434 14.2472 5.52376 13.6605 6.29619 13.6605V13.1605V12.6605C5.02311 12.6605 3.94434 13.6447 3.94434 14.9149H4.44434ZM6.29619 13.1605V13.6605C7.06861 13.6605 7.64804 14.2472 7.64804 14.9149H8.14804H8.64804C8.64804 13.6447 7.56926 12.6605 6.29619 12.6605V13.1605ZM15.5554 5.09032H15.0554C15.0554 5.75797 14.476 6.34471 13.7036 6.34471V6.84471V7.34471C14.9767 7.34471 16.0554 6.36051 16.0554 5.09032H15.5554ZM13.7036 6.84471V6.34471C12.9312 6.34471 12.3517 5.75797 12.3517 5.09032H11.8517H11.3517C11.3517 6.36051 12.4305 7.34471 13.7036 7.34471V6.84471ZM11.8517 5.09032H12.3517C12.3517 4.42267 12.9312 3.83594 13.7036 3.83594V3.33594V2.83594C12.4305 2.83594 11.3517 3.82013 11.3517 5.09032H11.8517ZM13.7036 3.33594V3.83594C14.476 3.83594 15.0554 4.42267 15.0554 5.09032H15.5554H16.0554C16.0554 3.82013 14.9767 2.83594 13.7036 2.83594V3.33594ZM13.7036 7.19559L13.2036 7.1913L13.1544 12.9277L13.6544 12.932L14.1544 12.9363L14.2036 7.19987L13.7036 7.19559ZM6.29619 6.84471H5.79619V13.1605H6.29619H6.79619V6.84471H6.29619ZM11.6545 14.9149V14.4149H8.14804V14.9149V15.4149H11.6545V14.9149ZM13.6544 12.932L13.1544 12.9277C13.1474 13.7511 12.4779 14.4149 11.6545 14.4149V14.9149V15.4149C13.0269 15.4149 14.1426 14.3086 14.1544 12.9363L13.6544 12.932Z" fill="currentColor"/>`,
  edit: `<path d="M17.0832 17.0807V17.5807H17.5832V17.0807H17.0832ZM2.9165 17.0807H2.4165V17.5807H2.9165V17.0807ZM2.9165 2.91406V2.41406H2.4165V2.91406H2.9165ZM9.58317 3.41406H10.0832V2.41406H9.58317V2.91406V3.41406ZM17.5832 10.4141V9.91406H16.5832V10.4141H17.0832H17.5832ZM6.24984 11.2474L5.89628 10.8938L5.74984 11.0403V11.2474H6.24984ZM6.24984 13.7474H5.74984V14.2474H6.24984V13.7474ZM8.74984 13.7474V14.2474H8.95694L9.10339 14.101L8.74984 13.7474ZM15.2082 2.28906L15.5617 1.93551L15.2082 1.58196L14.8546 1.93551L15.2082 2.28906ZM17.7082 4.78906L18.0617 5.14262L18.4153 4.78906L18.0617 4.43551L17.7082 4.78906ZM17.0832 17.0807V16.5807H2.9165V17.0807V17.5807H17.0832V17.0807ZM2.9165 17.0807H3.4165V2.91406H2.9165H2.4165V17.0807H2.9165ZM2.9165 2.91406V3.41406H9.58317V2.91406V2.41406H2.9165V2.91406ZM17.0832 10.4141H16.5832V17.0807H17.0832H17.5832V10.4141H17.0832ZM6.24984 11.2474H5.74984V13.7474H6.24984H6.74984V11.2474H6.24984ZM6.24984 13.7474V14.2474H8.74984V13.7474V13.2474H6.24984V13.7474ZM6.24984 11.2474L6.60339 11.6009L15.5617 2.64262L15.2082 2.28906L14.8546 1.93551L5.89628 10.8938L6.24984 11.2474ZM15.2082 2.28906L14.8546 2.64262L17.3546 5.14262L17.7082 4.78906L18.0617 4.43551L15.5617 1.93551L15.2082 2.28906ZM17.7082 4.78906L17.3546 4.43551L8.39628 13.3938L8.74984 13.7474L9.10339 14.101L18.0617 5.14262L17.7082 4.78906Z" fill="currentColor"/>`,
-  help: `<path d="M7.91683 7.91927V6.2526H12.0835V8.7526L10.0002 10.0026V12.0859M10.0002 13.7526V13.7609M17.9168 10.0026C17.9168 14.3749 14.3724 17.9193 10.0002 17.9193C5.62791 17.9193 2.0835 14.3749 2.0835 10.0026C2.0835 5.63035 5.62791 2.08594 10.0002 2.08594C14.3724 2.08594 17.9168 5.63035 17.9168 10.0026Z" stroke="currentColor" stroke-linecap="square"/>`,
-  "settings-gear": `<path d="M7.62516 4.46094L5.05225 3.86719L3.86475 5.05469L4.4585 7.6276L2.0835 9.21094V10.7943L4.4585 12.3776L3.86475 14.9505L5.05225 16.138L7.62516 15.5443L9.2085 17.9193H10.7918L12.3752 15.5443L14.9481 16.138L16.1356 14.9505L15.5418 12.3776L17.9168 10.7943V9.21094L15.5418 7.6276L16.1356 5.05469L14.9481 3.86719L12.3752 4.46094L10.7918 2.08594H9.2085L7.62516 4.46094Z" stroke="currentColor"/><path d="M12.5002 10.0026C12.5002 11.3833 11.3809 12.5026 10.0002 12.5026C8.61945 12.5026 7.50016 11.3833 7.50016 10.0026C7.50016 8.62189 8.61945 7.5026 10.0002 7.5026C11.3809 7.5026 12.5002 8.62189 12.5002 10.0026Z" stroke="currentColor"/>`,
+  help: `<path d="M17 10C17 6.13401 13.866 3 10 3C6.13401 3 3 6.13401 3 10C3 13.866 6.13401 17 10 17C13.866 17 17 13.866 17 10ZM18 10C18 14.4183 14.4183 18 10 18C5.58172 18 2 14.4183 2 10C2 5.58172 5.58172 2 10 2C14.4183 2 18 5.58172 18 10Z" fill="currentColor"/><path d="M9.26936 13.6022H10.6094V15H9.26936V13.6022ZM7 8.21909C7 7.25134 7.27385 6.47401 7.82155 5.8871C8.36925 5.2957 9.12121 5 10.0774 5C10.9618 5 11.6689 5.25314 12.1987 5.75941C12.7329 6.2612 13 6.90412 13 7.68817C13 8.16308 12.9012 8.54839 12.7037 8.84409C12.5107 9.13979 12.1178 9.57437 11.5253 10.1478C11.0943 10.5645 10.8137 10.9185 10.6835 11.2097C10.5578 11.4964 10.4949 11.922 10.4949 12.4866H9.2963C9.2963 11.8459 9.37261 11.3306 9.52525 10.9409C9.67789 10.5466 10.0123 10.0963 10.5286 9.59005L11.0673 9.05914C11.229 8.90681 11.3591 8.74776 11.4579 8.58199C11.6375 8.29077 11.7273 7.98835 11.7273 7.67473C11.7273 7.23566 11.5948 6.85484 11.33 6.53226C11.0696 6.20968 10.6364 6.04839 10.0303 6.04839C9.28058 6.04839 8.76207 6.32616 8.47475 6.88172C8.31313 7.19086 8.2211 7.63665 8.19865 8.21909H7Z" fill="currentColor"/>`,
+  "settings-gear": `<path d="M10.0556 1.5L17.6112 5.74998V14.2501L10.0556 18.5L2.5 14.2503L2.5 5.74996L10.0556 1.5Z" stroke="currentColor" stroke-linecap="square"/><path d="M12.889 10.0001C12.889 11.5649 11.6205 12.8334 10.0556 12.8334C8.49083 12.8334 7.22229 11.5649 7.22229 10.0001C7.22229 8.43523 8.49083 7.1667 10.0556 7.1667C11.6205 7.1667 12.889 8.43523 12.889 10.0001Z" stroke="currentColor" stroke-linecap="square"/>`,
  dash: `<rect x="5" y="9.5" width="10" height="1" fill="currentColor"/>`,
  "cloud-upload": `<path d="M12.0833 16.25H15C17.0711 16.25 18.75 14.5711 18.75 12.5C18.75 10.5649 17.2843 8.97217 15.4025 8.77133C15.2 6.13103 12.8586 4.08333 10 4.08333C7.71532 4.08333 5.76101 5.49781 4.96501 7.49881C2.84892 7.90461 1.25 9.76559 1.25 11.6667C1.25 13.9813 3.30203 16.25 5.83333 16.25H7.91667M10 16.25V10.4167M12.0833 11.875L10 9.79167L7.91667 11.875" stroke="currentColor" stroke-linecap="square"/>`,
  trash: `<path d="M4.58342 17.9134L4.58369 17.4134L4.22787 17.5384L4.22766 18.0384H4.58342V17.9134ZM15.4167 17.9134V18.0384H15.7725L15.7723 17.5384L15.4167 17.9134ZM2.08342 3.95508V3.45508H1.58342V3.95508H2.08342V4.45508V3.95508ZM17.9167 4.45508V4.95508H18.4167V4.45508H17.9167V3.95508V4.45508ZM4.16677 4.58008L3.66701 4.5996L4.22816 17.5379L4.72792 17.4934L5.22767 17.4489L4.66652 4.54055L4.16677 4.58008ZM4.58342 18.0384V17.9134H15.4167V18.0384V18.5384H4.58342V18.0384ZM15.4167 17.9134L15.8332 17.5379L16.2498 4.5996L15.7501 4.58008L15.2503 4.56055L14.8337 17.4989L15.4167 17.9134ZM15.8334 4.58008V4.08008H4.16677V4.58008V5.08008H15.8334V4.58008ZM2.08342 4.45508V4.95508H4.16677V4.58008V4.08008H2.08342V4.45508ZM15.8334 4.58008V5.08008H17.9167V4.45508V3.95508H15.8334V4.58008ZM6.83951 4.35149L7.432 4.55047C7.79251 3.47701 8.80699 2.70508 10.0001 2.70508V2.20508V1.70508C8.25392 1.70508 6.77335 2.83539 6.24702 4.15251L6.83951 4.35149ZM10.0001 2.20508V2.70508C11.1932 2.70508 12.2077 3.47701 12.5682 4.55047L13.1607 4.35149L13.7532 4.15251C13.2269 2.83539 11.7463 1.70508 10.0001 1.70508V2.20508Z" fill="currentColor"/>`,
--- a/packages/ui/src/components/message-part.css
+++ b/packages/ui/src/components/message-part.css
@@ -614,7 +614,7 @@
  align-items: center;
  justify-content: flex-start;
  gap: 0px;
-  cursor: pointer;
+  cursor: default;

  [data-slot="context-tool-group-title"] {
    flex-shrink: 1;
@@ -623,6 +623,7 @@

  [data-slot="collapsible-arrow"] {
    color: var(--icon-weaker);
+    cursor: pointer;
  }
 }

--- a/packages/ui/src/components/tabs.css
+++ b/packages/ui/src/components/tabs.css
@@ -6,6 +6,7 @@

  width: 100%;
  height: 100%;
+  min-height: 0;
  display: flex;
  flex-direction: column;
  background-color: var(--background-stronger);
@@ -122,6 +123,7 @@
  [data-slot="tabs-content"] {
    overflow-y: auto;
    flex: 1;
+    min-height: 0;

    /* Hide scrollbar */
    scrollbar-width: none;
@@ -288,7 +290,7 @@
      border: none;
      color: var(--text-base);
      background-color: transparent;
-      border-bottom-width: 2px;
+      border-bottom-width: 1px;
      border-bottom-style: solid;
      border-bottom-color: transparent;
      gap: 4px;
@@ -305,7 +307,7 @@
        height: 100%;
        padding: 4px;
        background-color: transparent;
-        border-bottom-width: 2px;
+        border-bottom-width: 1px;
        border-bottom-color: transparent;
      }

--- a/packages/ui/src/styles/tailwind/utilities.css
+++ b/packages/ui/src/styles/tailwind/utilities.css
@@ -13,6 +13,11 @@
  mask-image: radial-gradient(circle 5px at calc(100% - 4px) 4px, transparent 5px, black 5.5px);
 }

+@utility badge-mask-tight {
+  -webkit-mask-image: radial-gradient(circle 5px at calc(100% - 2px) 2px, transparent 5px, black 5.5px);
+  mask-image: radial-gradient(circle 5px at calc(100% - 2px) 2px, transparent 5px, black 5.5px);
+}
+
@utility truncate-start {
  text-overflow: ellipsis;
  overflow: hidden;
Author	SHA1	Message	Date
David Hill	c81b2d81b7	fix(app): update status modal header and tab typography	2026-03-13 13:01:39 +00:00
David Hill	3527d011a6	fix(app): refine status modal layout and spacing	2026-03-13 12:51:23 +00:00
David Hill	d5768ca43c	fix(ui): use 1px active indicator for alt tabs	2026-03-13 12:37:57 +00:00
David Hill	f7cf90f9da	fix(app): remove status tablist top padding	2026-03-13 12:30:58 +00:00
David Hill	e914be4057	fix(app): increase status tab spacing	2026-03-13 12:30:48 +00:00
David Hill	ea65c154a9	fix(app): align status tablist padding	2026-03-13 12:30:37 +00:00
David Hill	9caa43571e	fix(app): remove status tab trigger px	2026-03-13 12:30:09 +00:00
David Hill	7ffa1442cf	fix(app): match status panel bg to dialog	2026-03-13 12:29:57 +00:00
David Hill	84e54b3965	fix(app): add bottom border to status tablist	2026-03-13 12:29:43 +00:00
David Hill	0e1978abbf	fix(console): remove tablist bg and add divider	2026-03-13 12:29:28 +00:00
David Hill	953af23920	tui: replace help and settings-gear icons with cleaner SVG paths	2026-03-13 10:07:34 +00:00
David Hill	8e5d00e8f3	feat(app): open status as modal Replace the status popover with a dialog-based modal from the sidebar rail and tune the layout (top offset, max height, transitions, and tab panel sizing).	2026-03-12 23:00:36 +00:00
David Hill	8ba2a78aad	feat(ui): support top-positioned dialogs Add a dialog position option and allow customizing the top offset via --dialog-top, plus pass-through style support.	2026-03-12 23:00:29 +00:00
David Hill	ef08f6df0a	fix(app): align status badge and popover spacing Offset the status health dot/mask to match the sidebar rail placement and increase the popover gutter to 8px.	2026-03-12 22:06:38 +00:00
David Hill	59090bc1b3	feat(app): move status button to sidebar rail Relocate the status popover trigger from the title bar into the left project rail above Settings/Help, keeping the health dot indicator.	2026-03-12 21:39:44 +00:00
Adam	3ba9ab2c0a	fix(app): not loading message nav	2026-03-12 13:33:17 -05:00
David Hill	184732fc20	fix(app): titlebar cleanup (#17206 )	2026-03-12 18:26:50 +00:00
Frank	b66222baf7	zen: fix nemotron issue	2026-03-12 14:17:36 -04:00