React-Group/interstellar_ai
1
1
Fork 2
Code Issues 8 Pull requests Projects Releases Packages Wiki Activity Actions

Database first tries

Browse source
This commit is contained in:
sageTheDM 2024-10-09 08:11:40 +02:00
parent 9c8bc39b9d
commit e0e711f1a9
6 changed files with 100 additions and 117 deletions
Download patch file Download diff file Expand all files Collapse all files

18
app/components/Header.tsx
View file

@ -20,13 +20,16 @@ const Header: React.FC<HeaderProps> = ({
const dropdownRef = useRef<HTMLDivElement | null>(null);
const toggleRef = useRef<HTMLDivElement | null>(null);
// Pages that will be displayed in the menu
const pages: ('AI' | 'FAQ' | 'Documentation' | 'Credits')[] = ['AI', 'FAQ', 'Documentation', 'Credits'];
// Toggle menu state
const toggleMenu = () => {
setMenuOpen((prevMenuOpen) => !prevMenuOpen);
};
// Handle button click
const buttonClicked = (page: "AI" | "Documentation" | "FAQ" | "Credits") => {
const handleViewChange = (page: 'AI' | 'FAQ' | 'Documentation' | 'Credits') => {
onViewChange(page);
setMenuOpen(false); // Close the menu when a button is clicked
};
@ -35,9 +38,9 @@ const Header: React.FC<HeaderProps> = ({
useEffect(() => {
const handleClickOutside = (event: MouseEvent) => {
if (
dropdownRef.current &&
dropdownRef.current &&
!dropdownRef.current.contains(event.target as Node) &&
toggleRef.current &&
toggleRef.current &&
!toggleRef.current.contains(event.target as Node)
) {
setMenuOpen(false);
@ -72,10 +75,11 @@ const Header: React.FC<HeaderProps> = ({
</button>
)}
<nav ref={dropdownRef} className={`nav-links ${menuOpen ? "active" : ""}`}>
<button onClick={() => buttonClicked("AI")} className="nav-btn">Chat</button>
<button onClick={() => buttonClicked("FAQ")} className="nav-btn">FAQ</button>
<button onClick={() => buttonClicked("Documentation")} className="nav-btn">Documentation</button>
<button onClick={() => buttonClicked("Credits")} className="nav-btn">Credits</button>
{pages.map(page => (
<button key={page} onClick={() => handleViewChange(page)} className="nav-btn">
{page}
</button>
))}
</nav>
<div ref={toggleRef} className={`hamburger ${menuOpen ? "open" : ""}`} onClick={toggleMenu}>
<span></span>