1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
import React, { useEffect, useState } from "react";
import type { Server } from "../src/server/server";
import type { Session } from "../src/session/session";
import { hc } from "hono/client";
import { createInterface, Interface } from "readline";
const client = hc<Server.App>(`http://localhost:16713`);
const session = await client.session_create.$post().then((res) => res.json());
const initial: {
session: {
info: {
[sessionID: string]: Session.Info;
};
message: {
[sessionID: string]: {
[messageID: string]: Session.Message;
};
};
};
} = {
session: {
info: {
[session.id]: session
},
message: {
[session.id]: {}
},
},
};
import { render, Text, Newline, useStdout, Box } from "ink";
import TextInput from "ink-text-input"
function App() {
const [state, setState] = useState(initial)
const [input, setInput] = useState("")
useEffect(() => {
fetch("http://localhost:16713/event")
.then(stream => {
const decoder = new TextDecoder();
stream.body!.pipeTo(
new WritableStream({
write(chunk) {
const data = decoder.decode(chunk);
if (data.startsWith("data: ")) {
try {
const event = JSON.parse(data.substring(6));
switch (event.type) {
case "storage.write":
const splits: string[] = event.properties.key.split("/");
let item = state as any;
for (let i = 0; i < splits.length; i++) {
const part = splits[i];
if (i === splits.length - 1) {
item[part] = event.properties.body;
continue;
}
if (!item[part]) item[part] = {};
item = item[part];
}
}
setState({ ...state })
} catch {
}
}
},
}),
)
});
}, [])
return (
<>
<Text>{session.title}</Text>
{
Object.values(state.session.message[session.id]).map(message => {
return Object.values(message.parts).map((part, index) => {
if (part.type === "text") {
return <Text key={`${message.id}-${index}`}>{message.role}: {part.text}</Text>
}
})
})
}
<Box gap={1} >
<Text>Input:</Text>
<TextInput
value={input}
onChange={setInput}
onSubmit={() => {
setInput("")
client.session_chat.$post({
json: {
sessionID: session.id,
parts: [
{
type: "text",
text: input,
},
],
}
})
}}
/>
</Box>
</>
);
};
console.clear();
render(<App />);
|