diff --git a/web/.eslintrc.js b/web/.eslintrc.js index e19530a..c3f2007 100644 --- a/web/.eslintrc.js +++ b/web/.eslintrc.js @@ -19,7 +19,7 @@ module.exports = { // Allow only double quotes and backticks quotes: ["error", "double"], // Warn if a line isn't indented with a multiple of 2 - indent: ["warn", 2], + indent: ["warn", 2, { "SwitchCase": 1 }], // Don't enforce any particular brace style curly: "off", // Allow only vars starting with _ to be ununsed vars @@ -64,7 +64,7 @@ module.exports = { "@typescript-eslint/quotes": ["error", "double"], semi: "off", "@typescript-eslint/semi": ["warn", "always"], - indent: ["warn", 2], + indent: ["warn", 2, { "SwitchCase": 1 }], "@typescript-eslint/indent": "off", "@typescript-eslint/comma-dangle": "warn", "keyword-spacing": "off", diff --git a/web/src/App.tsx b/web/src/App.tsx index 7df9afd..9bb6a36 100644 --- a/web/src/App.tsx +++ b/web/src/App.tsx @@ -22,7 +22,7 @@ const queryClient = new QueryClient({ // delay = Math.min(1000 * 2 ** attemptIndex, 30000) retry: true, useErrorBoundary: true, - suspense: true, + suspense: true }, mutations: { onError: (error) => { @@ -47,7 +47,7 @@ export function App() { return ( diff --git a/web/src/api/APIClient.ts b/web/src/api/APIClient.ts index bbb10b1..4e48e5d 100644 --- a/web/src/api/APIClient.ts +++ b/web/src/api/APIClient.ts @@ -20,7 +20,7 @@ interface HttpConfig { function encodeRFC3986URIComponent(str: string): string { return encodeURIComponent(str).replace( /[!'()*]/g, - (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}`, + (c) => `%${c.charCodeAt(0).toString(16).toUpperCase()}` ); } @@ -82,27 +82,27 @@ export async function HttpClient( const response = await window.fetch(`${baseUrl()}${endpoint}`, init); switch (response.status) { - case 204: + case 204: // 204 contains no data, but indicates success - return Promise.resolve({} as T); - case 401: + return Promise.resolve({} as T); + case 401: // Remove auth info from localStorage - AuthContext.reset(); + AuthContext.reset(); - // Show an error toast to notify the user what occurred - return Promise.reject(new Error(`[401] Unauthorized: "${endpoint}"`)); - case 404: - return Promise.reject(new Error(`[404] Not found: "${endpoint}"`)); - case 500: - const health = await window.fetch(`${baseUrl()}api/healthz/liveness`); - if (!health.ok) { - return Promise.reject( - new Error(`[500] Offline (Internal server error): "${endpoint}"`, { cause: "OFFLINE" }) - ); - } - break; - default: - break; + // Show an error toast to notify the user what occurred + return Promise.reject(new Error(`[401] Unauthorized: "${endpoint}"`)); + case 404: + return Promise.reject(new Error(`[404] Not found: "${endpoint}"`)); + case 500: + const health = await window.fetch(`${baseUrl()}api/healthz/liveness`); + if (!health.ok) { + return Promise.reject( + new Error(`[500] Offline (Internal server error): "${endpoint}"`, { cause: "OFFLINE" }) + ); + } + break; + default: + break; } const isJson = response.headers.get("Content-Type")?.includes("application/json"); diff --git a/web/src/components/alerts/ErrorPage.tsx b/web/src/components/alerts/ErrorPage.tsx index 4ed2335..bcd5690 100644 --- a/web/src/components/alerts/ErrorPage.tsx +++ b/web/src/components/alerts/ErrorPage.tsx @@ -17,11 +17,20 @@ export const ErrorPage = ({ error, resetErrorBoundary }: FallbackProps) => { } }); + const parseTitle = () => { + switch (error?.cause) { + case "OFFLINE": + return "Connection to Autobrr failed! Check the application state and verify your connectivity."; + default: + return "We caught an unrecoverable error!"; + } + }; + return (

- We caught an unrecoverable error! + {parseTitle()}

Please consider reporting this error to our @@ -67,7 +76,7 @@ export const ErrorPage = ({ error, resetErrorBoundary }: FallbackProps) => { ) : null} - You can try resetting the page state using the button provided below. + You can try resetting the page state using the button provided below or restarting your autobrr application. However, this is not guaranteed to fix the error.