Merge branch 'main' into card-rework

Author: Roshanjossey

package.json

@@ -101,5 +101,8 @@
   },
   "resolutions": {
     "webpack": "^5"
+  },
+  "engines": {
+    "node": "17.5.0"
   }
 }

src/components/issue/IssuesFromLastRepo.tsx

@@ -61,29 +61,31 @@ const IssuesFromLastRepo = ({ user }: IssuesFromLastRepoProps) => {
   return (
     <div className="mt-10">
       <h3 className="font-bold text-gray-500 text-lg">Issues from last repo</h3>
-      <div className="relative">
+      <div className="flex">
         <div
-          className=" flex overflow-x-auto space-x-4 no-scrollbar scroll-smooth"
+          className="grid grid-rows-2 grid-flow-col gap-4 flex-1 overflow-x-auto no-scrollbar scroll-smooth"
           ref={scrollableElement}
         >
           {data.issuesFromLastRepo.edges.map(
             (issue) => issue && <Issue issue={issue.node} key={issue.node.id} />
           )}
         </div>
-        <button
-          type="button"
-          className="absolute right-8 bottom-0 mr-4 mt-4"
-          onClick={() => scrollHorizontally(scrollDirection.Left)}
-        >
-          <FaChevronRight className="b-0 w-6 h-6 rotate-180 dark:text-gray-300 bg-gray-300 dark:bg-dark-900 rounded-full p-1 font-bold" />
-        </button>
-        <button
-          type="button"
-          className="absolute right-0 bottom-0 mr-4 mt-4"
-          onClick={() => handleScrollRight()}
-        >
-          <FaChevronRight className="b-0 w-6 h-6 dark:text-gray-300 bg-gray-300 dark:bg-dark-900 rounded-full p-1 font-bold" />
-        </button>
+        <div className="flex flex-col ml-2 h-full">
+          <button
+            type="button"
+            className=" right-8 bottom-0 mr-4 mt-4"
+            onClick={() => scrollHorizontally(scrollDirection.Left)}
+          >
+            <FaChevronRight className="b-0 w-6 h-6 rotate-180 dark:text-gray-300 bg-gray-300 dark:bg-dark-900 rounded-full p-1 font-bold" />
+          </button>
+          <button
+            type="button"
+            className=" right-0 bottom-0 mr-4 mt-4"
+            onClick={() => handleScrollRight()}
+          >
+            <FaChevronRight className="b-0 w-6 h-6 dark:text-gray-300 bg-gray-300 dark:bg-dark-900 rounded-full p-1 font-bold" />
+          </button>
+        </div>
       </div>
       <style jsx>
         {`

src/components/issue/IssuesFromRecentRepo.tsx

@@ -42,7 +42,7 @@ const IssuesFromRecentRepos = ({ user }: IssuesFromRecentReposProps) => {
       <h3 className="font-bold text-gray-500 text-lg">
         Issues from other recent repos
       </h3>
-      <div className="grid grid-cols-2 xl:grid-cols-2 gap-4 mt-4">
+      <div className="grid grid-cols-1 xl:grid-cols-1 gap-4 mt-4">
         {data.issuesFromOtherRecentRepos.edges.map(
           (issue) => issue && <Issue issue={issue.node} key={issue.node.id} />
         )}

src/components/issue/RelevantIssues.tsx

@@ -38,7 +38,7 @@ const RelevantIssues = ({ user }: RelevantIssuesProps) => {
   return (
     <div className="mt-10">
       <h3 className="font-bold text-gray-500 text-lg">Explore New Issues</h3>
-      <div className="grid grid-cols-2 xl:grid-cols-2 gap-4 mt-4">
+      <div className="grid grid-cols-1 xl:grid-cols-1 gap-4 mt-4">
         {data.relevantIssues.edges.map(
           (issue) => issue && <Issue issue={issue.node} key={issue.node.id} />
         )}

yarn.lock

@@ -2099,9 +2099,9 @@
     "@hapi/hoek" "^9.0.0"
 
 "@sideway/formula@^3.0.0":
-  version "3.0.0"
-  resolved "https://registry.npmjs.org/@sideway/formula/-/formula-3.0.0.tgz"
-  integrity sha512-vHe7wZ4NOXVfkoRb8T5otiENVlT7a3IAiw7H5M2+GO+9CDgcVUUsX1zalAztCmwyOr2RUTGJdgB+ZvSVqmdHmg==
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/@sideway/formula/-/formula-3.0.1.tgz#80fcbcbaf7ce031e0ef2dd29b1bfc7c3f583611f"
+  integrity sha512-/poHZJJVjx3L+zVD6g9KgHfYnb443oi7wLu/XKojDviHy6HOEOA6z1Trk5aR1dGcmPenJEgb2sK2I80LeS3MIg==
 
 "@sideway/pinpoint@^2.0.0":
   version "2.0.0"
@@ -12364,9 +12364,9 @@ webpack-virtual-modules@^0.4.1:
   integrity sha512-8bWq0Iluiv9lVf9YaqWQ9+liNgXSHICm+rg544yRgGYaR8yXZTVBaHZkINZSB2yZSWo4b0F6MIxqJezVfOEAlg==
 
 webpack@4, "webpack@>=4.43.0 <6.0.0", webpack@^5, webpack@^5.9.0:
-  version "5.74.0"
-  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.74.0.tgz#02a5dac19a17e0bb47093f2be67c695102a55980"
-  integrity sha512-A2InDwnhhGN4LYctJj6M1JEaGL7Luj6LOmyBHjcI8529cm5p6VXiTIW2sn6ffvEAKmveLzvu4jrihwXtPojlAA==
+  version "5.76.1"
+  resolved "https://registry.yarnpkg.com/webpack/-/webpack-5.76.1.tgz#7773de017e988bccb0f13c7d75ec245f377d295c"
+  integrity sha512-4+YIK4Abzv8172/SGqObnUjaIHjLEuUasz9EwQj/9xmPPkYJy2Mh03Q/lJfSD3YLzbxy5FeTq5Uw0323Oh6SJQ==
   dependencies:
     "@types/eslint-scope" "^3.7.3"
     "@types/estree" "^0.0.51"