|
|
@@ -554,114 +554,117 @@ export function SessionHeader() {
|
|
|
</Show>
|
|
|
<div class="flex items-center gap-1">
|
|
|
<div class="hidden md:flex items-center gap-3 shrink-0">
|
|
|
- <TooltipKeybind
|
|
|
- title={language.t("command.terminal.toggle")}
|
|
|
- keybind={command.keybind("terminal.toggle")}
|
|
|
- >
|
|
|
- <Button
|
|
|
- variant="ghost"
|
|
|
- class="group/terminal-toggle titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
- onClick={() => view().terminal.toggle()}
|
|
|
- aria-label={language.t("command.terminal.toggle")}
|
|
|
- aria-expanded={view().terminal.opened()}
|
|
|
- aria-controls="terminal-panel"
|
|
|
+ <TooltipKeybind
|
|
|
+ title={language.t("command.terminal.toggle")}
|
|
|
+ keybind={command.keybind("terminal.toggle")}
|
|
|
>
|
|
|
- <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>
|
|
|
- </Button>
|
|
|
- </TooltipKeybind>
|
|
|
- </div>
|
|
|
+ <Button
|
|
|
+ variant="ghost"
|
|
|
+ class="group/terminal-toggle titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
+ onClick={() => view().terminal.toggle()}
|
|
|
+ aria-label={language.t("command.terminal.toggle")}
|
|
|
+ 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>
|
|
|
+ </Button>
|
|
|
+ </TooltipKeybind>
|
|
|
+ </div>
|
|
|
<div class="hidden md:block shrink-0">
|
|
|
- <TooltipKeybind title={language.t("command.review.toggle")} keybind={command.keybind("review.toggle")}>
|
|
|
- <Button
|
|
|
- variant="ghost"
|
|
|
- class="group/review-toggle titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
- onClick={() => view().reviewPanel.toggle()}
|
|
|
- aria-label={language.t("command.review.toggle")}
|
|
|
- aria-expanded={view().reviewPanel.opened()}
|
|
|
- aria-controls="review-panel"
|
|
|
+ <TooltipKeybind
|
|
|
+ title={language.t("command.review.toggle")}
|
|
|
+ keybind={command.keybind("review.toggle")}
|
|
|
>
|
|
|
- <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>
|
|
|
- </Button>
|
|
|
- </TooltipKeybind>
|
|
|
- </div>
|
|
|
+ <Button
|
|
|
+ variant="ghost"
|
|
|
+ class="group/review-toggle titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
+ onClick={() => view().reviewPanel.toggle()}
|
|
|
+ aria-label={language.t("command.review.toggle")}
|
|
|
+ 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>
|
|
|
+ </Button>
|
|
|
+ </TooltipKeybind>
|
|
|
+ </div>
|
|
|
<div class="hidden md:block shrink-0">
|
|
|
- <div
|
|
|
- aria-hidden={!view().reviewPanel.opened()}
|
|
|
- class="overflow-hidden transition-[width,margin-left] duration-200 ease-out motion-reduce:transition-none"
|
|
|
- classList={{
|
|
|
- "w-8 ml-0": view().reviewPanel.opened(),
|
|
|
- "w-0 -ml-1": !view().reviewPanel.opened(),
|
|
|
- }}
|
|
|
- >
|
|
|
<div
|
|
|
- class="transition-[opacity,transform] duration-200 ease-out origin-center motion-reduce:transition-none"
|
|
|
+ aria-hidden={!view().reviewPanel.opened()}
|
|
|
+ class="overflow-hidden transition-[width,margin-left] duration-200 ease-out motion-reduce:transition-none"
|
|
|
classList={{
|
|
|
- "opacity-100 scale-100": view().reviewPanel.opened(),
|
|
|
- "opacity-0 scale-90": !view().reviewPanel.opened(),
|
|
|
+ "w-8 ml-0": view().reviewPanel.opened(),
|
|
|
+ "w-0 -ml-1": !view().reviewPanel.opened(),
|
|
|
}}
|
|
|
>
|
|
|
- <TooltipKeybind
|
|
|
- title={language.t("command.fileTree.toggle")}
|
|
|
- keybind={command.keybind("fileTree.toggle")}
|
|
|
+ <div
|
|
|
+ class="transition-[opacity,transform] duration-200 ease-out origin-center motion-reduce:transition-none"
|
|
|
+ classList={{
|
|
|
+ "opacity-100 scale-100": view().reviewPanel.opened(),
|
|
|
+ "opacity-0 scale-90": !view().reviewPanel.opened(),
|
|
|
+ }}
|
|
|
>
|
|
|
- <Button
|
|
|
- variant="ghost"
|
|
|
- class="titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
- onClick={() => layout.fileTree.toggle()}
|
|
|
- disabled={!view().reviewPanel.opened()}
|
|
|
- aria-label={language.t("command.fileTree.toggle")}
|
|
|
- aria-expanded={layout.fileTree.opened()}
|
|
|
- aria-controls="file-tree-panel"
|
|
|
- tabIndex={view().reviewPanel.opened() ? undefined : -1}
|
|
|
+ <TooltipKeybind
|
|
|
+ title={language.t("command.fileTree.toggle")}
|
|
|
+ keybind={command.keybind("fileTree.toggle")}
|
|
|
>
|
|
|
- <div class="relative flex items-center justify-center size-4">
|
|
|
- <Icon
|
|
|
- size="small"
|
|
|
- name={layout.fileTree.opened() ? "file-tree-active" : "file-tree"}
|
|
|
- classList={{
|
|
|
- "text-icon-strong": layout.fileTree.opened(),
|
|
|
- "text-icon-weak": !layout.fileTree.opened(),
|
|
|
- }}
|
|
|
- />
|
|
|
- </div>
|
|
|
- </Button>
|
|
|
- </TooltipKeybind>
|
|
|
+ <Button
|
|
|
+ variant="ghost"
|
|
|
+ class="titlebar-icon w-8 h-6 p-0 box-border"
|
|
|
+ onClick={() => layout.fileTree.toggle()}
|
|
|
+ disabled={!view().reviewPanel.opened()}
|
|
|
+ aria-label={language.t("command.fileTree.toggle")}
|
|
|
+ aria-expanded={layout.fileTree.opened()}
|
|
|
+ aria-controls="file-tree-panel"
|
|
|
+ tabIndex={view().reviewPanel.opened() ? undefined : -1}
|
|
|
+ >
|
|
|
+ <div class="relative flex items-center justify-center size-4">
|
|
|
+ <Icon
|
|
|
+ size="small"
|
|
|
+ name={layout.fileTree.opened() ? "file-tree-active" : "file-tree"}
|
|
|
+ classList={{
|
|
|
+ "text-icon-strong": layout.fileTree.opened(),
|
|
|
+ "text-icon-weak": !layout.fileTree.opened(),
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </Button>
|
|
|
+ </TooltipKeybind>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
</div>
|
|
|
</Portal>
|
|
|
)}
|
opencode-agent[bot]