GlobalErrorコンポーネントにエラーログ出力機能を追加し、リセットボタンを実装しました。エラーオブジェクトの詳細情報をコンソールに…

…出力するようにしました。 (#622)

next/src/app/global-error.tsx

@@ -6,8 +6,25 @@ import { useEffect } from "react";
 
 export default function GlobalError({
 	error,
-}: { error: Error & { digest?: string } }) {
+	reset,
+}: { error: Error & { digest?: string }; reset: () => void }) {
 	useEffect(() => {
+		// エラーオブジェクトの詳細情報をコンソールに出力
+		console.error("Error object:", error);
+
+		// エラーオブジェクトのプロパティを列挙
+		console.error("Error properties:", Object.getOwnPropertyNames(error));
+
+		// Response オブジェクトの場合の追加情報
+		if (error.toString() === "[object Response]") {
+			const responseError = error as unknown as Response;
+			console.error("Response details:", {
+				status: responseError.status,
+				url: responseError.url,
+				type: responseError.type,
+				redirected: responseError.redirected,
+			});
+		}
 		Sentry.captureException(error);
 	}, [error]);
 
@@ -19,6 +36,9 @@ export default function GlobalError({
         does not expose status codes for errors, we simply pass 0 to render a
         generic error message. */}
 				<NextError statusCode={0} />
+				<button onClick={() => reset()} type="button">
+					Reset error boundary
+				</button>
 			</body>
 		</html>
 	);