import * as React from "react"; import { MainHeading, Body, BodySection } from "../styles"; import { TxHash } from "@joincivil/core"; import { PublishButton } from "./PublishButton"; import { ArchiveOptions } from "./BlockchainPublishPanel"; import { ArchiveControls } from "./ArchiveControls"; import { urls } from "../../constants"; export interface PublishPanelFirstTimeState { archiveSelected: boolean; ipfsSelected: boolean; ethTransaction: boolean; estimate?: number; } export interface PublishPanelFirstTimeProps { revisionUrl: string; revisionJsonHash: string; revisionJson: any; civilContentID?: number; currentPostLastRevisionId?: number; txHash?: TxHash; disabled?: boolean; walletReady?: boolean; publishContent?( contentId: number, revisionId: number, revisionJson: any, txHash: TxHash, ipfs: string, archive: ArchiveOptions, ): Promise; updateContent?( revisionId: number, revisionJson: any, txHash: TxHash, ipfs: string, archive?: ArchiveOptions, ): Promise; saveTxHash?(txHash: TxHash, ipfs: string, archive: ArchiveOptions): void; } export class PublishPanelFirstTime extends React.Component { constructor(props: PublishPanelFirstTimeProps) { super(props); this.state = { archiveSelected: false, ipfsSelected: true, ethTransaction: false, }; } public render(): JSX.Element { return ( Index

This publishes a permanent record of your post to the Civil network by putting a link and record of the post onto{" "} IPFS {" "} and the{" "} Ethereum Blockchain . The index points back to your site where the story is hosted on your servers. Indexing provides proof that the story hasn't changed since its last publish date.

This will add the full text of this post to the index you publish to{" "} IPFS {" "} and/or the{" "} Ethereum Blockchain . Tip: If this post is behind a paywall and you don't want the full text to be public, we recommend you only index instead of archiving.

} /> ); } private selectArchive = (): void => { this.setState({ archiveSelected: !this.state.archiveSelected }); }; private selectEthTransaction = (): void => { this.setState({ ethTransaction: !this.state.ethTransaction }); }; }