Fix bug in error handler response handling

Change background of Sonner

frontend/@/components/ui/sonner.tsx

@@ -13,7 +13,7 @@ const Toaster = ({ ...props }: ToasterProps) => {
       toastOptions={{
         classNames: {
           toast:
-            "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+            "group toast group-[.toaster]:bg-content1 group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
           description: "group-[.toast]:text-muted-foreground",
           actionButton:
             "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",

frontend/App.tsx

@@ -11,7 +11,8 @@ import {ErrorHandlingMiddleware} from "Frontend/util/middleware";
 
 export default function App() {
     const navigate = useNavigate();
-    client.middlewares.push(ErrorHandlingMiddleware);
+
+    client.middlewares = [ErrorHandlingMiddleware];
 
     return (
         <NextUIProvider className="size-full" navigate={navigate}>

frontend/util/middleware.ts

@@ -2,19 +2,30 @@ import {Middleware, MiddlewareContext, MiddlewareNext} from '@hilla/frontend';
 import {toast} from "sonner";
 import {getReasonPhrase} from "http-status-codes";
 
-export const ErrorHandlingMiddleware: Middleware = async function(
+export const ErrorHandlingMiddleware: Middleware = async function (
     context: MiddlewareContext,
     next: MiddlewareNext
 ) {
     const {endpoint, method} = context;
 
-    let response: Response = await next(context);
-    if(!response.ok) {
-        //Ignore calls to UserEndpoint.getUserInfo since they are managed by Hilla and called on initial load
-        if(endpoint == "UserEndpoint" && method == "getUserInfo") return response;
+    let originalResponse = (await next(context));
 
-        toast.error(`${getReasonPhrase(response.status)}`, {description: `${endpoint}.${method}`})
+    if (!originalResponse.ok) {
+        // .clone() is necessary because response.json() is one-time only and Hilla accesses it in its internal error handler
+        // @see https://developer.mozilla.org/en-US/docs/Web/API/Response/clone
+        let response: Response = originalResponse.clone();
+
+        //Ignore calls to UserEndpoint.getUserInfo since they are managed by Hilla and called on initial load
+        if (endpoint == "UserEndpoint" && method == "getUserInfo") return originalResponse;
+
+        let json: any = await response.json();
+
+        if (json.type == "dev.hilla.exception.EndpointException") {
+            toast.error(`${getReasonPhrase(response.status)}`, {description: `${json.message}`});
+        } else {
+            toast.error(`${getReasonPhrase(response.status)}`, {description: `${endpoint}.${method}`})
+        }
     }
 
-    return response;
+    return originalResponse;
 }

frontend/views/SetupView.tsx

@@ -94,17 +94,13 @@ function SetupView() {
                     initialValues={{username: '', email: '', password: '', passwordRepeat: ''}}
                     onSubmit={
                         async (values: any) => {
-                            try {
-                                await SetupEndpoint.registerSuperAdmin({
+                            await SetupEndpoint.registerSuperAdmin({
                                     username: values.username,
                                     password: values.password,
                                     email: values.email
-                                });
-                                toast.success("Setup finished", {description: "Have fun with Gameyfin!"});
-                                navigate('/login');
-                            } catch (e) {
-                                alert("An error occurred while completing the setup. Please try again.")
-                            }
+                            });
+                            toast.success("Setup finished", {description: "Have fun with Gameyfin!"});
+                            navigate('/login');
                         }
                     }
                 >