From 594347d0971882c78e23cbeeebe7140ab6b37b82 Mon Sep 17 00:00:00 2001 From: Marek Zelinka Date: Mon, 3 Feb 2025 19:09:51 +0100 Subject: [PATCH] fixes --- app/components/error-boundary.tsx | 21 +++++++------- app/layouts/search.tsx | 2 +- app/root.tsx | 47 ++++++++++--------------------- app/routes/results.tsx | 2 +- 4 files changed, 27 insertions(+), 45 deletions(-) diff --git a/app/components/error-boundary.tsx b/app/components/error-boundary.tsx index 78810a9..021c54a 100644 --- a/app/components/error-boundary.tsx +++ b/app/components/error-boundary.tsx @@ -8,35 +8,34 @@ export function GeneralErrorBoundary() { : getErrorMessage(error); return ( -
-
+
+
-
-

- Oops! An error occurred… -

-

{errorMessage}

-
+

+ Oops! An error occurred… +

+

{errorMessage}

); } function getErrorMessage(error: unknown) { + const fallbackMessage = "Unknown Error"; + if (typeof error === "string") { return error; } - if ( error && typeof error === "object" && "message" in error && typeof error.message === "string" ) { - return error.message; + return error.message || fallbackMessage; } console.error("Unable to get error message for error", error); - return "Unknown Error"; + return fallbackMessage; } diff --git a/app/layouts/search.tsx b/app/layouts/search.tsx index a0b0d24..f36f7f8 100644 --- a/app/layouts/search.tsx +++ b/app/layouts/search.tsx @@ -4,7 +4,7 @@ import { SearchBar } from "~/components/search-bar"; export default function SearchLayout() { return ( -
+
diff --git a/app/root.tsx b/app/root.tsx index 79bbd5d..1d5aea2 100644 --- a/app/root.tsx +++ b/app/root.tsx @@ -1,14 +1,10 @@ import type { ReactNode } from "react"; -import { - isRouteErrorResponse, - Links, - Meta, - Outlet, - Scripts, - ScrollRestoration, -} from "react-router"; +import { Links, Meta, Outlet, Scripts, ScrollRestoration } from "react-router"; import type { Route } from "./+types/root"; import "./app.css"; +import { GeneralErrorBoundary } from "./components/error-boundary"; + +export const meta: Route.MetaFunction = () => [{ title: "DevFinder" }]; export const links: Route.LinksFunction = () => [ { rel: "preconnect", href: "https://fonts.googleapis.com" }, @@ -32,7 +28,7 @@ export function Layout({ children }: { children: ReactNode }) { - + {children} @@ -42,34 +38,21 @@ export function Layout({ children }: { children: ReactNode }) { } export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) { - let message = "Oops!"; - let details = "An unexpected error occurred."; - let stack: string | undefined; - - if (isRouteErrorResponse(error)) { - message = error.status === 404 ? "404" : "Error"; - details = - error.status === 404 - ? "The requested page could not be found." - : error.statusText || details; - } else if (import.meta.env.DEV && error && error instanceof Error) { - details = error.message; - stack = error.stack; - } - return ( -
-

{message}

-

{details}

- {stack && ( - 
-          {stack}
-
- )} +
+
+
+
+ +
+
+
); } export default function App() { + throw new Error(); + return ; } diff --git a/app/routes/results.tsx b/app/routes/results.tsx index be1ec41..aeca3da 100644 --- a/app/routes/results.tsx +++ b/app/routes/results.tsx @@ -12,7 +12,7 @@ import type { Route } from "./+types/results"; export function meta({ data, error }: Route.MetaArgs) { return [ { - title: error ? "Not Found" : (data.user.name ?? `@${data.user.login}`), + title: `${error ? "Not Found" : (data.user.name ?? `@${data.user.login}`)} | DevFinder`, }, ]; }