import React from "react";
import { useModel } from '@/store';

/**
 * 页面显示, 隐藏 hook, 可以在 component 中使用
 */
export default (fn, deps = []) => {
  const fnRef = React.useRef();
  fnRef.current = fn;

  const { getPageCtx } = useModel('page');
  // eslint-disable-next-line react-hooks/exhaustive-deps
  const ctx = React.useMemo(getPageCtx, []);
  const { show } = React.useContext(ctx);

  React.useEffect(() => {
    if (show) {
      fnRef.current();
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [show, ...deps]);
}
