chore: move navigation bar to layout from each page file

app/app/files/page.tsx

@@ -1,10 +1,8 @@
 import FilesEdit from "@/components/FilesEditor";
-import ConsoleNavigation from "@/components/ConsoleNavigation";
 
 export default function Files() {
   return (
     <>
-      <ConsoleNavigation />
       <section className="container mx-auto">
         <FilesEdit />
       </section>

app/app/layout.tsx

@@ -1,6 +1,8 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
 import "./globals.css";
+import { Console } from "console";
+import ConsoleNavigation from "@/components/ConsoleNavigation";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -20,7 +22,10 @@ export default function RootLayout({
         <header>
           <h1 className="text-4xl font-bold"></h1>
         </header>
-        <div id="container">{children}</div>
+        <div id="container">
+          <ConsoleNavigation />
+          {children}
+        </div>
       </body>
     </html>
   );

app/components/ConsoleNavigation/index.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import Link from "next/link";
 import React from "react";
 

app/components/WebConsole/index.tsx

@@ -6,7 +6,6 @@ import Stats from "./stats";
 import ServerName from "./serverName";
 import ServerControl from "./serverControl";
 import ServerStatus from "./serverStatus";
-import Navigation from "../ConsoleNavigation";
 
 const Console = () => {
   const [apiKey, setApiKey] = useState("");
@@ -157,7 +156,6 @@ const Console = () => {
 
   return (
     <>
-      <Navigation />
       <section className="container mx-auto">
         <div className="flex flex-col gap-4">
           <div className="flex gap-4">