// @flow import React from 'react'; import Button from 'component/button'; import { Form, FormField } from 'component/common/form'; import { Modal } from 'modal/modal'; import Card from 'component/common/card'; import Tag from 'component/tag'; import MarkdownPreview from 'component/common/markdown-preview'; import { COPYRIGHT, OTHER } from 'constants/licenses'; import LbcSymbol from 'component/common/lbc-symbol'; import ChannelThumbnail from 'component/channelThumbnail'; import * as ICONS from 'constants/icons'; import Icon from 'component/common/icon'; type Props = { filePath: string | WebFile, isMarkdownPost: boolean, optimize: boolean, title: ?string, description: ?string, channel: ?string, bid: ?number, uri: ?string, contentIsFree: boolean, fee: { amount: string, currency: string, }, language: string, licenseType: string, otherLicenseDescription: ?string, licenseUrl: ?string, tags: Array, isVid: boolean, ffmpegStatus: any, previewResponse: PublishResponse, publish: (?string, ?boolean) => void, closeModal: () => void, enablePublishPreview: boolean, setEnablePublishPreview: (boolean) => void, isStillEditing: boolean, myChannels: ?Array, }; class ModalPublishPreview extends React.PureComponent { onConfirmed() { const { filePath, publish, closeModal } = this.props; // Publish for real: publish(this.resolveFilePathName(filePath), false); closeModal(); } resolveFilePathName(filePath: string | WebFile) { if (!filePath) { return '---'; } if (typeof filePath === 'string') { return filePath; } else { return filePath.name; } } createRow(label: string, value: any) { return ( {label} {value} ); } togglePreviewEnabled() { const { enablePublishPreview, setEnablePublishPreview } = this.props; setEnablePublishPreview(!enablePublishPreview); } render() { const { filePath, isMarkdownPost, optimize, title, description, channel, bid, uri, contentIsFree, fee, language, licenseType, otherLicenseDescription, licenseUrl, tags, isVid, ffmpegStatus = {}, previewResponse, closeModal, enablePublishPreview, setEnablePublishPreview, isStillEditing, myChannels, } = this.props; const txFee = previewResponse ? previewResponse['total_fee'] : null; // $FlowFixMe add outputs[0] etc to PublishResponse type const livestream = // $FlowFixMe previewResponse.outputs[0] && previewResponse.outputs[0].value && !previewResponse.outputs[0].value.source; const isOptimizeAvail = filePath && filePath !== '' && isVid && ffmpegStatus.available; let modalTitle; if (isStillEditing) { modalTitle = __('Confirm Edit'); } else if (livestream) { modalTitle = __('Create Livestream'); } else { modalTitle = __('Confirm Upload'); } let confirmBtnText; if (isStillEditing) { confirmBtnText = __('Save'); } else if (livestream) { confirmBtnText = __('Create'); } else { confirmBtnText = __('Upload'); } const descriptionValue = description ? (
) : null; const licenseValue = licenseType === COPYRIGHT ? (

© {otherLicenseDescription}

) : licenseType === OTHER ? (

{otherLicenseDescription}
{licenseUrl}

) : (

{licenseType}

); const tagsValue = // Do nothing for onClick(). Setting to 'null' results in "View Tag" action -- we don't want to leave the modal. tags.map((tag) => {}} />); const depositValue = bid ? :

---

; let priceValue = __('Free'); if (!contentIsFree) { if (fee.currency === 'LBC') { priceValue = ; } else { priceValue = `${fee.amount} ${fee.currency}`; } } const channelValue = (channel) => { const channelClaim = myChannels && myChannels.find((x) => x.name === channel); return channel ? (
{channelClaim && } {channel}
) : (
{__('Anonymous')}
); }; return (
this.onConfirmed()}>
{!livestream && !isMarkdownPost && this.createRow(__('File'), this.resolveFilePathName(filePath))} {isOptimizeAvail && this.createRow(__('Transcode'), optimize ? __('Yes') : __('No'))} {this.createRow(__('Title'), title)} {this.createRow(__('Description'), descriptionValue)} {this.createRow(__('Channel'), channelValue(channel))} {this.createRow(__('URL'), uri)} {this.createRow(__('Deposit'), depositValue)} {this.createRow(__('Price'), priceValue)} {this.createRow(__('Language'), language)} {this.createRow(__('License'), licenseValue)} {this.createRow(__('Tags'), tagsValue)}
{txFee && (
{__('Est. transaction fee:')}  
)} } actions={ <>

{__('Once the transaction is sent, it cannot be reversed.')}

setEnablePublishPreview(!enablePublishPreview)} /> } />
); } } export default ModalPublishPreview;