Merge test (#482)

* test

* fix: minor changes

* fix: add env example

.env.example

@@ -1,10 +1,10 @@
-NEXT_PUBLIC_SUPABASE_URL=<your_supabase_url>
-NEXT_PUBLIC_SUPABASE_ANON_KEY=<your_supabase_anon_key>
-NEXT_PUBLIC_URL=https://git-re.vercel.app/
+NEXT_PUBLIC_SUPABASE_URL=
+NEXT_PUBLIC_SUPABASE_ANON_KEY=
+NEXT_PUBLIC_URL=https://localhost:3000/
 NEXT_PUBLIC_UPSTASH_REDIS_URL=
 NEXT_PUBLIC_UPSTASH_REDIS_TOKEN=
 
-NEXT_PUBLIC_GEMINI_API_KEY=your-gemini-api-key
+NEXT_PUBLIC_GEMINI_API_KEY=
 
 # Generate the token from https://github.com/settings/tokens?type=beta
 # Repository Access to public repositories (read-only)

app/auth/callback/route.ts

@@ -5,11 +5,14 @@ import { type CookieOptions, createServerClient } from "@supabase/ssr";
 export async function GET(request: Request) {
   const { searchParams, origin } = new URL(request.url);
   const code = searchParams.get("code");
-  // if "next" is in param, use it as the redirect URL
+
+  // If "next" parameter is present, use it as the redirect URL; otherwise, default to "/"
   const next = searchParams.get("next") ?? "/";
 
   if (code) {
     const cookieStore = cookies();
+
+    // Create a Supabase client with the necessary credentials and cookie management
     const supabase = createServerClient(
       process.env.NEXT_PUBLIC_SUPABASE_URL!,
       process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
@@ -18,6 +21,7 @@ export async function GET(request: Request) {
           get(name: string) {
             return cookieStore.get(name)?.value;
           },
+          // Set a cookie with options
           set(name: string, value: string, options: CookieOptions) {
             cookieStore.set({ name, value, ...options });
           },
@@ -27,12 +31,14 @@ export async function GET(request: Request) {
         },
       }
     );
+
+    // Authorization code exchange for a session
     const { error } = await supabase.auth.exchangeCodeForSession(code);
+
     if (!error) {
       return NextResponse.redirect(`${origin}${next}`);
     }
   }
 
-  // return the user to an error page with instructions
   return NextResponse.redirect(`${origin}/?error=User cancelled login.`);
 }

app/compare/page.tsx

@@ -413,7 +413,9 @@ const Compare = () => {
 
   return (
     <div className="max-w-screen-lg mx-auto px-4 py-2 lg:px-4 max-md:rounded-none rounded-2xl bg-white dark:bg-inherit text-black dark:text-white">
-      <h1 className="text-2xl font-semibold mb-6 mt-4">Compare GitHub Users</h1>
+      <h1 className="text-2xl font-semibold mb-6 mt-4 md:mt-24">
+        Compare Github Users
+      </h1>
 
       <div className="flex flex-col space-y-4 sm:flex-row sm:space-y-0 sm:space-x-4 mb-6">
         <div className="flex-grow relative">

app/cover-letter/page.tsx

@@ -7,7 +7,7 @@ export default async function Page() {
   const { data } = await supabase.auth.getUser();
 
   return (
-    <div>
+    <div className="mt-12">
       <CoverLetter user={data.user} />
     </div>
   );

app/leaderboard/page.tsx

@@ -73,7 +73,7 @@ export default function Leaderboard() {
   return (
     <>
       <div className="max-w-screen-lg mx-auto px-4 lg:px-8">
-        <div className="justify-between items-center mb-20 mt-10 grid grid-cols-1 sm:grid-cols-2 gap-4">
+        <div className="justify-between items-center mb-20 mt-10 md:mt-24 grid grid-cols-1 sm:grid-cols-2 gap-4">
           <h1 className="text-2xl font-semibold">Leaderboard</h1>
           <div className="flex">
             <input

app/page.tsx

@@ -92,7 +92,7 @@ export default function Home() {
           </div>
         </div>
       </div>
-      <div className="h-[30rem] w-full flex flex-col items-center justify-center">
+      {/* <div className="h-[30rem] w-full flex flex-col items-center justify-center">
         <div className="py-4">
           <p
             className="text-4xl font-bold text-center mt-4"
@@ -105,7 +105,7 @@ export default function Home() {
           </p>
         </div>
         <RecentGenerations />
-      </div>
+      </div> */}
       <div
         className="flex justify-center items-center h-[30rem]"
         id="userTestiminials"

app/resume/[username]/page.tsx

@@ -1,4 +1,3 @@
-// import Resume from "@/components/Resume";
 import { createServerComponentClient } from "@supabase/auth-helpers-nextjs";
 import React from "react";
 import { cookies } from "next/headers";
@@ -55,8 +54,7 @@ export default async function Home({
     redirect("/");
   }
   return (
-    <div>
-      {/* <Resume /> */}
+    <div className="mt-16">
       <NewResume />
     </div>
   );

components/AuthButton.tsx

@@ -1,7 +1,6 @@
 "use client";
 import React, { useState } from "react";
 import { Button } from "./ui/button";
-import { GitHubLogoIcon } from "@radix-ui/react-icons";
 import { supabaseBrowser } from "@/utils/supabase/client";
 import { User } from "@supabase/supabase-js";
 import { usePathname, useRouter } from "next/navigation";
@@ -10,6 +9,7 @@ import { cn } from "@/lib/utils";
 import Link from "next/link";
 
 type AuthButtonProps = {
+  // Null if not authenticated
   user: User | null;
   height?: number;
   width?: number;
@@ -41,6 +41,7 @@ export default function AuthButton({
     setLoading(true);
     const supabase = supabaseBrowser();
     await supabase.auth.signOut();
+    // Refresh the router to update the UI
     router.refresh();
     setLoading(false);
   };

components/new-resume.tsx

@@ -1,22 +1,16 @@
 "use client";
-import { BarChart, Bar, ResponsiveContainer } from "recharts";
-import { IconTrendingUp } from "@tabler/icons-react";
 import {
   IconBrandGithub,
-  IconBrandLinkedin,
   IconCode,
   IconFolder,
   IconGitCommit,
   IconGitFork,
   IconWorld,
-  IconMail,
   IconStar,
   IconUsers,
   IconTimeline,
 } from "@tabler/icons-react";
 import { useEffect, useState } from "react";
-import redis from "@/lib/redis";
-import { CACHE_TTL } from "@/lib/consts";
 import {
   fetchLanguageData,
   fetchPopularRepos,
@@ -28,8 +22,6 @@ import { calculateRating } from "@/utils/rating/action";
 import { getIndividualUserRank } from "@/app/leaderboard/action";
 import { useParams } from "next/navigation";
 import GitHubCalendar from "react-github-calendar";
-import { Avatar } from "./ui/avatar";
-import { AvatarFallback, AvatarImage } from "@radix-ui/react-avatar";
 import Image from "next/image";
 import { useTheme } from "next-themes";
 import Link from "next/link";
@@ -39,6 +31,7 @@ import CustomisationDrawer from "./CustomisationDrawer";
 import ProfileTracking from "./ProfileTracking";
 import ShareBtn from "./ShareBtn";
 import { Skeleton } from "./ui/skeleton";
+
 interface GitHubProfile {
   name: string;
   bio: string;
@@ -82,10 +75,6 @@ interface Language {
   url: string;
   percent: number;
 }
-interface OrganizationsProps {
-  username: string;
-  count: number;
-}
 
 interface ContributionsProps {
   organizationName: string;
@@ -100,20 +89,7 @@ export function NewResume() {
   const [profile, setProfile] = useState<GitHubProfile | null>(null);
   const [repos, setRepos] = useState<GitHubRepo[]>([]);
   const [languageData, setLanguageData] = useState({});
-
-  const [showName, setShowName] = useState(true);
-  const [showBio, setShowBio] = useState(true);
-  const [showBlog, setShowBlog] = useState(true);
-  const [showRepos, setShowRepos] = useState(true);
-  const [showRepoOptions, setShowRepoOptions] = useState(false);
   const [repoCount, setRepoCount] = useState(5);
-  const [showLanguageChart, setShowLanguageChart] = useState(true);
-  const [showOtherBox, setShowOtherBox] = useState(true);
-  const [startYear, setStartYear] = useState<number>(new Date().getFullYear());
-  const [endYear, setEndYear] = useState<number>(new Date().getFullYear());
-  const [showContributionGraph, setShowContributionGraph] = useState(true);
-  const [showContributions, setShowContributions] = useState(true);
-  const [showOrganizations, setShowOrganizations] = useState(true);
   const [contributionCount, setContributionCount] = useState(3);
   const [organizationCount, setOrganizationCount] = useState(5);
   const [rating, setRating] = useState<number>();
@@ -152,7 +128,7 @@ export function NewResume() {
         ).then((res) => res.json());
         setProfile(profileData);
 
-        // Fetch data using resumeUtils functions
+        // Fetch data using resumeUtils functions, parallelly
         const [reposData, languages, stats, orgsData, contributionData] =
           await Promise.all([
             fetchPopularRepos(username),