removed sidebar and header

langflow/frontend/src/App.tsx

@@ -8,7 +8,6 @@ import SuccessAlert from "./alerts/success";
 import ExtraSidebar from "./components/ExtraSidebarComponent";
 import { alertContext } from "./contexts/alertContext";
 import { locationContext } from "./contexts/locationContext";
-import Sidebar from "./components/SidebarComponent";
 import Header from "./components/HeaderComponent";
 import TabsManagerComponent from "./pages/FlowPage/components/tabsManagerComponent";
 
@@ -82,9 +81,7 @@ export default function App() {
 				<Header></Header>
 			</div>
 			<div className="flex grow shrink basis-auto min-h-0 flex-1 overflow-hidden">
-				<Sidebar />
 				<ExtraSidebar />
-
 				{/* Main area */}
 				<main className="min-w-0 flex-1 border-t border-gray-200 dark:border-gray-700 flex">
 					{/* Primary column */}

langflow/frontend/src/components/ExtraSidebarComponent/index.tsx

@@ -25,12 +25,6 @@ export default function ExtraSidebar() {
             <span className="text-gray-900 dark:text-white text-lg ml-2 font-semibold">
               {extraNavigation.title}
             </span>
-            <button
-              className="text-gray-400 flex-shrink-0 inline-flex items-center justify-center rounded-lg"
-              onClick={() => setIsStackedOpen(false)}
-            >
-              <ChevronLeftIcon className="h-6 w-6"></ChevronLeftIcon>
-            </button>
           </div>
           <div className="flex flex-grow flex-col w-full">
             {extraNavigation.options ? (

langflow/frontend/src/components/HeaderComponent/index.tsx

@@ -4,7 +4,6 @@ import {
     MoonIcon,
     SunIcon,
   } from '@heroicons/react/24/outline'
-import Breadcrumb from '../breadcrumbComponent'
 import { alertContext } from '../../contexts/alertContext'
 import { useLayer } from 'react-laag'
 import AlertDropdown from '../../alerts/alertDropDown'
@@ -25,25 +24,8 @@ export default function Header(){
   const {dark, setDark} = useContext(darkContext);
     return (
     <header className="relative flex h-16 w-full shrink-0 items-center bg-white dark:bg-gray-800">
-        {/* Logo area */}
-        <div className="static shrink-0">
-          <a
-            href="/"
-            className="flex h-16 items-center justify-center bg-indigo-500 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-indigo-600 w-20"
-          >
-            <img
-              className="h-8 w-auto"
-              src="https://tailwindui.com/img/logos/mark.svg?color=white"
-              alt="Your Company"
-            />
-          </a>
-        </div>
-
         {/* Desktop nav area */}
-        <div className="flex min-w-0 flex-1 items-center justify-between">
+        <div className="flex min-w-0 flex-1  flex-row-reverse items-center justify-between">
-          <div className="min-w-0 flex-1 ml-5">
-            <Breadcrumb />
-          </div>
           <div className="ml-10 flex shrink-0 items-center space-x-10 pr-4">
             <div className="flex items-center space-x-8">
               <span className="inline-flex gap-6">

langflow/frontend/src/components/SidebarComponent/index.tsx

@@ -1,66 +0,0 @@
-import SidebarButton from "./sidebarButton";
-import { BsPlusSquare } from "react-icons/bs";
-import { classNames } from "../../utils";
-import { ChevronRightIcon } from "@heroicons/react/24/outline";
-import { useContext } from "react";
-import { sidebarNavigation } from "../../entities/sidebarNav";
-import { locationContext } from "../../contexts/locationContext";
-
-export default function Sidebar() {
-  let { showSideBar, isStackedOpen, setIsStackedOpen } =
-    useContext(locationContext);
-  let current = false;
-  return (
-    <div
-      className={
-        (showSideBar ? "w-20" : "w-0") +
-        " h-full overflow-hidden flex-col transition-all duration-500"
-      }
-    >
-      <div className="w-20 h-full">
-        <nav
-          aria-label="Sidebar"
-          className="h-full overflow-y-auto bg-gray-800 dark:bg-gray-900"
-        >
-          <div className="flex flex-col h-full justify-between">
-            <div className="relative flex w-20 flex-col space-y-3 p-3">
-              {sidebarNavigation.map((item, index) => (
-                <SidebarButton item={item} key={index}></SidebarButton>
-              ))}
-            </div>
-            <div className="relative flex w-20 flex-col items-center space-y-3 align-items: center;">
-              <button
-                key="New Project"
-                onClick={() => {
-                }}
-                className={classNames(
-                  current
-                    ? "bg-gray-900 text-white"
-                    : "text-gray-400 hover:bg-gray-700",
-                  "flex-shrink-0 inline-flex items-center justify-center h-14 w-14 rounded-lg"
-                )}
-              >
-                <span className="sr-only">"New Project"</span>
-                <BsPlusSquare className="h-8 w-8" aria-hidden="true" />
-              </button>
-              <div
-                className={` ${
-                  isStackedOpen ? "h-0" : "h-12"
-                } overflow-hidden transition-all duration-500`}
-              >
-                <div className="h-10">
-                  <button
-                    className="text-gray-400 flex-shrink-0 inline-flex items-center justify-center rounded-lg"
-                    onClick={() => setIsStackedOpen(true)}
-                  >
-                    <ChevronRightIcon className="h-6 w-6"></ChevronRightIcon>
-                  </button>
-                </div>
-              </div>
-            </div>
-          </div>
-        </nav>
-      </div>
-    </div>
-  );
-}

langflow/frontend/src/components/SidebarComponent/sidebarButton/index.tsx

@@ -1,24 +0,0 @@
-import { classNames } from "../../../utils"
-import { Link } from "react-router-dom"
-import { useContext } from "react"
-import { locationContext } from "../../../contexts/locationContext";
-import { sidebarNavigationItemType } from "../../../types/entities";
-
-export default function SidebarButton({item}:{item:sidebarNavigationItemType}){
-    let {current}= useContext(locationContext);
-    return (
-        <>
-        <Link
-        key={item.name}
-        to={item.href}
-        className={classNames(
-            item.href.split("/")[1]=== current[3]? 'bg-gray-900 text-white' : 'text-gray-400 hover:bg-gray-700',
-            'flex-shrink-0 inline-flex items-center justify-center h-14 w-14 rounded-lg'
-        )}
-        >
-        <span className="sr-only">{item.name}</span>
-        <item.icon className="h-6 w-6" aria-hidden="true" />
-        </Link>
-        </>
-    )
-}

langflow/frontend/src/components/breadcrumbComponent/index.tsx

@@ -1,55 +0,0 @@
-import { ChevronRightIcon, HomeIcon } from '@heroicons/react/20/solid'
-import { useContext } from 'react';
-import { Link } from 'react-router-dom'
-import { locationContext } from '../../contexts/locationContext';
-
-const breadcrumbNameMap: { [key: string]: string } = {
-  '/settings': 'Settings',
-  '/settings/general': 'General',
-  '/settings/general/main': 'Main',
-  '/table': 'Table',
-};
-
-
-function getPages(atual:string[]){
-  let pages = [];
-  for(let i = 2; i <= atual.length; i++){
-    let to = '/' + atual.slice(1,i).join('/');
-    pages.push({ name: breadcrumbNameMap[to], href: to })
-  }
-  return (pages);
-  
-}
-
-export default function Breadcrumb(){
-  let {current} = useContext(locationContext);
-    return (
-        <div>
-            <nav className="flex ml-2" aria-label="Breadcrumb">
-              <ol className="flex items-center space-x-4">
-                <li>
-                  <div>
-                    <Link to='/' className="text-gray-400 hover:text-gray-500">
-                      <HomeIcon className="h-5 w-5 flex-shrink-0" aria-hidden="true" />
-                      <span className="sr-only">Home</span>
-                    </Link>
-                  </div>
-                </li>
-                  {getPages(current).map((page) => (
-                    <li key={page.href}>
-                      <div className="flex items-center">
-                        <ChevronRightIcon className="h-5 w-5 flex-shrink-0 text-gray-400" aria-hidden="true" />
-                        <a
-                          href={page.href}
-                          className="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700"
-                        >
-                          {page.name}
-                        </a>
-                      </div>
-                    </li>
-                  ))}
-              </ol>
-            </nav>
-        </div>
-    )
-}

langflow/frontend/src/pages/FlowPage/components/extraSidebarComponent/index.tsx

@@ -20,7 +20,6 @@ export default function ExtraSidebar() {
         str: "advanced",
         bool: "advanced",
         chatOutput: "chat",
-        chatInput: "chat",
       }
       let result = await getAll();
       setData(result.data);

langflow/frontend/src/pages/FlowPage/index.tsx

@@ -76,7 +76,7 @@ export default function FlowPage({ flow }:{flow:FlowType}) {
 
 	useEffect(() => {
 		setExtraComponent(<ExtraSidebar />);
-		setExtraNavigation({ title: "Nodes" });
+		setExtraNavigation({ title: "Componets" });
 	}, [setExtraComponent, setExtraNavigation]);
 
 	const onEdgesChangeMod = useCallback(