apunkt/dograh
1
0
Fork 0
mirror of https://github.com/dograh-hq/dograh.git synced 2026-06-22 08:38:13 +02:00
Code Issues Projects Releases Packages Wiki Activity

feat: show error if quota is exceeded

Browse source
This commit is contained in:
Abhishek Kumar 2025-11-26 17:40:11 +07:00
parent 3d710cafb1
commit b804daff77
5 changed files with 219 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

37
ui/src/app/workflow/[workflowId]/run/[runId]/components/ApiKeyErrorDialog.tsx
View file

@ -1,3 +1,5 @@
import { AlertCircle, CreditCard, Key } from "lucide-react";
import { Button } from "@/components/ui/button";
import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@/components/ui/dialog";
@ -14,18 +16,43 @@ export const ApiKeyErrorDialog = ({
error,
onNavigateToApiKeys
}: ApiKeyErrorDialogProps) => {
// Check if this is a quota error based on the error message
const isQuotaError = error?.toLowerCase().includes('insufficient') ||
error?.toLowerCase().includes('credits') ||
error?.toLowerCase().includes('quota');
const title = isQuotaError ? "Insufficient Credits" : "API Configuration Error";
const icon = isQuotaError ? <CreditCard className="h-5 w-5 text-orange-500" /> : <Key className="h-5 w-5 text-red-500" />;
const buttonText = isQuotaError ? "Add Credits" : "Go to API Keys Settings";
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent>
<DialogContent className="sm:max-w-md">
<DialogHeader>
<DialogTitle>API Key Error</DialogTitle>
<DialogDescription className="text-red-500 whitespace-pre-line">
{error}
<DialogTitle className="flex items-center gap-2">
{icon}
{title}
</DialogTitle>
<DialogDescription className="pt-3" asChild>
<div className="flex items-start gap-2">
<AlertCircle className="h-4 w-4 text-muted-foreground mt-0.5 flex-shrink-0" />
<div className="text-sm space-y-1">
<p className="font-medium text-foreground">{error}</p>
{isQuotaError && (
<p className="text-muted-foreground">
Your Dograh service credits are too low to start a call.
</p>
)}
</div>
</div>
</DialogDescription>
</DialogHeader>
<DialogFooter>
<Button variant="outline" onClick={() => onOpenChange(false)}>
Cancel
</Button>
<Button onClick={onNavigateToApiKeys}>
Go to API Keys Settings
{buttonText}
</Button>
</DialogFooter>
</DialogContent>

27
ui/src/app/workflow/[workflowId]/run/[runId]/hooks/useWebSocketRTC.tsx
View file

@ -213,7 +213,32 @@ export const useWebSocketRTC = ({ workflowId, workflowRunId, accessToken, initia
break;
case 'error':
logger.error('Server error:', message.payload);
// Check if this is a quota exceeded error
if (message.payload?.error_type === 'quota_exceeded') {
// Log as info since it's a handled business logic case
logger.info('Quota exceeded, showing user dialog:', message.payload.message);
// Set error state for display
setApiKeyError(message.payload.message || 'Service quota exceeded');
setApiKeyModalOpen(true);
// Stop the connection gracefully
setConnectionStatus('failed');
setConnectionActive(false);
// Close WebSocket and peer connection
if (wsRef.current) {
wsRef.current.close();
wsRef.current = null;
}
if (pcRef.current) {
pcRef.current.close();
pcRef.current = null;
}
} else {
// Log other errors as actual errors
logger.error('Server error:', message.payload);
}
break;
default: