reduce redundant trpc error handling code to function

src/pages/resources/[id]/edit.tsx

@@ -13,6 +13,7 @@ import { useRouter } from "next/router";
 import { HeaderFooterLayout } from "~/layouts/HeaderFooterLayout";
 import { QueryWaitWrapper } from "~/components/LoadingWrapper";
 import { type AuditoryResource } from "@prisma/client";
+import { parseTRPCErrorMessage } from "~/utils/parseTRPCError";
 
 const EditResourcePage = () => {
   const router = useRouter();
@@ -50,18 +51,7 @@ const EditResourcePage = () => {
         await router.push(`/resources/${data.id}`);
       },
       onError: (error) => {
-        try {
-          const zodErrors = JSON.parse(error.message) as unknown as { message: string }[];
-          setServerError(
-            zodErrors
-              .map((error) => {
-                return error.message;
-              })
-              .join(", ")
-          );
-        } catch {
-          setServerError(error.message);
-        }
+        setServerError(parseTRPCErrorMessage(error.message));
       },
     });
 

src/pages/resources/create.tsx

@@ -15,6 +15,7 @@ import {
 } from "~/components/admin/resources/form";
 import { HeaderFooterLayout } from "~/layouts/HeaderFooterLayout";
 import { api } from "~/utils/api";
+import { parseTRPCErrorMessage } from "~/utils/parseTRPCError";
 
 const EditResourcePage = () => {
   const router = useRouter();
@@ -31,6 +32,9 @@ const EditResourcePage = () => {
       setServerError(undefined);
       await router.push(`/resources/${resData.id}`);
     },
+    onError: (error) => {
+      setServerError(parseTRPCErrorMessage(error.message));
+    },
   });
 
   const onSubmit: SubmitHandler<ResourceCreateInput> = (data) => {
@@ -61,7 +65,9 @@ const EditResourcePage = () => {
       >
         <div className="mb-12">
           <ResourceForm
-            methods={formMethods as UseFormReturn<ResourceUpdateInput>}
+            methods={
+              formMethods as unknown as UseFormReturn<ResourceUpdateInput>
+            }
             error={serverError}
           />
         </div>