added prettier extensions and fixed related eslint errors

app/page.tsx

@@ -38,7 +38,7 @@ export default function Home() {
                     <div className="space-y-12">
                       <div className="space-y-5 sm:space-y-4 md:max-w-xl lg:max-w-3xl xl:max-w-none">
                         <h2 className="text-3xl font-bold tracking-tight sm:text-5xl">
-                          What's happening?
+                          What&apos;s happening?
                         </h2>
                       </div>
                       <GitHubEvents minimal />

components/contributors/InfoCard.tsx

@@ -17,7 +17,7 @@ export default function InfoCard({
       className={clsx(
         "xl:text-left",
         isClickable &&
-          "border-2 border-transparent hover:border-primary-400 hover:shadow-lg hover:scale-105 transition-all duration-300 ease-in-out transform rounded-lg p-4"
+          "border-2 border-transparent hover:border-primary-400 hover:shadow-lg hover:scale-105 transition-all duration-300 ease-in-out transform rounded-lg p-4",
       )}
       role="listitem"
     >
@@ -47,7 +47,7 @@ export default function InfoCard({
               <h3
                 className={clsx(
                   "text-lg md:text-2xl leading-tight ",
-                  isClickable && "cursor-pointer hover:text-primary-200"
+                  isClickable && "cursor-pointer hover:text-primary-200",
                 )}
               >
                 {contributor.name}

components/gh_events/GitHubEvent.tsx

@@ -80,10 +80,11 @@ export default function GitHubEvent({ event }: { event?: IGitHubEvent }) {
         <ul className="text-xs">
           {event.payload.commits.map((commit) => (
             <a
+              key={commit.sha}
               className="hover:underline group"
               href={`https://github.com/${event.repo.name}/commit/${commit.sha}`}
             >
-              <li key={commit.sha}>
+              <li>
                 <span className="text-gray-500 font-mono px-2 group-hover:text-gray-700 dark:group-hover:text-gray-300">
                   {commit.sha.slice(-7)}
                 </span>

components/gh_events/GitHubEvents.tsx

@@ -27,16 +27,16 @@ export default function GitHubEvents({ minimal }: { minimal?: boolean }) {
 
   useEffect(() => {
     fetch(
-      `https://api.github.com/orgs/${process.env.NEXT_PUBLIC_GITHUB_ORG}/events?per_page=20&page=${page}`
+      `https://api.github.com/orgs/${process.env.NEXT_PUBLIC_GITHUB_ORG}/events?per_page=20&page=${page}`,
     )
       .then((res) => res.json())
       .then((data) =>
         setEvents(
           data
             .filter(exludeBotEvents)
             .filter(excludeBlacklistedEvents)
-            .slice(0, 5)
-        )
+            .slice(0, 5),
+        ),
       );
   }, [page]);
 

components/gh_events/OpenGraphImage.tsx

@@ -5,7 +5,7 @@ const hashed = (url: string) => {
 const OpenGraphImage = (props: { url: string; className?: string }) => {
   const src = props.url.replace(
     "https://github.com/",
-    `https://opengraph.githubassets.com/${hashed(props.url)}/`
+    `https://opengraph.githubassets.com/${hashed(props.url)}/`,
   );
 
   return (

lib/api.ts

@@ -61,10 +61,10 @@ export function getSlackMessages(slackId: string) {
             time: new Date(message.ts * 1000).toISOString(),
             link: "",
             text: message.text,
-          }))
+          })),
         );
       },
-      []
+      [],
     );
   } else {
     return [] as Activity[];
@@ -90,7 +90,7 @@ export function getContributorBySlug(file: string, detail = false) {
 
   try {
     activityData = JSON.parse(
-      fs.readFileSync(join(githubRoot, `${githubHandle}.json`), "utf8")
+      fs.readFileSync(join(githubRoot, `${githubHandle}.json`), "utf8"),
     );
   } catch (e) {
     console.log(e);
@@ -135,7 +135,7 @@ export function getContributorBySlug(file: string, detail = false) {
       pr_reviewed: 0,
       issue_assigned: 0,
       issue_opened: 0,
-    } as Highlights & { activity: Activity[] }
+    } as Highlights & { activity: Activity[] },
   );
 
   const calendarData = getCalendarData(weightedActivity.activity);
@@ -202,17 +202,17 @@ export function getCalendarData(activity: Activity[]) {
       }
       return acc;
     },
-    {} as Record<string, any>
+    {} as Record<string, any>,
   );
   return [...Array(365)].map((_, i) => {
     // Current Date - i
     const iReverse = 365 - i;
     const date = new Date(
-      new Date().getTime() - iReverse * 24 * 60 * 60 * 1000
+      new Date().getTime() - iReverse * 24 * 60 * 60 * 1000,
     );
     // yyyy-mm-dd
     const dateString = `${date.getFullYear()}-${padZero(
-      date.getMonth() + 1
+      date.getMonth() + 1,
     )}-${padZero(date.getDate())}`;
     const returnable = {
       // date in format YYYY-MM-DD
@@ -228,7 +228,7 @@ export function getCalendarData(activity: Activity[]) {
 
 const computePoints = (
   calendarDataEntry: Highlights,
-  initialPoints: number
+  initialPoints: number,
 ) => {
   let pointsToAdd = initialPoints ?? 0;
   pointsToAdd += points.eod_update * (calendarDataEntry.eod_update ?? 0);
@@ -273,7 +273,7 @@ const getLastWeekHighlights = (calendarData: Highlights[]) => {
       pr_collaborated: 0,
       issue_assigned: 0,
       issue_opened: 0,
-    }
+    },
   );
 
   if (highlights.eod_update == 7) {

package.json

@@ -33,9 +33,11 @@
     "autoprefixer": "^10.4.14",
     "eslint": "8.16.0",
     "eslint-config-next": "^13.4.7",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-prettier": "^5.0.1",
     "postcss": "^8.4.24",
-    "prettier": "^3.0.3",
+    "prettier": "^3.1.1",
     "tailwindcss": "^3.3.2",
     "typescript": "^5.1.3"
   }
-}
+}