Skip to content

Commit 6a03f28

Browse files
authored
feat: New Tools xStream and xRequest (#138)
* feat: new x-tools function xStream. * feat: new x-tools function xFetch * refactor: skip empty parts while split stream * refactor: add isValidString to check if a string is not empty or only contains whitespace characters * refactor: renamed and replaced transformPipe with a single transformStream option to enhance flexibility and improve TypeScript type inference. * refactor: default to using double newline characters to separate the stream * refactor: renamed and replaced separator with separators to enhance flexibility. * feat: new x-tools class XAdapter. refactor: add arg for XFetchMiddlewares.onRequest. * feat: add new x-tools class XAgent * feat: add dangerouslyApiKey option for XAgent. refactor: add isValidString check for splitEvent. fix: remove agent memo deps, avoid state anomalies caused by multiple instantiations * feat: new x-tools createXRequest * feat: new x-tools x-request. * refactor: ts * chore: adjust the directory * feat: new x-tools xRequest xStream. * fix: ci error * test: updated snapshots * chore: rename xRequest -> XRequest \ xStream -> XStream * chore: update bun.lockb * test: update snap
1 parent 034a4dc commit 6a03f28

33 files changed

+1790
-107
lines changed

bun.lockb

152 Bytes
Binary file not shown.

components/index.ts

+3
Original file line numberDiff line numberDiff line change
@@ -13,4 +13,7 @@ export { default as XProvider } from './x-provider';
1313
export type { XProviderProps } from './x-provider';
1414
export { default as useXChat } from './useXChat';
1515
export { default as useXAgent } from './useXAgent';
16+
export { default as XStream } from './x-stream';
17+
export type { XStreamOptions } from './x-stream';
18+
export { default as XRequest } from './x-request';
1619
export { default as version } from './version';

components/useXAgent/__tests__/__snapshots__/demo.test.ts.snap

+145-2
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,150 @@ Array [
6565
`;
6666

6767
exports[`renders components/useXAgent/demo/preset.tsx correctly 1`] = `
68-
<div>
69-
Wait for XFetch & XStream
68+
<div
69+
class="ant-splitter ant-splitter-horizontal"
70+
>
71+
<div
72+
class="ant-splitter-panel"
73+
style="flex-basis:50px"
74+
>
75+
<button
76+
class="ant-btn ant-btn-primary ant-btn-color-primary ant-btn-variant-solid"
77+
type="button"
78+
>
79+
<span>
80+
Agent Request
81+
</span>
82+
</button>
83+
</div>
84+
<div
85+
aria-valuemax="100"
86+
aria-valuemin="0"
87+
aria-valuenow="50"
88+
class="ant-splitter-bar"
89+
role="separator"
90+
>
91+
<div
92+
class="ant-splitter-bar-dragger"
93+
/>
94+
</div>
95+
<div
96+
class="ant-splitter-panel"
97+
style="flex-basis:50px"
98+
>
99+
<div
100+
class="ant-thought-chain ant-thought-chain-middle"
101+
style="margin-left:16px"
102+
>
103+
<div
104+
class="ant-thought-chain-item"
105+
>
106+
<div
107+
class="ant-thought-chain-item-header"
108+
>
109+
<span
110+
class="ant-avatar ant-avatar-circle ant-avatar-icon ant-thought-chain-item-icon"
111+
>
112+
<span
113+
aria-label="tags"
114+
class="anticon anticon-tags"
115+
role="img"
116+
>
117+
<svg
118+
aria-hidden="true"
119+
data-icon="tags"
120+
fill="currentColor"
121+
focusable="false"
122+
height="1em"
123+
viewBox="64 64 896 896"
124+
width="1em"
125+
>
126+
<path
127+
d="M483.2 790.3L861.4 412c1.7-1.7 2.5-4 2.3-6.3l-25.5-301.4c-.7-7.8-6.8-13.9-14.6-14.6L522.2 64.3c-2.3-.2-4.7.6-6.3 2.3L137.7 444.8a8.03 8.03 0 000 11.3l334.2 334.2c3.1 3.2 8.2 3.2 11.3 0zm62.6-651.7l224.6 19 19 224.6L477.5 694 233.9 450.5l311.9-311.9zm60.16 186.23a48 48 0 1067.88-67.89 48 48 0 10-67.88 67.89zM889.7 539.8l-39.6-39.5a8.03 8.03 0 00-11.3 0l-362 361.3-237.6-237a8.03 8.03 0 00-11.3 0l-39.6 39.5a8.03 8.03 0 000 11.3l243.2 242.8 39.6 39.5c3.1 3.1 8.2 3.1 11.3 0l407.3-406.6c3.1-3.1 3.1-8.2 0-11.3z"
128+
/>
129+
</svg>
130+
</span>
131+
</span>
132+
<div
133+
class="ant-thought-chain-item-header-box"
134+
>
135+
<span
136+
class="ant-typography ant-typography-ellipsis ant-typography-ellipsis-single-line ant-thought-chain-item-title"
137+
>
138+
<strong>
139+
Agent Request Log
140+
</strong>
141+
</span>
142+
</div>
143+
</div>
144+
<div
145+
class="ant-thought-chain-item-content"
146+
>
147+
<div
148+
class="ant-thought-chain-item-content-box"
149+
>
150+
<div
151+
class="ant-descriptions"
152+
>
153+
<div
154+
class="ant-descriptions-view"
155+
>
156+
<table>
157+
<tbody>
158+
<tr
159+
class="ant-descriptions-row"
160+
>
161+
<td
162+
class="ant-descriptions-item"
163+
colspan="1"
164+
>
165+
<div
166+
class="ant-descriptions-item-container"
167+
>
168+
<span
169+
class="ant-descriptions-item-label"
170+
>
171+
Status
172+
</span>
173+
<span
174+
class="ant-descriptions-item-content"
175+
>
176+
-
177+
</span>
178+
</div>
179+
</td>
180+
</tr>
181+
<tr
182+
class="ant-descriptions-row"
183+
>
184+
<td
185+
class="ant-descriptions-item"
186+
colspan="1"
187+
>
188+
<div
189+
class="ant-descriptions-item-container"
190+
>
191+
<span
192+
class="ant-descriptions-item-label"
193+
>
194+
Update Times
195+
</span>
196+
<span
197+
class="ant-descriptions-item-content"
198+
>
199+
0
200+
</span>
201+
</div>
202+
</td>
203+
</tr>
204+
</tbody>
205+
</table>
206+
</div>
207+
</div>
208+
</div>
209+
</div>
210+
</div>
211+
</div>
212+
</div>
70213
</div>
71214
`;

components/useXAgent/demo/preset.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
## zh-CN
22

3-
基础用法。
3+
我们将 XRequest 作为预设请求,仅需配置 `baseURL``model` 即可
44

55
## en-US
66

7-
Basic usage.
7+
We will use XRequest as the default request, and only need to configure baseURL and model

components/useXAgent/demo/preset.tsx

+82-6
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,90 @@
1-
import { useXAgent } from '@ant-design/x';
1+
import { LoadingOutlined, TagsOutlined } from '@ant-design/icons';
2+
import { ThoughtChain, useXAgent } from '@ant-design/x';
3+
import { Button, Descriptions, Splitter } from 'antd';
24
import React from 'react';
35

6+
import type { ThoughtChainItem } from '@ant-design/x';
7+
8+
/**
9+
* 🔔 Please replace the BASE_URL, PATH, MODEL, API_KEY with your own values.
10+
*/
11+
const BASE_URL = 'https://api.example.com';
12+
const PATH = '/chat';
13+
const MODEL = 'gpt-3.5-turbo';
14+
/** 🔥🔥 Its dangerously! */
15+
// const API_KEY = '';
16+
17+
interface YourMessageType {
18+
role: string;
19+
content: string;
20+
}
21+
422
const App = () => {
5-
useXAgent({
6-
baseURL: 'https://mocks-server.ant.design',
7-
key: 'x-agent-demo',
8-
model: 'todo',
23+
const [status, setStatus] = React.useState<ThoughtChainItem['status']>();
24+
const [lines, setLines] = React.useState<any[]>([]);
25+
26+
const [agent] = useXAgent<YourMessageType>({
27+
baseURL: BASE_URL + PATH,
28+
model: MODEL,
29+
// dangerouslyApiKey: API_KEY
930
});
1031

11-
return <div>Wait for XFetch & XStream</div>;
32+
async function request() {
33+
setStatus('pending');
34+
35+
agent.request(
36+
{
37+
messages: [{ role: 'user', content: 'hello, who are u?' }],
38+
stream: true,
39+
},
40+
{
41+
onSuccess: (messages) => {
42+
setStatus('success');
43+
console.log('onSuccess', messages);
44+
},
45+
onError: (error) => {
46+
setStatus('error');
47+
console.error('onError', error);
48+
},
49+
onUpdate: (msg) => {
50+
setLines((pre) => [...pre, msg]);
51+
console.log('onUpdate', msg);
52+
},
53+
},
54+
);
55+
}
56+
57+
return (
58+
<Splitter>
59+
<Splitter.Panel>
60+
<Button type="primary" disabled={status === 'pending'} onClick={request}>
61+
Agent Request
62+
</Button>
63+
</Splitter.Panel>
64+
<Splitter.Panel>
65+
<ThoughtChain
66+
style={{ marginLeft: 16 }}
67+
items={[
68+
{
69+
title: 'Agent Request Log',
70+
status: status,
71+
icon: status === 'pending' ? <LoadingOutlined /> : <TagsOutlined />,
72+
description:
73+
status === 'error' &&
74+
agent.config.baseURL === BASE_URL + PATH &&
75+
'Please replace the BASE_URL, PATH, MODEL, API_KEY with your own values.',
76+
content: (
77+
<Descriptions column={1}>
78+
<Descriptions.Item label="Status">{status || '-'}</Descriptions.Item>
79+
<Descriptions.Item label="Update Times">{lines.length}</Descriptions.Item>
80+
</Descriptions>
81+
),
82+
},
83+
]}
84+
/>
85+
</Splitter.Panel>
86+
</Splitter>
87+
);
1288
};
1389

1490
export default App;

components/useXAgent/index.en-US.md

+20-11
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ Connect with the backend model to provide an abstract data flow.
1818
## Examples
1919

2020
<!-- prettier-ignore -->
21-
<code src="./demo/preset.tsx" debug>Preset Request</code>
21+
<code src="./demo/preset.tsx">Preset Request</code>
2222
<code src="./demo/custom.tsx">Custom Request</code>
2323

2424
## API
@@ -33,11 +33,12 @@ type useXAgent<AgentMessage> = (
3333

3434
Use preset protocol for request, protocol is not implemented yet.
3535

36-
| Property | Description | Type | Default | Version |
37-
| -------- | -------------------------- | ------ | ------- | ------- |
38-
| baseURL | Request for server address | string | - | |
39-
| key | Request key | string | - | |
40-
| model | Preset protocol model | `TODO` | - | |
36+
| Property | Description | Type | Default | Version |
37+
| --- | --- | --- | --- | --- |
38+
| baseURL | Request for server address | string | - | |
39+
| key | Request key | string | - | |
40+
| model | Preset protocol model | string | - | |
41+
| dangerouslyApiKey | Enabling this option can be dangerous, exposing secret API credentials | string | - | - |
4142

4243
### XAgentConfigCustom
4344

@@ -50,11 +51,15 @@ Custom request protocol.
5051
#### RequestFn
5152

5253
```tsx | pure
53-
type RequestFn<AgentMessage> = (
54-
info: { message: AgentMessage; messages: AgentMessage[] },
54+
interface RequestFnInfo<Message> extends Partial<XAgentConfigPreset>, AnyObject {
55+
messages?: Message[];
56+
}
57+
58+
type RequestFn<Message> = (
59+
info: RequestFnInfo<Message>,
5560
callbacks: {
56-
onUpdate: (message: AgentMessage) => void;
57-
onSuccess: (message: AgentMessage) => void;
61+
onUpdate: (message: Message) => void;
62+
onSuccess: (message: Message) => void;
5863
onError: (error: Error) => void;
5964
},
6065
) => void;
@@ -68,8 +73,12 @@ type RequestFn<AgentMessage> = (
6873
| isRequesting | Check if it is requesting | () => boolean | |
6974

7075
```tsx | pure
76+
interface AgentRequestFnInfo<Message> extends Partial<XAgentConfigPreset>, AnyObject {
77+
messages?: Message[];
78+
}
79+
7180
type AgentRequestFn<AgentMessage> = (
72-
info: { message: AgentMessage; messages?: AgentMessage[] },
81+
info: AgentRequestFnInfo<Message>,
7382
callbacks: {
7483
onUpdate: (message: AgentMessage) => void;
7584
onSuccess: (message: AgentMessage) => void;

0 commit comments

Comments
 (0)