Check if button is active then get its value to pass down a button

Question

function Input() {
  const [input, setInput] = useState("");
  function handleSearch() {
    let url = "https://google.com/search?q=${input}"
    window.open(url)
  }
  return (
    <div className="input-wrap">
      <input
        type="text"
        className="input__search"
        placeholder="Enter your search..."
        value={input}
        onChange={(e) => setInput(e.target.value)}></input>
      <button
        className="input__search--btn"
        onClick={handleSearch}>
        <i className="fa-solid fa-magnifying-glass"></i>
      </button>
    </div>
  );
}

The search button when clicked will redirect you to a google search based on the value from the input field, below is the site for advanced search, when active the link will add an additional link after "https://google.com/search?q=${input}+site%3A${activepage}.com, how do I check if one or many sites are active then pass down its name to url

P/s: code for toggling websites

function WebButton({ icon, name }) {
    const [active, setActive] = useState(false);
    function handleToggle() {
        setActive(!active);
    }
        return (
            <button
            className={active ? "websites-btn active" : "websites-btn"}
            onClick={handleToggle}>
            <i className={icon}></i>
            <div className="websites-name">{name}</div> 
    </button>
  );
}