import React from 'react';
import style from './Publish.less';
import classnames from 'classnames';
import EasyvButton from 'components/EasyvButton';

function Publish({ theme = 'white', onPublish }: { theme?: 'black' | 'white'; onPublish: Function }) {
  const onPublishChange = async () => {
    onPublish && (await onPublish(true));
  };

  return (
    <div className={classnames(style.box, style[theme])}>
      <span className={style.group}>
        <div className={style.publishIcon}>
          <img src={require(`images/publish_${theme}.svg`)} alt="icon" />
        </div>
        <p>发布后，他人可通过分享链接访问项目</p>
        <EasyvButton theme="primary" onClick={onPublishChange} style={{ minWidth: 80 }} type="primary">
          发布应用
        </EasyvButton>
      </span>
    </div>
  );
}

export default Publish;
