From fb2a057c0594174d69f7bfaa8347b43e7febdb9b Mon Sep 17 00:00:00 2001 From: Dan Ditomaso Date: Sat, 22 Feb 2025 15:14:44 -0500 Subject: [PATCH] feat: add chirpy to error page --- public/images/chirpy.svg | 1 + src/App.tsx | 2 +- src/components/UI/ErrorPage.tsx | 140 ++++++++++++++++------------- src/components/UI/Typography/P.tsx | 7 +- 4 files changed, 83 insertions(+), 67 deletions(-) create mode 100644 public/images/chirpy.svg diff --git a/public/images/chirpy.svg b/public/images/chirpy.svg new file mode 100644 index 00000000..d215662d --- /dev/null +++ b/public/images/chirpy.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App.tsx b/src/App.tsx index 2db189e3..3b756ed4 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -38,7 +38,7 @@ export const App = (): JSX.Element => {
{device ? ( -
+
diff --git a/src/components/UI/ErrorPage.tsx b/src/components/UI/ErrorPage.tsx index ca0921f0..a94af94d 100644 --- a/src/components/UI/ErrorPage.tsx +++ b/src/components/UI/ErrorPage.tsx @@ -10,71 +10,83 @@ export function ErrorPage({ error }: { error: Error }) { } return ( -
-
- - This is a little embarrassing... - -

- We are really sorry but an error occured in the web client that caused - it to crash. This is not supposed to happen and we are working hard to - fix it. -

-

- The best way to prevent this from happening again to you or anyone - else is to report the issue to us. -

-

Please include the following information in your report:

-
    -
  • What you were doing when the error occured
    • -
  • What you expected to happen
    • -
  • What actually happened
    • -
  • Any other information you think might be relevant
    • -
-

- You can report the issue to our{" "} - ", - logs: error?.stack, - })} - > - Github - - -

-

- Return to the dashboard -

+
+
+
+
+ + This is a little embarrassing... + +

+ We are really sorry but an error occured in the web client that + caused it to crash. This is not supposed to happen and we are + working hard to fix it. +

+

+ The best way to prevent this from happening again to you or anyone + else is to report the issue to us. +

+

Please include the following information in your report:

+
    +
  • What you were doing when the error occured
    • +
  • What you expected to happen
    • +
  • What actually happened
    • +
  • Any other information you think might be relevant
    • +
+

+ You can report the issue to our{" "} + ", + logs: error?.stack, + })} + > + Github + + +

+

+ Return to the dashboard +

-
- Error Details - - {error?.message ? ( - <> - - 
{`${error.message}`}
- - ) : null} - {error?.stack ? ( - <> - - 
{`${error.stack}`}
- - ) : null} - {!error?.message && !error?.stack ? ( - 
{error.toString()}
- ) : null} - -
+
+ Error Details + + {error?.message ? ( + <> + + 
{`${error.message}`}
+ + ) : null} + {error?.stack ? ( + <> + + 
{`${error.stack}`}
+ + ) : null} + {!error?.message && !error?.stack ? ( + 
+                    {error.toString()}
+
+ ) : null} + +
+
+ Chripy the Meshtastic error +
); diff --git a/src/components/UI/Typography/P.tsx b/src/components/UI/Typography/P.tsx index 33467596..4bfe56c3 100644 --- a/src/components/UI/Typography/P.tsx +++ b/src/components/UI/Typography/P.tsx @@ -1,7 +1,10 @@ +import { cn } from "@app/core/utils/cn"; + export interface PProps { children: React.ReactNode; + className?: string; } -export const P = ({ children }: PProps) => ( -

{children}

+export const P = ({ children, className }: PProps) => ( +

{children}

);