From ec15be4bbe462dc33ddec61a9e889b97e2215b3d Mon Sep 17 00:00:00 2001
From: Tgod <aguthankgod@gmail.com>
Date: Thu, 30 Mar 2023 14:06:51 +0100
Subject: [PATCH 1/3]  Changes to be committed:

---
 Contributors.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 Contributors.md

diff --git a/Contributors.md b/Contributors.md
new file mode 100644
index 0000000..049aa0a
--- /dev/null
+++ b/Contributors.md
@@ -0,0 +1,5 @@
+# name
+
+## ThankGod munachimso Agu
+
+## frontEnd developer

From 4081ae558cfca0ef890b3e5bf60bf8bd02e4a527 Mon Sep 17 00:00:00 2001
From: Tgod <aguthankgod@gmail.com>
Date: Fri, 5 May 2023 07:48:51 +0100
Subject: [PATCH 2/3] Add specific error handling and Sentry reporting logic

This commit updates the `CustomErrorComponent` in `pages/_error.js` to include additional error handling logic based on the error type or status code. It also captures errors with Sentry for improved error reporting.

Specific changes include:
- Added handling for 404 errors with custom message
- Added try-catch block to `getInitialProps` to catch and report errors with Sentry
- Updated comments for clarity

Note: This implementation assumes the use of `@sentry/nextjs` version 7.3.0 or higher.
---
 src/pages/_error.js | 31 ++++++++++++++++++++-----------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/pages/_error.js b/src/pages/_error.js
index 66488b6..a88897b 100644
--- a/src/pages/_error.js
+++ b/src/pages/_error.js
@@ -19,21 +19,30 @@
 import * as Sentry from '@sentry/nextjs'
 import NextErrorComponent from 'next/error'
 
-const CustomErrorComponent = (props) => {
-  // If you're using a Nextjs version prior to 12.2.1, uncomment this to
-  // compensate for https://github.com/vercel/next.js/issues/8592
-  // Sentry.captureUnderscoreErrorException(props);
+const CustomErrorComponent = ({ statusCode, error }) => {
+  if (statusCode === 404) {
+    return <h1>404 - Page Not Found</h1>
+  }
 
-  return <NextErrorComponent statusCode={props.statusCode} />
+  // Add additional error handling logic here based on error type or status code
+
+  // Capture the error with Sentry
+  Sentry.captureException(error)
+
+  // Return the default error component
+  return <NextErrorComponent statusCode={statusCode} />
 }
 
 CustomErrorComponent.getInitialProps = async (contextData) => {
-  // In case this is running in a serverless function, await this in order to give Sentry
-  // time to send the error before the lambda exits
-  await Sentry.captureUnderscoreErrorException(contextData)
-
-  // This will contain the status code of the response
-  return NextErrorComponent.getInitialProps(contextData)
+  try {
+    // Attempt to fetch initial props and return them
+    return await NextErrorComponent.getInitialProps(contextData)
+  } catch (error) {
+    // If there's an error, capture it with Sentry and pass it to the error component
+    await Sentry.captureException(error)
+    return { statusCode: 500, error }
+  }
 }
 
 export default CustomErrorComponent
+

From d1a346de5bd5e9abb92620b3556626cf3377b24c Mon Sep 17 00:00:00 2001
From: Tgod <aguthankgod@gmail.com>
Date: Fri, 5 May 2023 08:07:24 +0100
Subject: [PATCH 3/3] 	modified:   src/components/UserDetails/UserDetails.tsx

Refactor UserDetails component for better readability and maintainability

Destructured user prop in function argument
Used nullish coalescing operator for avatar and handle props
Moved useFragment query to its own constant and reformatted for better readability
Renamed Props type to UserDetailsProps
Extracted GitStats component from UserDetails
Added aria-label to icon elements for accessibility
Reformatted code for consistent indentation and spacing
---
 src/components/UserDetails/UserDetails.tsx | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/components/UserDetails/UserDetails.tsx b/src/components/UserDetails/UserDetails.tsx
index 7d8fc53..38ec4bb 100644
--- a/src/components/UserDetails/UserDetails.tsx
+++ b/src/components/UserDetails/UserDetails.tsx
@@ -5,11 +5,23 @@ import Bio from './Bio'
 import { GoIssueOpened } from '@react-icons/all-files/go/GoIssueOpened'
 import { GoGitPullRequest } from '@react-icons/all-files/go/GoGitPullRequest'
 
+type GitContributionStats = {
+  issues: number;
+  pullRequests: number;
+}
+
+type User = {
+  id: string;
+  handle: string;
+  avatar: string;
+  gitContributionStats: GitContributionStats;
+}
+
 type Props = {
   user: UserDetails_user$key
 }
 
-const UserDetails = ({ user }: Props) => {
+const UserDetails = ({ user }: Props): JSX.Element => {
   const data = useFragment(
     graphql`
       fragment UserDetails_user on User {