diff --git a/src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx b/src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx index 66499f00..a132befb 100644 --- a/src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx +++ b/src/components/CentralContainer/Sidebar/SidebarTabs/SearchTabPanel/index.tsx @@ -1,4 +1,8 @@ -import {useState} from "react"; +import { + useContext, + useRef, + useState, +} from "react"; import { AccordionGroup, @@ -10,11 +14,11 @@ import { import UnfoldLessIcon from "@mui/icons-material/UnfoldLess"; import UnfoldMoreIcon from "@mui/icons-material/UnfoldMore"; +import {StateContext} from "../../../../../contexts/StateContextProvider"; import { TAB_DISPLAY_NAMES, TAB_NAME, } from "../../../../../typings/tab"; -import {QueryResults} from "../../../../../typings/worker"; import CustomTabPanel from "../CustomTabPanel"; import TitleButton from "../TitleButton"; import ResultsGroup from "./ResultsGroup"; @@ -25,37 +29,6 @@ enum SEARCH_OPTION { IS_REGEX = "isRegex" } -/** - * - */ -const SAMPLE_RESULTS: QueryResults = new Map([ - [1, - [ - {logEventNum: 1, - message: "hi how are you", - matchRange: [0, - 2] as [number, number]}, - ]], - [2, - [ - {logEventNum: 202, - message: "i'm a super long message that supposedly overflows in the panel width.", - matchRange: [4, - 6] as [number, number]}, - ]], - [8, - [ - {logEventNum: 808, - message: "hi how are you", - matchRange: [4, - 6] as [number, number]}, - {logEventNum: 809, - message: "hi how are you", - matchRange: [4, - 6] as [number, number]}, - ]], -]); - /** * Displays a panel for submitting search queries and viewing query results. * @@ -64,24 +37,34 @@ const SAMPLE_RESULTS: QueryResults = new Map([ const SearchTabPanel = () => { const [isAllExpanded, setIsAllExpanded] = useState(true); const [searchOptions, setSearchOptions] = useState([]); + const searchTextRef = useRef(null); + const {queryResults, startQuery} = useContext(StateContext); + const handleSearch = (event: React.KeyboardEvent) => { + if ("Enter" === event.key && searchTextRef.current) { + event.preventDefault(); + const isCaseSensitive = searchOptions.includes(SEARCH_OPTION.IS_CASE_SENSITIVE); + const isRegex = searchOptions.includes(SEARCH_OPTION.IS_REGEX); + startQuery(searchTextRef.current.value, isRegex, isCaseSensitive); + } + }; return ( + titleButtons={ { setIsAllExpanded((v) => !v); }}> {isAllExpanded ? : } - } + } >