chore(brain): adding button event

This commit is contained in:
Stan Girard 2023-07-01 18:40:43 +02:00
parent b76262c4f0
commit 2468a6da1d

View File

@ -1,8 +1,11 @@
/* eslint-disable */
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import { FaBrain } from "react-icons/fa"; import { FaBrain } from "react-icons/fa";
import { IoMdAdd } from "react-icons/io"; import { IoMdAdd } from "react-icons/io";
import { useBrainContext } from "@/lib/context/BrainProvider/hooks/useBrainContext"; import { useBrainContext } from "@/lib/context/BrainProvider/hooks/useBrainContext";
import { useEventTracking } from "@/services/analytics/useEventTracking";
export const BrainsDropDown = (): JSX.Element => { export const BrainsDropDown = (): JSX.Element => {
const [showDropdown, setShowDropdown] = useState(false); const [showDropdown, setShowDropdown] = useState(false);
@ -10,9 +13,11 @@ export const BrainsDropDown = (): JSX.Element => {
const { allBrains, createBrain, setActiveBrain, currentBrain } = const { allBrains, createBrain, setActiveBrain, currentBrain } =
useBrainContext(); useBrainContext();
const dropdownRef = useRef<HTMLDivElement | null>(null); const dropdownRef = useRef<HTMLDivElement | null>(null);
const { track } = useEventTracking();
const toggleDropdown = () => { const toggleDropdown = () => {
setShowDropdown((prevState) => !prevState); setShowDropdown((prevState) => !prevState);
void track("SHOW_BRAINS_DROPDOWN")
}; };
const handleCreateBrain = () => { const handleCreateBrain = () => {
@ -22,6 +27,7 @@ export const BrainsDropDown = (): JSX.Element => {
void createBrain(newBrainName); void createBrain(newBrainName);
setNewBrainName(""); // Reset the new brain name input setNewBrainName(""); // Reset the new brain name input
void track("BRAIN_CREATED")
}; };
const handleClickOutside = (event: MouseEvent) => { const handleClickOutside = (event: MouseEvent) => {
@ -32,6 +38,12 @@ export const BrainsDropDown = (): JSX.Element => {
setShowDropdown(false); setShowDropdown(false);
} }
}; };
const changeBrains = (value: string) => {
void track("CHANGE_BRAIN")
setNewBrainName(value)
}
useEffect(() => { useEffect(() => {
document.addEventListener("mousedown", handleClickOutside); document.addEventListener("mousedown", handleClickOutside);
@ -60,7 +72,7 @@ export const BrainsDropDown = (): JSX.Element => {
type="text" type="text"
placeholder="Add a new brain" placeholder="Add a new brain"
value={newBrainName} value={newBrainName}
onChange={(e) => setNewBrainName(e.target.value)} onChange={(e) => changeBrains(e.target.value)}
className="flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:outline-none" className="flex-1 px-3 py-2 border border-gray-300 rounded-lg focus:outline-none"
/> />
<button <button