diff --git a/ui/src/components/Layouts/FloatingHeader/index.tsx b/ui/src/components/Layouts/FloatingHeader/index.tsx
index 7d8ee47e..54532823 100644
--- a/ui/src/components/Layouts/FloatingHeader/index.tsx
+++ b/ui/src/components/Layouts/FloatingHeader/index.tsx
@@ -2,7 +2,7 @@ import { Button, theme } from "antd";
 import style from "./FloatingHeader.module.scss";
 import Notification from "components/General/Notification";
 import Icon from "components/General/Icon";
-import { openLink } from "lib/utils/helper";
+import { Link } from "react-router-dom";
 
 const FloatingHeader = () => {
 	const {
@@ -17,12 +17,11 @@ const FloatingHeader = () => {
 			}}
 		>
 			<Notification colorText={colorText} />
-			<Button
-				className={style.fb__button}
-				onClick={() => openLink("/feedback", false)}
-			>
-				<Icon name="Megaphone" size={20} color={colorText} />
-			</Button>
+			<Link to="/feedback">
+				<Button className={style.fb__button}>
+					<Icon name="Megaphone" size={20} color={colorText} />
+				</Button>
+			</Link>
 		</div>
 	);
 };
diff --git a/ui/src/components/Layouts/Footer/index.tsx b/ui/src/components/Layouts/Footer/index.tsx
index 28bfbde9..01652a80 100644
--- a/ui/src/components/Layouts/Footer/index.tsx
+++ b/ui/src/components/Layouts/Footer/index.tsx
@@ -97,7 +97,9 @@ const Footer: React.FC = () => {
 				<Typography.Title level={4}>Company</Typography.Title>
 				<ul className={style.footer__list}>
 					<li>
-						<a onClick={() => openLink("/about", false)}>About</a>
+						<Link to={"/about"}>
+							<a>About</a>
+						</Link>
 					</li>
 					{/* <li>
 									<a