5a00822690
Replace hardcoded "Failed to fetch usage" in the Dashboard tab with the ErrorMessage component so errors like TOKEN_EXPIRED, HTTP 429, and network failures display human-readable text consistent with the detail tabs. Also improve HTTP error copy and add network-level error detection. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
48 lines
1.8 KiB
TypeScript
48 lines
1.8 KiB
TypeScript
import { View, Text } from "react-native";
|
|
|
|
const ERROR_MESSAGES: Record<string, string> = {
|
|
TOKEN_EXPIRED: "Your session token has expired. Please reconfigure.",
|
|
MISSING_ACCESS_TOKEN: "auth.json is missing the accessToken field.",
|
|
INVALID_JSON: "The selected file is not valid JSON.",
|
|
NO_ORGS_FOUND: "No Claude organizations found for this session key.",
|
|
INVALID_CODEX_RESPONSE:
|
|
"Codex returned an unexpected response. The app was kept safe from invalid data.",
|
|
INVALID_CLAUDE_RESPONSE:
|
|
"Claude returned an unexpected usage response. The app was kept safe from invalid data.",
|
|
INVALID_CLAUDE_ORGS_RESPONSE:
|
|
"Claude returned an unexpected organizations response.",
|
|
UNKNOWN_ERROR: "An unknown error occurred. Try refreshing.",
|
|
};
|
|
|
|
function humanize(code: string): string {
|
|
if (code.startsWith("HTTP_ERROR_")) {
|
|
const status = code.replace("HTTP_ERROR_", "");
|
|
if (status === "429") return "Rate limited by the server. Try again shortly.";
|
|
if (status === "500" || status === "502" || status === "503")
|
|
return `Server error (${status}). The service may be down.`;
|
|
return `Unexpected server response (HTTP ${status}).`;
|
|
}
|
|
if (
|
|
code === "Network request failed" ||
|
|
code.includes("fetch") ||
|
|
code.includes("network")
|
|
) {
|
|
return "Network error. Check your internet connection and try again.";
|
|
}
|
|
return ERROR_MESSAGES[code] ?? `Unexpected error: ${code}`;
|
|
}
|
|
|
|
interface ErrorMessageProps {
|
|
message: string | null;
|
|
}
|
|
|
|
export function ErrorMessage({ message }: ErrorMessageProps) {
|
|
if (!message) return null;
|
|
|
|
return (
|
|
<View className="bg-red-50 dark:bg-red-900/30 border border-red-200 dark:border-red-800 rounded-xl px-3 py-2.5 mb-3">
|
|
<Text className="text-sm text-red-700 dark:text-red-300">{humanize(message)}</Text>
|
|
</View>
|
|
);
|
|
}
|