diff --git a/frontend/src/basic/NavBar/NavBar.tsx b/frontend/src/basic/NavBar/NavBar.tsx
index fbd45e95..74356e3a 100644
--- a/frontend/src/basic/NavBar/NavBar.tsx
+++ b/frontend/src/basic/NavBar/NavBar.tsx
@@ -54,8 +54,11 @@ const NavBar = ({ width, height }: NavBarProps): JSX.Element => {
   };
 
   useEffect(() => {
-    const pathPage = location.pathname.split('/')[1];
-    setPage(pathPage);
+    // change tab (page) into the current route
+    const pathPage: Page = location.pathname.split('/')[1];
+    if (pathPage) {
+      setPage(pathPage);
+    }
   }, [location]);
 
   const handleSlideDirection = function (oldPage: Page, newPage: Page) {
diff --git a/frontend/src/basic/OrderPage/index.tsx b/frontend/src/basic/OrderPage/index.tsx
index 57307246..948be1b8 100644
--- a/frontend/src/basic/OrderPage/index.tsx
+++ b/frontend/src/basic/OrderPage/index.tsx
@@ -17,6 +17,8 @@ const OrderPage = (): JSX.Element => {
     robot,
     settings,
     setOrder,
+    clearOrder,
+    currentOrder,
     setCurrentOrder,
     badOrder,
     setBadOrder,
@@ -32,7 +34,12 @@ const OrderPage = (): JSX.Element => {
 
   const [tab, setTab] = useState<'order' | 'contract'>('contract');
 
-  useEffect(() => setCurrentOrder(Number(params.orderId)), [params.orderId]);
+  useEffect(() => {
+    setCurrentOrder(Number(params.orderId));
+    if (currentOrder != params.orderId) {
+      clearOrder();
+    }
+  }, [params.orderId]);
 
   const renewOrder = function () {
     if (order != undefined) {