diff --git a/ui/src/app/(home)/_components/announcements.tsx b/ui/src/app/(home)/_components/announcements.tsx
index cb9637b9..387b8c2f 100644
--- a/ui/src/app/(home)/_components/announcements.tsx
+++ b/ui/src/app/(home)/_components/announcements.tsx
@@ -26,4 +26,4 @@ const Announcements = async () => {
);
};
-export default Announcements;
+export default Announcements;
\ No newline at end of file
diff --git a/ui/src/app/ErrorBoundary.tsx b/ui/src/app/ErrorBoundary.tsx
new file mode 100644
index 00000000..1ef5dccf
--- /dev/null
+++ b/ui/src/app/ErrorBoundary.tsx
@@ -0,0 +1,10 @@
+'use client';
+import ApiErrorModal from '@/components/modal/api-error-modal';
+
+export default function ErrorBoundary() {
+ return (
+ <>
+
+
+ );
+}
diff --git a/ui/src/app/layout.tsx b/ui/src/app/layout.tsx
index 4f99a11f..98fe2c8e 100644
--- a/ui/src/app/layout.tsx
+++ b/ui/src/app/layout.tsx
@@ -2,6 +2,7 @@ import './globals.css';
import { Source_Sans_3 } from 'next/font/google';
import Navbar from '@/components/layout/navbar/navbar';
import Footer from '@/components/layout/footer';
+import ErrorBoundary from '@/app/ErrorBoundary';
import type { Metadata } from 'next';
const sourceSans3 = Source_Sans_3({
@@ -20,13 +21,15 @@ const RootLayout = ({
}: Readonly<{
children?: React.ReactNode;
}>) => (
-
-
-
- {children}
-
-
-
+
+
+
+
+ {children}
+
+
+
+
);
export default RootLayout;
diff --git a/ui/src/lib/http-client.ts b/ui/src/lib/http-client.ts
index 3d6b2cd9..b1977813 100644
--- a/ui/src/lib/http-client.ts
+++ b/ui/src/lib/http-client.ts
@@ -261,10 +261,11 @@ export const deleteRequestAsync = async (
*
* @returns The res.json()
*/
-const handleFetch = (res: Response, httpMethod: HTTPMethod) => {
+const handleFetch = async (res: Response, httpMethod: HTTPMethod) => {
if (!res.ok) {
const error = Error(`${res.status} error from ${httpMethod} ${res.url}`);
- sendStackTrace(error.stack as string);
+ await sendStackTrace(error.stack as string);
+ throw error;
}
return res.json();
};
diff --git a/ui/tests/lib/fetchers.test.ts b/ui/tests/lib/fetchers.test.ts
index 6ea82ae5..24fae36a 100644
--- a/ui/tests/lib/fetchers.test.ts
+++ b/ui/tests/lib/fetchers.test.ts
@@ -151,7 +151,8 @@ describe('fetchers', () => {
fetchMock.mockResponse(JSON.stringify(mockError), { status: 500 });
let res = ownedGrouping(groupPaths, page, size, sortString, isAscending);
await jest.advanceTimersByTimeAsync(5000);
- expect(await res).toEqual(mockError);
+ expect(await res).toBeInstanceOf(Error);
+ expect((await res).message).toMatch(/500 error from POST/);
fetchMock.mockReject(() => Promise.reject(mockError));
res = ownedGrouping(groupPaths, page, size, sortString, isAscending);