first commit

app/src/components/layout/sidebarLeft/Header.tsx

@@ -0,0 +1,31 @@
+import React from "react";
+import { ToggleSidebarIcon } from "../../icons/HeaderIcons";
+import { LogoIcon } from "../../icons/Logo";
+import FileMenu from "../../ui/FileMenu";
+import useToggleStore from "../../../store/useUIToggleStore";
+
+const Header: React.FC = () => {
+  const { toggleUI, setToggleUI } = useToggleStore();
+  return (
+    <div className="header-container">
+      <div className="header-content">
+        <div className="logo-container">
+          <LogoIcon />
+        </div>
+        <div className="header-title">
+          <FileMenu />
+        </div>
+      </div>
+      <div
+        className={`toggle-sidebar-ui-button ${!toggleUI ? "active" : ""}`}
+        onClick={() => {
+          setToggleUI(!toggleUI);
+        }}
+      >
+        <ToggleSidebarIcon />
+      </div>
+    </div>
+  );
+};
+
+export default Header;