ikanban-web 0.2.12 → 0.2.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/{ghostty-web-CEQVZrGO.js → ghostty-web-C-SSEmFU.js} +1 -1
- package/dist/assets/home-C_ni123d.js +1 -0
- package/dist/assets/{index-WJDzUYhg.js → index-BhuJVelU.js} +1 -1
- package/dist/assets/session-beMq99rD.js +24 -0
- package/dist/index.html +1 -1
- package/package.json +1 -1
- package/src/pages/home/helpers.test.ts +62 -0
- package/src/pages/home/helpers.ts +80 -0
- package/src/pages/home.tsx +17 -53
- package/dist/assets/home-BfGWAM3p.js +0 -1
- package/dist/assets/session-BDqUCVwy.js +0 -24
package/dist/index.html
CHANGED
|
@@ -27,7 +27,7 @@
|
|
|
27
27
|
<meta property="og:image" content="/ikanban/social-share.png" />
|
|
28
28
|
<meta property="twitter:image" content="/social-share.png" />
|
|
29
29
|
<script id="oc-theme-preload-script" src="/ikanban/oc-theme-preload.js"></script>
|
|
30
|
-
<script type="module" crossorigin src="/ikanban/assets/index-
|
|
30
|
+
<script type="module" crossorigin src="/ikanban/assets/index-BhuJVelU.js"></script>
|
|
31
31
|
<link rel="stylesheet" crossorigin href="/ikanban/assets/index-7dPULZd1.css">
|
|
32
32
|
</head>
|
|
33
33
|
<body class="antialiased overscroll-none text-12-regular overflow-hidden">
|
package/package.json
CHANGED
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { describe, expect, test } from "bun:test"
|
|
2
|
+
import type { Session } from "@opencode-ai/sdk/v2/client"
|
|
3
|
+
import { buildBoardColumns, trackedProjectDirectories } from "./helpers"
|
|
4
|
+
|
|
5
|
+
const session = (input: Partial<Session> & Pick<Session, "id">) =>
|
|
6
|
+
({
|
|
7
|
+
title: input.id,
|
|
8
|
+
version: "v2",
|
|
9
|
+
messageCount: 0,
|
|
10
|
+
permissions: { session: {}, share: {} },
|
|
11
|
+
time: { created: 0, updated: 0, archived: undefined },
|
|
12
|
+
...input,
|
|
13
|
+
}) as Session
|
|
14
|
+
|
|
15
|
+
describe("trackedProjectDirectories", () => {
|
|
16
|
+
test("keeps only unique opened project directories", () => {
|
|
17
|
+
expect(
|
|
18
|
+
trackedProjectDirectories([
|
|
19
|
+
{ worktree: "/open" },
|
|
20
|
+
{ worktree: "/open" },
|
|
21
|
+
{ worktree: "/other" },
|
|
22
|
+
]),
|
|
23
|
+
).toEqual(["/open", "/other"])
|
|
24
|
+
})
|
|
25
|
+
})
|
|
26
|
+
|
|
27
|
+
describe("buildBoardColumns", () => {
|
|
28
|
+
test("shows sessions only for opened projects", () => {
|
|
29
|
+
const columns = buildBoardColumns({
|
|
30
|
+
projectDirectories: ["/open"],
|
|
31
|
+
sessionsByProject: {
|
|
32
|
+
"/open": [session({ id: "open-session", title: "Open session" })],
|
|
33
|
+
"/closed": [session({ id: "closed-session", title: "Closed session" })],
|
|
34
|
+
},
|
|
35
|
+
statusesByProject: {},
|
|
36
|
+
})
|
|
37
|
+
|
|
38
|
+
expect(columns.idle.map((card) => card.session.id)).toEqual(["open-session"])
|
|
39
|
+
expect(columns.progress).toEqual([])
|
|
40
|
+
})
|
|
41
|
+
|
|
42
|
+
test("deduplicates the same session across projects and keeps progress state", () => {
|
|
43
|
+
const shared = session({ id: "session-1", title: "Shared", time: { created: 1, updated: 2, archived: undefined } })
|
|
44
|
+
|
|
45
|
+
const columns = buildBoardColumns({
|
|
46
|
+
projectDirectories: ["/open", "/other-open"],
|
|
47
|
+
sessionsByProject: {
|
|
48
|
+
"/open": [shared],
|
|
49
|
+
"/other-open": [shared],
|
|
50
|
+
},
|
|
51
|
+
statusesByProject: {
|
|
52
|
+
"/other-open": {
|
|
53
|
+
"session-1": { type: "busy" },
|
|
54
|
+
},
|
|
55
|
+
},
|
|
56
|
+
})
|
|
57
|
+
|
|
58
|
+
expect(columns.progress).toHaveLength(1)
|
|
59
|
+
expect(columns.progress[0]?.session.id).toBe("session-1")
|
|
60
|
+
expect(columns.idle).toEqual([])
|
|
61
|
+
})
|
|
62
|
+
})
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import type { Session } from "@opencode-ai/sdk/v2/client"
|
|
2
|
+
|
|
3
|
+
export type BoardColumn = "progress" | "idle"
|
|
4
|
+
|
|
5
|
+
export type BoardCard = {
|
|
6
|
+
session: Session
|
|
7
|
+
projectDirectory: string
|
|
8
|
+
updatedAt: number
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
type OpenProject = { worktree: string }
|
|
12
|
+
|
|
13
|
+
type SessionStatus = {
|
|
14
|
+
type?: string
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
export function trackedProjectDirectories(projects: OpenProject[]) {
|
|
18
|
+
return [...new Set(projects.map((project) => project.worktree).filter(Boolean))]
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
export function buildBoardColumns(input: {
|
|
22
|
+
projectDirectories: string[]
|
|
23
|
+
sessionsByProject: Record<string, Session[]>
|
|
24
|
+
statusesByProject: Record<string, Record<string, SessionStatus | undefined>>
|
|
25
|
+
}) {
|
|
26
|
+
const cards = new Map<string, BoardCard & { column: BoardColumn }>()
|
|
27
|
+
|
|
28
|
+
for (const directory of input.projectDirectories) {
|
|
29
|
+
const sessions = input.sessionsByProject[directory] ?? []
|
|
30
|
+
const statuses = input.statusesByProject[directory] ?? {}
|
|
31
|
+
|
|
32
|
+
for (const session of sessions) {
|
|
33
|
+
if (!session?.id || session.time?.archived) continue
|
|
34
|
+
|
|
35
|
+
const updatedAt = session.time.updated ?? session.time.created ?? 0
|
|
36
|
+
const nextColumn: BoardColumn =
|
|
37
|
+
statuses[session.id]?.type === "busy" || statuses[session.id]?.type === "retry"
|
|
38
|
+
? "progress"
|
|
39
|
+
: "idle"
|
|
40
|
+
|
|
41
|
+
const existing = cards.get(session.id)
|
|
42
|
+
if (!existing) {
|
|
43
|
+
cards.set(session.id, {
|
|
44
|
+
column: nextColumn,
|
|
45
|
+
projectDirectory: directory,
|
|
46
|
+
session,
|
|
47
|
+
updatedAt,
|
|
48
|
+
})
|
|
49
|
+
continue
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
if (nextColumn === "progress") existing.column = "progress"
|
|
53
|
+
|
|
54
|
+
if (updatedAt > existing.updatedAt) {
|
|
55
|
+
existing.projectDirectory = directory
|
|
56
|
+
existing.session = session
|
|
57
|
+
existing.updatedAt = updatedAt
|
|
58
|
+
}
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
const columns: Record<BoardColumn, BoardCard[]> = {
|
|
63
|
+
progress: [],
|
|
64
|
+
idle: [],
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
for (const card of cards.values()) {
|
|
68
|
+
columns[card.column].push({
|
|
69
|
+
projectDirectory: card.projectDirectory,
|
|
70
|
+
session: card.session,
|
|
71
|
+
updatedAt: card.updatedAt,
|
|
72
|
+
})
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
for (const key of Object.keys(columns) as BoardColumn[]) {
|
|
76
|
+
columns[key].sort((a, b) => b.updatedAt - a.updatedAt)
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
return columns
|
|
80
|
+
}
|
package/src/pages/home.tsx
CHANGED
|
@@ -16,14 +16,7 @@ import { useGlobalSync } from "@/context/global-sync";
|
|
|
16
16
|
import { useLanguage } from "@/context/language";
|
|
17
17
|
import { IconButton } from "ikanban-ui/icon-button";
|
|
18
18
|
import type { Session } from "@opencode-ai/sdk/v2/client";
|
|
19
|
-
|
|
20
|
-
type BoardColumn = "progress" | "idle";
|
|
21
|
-
|
|
22
|
-
type BoardCard = {
|
|
23
|
-
session: Session;
|
|
24
|
-
projectDirectory: string;
|
|
25
|
-
updatedAt: number;
|
|
26
|
-
};
|
|
19
|
+
import { buildBoardColumns, trackedProjectDirectories, type BoardCard, type BoardColumn } from "./home/helpers";
|
|
27
20
|
|
|
28
21
|
const homeStyles = {
|
|
29
22
|
border: { border: "1px solid var(--border-weak-base)" },
|
|
@@ -62,18 +55,10 @@ export default function Home() {
|
|
|
62
55
|
const globalSDK = useGlobalSDK();
|
|
63
56
|
const server = useServer();
|
|
64
57
|
const language = useLanguage();
|
|
65
|
-
const
|
|
66
|
-
return sync.data.project
|
|
67
|
-
.slice()
|
|
68
|
-
.sort(
|
|
69
|
-
(a, b) =>
|
|
70
|
-
(b.time.updated ?? b.time.created) -
|
|
71
|
-
(a.time.updated ?? a.time.created),
|
|
72
|
-
);
|
|
73
|
-
});
|
|
58
|
+
const trackedProjects = createMemo(() => trackedProjectDirectories(server.projects.list()));
|
|
74
59
|
|
|
75
60
|
const [rootSessions, { mutate: mutateRootSessions }] = createResource(
|
|
76
|
-
|
|
61
|
+
trackedProjects,
|
|
77
62
|
async (directories) => {
|
|
78
63
|
const entries = await Promise.all(
|
|
79
64
|
directories.map(async (directory) => {
|
|
@@ -95,45 +80,24 @@ export default function Home() {
|
|
|
95
80
|
);
|
|
96
81
|
|
|
97
82
|
const boardColumns = createMemo<Record<BoardColumn, BoardCard[]>>(() => {
|
|
98
|
-
const now = Date.now();
|
|
99
|
-
const columns: Record<BoardColumn, BoardCard[]> = {
|
|
100
|
-
progress: [],
|
|
101
|
-
idle: [],
|
|
102
|
-
};
|
|
103
83
|
const sessionsByProject = rootSessions() ?? {};
|
|
84
|
+
const statusesByProject = Object.fromEntries(
|
|
85
|
+
trackedProjects().map((directory) => {
|
|
86
|
+
const [store] = sync.child(directory);
|
|
87
|
+
return [directory, store.session_status] as const;
|
|
88
|
+
}),
|
|
89
|
+
);
|
|
104
90
|
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
const status = store.session_status[session.id];
|
|
111
|
-
const updatedAt = session.time.updated ?? session.time.created;
|
|
112
|
-
const card = {
|
|
113
|
-
session,
|
|
114
|
-
projectDirectory: project.worktree,
|
|
115
|
-
updatedAt,
|
|
116
|
-
};
|
|
117
|
-
|
|
118
|
-
if (status?.type === "busy" || status?.type === "retry") {
|
|
119
|
-
columns.progress.push(card);
|
|
120
|
-
continue;
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
columns.idle.push(card);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
|
|
127
|
-
for (const key of Object.keys(columns) as BoardColumn[]) {
|
|
128
|
-
columns[key].sort((a, b) => b.updatedAt - a.updatedAt);
|
|
129
|
-
}
|
|
130
|
-
|
|
131
|
-
return columns;
|
|
91
|
+
return buildBoardColumns({
|
|
92
|
+
projectDirectories: trackedProjects(),
|
|
93
|
+
sessionsByProject,
|
|
94
|
+
statusesByProject,
|
|
95
|
+
});
|
|
132
96
|
});
|
|
133
97
|
|
|
134
98
|
createEffect(() => {
|
|
135
|
-
for (const
|
|
136
|
-
sync.child(
|
|
99
|
+
for (const directory of trackedProjects()) {
|
|
100
|
+
sync.child(directory);
|
|
137
101
|
}
|
|
138
102
|
});
|
|
139
103
|
|
|
@@ -249,7 +213,7 @@ export default function Home() {
|
|
|
249
213
|
</div>
|
|
250
214
|
|
|
251
215
|
<Switch>
|
|
252
|
-
<Match when={
|
|
216
|
+
<Match when={trackedProjects().length > 0}>
|
|
253
217
|
<div class="mt-6 flex w-full flex-col gap-6">
|
|
254
218
|
<section class="flex flex-col gap-4">
|
|
255
219
|
<div class="grid gap-3 lg:grid-cols-2">
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import{u as Q,a as U,b as W,c as X,d as Y,e as Z,f as ee,g as te,h as R,i as re,j as se,k as t,l as s,L as ae,B as L,m as y,n as oe,o as ne,D as ie,M as O,I as F,s as $,S as q,p as K,q as le,t as b,F as ce,r as de,v as ue,w as ge}from"./index-WJDzUYhg.js";var me=b("<div>"),ve=b('<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">'),be=b('<div class="mt-6 rounded-2xl border border-dashed px-6 py-10 shadow-xs-border-base"><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 shadow-xs-border-base"></div><div class="flex flex-col gap-1 items-center justify-center"><div class="text-14-medium text-text-strong"></div><div class="text-12-regular text-text-weak">'),fe=b('<div class="mx-auto w-full max-w-7xl px-4 py-6 md:px-6 md:py-8"><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 shadow-xs-border-base"></div><div><div class="text-18-medium text-text-strong"></div><div class="mt-0.5 text-12-regular text-text-weak"></div></div></div></div><div class="flex items-center gap-2 self-start md:justify-end">'),xe=b('<div class="rounded-xl border border-dashed px-3 py-8 text-center text-12-regular text-text-weak">'),pe=b('<section class="rounded-2xl p-3 md:p-4 min-h-72 shadow-xs-border-base"><div class="flex items-center justify-between gap-3"><div class="flex items-center gap-2 min-w-0"><div></div><div class="text-14-medium text-text-strong"></div></div><div class="text-12-mono text-text-weak"></div></div><div class="mt-3 flex flex-col gap-2">'),he=b('<span class="min-w-0 flex-1 truncate text-12-regular text-text-weak">'),we=b('<div class="flex shrink-0 items-center gap-2 text-12-regular text-text-weak"><span>'),ke=b('<div class="overflow-hidden rounded-xl transition-colors"><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">');const x={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))"}};function $e(){const o=Q(),B=U(),P=W(),p=X(),_=Y(),j=Z(),m=ee(),l=te(),h=R(()=>o.data.project.slice().sort((e,r)=>(r.time.updated??r.time.created)-(e.time.updated??e.time.created))),[E,{mutate:a}]=re(()=>h().map(e=>e.worktree),async e=>{const r=await Promise.all(e.map(async n=>{const d=((await j.client.session.list({directory:n,roots:!0})).data??[]).filter(v=>!!v?.id&&!v.time?.archived);return[n,d]}));return Object.fromEntries(r)}),u=R(()=>{const e={progress:[],idle:[]},r=E()??{};for(const n of h()){const[c]=o.child(n.worktree),d=r[n.worktree]??[];for(const v of d){const C=c.session_status[v.id],M=v.time.updated??v.time.created,S={session:v,projectDirectory:n.worktree,updatedAt:M};if(C?.type==="busy"||C?.type==="retry"){e.progress.push(S);continue}e.idle.push(S)}}for(const n of Object.keys(e))e[n].sort((c,d)=>d.updatedAt-c.updatedAt);return e});se(()=>{for(const e of h())o.child(e.worktree)});const f=R(()=>{const e=m.healthy();return e===!0?"bg-icon-success-base":e===!1?"bg-icon-critical-base":"bg-border-weak-base"});function z(e){B.projects.open(e),m.projects.touch(e),_(`/${K(e)}`)}function A(e,r){B.projects.open(e),m.projects.touch(e),_(`/${K(e)}/${r}`)}async function i(e,r){const[,n]=o.child(e,{bootstrap:!1});await j.client.session.update({sessionID:r,time:{archived:Date.now()}}),a(c=>c?.[e]?{...c,[e]:c[e].filter(d=>d.id!==r)}:c),n("session",c=>c.filter(d=>d.id!==r))}async function I(){function e(r){if(Array.isArray(r))for(const n of r)z(n);else r&&z(r)}if(P.openDirectoryPickerDialog&&m.isLocal()){const r=await P.openDirectoryPickerDialog?.({title:l.t("command.project.open"),multiple:!0});e(r)}else p.show(()=>s(le,{multiple:!0,onSelect:e}),()=>e(null))}return(()=>{var e=fe(),r=e.firstChild,n=r.firstChild,c=n.firstChild,d=c.firstChild,v=d.nextSibling,C=v.firstChild,M=C.nextSibling,S=n.nextSibling;return t(d,s(ae,{class:"w-6 opacity-90"})),t(C,()=>l.t("home.sessionBoard")),t(M,()=>l.t("home.sessionBoard.description")),t(S,s(L,{icon:"folder-add-left",size:"normal",class:"pl-2 pr-3",onClick:I,get children(){return l.t("command.project.open")}}),null),t(S,s(L,{size:"normal",variant:"ghost",class:"pr-3 text-13-regular text-text-weak",onClick:()=>p.show(()=>s(ie,{})),get children(){return[(()=>{var g=me();return y(w=>oe(g,{"size-2 rounded-full":!0,[f()]:!0},w)),g})(),ne(()=>m.name)]}}),null),t(e,s(q,{get children(){return[s(O,{get when(){return h().length>0},get children(){var g=ve(),w=g.firstChild,k=w.firstChild;return t(k,s(N,{get title(){return l.t("home.sessionBoard.progress")},icon:"brain",tone:"progress",get cards(){return u().progress},onOpen:A,onArchive:i,get empty(){return l.t("home.sessionBoard.emptyProgress")}}),null),t(k,s(N,{get title(){return l.t("home.sessionBoard.idle")},icon:"dash",tone:"idle",get cards(){return u().idle},onOpen:A,onArchive:i,get empty(){return l.t("home.sessionBoard.emptyIdle")}}),null),g}}),s(O,{when:!0,get children(){var g=be(),w=g.firstChild,k=w.firstChild,H=k.nextSibling,G=H.firstChild,T=G.nextSibling;return t(k,s(F,{name:"folder-add-left",size:"large"})),t(G,()=>l.t("home.empty.title")),t(T,()=>l.t("home.empty.description")),t(w,s(L,{class:"mt-1 px-3",onClick:I,get children(){return l.t("command.project.open")}}),null),y(D=>{var V=x.emptyPanel,J=x.emptyIcon;return D.e=$(g,V,D.e),D.t=$(k,J,D.t),D},{e:void 0,t:void 0}),g}})]}}),null),y(g=>$(d,x.heroIcon,g)),e})()}function N(o){const B=()=>o.tone==="progress"?"bg-surface-base-hover text-icon-success-base border-border-weak-base":"bg-surface-inset-base text-icon-base border-border-weak-base",P=()=>o.tone==="progress"?{...x.border,background:"linear-gradient(180deg, color-mix(in srgb, var(--text-interactive-base) 8%, var(--background-stronger)), var(--background-stronger))"}:{...x.border,background:"linear-gradient(180deg, color-mix(in srgb, var(--surface-inset-base) 55%, var(--background-stronger)), var(--background-stronger))"};return(()=>{var p=pe(),_=p.firstChild,j=_.firstChild,m=j.firstChild,l=m.nextSibling,h=j.nextSibling,E=_.nextSibling;return t(m,s(F,{get name(){return o.icon},size:"small"})),t(l,()=>o.title),t(h,()=>o.cards.length),t(E,s(q,{get children(){return[s(O,{get when(){return o.cards.length>0},get children(){return s(ce,{get each(){return o.cards},children:a=>(()=>{var u=ke(),f=u.firstChild,z=f.firstChild,A=z.firstChild;return t(A,()=>a.session.title),t(f,s(de,{icon:"archive",variant:"ghost",class:"size-7 rounded-md","aria-label":"Archive session",onClick:i=>{i.preventDefault(),i.stopPropagation(),o.onArchive(a.projectDirectory,a.session.id)}}),null),t(u,s(L,{variant:"ghost",class:"flex h-auto w-full min-w-0 items-center justify-between gap-3 rounded-none border-0 bg-transparent px-3 pb-3 pt-2 text-left",onClick:()=>o.onOpen(a.projectDirectory,a.session.id),get children(){return[(()=>{var i=he();return t(i,()=>a.projectDirectory.replace(/^.*?([^/\\]+(?:[/\\][^/\\]+)?)$/,"$1")),i})(),(()=>{var i=we(),I=i.firstChild;return t(I,()=>ue.fromMillis(a.updatedAt).toRelative()),t(i,s(F,{name:"arrow-right",size:"small",class:"text-icon-weak shrink-0"}),null),i})()]}}),null),y(i=>$(u,x.card,i)),u})()})}}),s(O,{when:!0,get children(){var a=xe();return t(a,()=>o.empty),y(u=>$(a,x.emptyState,u)),a}})]}})),y(a=>{var u=P(),f=`size-7 rounded-full border flex items-center justify-center ${B()}`;return a.e=$(p,u,a.e),f!==a.t&&ge(m,a.t=f),a},{e:void 0,t:void 0}),p})()}export{$e as default};
|