my-project-public

repository

loading code, commits, and activity

repositories

loading repo index

#1	import { Button } from "@/components/ui/button";
#2	import { ChevronRight, X, RefreshCcw, Settings } from "lucide-react";
#3	import { Dispatch, SetStateAction, useContext, useEffect, useState } from "react";
#4	import GlobalContext from "../contexts/GlobalContext";
#5	import { Input } from "./ui/input";
#6
#7	const Header = (props: {
#8	setIsSettingsOpen: Dispatch<SetStateAction<boolean>>;
#9	}) => {
#10	const { setIsSettingsOpen } = props;
#11	const { selectUserHandler, clearUserHandler, selectedUser, clearConfiguration } = useContext(GlobalContext);
#12	const [userId, setUserId] = useState<string>("");
#13
#14	const handleSelectUser = (e: React.ChangeEvent<HTMLInputElement>) => {
#15	setUserId(e.target.value);
#16	};
#17
#18	const handleClearUser = () => {
#19	clearUserHandler();
#20	setUserId("");
#21	};
#22
#23	const handleSubmit = () => {
#24	selectUserHandler(userId);
#25	};
#26
#27	// New function to handle key down events
#28	const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
#29	if (e.key === 'Enter') {
#30	e.preventDefault(); // Prevent form submission if it's in a form
#31	handleSubmit();
#32	}
#33	};
#34
#35	useEffect(() => {
#36	if (selectedUser) {
#37	setUserId(selectedUser);
#38	}
#39	}, [selectedUser]);
#40
#41	return (
#42	<>
#43	<header className="border-b p-4 flex items-center justify-between">
#44	<div className="flex items-center space-x-2">
#45	<span className="text-xl font-semibold">Mem0 Assistant</span>
#46	</div>
#47	<div className="flex items-center space-x-2 text-sm">
#48	<div className="flex">
#49	<Input
#50	placeholder="UserId"
#51	className="w-full rounded-3xl pr-6 pl-4"
#52	value={userId}
#53	onChange={handleSelectUser}
#54	onKeyDown={handleKeyDown} // Attach the key down handler here
#55	/>
#56	<Button variant="ghost" size="icon" onClick={handleClearUser} className="relative hover:bg-transparent hover:text-neutral-400 right-8">
#57	<X className="h-4 w-4" />
#58	</Button>
#59	<Button variant="ghost" size="icon" onClick={handleSubmit} className="relative right-6">
#60	<ChevronRight className="h-4 w-4" />
#61	</Button>
#62	</div>
#63	<div className="flex items-center space-x-2">
#64	<Button variant="ghost" size="icon" onClick={clearConfiguration}>
#65	<RefreshCcw className="h-4 w-4" />
#66	</Button>
#67	<Button
#68	variant="ghost"
#69	size="icon"
#70	onClick={() => setIsSettingsOpen(true)}
#71	>
#72	<Settings className="h-4 w-4" />
#73	</Button>
#74	</div>
#75	</div>
#76	</header>
#77	</>
#78	);
#79	};
#80
#81	export default Header;
#82

z6Mkq5mY3JWtxoxUobWcfNHm7AkRubgSWEZTkBVqZXJviFZ5/my-project-public