More blank components and stories to be filled in

web/components/ui/Header/Header.tsx

@@ -1,31 +1,17 @@
-import s from './Header.module.scss';
 import { Layout } from 'antd';
-import { ServerStatusStore, serverStatusState } from '../../stores/ServerStatusStore';
-import {
-  ClientConfigStore,
-  clientConfigState,
-  chatCurrentlyVisible,
-} from '../../stores/ClientConfigStore';
-import { ClientConfig } from '../../../interfaces/client-config.model';
-import { useRecoilState, useRecoilValue } from 'recoil';
-import { useEffect } from 'react';
+import UserDropdown from '../../UserDropdownMenu';
+import s from './Header.module.scss';
 
 const { Header } = Layout;
 
-export default function HeaderComponent() {
-  const clientConfig = useRecoilValue<ClientConfig>(clientConfigState);
-  const [chatOpen, setChatOpen] = useRecoilState(chatCurrentlyVisible);
-
-  const { name } = clientConfig;
-
-  useEffect(() => {
-    console.log({ chatOpen });
-  }, [chatOpen]);
+export default function HeaderComponent(props) {
+  const { name } = props;
 
   return (
     <Header className={`${s.header}`}>
+      Logo goes here
       {name}
-      <button onClick={() => setChatOpen(!chatOpen)}>Toggle Chat</button>
+      <UserDropdown />
     </Header>
   );
 }