diff options
| author | David Hill <[email protected]> | 2026-03-17 19:54:14 +0000 |
|---|---|---|
| committer | GitHub <[email protected]> | 2026-03-17 19:54:14 +0000 |
| commit | 7daea69e13e5a17278fe244273fdeb141b0369d6 (patch) | |
| tree | 4d421611992fb686a052b72ff928711f6805dc35 /packages/app/src/components | |
| parent | 0772a9591807d15c369c37edc01b9018bdc6e7d1 (diff) | |
| download | opencode-7daea69e13e5a17278fe244273fdeb141b0369d6.tar.gz opencode-7daea69e13e5a17278fe244273fdeb141b0369d6.zip | |
tweak(ui): add an empty state to the sidebar when no projects (#17971)
Co-authored-by: Shoubhit Dash <[email protected]>
Diffstat (limited to 'packages/app/src/components')
| -rw-r--r-- | packages/app/src/components/titlebar.tsx | 63 |
1 files changed, 33 insertions, 30 deletions
diff --git a/packages/app/src/components/titlebar.tsx b/packages/app/src/components/titlebar.tsx index 345903420..77de1a73c 100644 --- a/packages/app/src/components/titlebar.tsx +++ b/packages/app/src/components/titlebar.tsx @@ -77,6 +77,7 @@ export function Titlebar() { const canBack = createMemo(() => history.index > 0) const canForward = createMemo(() => history.index < history.stack.length - 1) + const hasProjects = createMemo(() => layout.projects.list().length > 0) const back = () => { const next = backPath(history) @@ -251,36 +252,38 @@ export function Titlebar() { </div> </div> </Show> - <div - class="flex items-center gap-0 transition-transform" - classList={{ - "translate-x-0": !layout.sidebar.opened(), - "-translate-x-[36px]": layout.sidebar.opened(), - "duration-180 ease-out": !layout.sidebar.opened(), - "duration-180 ease-in": layout.sidebar.opened(), - }} - > - <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}> - <Button - variant="ghost" - icon="chevron-left" - class="titlebar-icon w-6 h-6 p-0 box-border" - disabled={!canBack()} - onClick={back} - aria-label={language.t("common.goBack")} - /> - </Tooltip> - <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}> - <Button - variant="ghost" - icon="chevron-right" - class="titlebar-icon w-6 h-6 p-0 box-border" - disabled={!canForward()} - onClick={forward} - aria-label={language.t("common.goForward")} - /> - </Tooltip> - </div> + <Show when={hasProjects()}> + <div + class="flex items-center gap-0 transition-transform" + classList={{ + "translate-x-0": !layout.sidebar.opened(), + "-translate-x-[36px]": layout.sidebar.opened(), + "duration-180 ease-out": !layout.sidebar.opened(), + "duration-180 ease-in": layout.sidebar.opened(), + }} + > + <Tooltip placement="bottom" value={language.t("common.goBack")} openDelay={2000}> + <Button + variant="ghost" + icon="chevron-left" + class="titlebar-icon w-6 h-6 p-0 box-border" + disabled={!canBack()} + onClick={back} + aria-label={language.t("common.goBack")} + /> + </Tooltip> + <Tooltip placement="bottom" value={language.t("common.goForward")} openDelay={2000}> + <Button + variant="ghost" + icon="chevron-right" + class="titlebar-icon w-6 h-6 p-0 box-border" + disabled={!canForward()} + onClick={forward} + aria-label={language.t("common.goForward")} + /> + </Tooltip> + </div> + </Show> </div> </div> <div id="opencode-titlebar-left" class="flex items-center gap-3 min-w-0 px-2" /> |