From bd202f12be467efe41669475c660513d2e8eddd3 Mon Sep 17 00:00:00 2001
From: Robin Singh <44robin.rs@gmail.com>
Date: Tue, 1 Aug 2023 19:49:09 +0530
Subject: [PATCH] scroll to top on URL change
---
src/components/AppLayout.js | 6 +++++-
src/components/ScrollToTop.js | 12 ++++++++++++
2 files changed, 17 insertions(+), 1 deletion(-)
create mode 100644 src/components/ScrollToTop.js
diff --git a/src/components/AppLayout.js b/src/components/AppLayout.js
index 0f0e3a2..4f58564 100644
--- a/src/components/AppLayout.js
+++ b/src/components/AppLayout.js
@@ -5,7 +5,7 @@ import { useState } from "react";
import UserContext from "../utils/UserContext";
import { Provider } from "react-redux";
import store from "../utils/store";
-
+import ScrollToTop from "./ScrollToTop";
const AppLayout = () => {
const [user, setUser] = useState({
name: "Robin Singh",
@@ -13,13 +13,17 @@ const AppLayout = () => {
});
return (
+ <>
+
+
+
);
};
diff --git a/src/components/ScrollToTop.js b/src/components/ScrollToTop.js
new file mode 100644
index 0000000..f14a844
--- /dev/null
+++ b/src/components/ScrollToTop.js
@@ -0,0 +1,12 @@
+import { useLocation } from "react-router-dom";
+import { useEffect } from "react";
+
+const ScrollToTop = () => {
+ const { pathname } = useLocation();
+ useEffect(() => {
+ window.scrollTo(0, 0);
+ }, [pathname]);
+ return null;
+};
+
+export default ScrollToTop;