ikanban-web 0.2.10 → 0.2.12

package/src/context/global-sync.test.ts

@@ -5,6 +5,8 @@ import {
   loadRootSessionsWithFallback,
   pickDirectoriesToEvict,
 } from "./global-sync"
+import { bootstrapGlobal } from "./global-sync/bootstrap"
+import { shouldLoadProjectsOnBootstrap } from "./global-sync/bootstrap-mode"
 
 describe("pickDirectoriesToEvict", () => {
   test("keeps pinned stores and evicts idle stores", () => {
@@ -124,3 +126,58 @@ describe("canDisposeDirectory", () => {
     ).toBe(true)
   })
 })
+
+describe("bootstrapGlobal", () => {
+  test("does not call project list when project loading is disabled", async () => {
+    let projectListCalls = 0
+    const project = {
+      list: async () => {
+        projectListCalls += 1
+        return { data: [] }
+      },
+    }
+
+    const updates: Array<[string, unknown]> = []
+
+    await bootstrapGlobal({
+      globalSDK: {
+        global: {
+          health: async () => ({ data: { healthy: true } }),
+          config: { get: async () => ({ data: {} }) },
+        },
+        path: { get: async () => ({ data: { state: "", config: "", worktree: "", directory: "", home: "" } }) },
+        project,
+        provider: {
+          list: async () => ({ data: { all: [], connected: [], default: {} } }),
+          auth: async () => ({ data: {} }),
+        },
+      } as never,
+      connectErrorTitle: "connect",
+      connectErrorDescription: "connect desc",
+      requestFailedTitle: "request",
+      unknownError: "unknown",
+      invalidConfigurationError: "invalid",
+      formatMoreCount: () => "",
+      setGlobalStore: ((key: string, value: unknown) => {
+        updates.push([key, value])
+        return value
+      }) as never,
+      loadProjects: false,
+    } as never)
+
+    expect(projectListCalls).toBe(0)
+    expect(updates.some(([key]) => key === "ready")).toBe(true)
+  })
+})
+
+describe("shouldLoadProjectsOnBootstrap", () => {
+  test("skips project loading on the home route", () => {
+    expect(shouldLoadProjectsOnBootstrap("/", "/")).toBe(false)
+    expect(shouldLoadProjectsOnBootstrap("/ikanban", "/ikanban/")).toBe(false)
+  })
+
+  test("loads projects away from the home route", () => {
+    expect(shouldLoadProjectsOnBootstrap("/dGVzdA", "/")).toBe(true)
+    expect(shouldLoadProjectsOnBootstrap("/ikanban/dGVzdA", "/ikanban/")).toBe(true)
+  })
+})

package/src/context/global-sync.tsx

@@ -26,6 +26,7 @@ import { Persist, persisted } from "@/utils/persist"
 import type { InitError } from "../pages/error"
 import { useGlobalSDK } from "./global-sdk"
 import { bootstrapDirectory, bootstrapGlobal } from "./global-sync/bootstrap"
+import { shouldLoadProjectsOnBootstrap } from "./global-sync/bootstrap-mode"
 import { createChildStoreManager } from "./global-sync/child-store"
 import { applyDirectoryEvent, applyGlobalEvent } from "./global-sync/event-reducer"
 import { createRefreshQueue } from "./global-sync/queue"
@@ -334,6 +335,10 @@ function createGlobalSync() {
       unknownError: language.t("error.chain.unknown"),
       invalidConfigurationError: language.t("error.server.invalidConfiguration"),
       formatMoreCount: (count) => language.t("common.moreCountSuffix", { count }),
+      loadProjects: shouldLoadProjectsOnBootstrap(
+        globalThis.location?.pathname ?? "/",
+        import.meta.env.BASE_URL ?? "/",
+      ),
       setGlobalStore: setBootStore,
     })
   }

package/src/context/notification.tsx

@@ -245,7 +245,7 @@ export const { use: useNotification, provider: NotificationProvider } = createSi
           session: sessionID,
         })
 
-        const href = `/${base64Encode(directory)}/session/${sessionID}`
+        const href = `/${base64Encode(directory)}/${sessionID}`
         if (settings.notifications.agent()) {
           void platform.notify(language.t("notification.session.responseReady.title"), session.title ?? sessionID, href)
         }
@@ -278,7 +278,7 @@ export const { use: useNotification, provider: NotificationProvider } = createSi
         const description =
           session?.title ??
           (typeof error === "string" ? error : language.t("notification.session.error.fallbackDescription"))
-        const href = sessionID ? `/${base64Encode(directory)}/session/${sessionID}` : `/${base64Encode(directory)}`
+        const href = sessionID ? `/${base64Encode(directory)}/${sessionID}` : `/${base64Encode(directory)}`
         if (settings.notifications.errors()) {
           void platform.notify(language.t("notification.session.error.title"), description, href)
         }

package/src/i18n/en.ts

@@ -133,7 +133,7 @@ export const dict = {
     "Customize which models appear in the model selector.",
   "dialog.model.manage.provider.toggle": "Toggle all {{provider}} models",
 
-  "dialog.model.unpaid.freeModels.title": "Free models provided by OpenCode",
+  "dialog.model.unpaid.freeModels.title": "Free models provided by iKanban",
   "dialog.model.unpaid.addMore.title": "Add more models from popular providers",
 
   "dialog.provider.viewAll": "Show more providers",
@@ -146,7 +146,7 @@ export const dict = {
   "provider.connect.status.waiting": "Waiting for authorization...",
   "provider.connect.status.failed": "Authorization failed: {{error}}",
   "provider.connect.apiKey.description":
-    "Enter your {{provider}} API key to connect your account and use {{provider}} models in OpenCode.",
+    "Enter your {{provider}} API key to connect your account and use {{provider}} models in iKanban.",
   "provider.connect.apiKey.label": "{{provider}} API key",
   "provider.connect.apiKey.placeholder": "API key",
   "provider.connect.apiKey.required": "API key is required",
@@ -160,7 +160,7 @@ export const dict = {
   "provider.connect.oauth.code.visit.prefix": "Visit ",
   "provider.connect.oauth.code.visit.link": "this link",
   "provider.connect.oauth.code.visit.suffix":
-    " to collect your authorization code to connect your account and use {{provider}} models in OpenCode.",
+    " to collect your authorization code to connect your account and use {{provider}} models in iKanban.",
   "provider.connect.oauth.code.label": "{{method}} authorization code",
   "provider.connect.oauth.code.placeholder": "Authorization code",
   "provider.connect.oauth.code.required": "Authorization code is required",
@@ -168,7 +168,7 @@ export const dict = {
   "provider.connect.oauth.auto.visit.prefix": "Visit ",
   "provider.connect.oauth.auto.visit.link": "this link",
   "provider.connect.oauth.auto.visit.suffix":
-    " and enter the code below to connect your account and use {{provider}} models in OpenCode.",
+    " and enter the code below to connect your account and use {{provider}} models in iKanban.",
   "provider.connect.oauth.auto.confirmationCode": "Confirmation code",
   "provider.connect.toast.connected.title": "{{provider}} connected",
   "provider.connect.toast.connected.description":
@@ -486,7 +486,7 @@ export const dict = {
 
   "toast.update.title": "Update available",
   "toast.update.description":
-    "A new version of OpenCode ({{version}}) is now available to install.",
+    "A new version of iKanban ({{version}}) is now available to install.",
   "toast.update.action.installRestart": "Install and restart",
   "toast.update.action.notYet": "Not yet",
 
@@ -497,7 +497,7 @@ export const dict = {
   "error.page.action.checking": "Checking...",
   "error.page.action.checkUpdates": "Check for updates",
   "error.page.action.updateTo": "Update to {{version}}",
-  "error.page.report.prefix": "Please report this error to the OpenCode team",
+  "error.page.report.prefix": "Please report this error to the iKanban team",
   "error.page.report.discord": "on Discord",
   "error.page.version": "Version: {{version}}",
 
@@ -550,7 +550,7 @@ export const dict = {
   "notification.session.error.fallbackDescription": "An error occurred",
 
   "home.recentProjects": "Recent projects",
-  "home.sessionBoard": "Session board",
+  "home.sessionBoard": "Ikanban",
   "home.sessionBoard.description":
     "Live session activity grouped into Progress and Idle.",
   "home.sessionBoard.progress": "Progress",
@@ -667,7 +667,7 @@ export const dict = {
   "sidebar.workspaces.disable": "Disable workspaces",
   "sidebar.gettingStarted.title": "Getting started",
   "sidebar.gettingStarted.line1":
-    "OpenCode includes free models so you can start immediately.",
+    "iKanban includes free models so you can start immediately.",
   "sidebar.gettingStarted.line2":
     "Connect any provider to use models, inc. Claude, GPT, Gemini etc.",
   "sidebar.project.recentSessions": "Recent sessions",
@@ -695,12 +695,12 @@ export const dict = {
 
   "settings.general.row.language.title": "Language",
   "settings.general.row.language.description":
-    "Change the display language for OpenCode",
+    "Change the display language for iKanban",
   "settings.general.row.appearance.title": "Appearance",
   "settings.general.row.appearance.description":
-    "Customise how OpenCode looks on your device",
+    "Customise how iKanban looks on your device",
   "settings.general.row.theme.title": "Theme",
-  "settings.general.row.theme.description": "Customise how OpenCode is themed.",
+  "settings.general.row.theme.description": "Customise how iKanban is themed.",
   "settings.general.row.font.title": "Font",
   "settings.general.row.font.description":
     "Customise the mono font used in code blocks",
@@ -731,7 +731,7 @@ export const dict = {
 
   "settings.updates.row.startup.title": "Check for updates on startup",
   "settings.updates.row.startup.description":
-    "Automatically check for updates when OpenCode launches",
+    "Automatically check for updates when iKanban launches",
   "settings.updates.row.check.title": "Check for updates",
   "settings.updates.row.check.description":
     "Manually check for updates and install if available",
@@ -739,7 +739,7 @@ export const dict = {
   "settings.updates.action.checking": "Checking...",
   "settings.updates.toast.latest.title": "You're up to date",
   "settings.updates.toast.latest.description":
-    "You're running the latest version of OpenCode.",
+    "You're running the latest version of iKanban.",
   "font.option.ibmPlexMono": "IBM Plex Mono",
   "font.option.cascadiaCode": "Cascadia Code",
   "font.option.firaCode": "Fira Code",

package/src/i18n/zh.ts

@@ -145,7 +145,7 @@ export const dict = {
   "dialog.model.recent": "最近",
   "dialog.model.manage.description": "自定义模型选择器中显示的模型。",
   "dialog.model.manage.provider.toggle": "切换 {{provider}} 的所有模型",
-  "dialog.model.unpaid.freeModels.title": "OpenCode 提供的免费模型",
+  "dialog.model.unpaid.freeModels.title": "iKanban 提供的免费模型",
   "dialog.model.unpaid.addMore.title": "从热门提供商添加更多模型",
 
   "dialog.provider.viewAll": "查看更多提供商",
@@ -158,7 +158,7 @@ export const dict = {
   "provider.connect.status.waiting": "等待授权...",
   "provider.connect.status.failed": "授权失败：{{error}}",
   "provider.connect.apiKey.description":
-    "输入你的 {{provider}} API 密钥以连接帐户，并在 OpenCode 中使用 {{provider}} 模型。",
+    "输入你的 {{provider}} API 密钥以连接帐户，并在 iKanban 中使用 {{provider}} 模型。",
   "provider.connect.apiKey.label": "{{provider}} API 密钥",
   "provider.connect.apiKey.placeholder": "API 密钥",
   "provider.connect.apiKey.required": "API 密钥为必填项",
@@ -172,7 +172,7 @@ export const dict = {
   "provider.connect.oauth.code.visit.prefix": "访问 ",
   "provider.connect.oauth.code.visit.link": "此链接",
   "provider.connect.oauth.code.visit.suffix":
-    " 获取授权码，以连接你的帐户并在 OpenCode 中使用 {{provider}} 模型。",
+    " 获取授权码，以连接你的帐户并在 iKanban 中使用 {{provider}} 模型。",
   "provider.connect.oauth.code.label": "{{method}} 授权码",
   "provider.connect.oauth.code.placeholder": "授权码",
   "provider.connect.oauth.code.required": "授权码为必填项",
@@ -180,7 +180,7 @@ export const dict = {
   "provider.connect.oauth.auto.visit.prefix": "访问 ",
   "provider.connect.oauth.auto.visit.link": "此链接",
   "provider.connect.oauth.auto.visit.suffix":
-    " 并输入以下代码，以连接你的帐户并在 OpenCode 中使用 {{provider}} 模型。",
+    " 并输入以下代码，以连接你的帐户并在 iKanban 中使用 {{provider}} 模型。",
   "provider.connect.oauth.auto.confirmationCode": "确认码",
   "provider.connect.toast.connected.title": "{{provider}} 已连接",
   "provider.connect.toast.connected.description":
@@ -461,7 +461,7 @@ export const dict = {
   "toast.session.unshare.failed.description": "取消分享会话时发生错误",
   "toast.session.listFailed.title": "无法加载 {{project}} 的会话",
   "toast.update.title": "有可用更新",
-  "toast.update.description": "OpenCode 有新版本 ({{version}}) 可安装。",
+  "toast.update.description": "iKanban 有新版本 ({{version}}) 可安装。",
   "toast.update.action.installRestart": "安装并重启",
   "toast.update.action.notYet": "稍后",
 
@@ -472,7 +472,7 @@ export const dict = {
   "error.page.action.checking": "检查中...",
   "error.page.action.checkUpdates": "检查更新",
   "error.page.action.updateTo": "更新到 {{version}}",
-  "error.page.report.prefix": "请将此错误报告给 OpenCode 团队",
+  "error.page.report.prefix": "请将此错误报告给 iKanban 团队",
   "error.page.report.discord": "在 Discord 上",
   "error.page.version": "版本：{{version}}",
   "error.dev.rootNotFound":
@@ -520,7 +520,7 @@ export const dict = {
   "notification.session.error.fallbackDescription": "发生错误",
 
   "home.recentProjects": "最近项目",
-  "home.sessionBoard": "会话看板",
+  "home.sessionBoard": "Ikanban",
   "home.sessionBoard.description": "按 Progress 和 Idle 分组。",
   "home.sessionBoard.progress": "Progress",
   "home.sessionBoard.idle": "Idle",
@@ -624,7 +624,7 @@ export const dict = {
   "sidebar.workspaces.enable": "启用工作区",
   "sidebar.workspaces.disable": "禁用工作区",
   "sidebar.gettingStarted.title": "入门",
-  "sidebar.gettingStarted.line1": "OpenCode 提供免费模型，你可以立即开始使用。",
+  "sidebar.gettingStarted.line1": "iKanban 提供免费模型，你可以立即开始使用。",
   "sidebar.gettingStarted.line2":
     "连接任意提供商即可使用更多模型，如 Claude、GPT、Gemini 等。",
   "sidebar.project.recentSessions": "最近会话",
@@ -652,12 +652,12 @@ export const dict = {
   "settings.general.section.feed": "动态",
   "settings.general.section.display": "显示",
   "settings.general.row.language.title": "语言",
-  "settings.general.row.language.description": "更改 OpenCode 的显示语言",
+  "settings.general.row.language.description": "更改 iKanban 的显示语言",
   "settings.general.row.appearance.title": "外观",
   "settings.general.row.appearance.description":
-    "自定义 OpenCode 在你的设备上的外观",
+    "自定义 iKanban 在你的设备上的外观",
   "settings.general.row.theme.title": "主题",
-  "settings.general.row.theme.description": "自定义 OpenCode 的主题。",
+  "settings.general.row.theme.description": "自定义 iKanban 的主题。",
   "settings.general.row.font.title": "字体",
   "settings.general.row.font.description": "自定义代码块使用的等宽字体",
   "settings.general.row.reasoningSummaries.title": "显示推理摘要",
@@ -682,14 +682,14 @@ export const dict = {
   "settings.general.action.releaseNotesCurrent": "查看变更",
 
   "settings.updates.row.startup.title": "启动时检查更新",
-  "settings.updates.row.startup.description": "在 OpenCode 启动时自动检查更新",
+  "settings.updates.row.startup.description": "在 iKanban 启动时自动检查更新",
   "settings.updates.row.check.title": "检查更新",
   "settings.updates.row.check.description": "手动检查更新并在有更新时安装",
   "settings.updates.action.checkNow": "立即检查",
   "settings.updates.action.checking": "正在检查...",
   "settings.updates.toast.latest.title": "已是最新版本",
   "settings.updates.toast.latest.description":
-    "你正在使用最新版本的 OpenCode。",
+    "你正在使用最新版本的 iKanban。",
 
   "font.option.ibmPlexMono": "IBM Plex Mono",
   "font.option.cascadiaCode": "Cascadia Code",

package/src/pages/directory-layout.tsx

@@ -19,8 +19,8 @@ function DirectoryDataProvider(props: ParentProps<{ directory: string }>) {
     <DataProvider
       data={sync.data}
       directory={props.directory}
-      onNavigateToSession={(sessionID: string) => navigate(`/${params.dir}/session/${sessionID}`)}
-      onSessionHref={(sessionID: string) => `/${params.dir}/session/${sessionID}`}
+      onNavigateToSession={(sessionID: string) => navigate(`/${params.dir}/${sessionID}`)}
+      onSessionHref={(sessionID: string) => `/${params.dir}/${sessionID}`}
     >
       <LocalProvider>{props.children}</LocalProvider>
     </DataProvider>

package/src/pages/home.tsx

@@ -1,4 +1,4 @@
-import { createMemo, createEffect, For, Match, Switch } from "solid-js";
+import { createMemo, createEffect, createResource, For, Match, Switch } from "solid-js";
 import { Button } from "ikanban-ui/button";
 import { Logo } from "ikanban-ui/logo";
 import { useLayout } from "@/context/layout";
@@ -15,7 +15,6 @@ import { useServer } from "@/context/server";
 import { useGlobalSync } from "@/context/global-sync";
 import { useLanguage } from "@/context/language";
 import { IconButton } from "ikanban-ui/icon-button";
-import { sortedRootSessions } from "@/pages/layout/helpers";
 import type { Session } from "@opencode-ai/sdk/v2/client";
 
 type BoardColumn = "progress" | "idle";
@@ -26,6 +25,34 @@ type BoardCard = {
   updatedAt: number;
 };
 
+const homeStyles = {
+  border: { border: "1px solid var(--border-weak-base)" },
+  heroIcon: {
+    border: "1px solid var(--border-weak-base)",
+    background:
+      "linear-gradient(135deg, color-mix(in srgb, var(--text-interactive-base) 12%, var(--background-stronger)), var(--background-stronger))",
+  },
+  emptyPanel: {
+    "border-color": "var(--border-weak-base)",
+    background:
+      "linear-gradient(180deg, color-mix(in srgb, var(--surface-base-hover) 35%, var(--background-stronger)), var(--background-stronger))",
+  },
+  emptyIcon: {
+    border: "1px solid var(--border-weak-base)",
+    background:
+      "linear-gradient(135deg, color-mix(in srgb, var(--text-interactive-base) 10%, var(--surface-inset-base)), var(--surface-inset-base))",
+  },
+  card: {
+    border: "1px solid var(--border-weak-base)",
+    background: "var(--background-base)",
+  },
+  emptyState: {
+    "border-color": "var(--border-weak-base)",
+    background:
+      "linear-gradient(180deg, color-mix(in srgb, var(--surface-base-hover) 30%, var(--surface-inset-base)), var(--surface-inset-base))",
+  },
+} as const;
+
 export default function Home() {
   const sync = useGlobalSync();
   const layout = useLayout();
@@ -35,26 +62,49 @@ export default function Home() {
   const globalSDK = useGlobalSDK();
   const server = useServer();
   const language = useLanguage();
-  const recent = createMemo(() => {
+  const projects = createMemo(() => {
     return sync.data.project
       .slice()
       .sort(
         (a, b) =>
           (b.time.updated ?? b.time.created) -
           (a.time.updated ?? a.time.created),
-      )
-      .slice(0, 5);
+      );
   });
+
+  const [rootSessions, { mutate: mutateRootSessions }] = createResource(
+    () => projects().map((project) => project.worktree),
+    async (directories) => {
+      const entries = await Promise.all(
+        directories.map(async (directory) => {
+          const result = await globalSDK.client.session.list({
+            directory,
+            roots: true,
+          });
+
+          const sessions = (result.data ?? []).filter(
+            (session): session is Session => !!session?.id && !session.time?.archived,
+          );
+
+          return [directory, sessions] as const;
+        }),
+      );
+
+      return Object.fromEntries(entries) as Record<string, Session[]>;
+    },
+  );
+
   const boardColumns = createMemo<Record<BoardColumn, BoardCard[]>>(() => {
     const now = Date.now();
     const columns: Record<BoardColumn, BoardCard[]> = {
       progress: [],
       idle: [],
     };
+    const sessionsByProject = rootSessions() ?? {};
 
-    for (const project of recent()) {
+    for (const project of projects()) {
       const [store] = sync.child(project.worktree);
-      const sessions = sortedRootSessions(store, now);
+      const sessions = sessionsByProject[project.worktree] ?? [];
 
       for (const session of sessions) {
         const status = store.session_status[session.id];
@@ -82,7 +132,7 @@ export default function Home() {
   });
 
   createEffect(() => {
-    for (const project of recent()) {
+    for (const project of projects()) {
       sync.child(project.worktree);
     }
   });
@@ -97,13 +147,13 @@ export default function Home() {
   function openProject(directory: string) {
     layout.projects.open(directory);
     server.projects.touch(directory);
-    navigate(`/${base64Encode(directory)}/session`);
+    navigate(`/${base64Encode(directory)}`);
   }
 
   function openSession(directory: string, sessionID: string) {
     layout.projects.open(directory);
     server.projects.touch(directory);
-    navigate(`/${base64Encode(directory)}/session/${sessionID}`);
+    navigate(`/${base64Encode(directory)}/${sessionID}`);
   }
 
   async function archiveSession(directory: string, sessionID: string) {
@@ -112,6 +162,13 @@ export default function Home() {
       sessionID,
       time: { archived: Date.now() },
     });
+    mutateRootSessions((current) => {
+      if (!current?.[directory]) return current;
+      return {
+        ...current,
+        [directory]: current[directory].filter((session) => session.id !== sessionID),
+      };
+    });
     setStore(
       "session",
       (sessions) => sessions.filter((session) => session.id !== sessionID),
@@ -148,7 +205,10 @@ export default function Home() {
       <div class="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
         <div class="min-w-0">
           <div class="flex items-center gap-3">
-            <div class="flex size-10 items-center justify-center rounded-2xl border border-border-weak bg-background-base/80">
+            <div
+              class="flex size-10 items-center justify-center rounded-2xl border shadow-xs-border-base"
+              style={homeStyles.heroIcon}
+            >
               <Logo class="w-6 opacity-90" />
             </div>
             <div>
@@ -189,7 +249,7 @@ export default function Home() {
       </div>
 
       <Switch>
-        <Match when={sync.data.project.length > 0}>
+        <Match when={projects().length > 0}>
           <div class="mt-6 flex w-full flex-col gap-6">
             <section class="flex flex-col gap-4">
               <div class="grid gap-3 lg:grid-cols-2">
@@ -216,9 +276,15 @@ export default function Home() {
           </div>
         </Match>
         <Match when={true}>
-          <div class="mt-6 rounded-2xl border border-dashed border-border-weak bg-background-base/60 px-6 py-10">
+          <div
+            class="mt-6 rounded-2xl border border-dashed px-6 py-10 shadow-xs-border-base"
+            style={homeStyles.emptyPanel}
+          >
             <div class="mx-auto flex max-w-md flex-col items-center gap-3 text-center">
-              <div class="flex size-12 items-center justify-center rounded-2xl border border-border-weak bg-background-base/80">
+              <div
+                class="flex size-12 items-center justify-center rounded-2xl border shadow-xs-border-base"
+                style={homeStyles.emptyIcon}
+              >
                 <Icon name="folder-add-left" size="large" />
               </div>
               <div class="flex flex-col gap-1 items-center justify-center">
@@ -251,12 +317,25 @@ function BoardColumnView(props: {
 }) {
   const toneClass = () => {
     if (props.tone === "progress")
-      return "bg-emerald-500/12 text-emerald-300 border-emerald-500/20";
-    return "bg-sky-500/12 text-sky-300 border-sky-500/20";
+      return "bg-surface-base-hover text-icon-success-base border-border-weak-base";
+    return "bg-surface-inset-base text-icon-base border-border-weak-base";
   };
 
+  const sectionStyle = () =>
+    props.tone === "progress"
+      ? {
+          ...homeStyles.border,
+          background:
+            "linear-gradient(180deg, color-mix(in srgb, var(--text-interactive-base) 8%, var(--background-stronger)), var(--background-stronger))",
+        }
+      : {
+          ...homeStyles.border,
+          background:
+            "linear-gradient(180deg, color-mix(in srgb, var(--surface-inset-base) 55%, var(--background-stronger)), var(--background-stronger))",
+        };
+
   return (
-    <section class="rounded-2xl border border-border-weak bg-background-base/80 p-3 md:p-4 min-h-72">
+    <section class="rounded-2xl p-3 md:p-4 min-h-72 shadow-xs-border-base" style={sectionStyle()}>
       <div class="flex items-center justify-between gap-3">
         <div class="flex items-center gap-2 min-w-0">
           <div
@@ -274,7 +353,10 @@ function BoardColumnView(props: {
           <Match when={props.cards.length > 0}>
             <For each={props.cards}>
               {(card) => (
-                <div class="overflow-hidden rounded-xl border border-border-weak bg-background-base/70 hover:border-border-strong">
+                <div
+                  class="overflow-hidden rounded-xl transition-colors"
+                  style={homeStyles.card}
+                >
                   <div class="flex items-start justify-between gap-3 px-3 pt-3">
                     <div class="min-w-0 flex-1 pt-1">
                       <div class="truncate text-14-medium leading-tight text-text-strong">
@@ -320,7 +402,10 @@ function BoardColumnView(props: {
             </For>
           </Match>
           <Match when={true}>
-            <div class="rounded-xl border border-dashed border-border-weak px-3 py-8 text-center text-12-regular text-text-weak">
+            <div
+              class="rounded-xl border border-dashed px-3 py-8 text-center text-12-regular text-text-weak"
+              style={homeStyles.emptyState}
+            >
               {props.empty}
             </div>
           </Match>

package/src/pages/layout/sidebar-items.tsx

@@ -101,7 +101,7 @@ const SessionRow = (props: {
   cancelHoverPrefetch: () => void
 }): JSX.Element => (
   <A
-    href={`/${props.slug}/session/${props.session.id}`}
+    href={`/${props.slug}/${props.session.id}`}
     class={`flex items-center justify-between gap-3 min-w-0 text-left w-full focus:outline-none transition-[padding] ${props.mobile ? "pr-7" : ""} group-hover/session:pr-7 group-focus-within/session:pr-7 group-active/session:pr-7 ${props.dense ? "py-0.5" : "py-1"}`}
     onPointerEnter={props.scheduleHoverPrefetch}
     onPointerLeave={props.cancelHoverPrefetch}
@@ -310,7 +310,7 @@ export const SessionItem = (props: SessionItemProps): JSX.Element => {
           onMessageSelect={(message) => {
             if (!isActive()) {
               layout.pendingMessage.set(`${base64Encode(props.session.directory)}/${props.session.id}`, message.id)
-              navigate(`${props.slug}/session/${props.session.id}`)
+              navigate(`/${props.slug}/${props.session.id}`)
               return
             }
             window.history.replaceState(null, "", `#message-${message.id}`)
@@ -360,7 +360,7 @@ export const NewSessionItem = (props: {
   const tooltip = () => props.mobile || !props.sidebarExpanded()
   const item = (
     <A
-      href={`/${props.slug}/session`}
+      href={`/${props.slug}`}
       end
       class={`flex items-center justify-between gap-3 min-w-0 text-left w-full focus:outline-none ${props.dense ? "py-0.5" : "py-1"}`}
       onClick={() => {

package/src/pages/layout/sidebar-project.tsx

@@ -8,7 +8,7 @@ import { Icon } from "ikanban-ui/icon"
 import { IconButton } from "ikanban-ui/icon-button"
 import { Tooltip } from "ikanban-ui/tooltip"
 import { createSortable } from "@thisbeyond/solid-dnd"
-import { useLayout, type LocalProject } from "@/context/layout"
+import { type LocalProject } from "@/context/layout"
 import { useGlobalSync } from "@/context/global-sync"
 import { useLanguage } from "@/context/language"
 import { useNotification } from "@/context/notification"
@@ -77,7 +77,6 @@ const ProjectTile = (props: {
   language: ReturnType<typeof useLanguage>
 }): JSX.Element => {
   const notification = useNotification()
-  const layout = useLayout()
   const unseenCount = createMemo(() =>
     props.dirs().reduce((total, directory) => total + notification.project.unseenCount(directory), 0),
   )
@@ -127,7 +126,6 @@ const ProjectTile = (props: {
         onClick={() => {
           if (props.selected()) {
             props.setSuppressHover(true)
-            layout.sidebar.toggle()
             return
           }
           props.setSuppressHover(false)

package/src/pages/layout/sidebar-shell-helpers.ts

@@ -1 +1 @@
-export const sidebarExpanded = (mobile: boolean | undefined, opened: boolean) => !!mobile || opened
+export const sidebarExpanded = (mobile: boolean | undefined, _opened: boolean) => !!mobile

package/src/pages/layout/sidebar-shell.test.ts

@@ -6,8 +6,8 @@ describe("sidebarExpanded", () => {
     expect(sidebarExpanded(true, false)).toBe(true)
   })
 
-  test("follows desktop open state when not mobile", () => {
-    expect(sidebarExpanded(false, true)).toBe(true)
+  test("stays closed on desktop now that the sidebar pane is removed", () => {
+    expect(sidebarExpanded(false, true)).toBe(false)
     expect(sidebarExpanded(false, false)).toBe(false)
   })
 })

package/src/pages/layout/sidebar-workspace.tsx

@@ -437,7 +437,7 @@ export const SortableWorkspace = (props: {
                 root={props.project.worktree}
                 setHoverSession={props.ctx.setHoverSession}
                 clearHoverProjectSoon={props.ctx.clearHoverProjectSoon}
-                navigateToNewSession={() => navigate(`/${slug()}/session`)}
+                navigateToNewSession={() => navigate(`/${slug()}`)}
               />
             </div>
           </div>