custom hook: useToastContent - using for toast a message, and then automatically hide it (after a timeout, eg: 2s)

useToastContent.js

export const useToastContent = (timeout = 2e3) => {
  const [content, setContent] = useState('');
  const timer = useRef();
  useEffect(() => {
    return () => {
      if (timer && timer.current) {
        clearTimeout(timer.current);
      }
    }
  }, []);

  const toast = (value) => {
    setContent(value);
    timer.current = setTimeout(() => {
      setContent('');
    }, timeout);
  }

  const close = () => {
    setContent('');
    if (timer && timer.current) {
      clearTimeout(timeout.current);
    }
  }

  return [content, toast, close];
}