Merge pull request #342 from VaishnaviMankala19/back-to-top

Scroll To up Button added

package.json

@@ -16,6 +16,7 @@
     "react-dom": "^18.2.0",
     "react-icons": "^5.0.1",
     "react-router-dom": "^6.21.3",
+    "react-scroll-to-top": "^3.0.0",
     "react-top-loading-bar": "^2.3.1"
   },
   "devDependencies": {
@@ -28,4 +29,4 @@
     "eslint-plugin-react-refresh": "^0.4.5",
     "vite": "^5.0.8"
   }
-}
+}

src/components/BackToTop.jsx

@@ -0,0 +1,10 @@
+import ScrollToTop from "react-scroll-to-top";
+
+function BackToTop() {
+  return (
+    <div>
+      <ScrollToTop smooth />
+    </div>
+  );
+}
+export default BackToTop;

src/components/Pages/MainPage.jsx

@@ -2,6 +2,7 @@ import React, { useEffect, useState } from "react";
 import ProjectCards from "../Cards/ProjectCards";
 import "./mainpage.css";
 import Dashboard from "./Dashboard";
+import BackToTop from '../BackToTop';
 
 const MainPage = (props) => {
   const { category, routes, setProgress } = props;
@@ -94,6 +95,7 @@ const MainPage = (props) => {
         </select>
       </div>
       <ProjectCards projectsData={filteredData} tech={getTech(category)} />
+      <BackToTop/>
     </div>
   );
 };