Next 13 upgrade

README.md

@@ -110,4 +110,8 @@ npm run dev
 
 <a href="CONTRIBUTING.md">Contributing Guide</a>
 
-## All the best! 🥇
+## ⭐ Project Contributors
+
+<a href="https://github.com/Mridul2820/git-o-get/graphs/contributors" align="center">
+  <img src="https://contrib.rocks/image?repo=Mridul2820/git-o-get" />
+</a>

components/404/NotFound.js

@@ -11,11 +11,12 @@ const NotFound = ({ image, message }) => {
         className="w-full max-w-[500px]"
       />
       <p className="text-center">{message}</p>
-      <Link href="/">
-        <a className="bg-purple-mid flex justify-center items-center gap-2 text-white px-5 py-2 text-lg rounded-lg">
-          <BiArrowBack />
-          Back to home
-        </a>
+      <Link
+        href="/"
+        className="bg-purple-mid flex justify-center items-center gap-2 text-white px-5 py-2 text-lg rounded-lg"
+      >
+        <BiArrowBack />
+        Back to home
       </Link>
     </div>
   );

components/nav/Navbar.js

@@ -8,13 +8,11 @@ const Navbar = () => {
     <nav className="dark:bg-dark-color border-b dark:border-gray-500 flex justify-center items-center bg-white w-full">
       <div className="flex justify-between items-center w-full max-w-[1500px] mx-auto px-5 py-4">
         <Link href="/">
-          <a>
-            <img
-              src="/logo.png"
-              alt="logo"
-              className="w-10 object-cover align-middle"
-            />
-          </a>
+          <img
+            src="/logo.png"
+            alt="logo"
+            className="w-10 object-cover align-middle"
+          />
         </Link>
         <div className="mx-3">
           <Search height="h-9" />

components/profile/ProfileFollowers.js

@@ -12,25 +12,27 @@ const ProfileFollowers = ({ username, followers }) => {
       </p>
       <div className="flex flex-col gap-4 max-h-[450px] overflow-y-scroll pt-2 pr-5">
         {followers?.nodes.map((follow) => (
-          <Link href={`/user/${follow.login}`} key={follow.id}>
-            <a className="dark:bg-dark-gray dark:border-gray-700 flex items-center gap-3 rounded-md shadow-bs5 hover:shadow-bs2 transition-all duration-200 p-2 border-2 border-slate-300">
-              <img
-                src={follow.avatarUrl}
-                alt={follow.login}
-                height={40}
-                width={40}
-                className="rounded-full"
-              />
-              <div className="">
-                <p className="text-base font-semibold">
-                  {'@'}
-                  {follow.login}
-                </p>
-                <p className="font-normal text-slate-600 text-sm dark:text-slate-400">
-                  {follow.name}
-                </p>
-              </div>
-            </a>
+          <Link
+            href={`/user/${follow.login}`}
+            key={follow.id}
+            className="dark:bg-dark-gray dark:border-gray-700 flex items-center gap-3 rounded-md shadow-bs5 hover:shadow-bs2 transition-all duration-200 p-2 border-2 border-slate-300"
+          >
+            <img
+              src={follow.avatarUrl}
+              alt={follow.login}
+              height={40}
+              width={40}
+              className="rounded-full"
+            />
+            <div className="">
+              <p className="text-base font-semibold">
+                {'@'}
+                {follow.login}
+              </p>
+              <p className="font-normal text-slate-600 text-sm dark:text-slate-400">
+                {follow.name}
+              </p>
+            </div>
           </Link>
         ))}
       </div>

components/social/SocialShare.js

@@ -4,10 +4,12 @@ import { BiLinkAlt } from 'react-icons/bi';
 import { useState } from 'react';
 
 const SocialShare = ({ username }) => {
-  const { SITE_URL } = process.env;
-  const shareText = `Check out @${username}'s GitHub profile!`;
   const [copySuccess, setCopySuccess] = useState('Copy to Clipboard');
 
+  const { SITE_URL } = process.env;
+  const shareText = `Check out ${username}'s GitHub profile!`;
+  const shareUrl = `${SITE_URL}/profile/${username}`;
+
   // copy function
   const copyToClipBoard = (copyMe) => {
     //Chrome
@@ -29,17 +31,14 @@ const SocialShare = ({ username }) => {
     }
   };
 
-  const ShareClass =
-    'dark:bg-dark-color dark:text-white border dark:border-gray-700 flex justify-center items-center text-white shadow-bs5 hover:shadow-bs2 transition-all duration-200 p-2 rounded-full';
-
   return (
     <div className="flex justify-center items-center flex-col gap-4 mb-4">
       <p className="text-center text-2xl font-bold select-none">Share Card</p>
 
       <SocialWrap className="flex justify-center items-center gap-4">
         <a
-          className={`twitter ${ShareClass}`}
-          href={`http://twitter.com/share?text=${shareText}&url=${SITE_URL}/user/${username}`}
+          className="twitter share-item"
+          href={`http://twitter.com/share?text=${shareText}&url=${shareUrl}`}
           target="new"
           data-social-type="vertical"
           data-social-tool="twitter"
@@ -51,17 +50,17 @@ const SocialShare = ({ username }) => {
         </a>
 
         <a
-          href={`https://www.linkedin.com/sharing/share-offsite/?url=${SITE_URL}/user/${username}`}
+          href={`https://www.linkedin.com/sharing/share-offsite/?url=${shareUrl}`}
           target="new"
-          className={`linkedin ${ShareClass}`}
+          className="linkedin share-item"
         >
           <FaLinkedin size="20px" />
         </a>
 
         <CopyLink
-          onClick={() => copyToClipBoard(`${SITE_URL}/user/${username}`)}
+          onClick={() => copyToClipBoard(`${shareUrl}`)}
           onMouseEnter={() => setCopySuccess('Copy to Clipboard')}
-          className={`copy ${ShareClass}`}
+          className="copy share-item"
         >
           <BiLinkAlt size="20px" />
           <CopyMessage className="absolute whitespace-nowrap text-sm rounded-sm shadow-md bg-purple-mid">