diff --git a/components/Layout.tsx b/components/Layout.tsx
index 29108e0..b1b2e20 100644
--- a/components/Layout.tsx
+++ b/components/Layout.tsx
@@ -37,7 +37,7 @@ export default function Layout({ children, isPathRoot }: LayoutProps) {
   });
   const { defaultData, defaultLoading, defaultError } = useDefaultMovies(1);
 
-  const { currentState } = useCurrentState({ filter, searchTerm });
+  const { currentState, setCurrentState } = useCurrentState({ filter, searchTerm });
 
   const isLoaded = useLoading({
     filterLoading,
@@ -65,6 +65,9 @@ export default function Layout({ children, isPathRoot }: LayoutProps) {
           asideOffsetBreakpoint="sm"
           navbar={
             <NavigationBar
+              currentState={currentState}
+              setCurrentState={setCurrentState}
+              setFilter={setFilter}
               hidden={!opened}
               p="md"
               hiddenBreakpoint="sm"
@@ -123,18 +126,16 @@ export default function Layout({ children, isPathRoot }: LayoutProps) {
           }
         >
           <UpUpTransition>
-            <div>
-              <Body
-                filter={filter}
-                filterData={filterData}
-                filterLoading={filterLoading}
-                searchData={searchData}
-                currentState={currentState}
-                isLoaded={isLoaded}
-              >
-                {children}
-              </Body>
-            </div>
+            <Body
+              filter={filter}
+              filterData={filterData}
+              filterLoading={filterLoading}
+              searchData={searchData}
+              currentState={currentState}
+              isLoaded={isLoaded}
+            >
+              {children}
+            </Body>
           </UpUpTransition>
         </AppShell>
       )}
diff --git a/components/NavigationBar.tsx b/components/NavigationBar.tsx
index c412fd5..fb82463 100644
--- a/components/NavigationBar.tsx
+++ b/components/NavigationBar.tsx
@@ -5,7 +5,7 @@
   </Link>
 </Navbar.Section> */
 }
-import { FC, useState } from "react";
+import { FC, SetStateAction, useState } from "react";
 import Link from "next/link";
 import Image from "next/image";
 import IconPytorchlightning from "../icons/Zap";
@@ -100,6 +100,9 @@ interface NavigationBarProps {
   p?: string;
   hiddenBreakpoint?: any;
   width?: any;
+  currentState?: string;
+  setCurrentState?: React.Dispatch<SetStateAction<string>>;
+  setFilter?: React.Dispatch<SetStateAction<string[]>>;
 }
 
 export default function NavigationBar({
@@ -107,6 +110,9 @@ export default function NavigationBar({
   p,
   hiddenBreakpoint,
   width,
+  currentState,
+  setCurrentState,
+  setFilter,
 }: NavigationBarProps) {
   const [active, setActive] = useState(0 as number);
   const router = useRouter();
@@ -117,6 +123,10 @@ export default function NavigationBar({
       key={link.label}
       active={index === active}
       onClick={() => {
+        if (currentState !== "all") {
+          setCurrentState?.("all");
+          setFilter?.([""]);
+        }
         if (link.label.includes("Coming Soon")) return;
         if (link.label.includes("TV")) {
           setActive(index);
diff --git a/hooks/useCurrentState.tsx b/hooks/useCurrentState.tsx
index d9403e4..2ee1cf5 100644
--- a/hooks/useCurrentState.tsx
+++ b/hooks/useCurrentState.tsx
@@ -22,7 +22,7 @@ const useCurrentState = ({ filter, searchTerm }: CurrentStateProps) => {
     }
   }, [filter, searchTerm]);
 
-  return { currentState };
+  return { currentState, setCurrentState };
 };
 
 export default useCurrentState;
