import { useCallback } from 'react';

import CommonDialog from '@/components/common-dialog';
import { PageUrl } from '@/constants/app';
import { ReportEventId } from '@/constants/event';
import { reportEvent } from '@/utils/event';
import { navigateTo } from '@/utils/route';

import './index.less';

interface IProps {
  onClose: () => void;
}

const PREFIX = 'material-guide';

function MaterialGuide(props: IProps) {
  const { onClose } = props;

  const handleConfirm = useCallback(() => {
    reportEvent(ReportEventId.VIEW_MATERIAL_GUIDE);
    navigateTo(PageUrl.MaterialUploadVideo);
    onClose();
  }, [onClose]);

  // useEffect(() => {
  //   updateLastMaterialGuideTime();
  // }, []);

  return (
    <CommonDialog
      className={`${PREFIX}__dialog`}
      visible
      onClose={onClose}
      onCancel={onClose}
      onClick={handleConfirm}
      content="完善模卡更容易获得老板青睐"
      confirm="立刻完善"
    />
  );
}

export default MaterialGuide;