Skip to content

Demo: Chat-Message Streaming and Chat-Prompt Suggestions imporved err… #35507

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
DuckTieCorpMember wants to merge 1 commit into
base: main
Choose a base branch
from
+128 −60
Open

Demo: Chat-Message Streaming and Chat-Prompt Suggestions imporved err… #35507

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion apps/demos/Demos/Chat/MessageStreaming/Angular/app/ai/ai.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ export class AiService {
};

try {
const stream = await this.chatService.chat.completions.create(params, { signal });
const stream = await this.chatService.chat.completions.create(params, { signal, maxRetries: 0 });

for await (const event of stream) {
const delta = event.choices?.[0]?.delta?.content;
Expand Down
18 changes: 13 additions & 5 deletions apps/demos/Demos/Chat/MessageStreaming/Angular/app/app.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -163,8 +163,14 @@ export class AppService {
return id;
}

private alertLimitReached(): void {
this.alertsSubject.next([{ message: 'Request limit reached, try again in a minute.' }]);
private getErrorMessage(err: unknown): string {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
}

private alertError(message: string): void {
this.alertsSubject.next([{ message }]);

setTimeout(() => {
this.alertsSubject.next([]);
Expand Down Expand Up @@ -224,9 +230,11 @@ export class AppService {
} catch (e: unknown) {
this.typingUsersSubject.next([]);

if ((e as Error)?.name !== 'AbortError' && assistantId !== undefined) {
this.updateMessageText(assistantId, '');
this.alertLimitReached();
if (!this.abortController?.signal.aborted) {
if (assistantId !== undefined) {
this.updateMessageText(assistantId, '');
}
this.alertError(this.getErrorMessage(e));
}
} finally {
this.abortController = null;
Expand Down
4 changes: 2 additions & 2 deletions apps/demos/Demos/Chat/MessageStreaming/React/service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,8 @@ export async function getAIResponseStream(
};

try {
const stream = await chatService.chat.completions.create(params, { signal });
// eslint-disable-next-line no-restricted-syntax
const stream = await chatService.chat.completions.create(params, { signal, maxRetries: 0 });

for await (const event of stream) {
const delta = event.choices?.[0]?.delta?.content;
if (delta) {
Expand Down
20 changes: 14 additions & 6 deletions apps/demos/Demos/Chat/MessageStreaming/React/useApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,12 @@ function createDelayedRenderer({ delay = 20, onRender }: DelayedRendererOptions)
return { pushChunk, stop };
}

const getErrorMessage = (err: unknown): string => {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
};

export const useApi = () => {
const [alerts, setAlerts] = useState<ChatTypes.Alert[]>([]);
const [typingUsers, setTypingUsers] = useState<ChatTypes.User[]>([]);
Expand Down Expand Up @@ -109,9 +115,9 @@ export const useApi = () => {
return id;
}, []);

const alertLimitReached = useCallback((): void => {
const alertError = useCallback((message: string): void => {
setAlerts([{
message: 'Request limit reached, try again in a minute.',
message,
}]);

setTimeout(() => {
Expand Down Expand Up @@ -167,15 +173,17 @@ export const useApi = () => {
} catch (e: unknown) {
setTypingUsers([]);

if ((e as Error)?.name !== 'AbortError' && assistantId !== undefined) {
updateMessageText(assistantId, '');
alertLimitReached();
if (!abortControllerRef.current?.signal.aborted) {
if (assistantId !== undefined) {
updateMessageText(assistantId, '');
}
alertError(getErrorMessage(e));
}
} finally {
abortControllerRef.current = null;
setIsStreaming(false);
}
}, [alertLimitReached, insertAssistantPlaceholder, updateMessageText]);
}, [alertError, insertAssistantPlaceholder, updateMessageText]);

return {
alerts,
Expand Down
3 changes: 1 addition & 2 deletions apps/demos/Demos/Chat/MessageStreaming/ReactJs/service.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,8 +19,7 @@ export async function getAIResponseStream(messages, {
stream: true,
};
try {
const stream = await chatService.chat.completions.create(params, { signal });
// eslint-disable-next-line no-restricted-syntax
const stream = await chatService.chat.completions.create(params, { signal, maxRetries: 0 });
for await (const event of stream) {
const delta = event.choices?.[0]?.delta?.content;
if (delta) {
Expand Down
19 changes: 13 additions & 6 deletions apps/demos/Demos/Chat/MessageStreaming/ReactJs/useApi.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -56,6 +56,11 @@ function createDelayedRenderer({ delay = 20, onRender }) {
}
return { pushChunk, stop };
}
const getErrorMessage = (err) => {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
};
export const useApi = () => {
const [alerts, setAlerts] = useState([]);
const [typingUsers, setTypingUsers] = useState([]);
Expand Down Expand Up @@ -88,10 +93,10 @@ export const useApi = () => {
]);
return id;
}, []);
const alertLimitReached = useCallback(() => {
const alertError = useCallback((message) => {
setAlerts([
{
message: 'Request limit reached, try again in a minute.',
message,
},
]);
setTimeout(() => {
Expand Down Expand Up @@ -137,16 +142,18 @@ export const useApi = () => {
setTypingUsers([]);
} catch (e) {
setTypingUsers([]);
if (e?.name !== 'AbortError' && assistantId !== undefined) {
updateMessageText(assistantId, '');
alertLimitReached();
if (!abortControllerRef.current?.signal.aborted) {
if (assistantId !== undefined) {
updateMessageText(assistantId, '');
}
alertError(getErrorMessage(e));
}
} finally {
abortControllerRef.current = null;
setIsStreaming(false);
}
},
[alertLimitReached, insertAssistantPlaceholder, updateMessageText],
[alertError, insertAssistantPlaceholder, updateMessageText],
);
return {
alerts,
Expand Down
18 changes: 13 additions & 5 deletions apps/demos/Demos/Chat/MessageStreaming/Vue/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,8 +92,14 @@ function insertAssistantPlaceholder(): number {
return id;
}

function alertLimitReached(): void {
alerts.value = [{ message: 'Request limit reached, try again in a minute.' }];
function getErrorMessage(err: unknown): string {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
}

function alertError(message: string): void {
alerts.value = [{ message }];
setTimeout(() => { alerts.value = []; }, ALERT_TIMEOUT);
}

Expand Down Expand Up @@ -162,9 +168,11 @@ async function fetchAIResponse(message: DxChatTypes.Message): Promise<void> {
typingUsers.value = [];
} catch (e: unknown) {
typingUsers.value = [];
if ((e as Error)?.name !== 'AbortError' && assistantId !== undefined) {
updateMessageText(assistantId, '');
alertLimitReached();
if (!abortController?.signal.aborted) {
if (assistantId !== undefined) {
updateMessageText(assistantId, '');
}
alertError(getErrorMessage(e));
}
} finally {
abortController = null;
Expand Down
2 changes: 1 addition & 1 deletion apps/demos/Demos/Chat/MessageStreaming/Vue/service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@ export async function getAIResponseStream(
};

try {
const stream = await chatService.chat.completions.create(params, { signal });
const stream = await chatService.chat.completions.create(params, { signal, maxRetries: 0 });

for await (const event of stream) {
const delta = event.choices?.[0]?.delta?.content;
Expand Down
19 changes: 14 additions & 5 deletions apps/demos/Demos/Chat/MessageStreaming/jQuery/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ $(() => {
try {
const stream = await chatService.chat.completions.create(params, {
signal,
maxRetries: 0,
});

// eslint-disable-next-line no-restricted-syntax
Expand All @@ -85,11 +86,17 @@ $(() => {
}
}

function alertLimitReached() {
function getErrorMessage(err) {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
}

function alertError(message) {
instance.option({
alerts: [
{
message: 'Request limit reached, try again in a minute.',
message,
},
],
});
Expand Down Expand Up @@ -170,9 +177,11 @@ $(() => {

messages.pop();

if (e?.name !== 'AbortError' && assistantId) {
updateMessageText(assistantId, '');
alertLimitReached();
if (!abortController?.signal.aborted) {
if (assistantId) {
updateMessageText(assistantId, '');
}
alertError(getErrorMessage(e));
}
} finally {
abortController = null;
Expand Down
2 changes: 1 addition & 1 deletion apps/demos/Demos/Chat/PromptSuggestions/Angular/app/ai/ai.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ export class AiService {
temperature: 0.7,
};

const response = await this.chatService.chat.completions.create(params);
const response = await this.chatService.chat.completions.create(params, { maxRetries: 0 });
const data = { choices: response.choices };

return data.choices[0].message?.content;
Expand Down
14 changes: 10 additions & 4 deletions apps/demos/Demos/Chat/PromptSuggestions/Angular/app/app.service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -168,13 +168,19 @@ export class AppService {
this.messages.push({ role: 'assistant', content: aiResponse });
this.renderAssistantMessage(aiResponse);
}, 200);
} catch {
} catch (err: unknown) {
this.typingUsersSubject.next([]);
this.messages.pop();
this.alertLimitReached();
this.alertError(this.getErrorMessage(err));
}
}

getErrorMessage(err: unknown): string {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
}

renderAssistantMessage(text: string): void {
this.insertMessage({
id: Date.now(),
Expand All @@ -184,8 +190,8 @@ export class AppService {
});
}

alertLimitReached(): void {
this.setAlerts([{ message: 'Request limit reached, try again in a minute.' }]);
alertError(message: string): void {
this.setAlerts([{ message }]);

setTimeout(() => {
this.setAlerts([]);
Expand Down
2 changes: 1 addition & 1 deletion apps/demos/Demos/Chat/PromptSuggestions/React/service.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ export async function getAIResponse(messages: AIMessage[], delay?: number): Prom
temperature: 0.7,
};

const response = await chatService.chat.completions.create(params);
const response = await chatService.chat.completions.create(params, { maxRetries: 0 });
const data = { choices: response.choices };

if (delay) {
Expand Down
16 changes: 11 additions & 5 deletions apps/demos/Demos/Chat/PromptSuggestions/React/useApi.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,16 +38,22 @@ const dataItemToMessage = (item: ChatTypes.Message): AIMessage => ({

const getMessageHistory = (): AIMessage[] => [...dataSource.items()].map(dataItemToMessage);

const getErrorMessage = (err: unknown): string => {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
};

export const useApi = () => {
const [alerts, setAlerts] = useState<ChatTypes.Alert[]>([]);

const insertMessage = useCallback((data: ChatTypes.Message): void => {
dataSource.store().push([{ type: 'insert', data }]);
}, []);

const alertLimitReached = useCallback((): void => {
const alertError = useCallback((message: string): void => {
setAlerts([{
message: 'Request limit reached, try again in a minute.',
message,
}]);

setTimeout(() => {
Expand All @@ -71,10 +77,10 @@ export const useApi = () => {
author: assistant,
text: aiResponse,
});
} catch {
alertLimitReached();
} catch (err: unknown) {
alertError(getErrorMessage(err));
}
}, [alertLimitReached, insertMessage]);
}, [alertError, insertMessage]);

return {
alerts,
Expand Down
2 changes: 1 addition & 1 deletion apps/demos/Demos/Chat/PromptSuggestions/ReactJs/service.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ export async function getAIResponse(messages, delay) {
max_completion_tokens: 1000,
temperature: 0.7,
};
const response = await chatService.chat.completions.create(params);
const response = await chatService.chat.completions.create(params, { maxRetries: 0 });
const data = { choices: response.choices };
if (delay) {
await wait(delay);
Expand Down
15 changes: 10 additions & 5 deletions apps/demos/Demos/Chat/PromptSuggestions/ReactJs/useApi.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,15 +29,20 @@ const dataItemToMessage = (item) => ({
content: item.text,
});
const getMessageHistory = () => [...dataSource.items()].map(dataItemToMessage);
const getErrorMessage = (err) => {
if (err instanceof Error) return err.message;
if (typeof err === 'string') return err;
return 'Unknown error';
};
export const useApi = () => {
const [alerts, setAlerts] = useState([]);
const insertMessage = useCallback((data) => {
dataSource.store().push([{ type: 'insert', data }]);
}, []);
const alertLimitReached = useCallback(() => {
const alertError = useCallback((message) => {
setAlerts([
{
message: 'Request limit reached, try again in a minute.',
message,
},
]);
setTimeout(() => {
Expand All @@ -59,11 +64,11 @@ export const useApi = () => {
author: assistant,
text: aiResponse,
});
} catch {
alertLimitReached();
} catch (err) {
alertError(getErrorMessage(err));
}
},
[alertLimitReached, insertMessage],
[alertError, insertMessage],
);
return {
alerts,
Expand Down
Loading
Loading