import useSearchModalStore from "@/stores/searchModalStore";
import { Button, Modal } from "@wordpress/components";
import SearchInput from "../SearchInput";
import SuggestedSearches from "../SuggestedSearches";
import LastSearches from "../LastSearches";

const SearchModal = () => {

    const { open, setOpen } = useSearchModalStore()

    return (
        <>
            {open && (
                <Modal size={'large'} __experimentalHideHeader={true} onRequestClose={() => setOpen(false)}>
                    <div className="space-y-4">
                        <SearchInput size="small" />
                        <SuggestedSearches />
                        <hr />
                        <LastSearches />
                    </div>
                </Modal>
            )}
        </>
    );
}

export default SearchModal;