Make any error show on ErrorPage, not just route error responses (#5623)

* Make any error show on ErrorPage, not just route error responses

Closes #5620 by making any error show on the page so the user can copy
it for use in an issue. Previously, the logic was too narrow and only
showed the error on the page if `isRouterErrorResponse` was true.

* @nadr0's feedback

thanks for giving my crap work a review

* Update src/components/ErrorPage.tsx

Co-authored-by: Jonathan Tran <jonnytran@gmail.com>

* @nadr0 feedback, handle overflowing error case

---------

Co-authored-by: Jonathan Tran <jonnytran@gmail.com>
Co-authored-by: Kevin Nadro <nadr0@users.noreply.github.com>

src/components/ErrorPage.tsx

@@ -8,9 +8,32 @@ import {
   faTrash,
 } from '@fortawesome/free-solid-svg-icons'
 
+/** Type narrowing function of unknown error to a string */
+function errorMessage(error: unknown): string {
+  if (isRouteErrorResponse(error)) {
+    return `${error.status} ${error.statusText}`
+  } else if (error != undefined && error instanceof Error) {
+    return error.message
+  } else if (error && typeof error === 'object') {
+    return JSON.stringify(error)
+  } else if (typeof error === 'string') {
+    return error
+  } else {
+    return 'Unknown error'
+  }
+}
+
+/** Generate a GitHub issue URL from the error */
+function generateToUrl(error: unknown) {
+  const title: string = 'An unexpected error occurred'
+  const body = errorMessage(error)
+  const result = `https://github.com/KittyCAD/modeling-app/issues/new?title=${title}&body=${body}`
+  return result
+}
+
 export const ErrorPage = () => {
   let error = useRouteError()
-
+  // We log the error to the console no matter what
   console.error('error', error)
 
   return (
@@ -19,11 +42,9 @@ export const ErrorPage = () => {
         <h1 className="text-4xl mb-8 font-bold" data-testid="unexpected-error">
           An unexpected error occurred
         </h1>
-        {isRouteErrorResponse(error) && (
-          <p className="mb-8">
-            {error.status}: {error.data}
-          </p>
-        )}
+        <p className="mb-8 w-full overflow-aut">
+          <>{errorMessage(error)}</>
+        </p>
         <div className="flex justify-between gap-2 mt-6">
           {isDesktop() && (
             <ActionButton
@@ -54,7 +75,7 @@ export const ErrorPage = () => {
           <ActionButton
             Element="externalLink"
             iconStart={{ icon: faBug }}
-            to="https://github.com/KittyCAD/modeling-app/issues/new"
+            to={generateToUrl(error)}
           >
             Report Bug
           </ActionButton>