Spaces:
Sleeping
Sleeping
File size: 1,991 Bytes
7c2c194 | 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 | /**
* @license
* SPDX-License-Identifier: Apache-2.0
*/
import { useLiveAPIContext } from '@/contexts/LiveAPIContext';
import React, { useEffect, useState } from 'react';
export interface ExtendedErrorType {
code?: number;
message?: string;
status?: string;
}
export default function ErrorScreen() {
const { client } = useLiveAPIContext();
const [error, setError] = useState<{ message?: string } | null>(null);
useEffect(() => {
function onError(error: ErrorEvent) {
console.error(error);
setError(error);
}
client.on('error', onError);
return () => {
client.off('error', onError);
};
}, [client]);
const quotaErrorMessage =
'Gemini Live API in AI Studio has a limited free quota each day. Come back tomorrow to continue.';
let errorMessage = 'Something went wrong. Please try again.';
let rawMessage: string | null = error?.message || null;
let tryAgainOption = true;
if (error?.message?.includes('RESOURCE_EXHAUSTED')) {
errorMessage = quotaErrorMessage;
rawMessage = null;
tryAgainOption = false;
}
if (!error) {
return <div style={{ display: 'none' }} />;
}
return (
<div className="error-screen">
<div
style={{
fontSize: 48,
}}
>
💔
</div>
<div
className="error-message-container"
style={{
fontSize: 22,
lineHeight: 1.2,
opacity: 0.5,
}}
>
{errorMessage}
</div>
{tryAgainOption ? (
<button
className="close-button"
onClick={() => {
setError(null);
}}
>
Close
</button>
) : null}
{rawMessage ? (
<div
className="error-raw-message-container"
style={{
fontSize: 15,
lineHeight: 1.2,
opacity: 0.4,
}}
>
{rawMessage}
</div>
) : null}
</div>
);
}
|