useToggle: Custom react hook for toggle

// File: useToggle.js
import { useState } from "react";

const useToggle = (initialState = false) => {
  const [visible, setVisibility] = useState(initialState);

  const toggle = () => setVisibility((prev) => !prev);

  const setToggleStatus = (value) => setVisibility(Boolean(value));

  return [visible, toggle, setToggleStatus];
};

export default useToggle;

// Usage
import { useToggle } from "./useToggle";

const App = () => {
  const [visible, toggleVisibility, setVisibility] = useToggle(false);

  return (
    <div>
      <div>
        <button onClick={() => toggleVisibility()}>Toggle</button>
        <button onClick={() => setVisibility(false)}>Hide</button>
      </div>

      <div>{visible ? "Hello" : "Hidden content"}</div>
    </div>
  );
};