import React, { useMemo, useCallback } from 'react'; import PropTypes from 'prop-types'; import { withTranslation } from 'react-i18next'; import { withUnstatedContainers } from './UnstatedUtils'; import RevisionCompareContainer from '../services/RevisionCompareContainer'; import RevisionDiff from './PageHistory/RevisionDiff'; import RevisionIdForm from './RevisionCompare/RevisionIdForm'; import { CopyToClipboard } from 'react-copy-to-clipboard'; import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap'; const DropdownItemContents = ({ title, contents }) => ( <>
{title}
{contents}
); function encodeSpaces(str) { if (str == null) { return null; } // Encode SPACE and IDEOGRAPHIC SPACE return str.replace(/ /g, '%20').replace(/\u3000/g, '%E3%80%80'); } class PageCompare extends React.Component { constructor() { super(); this.state = { dropdownOpen: false } this.toggleDropdown = this.toggleDropdown.bind(this); } componentWillMount() { const { revisionCompareContainer } = this.props; revisionCompareContainer.readyRevisions(); } toggleDropdown() { this.setState({ dropdownOpen: !this.state.dropdownOpen }); } render() { const { t, revisionCompareContainer } = this.props; const fromRev = revisionCompareContainer.state.fromRevision; const toRev = revisionCompareContainer.state.toRevision; const showDiff = (fromRev && toRev); const pagePathUrl = () => { const { origin } = window.location; const { path } = revisionCompareContainer.pageContainer.state; const { fromRevision, toRevision } = revisionCompareContainer.state; const urlParams = (fromRevision && toRevision ? `?compare=${fromRevision._id}...${toRevision._id}` : ""); return encodeSpaces(decodeURI(`${origin}/${path}${urlParams}`)); } return (
{ t('page_compare_revision.comparing_changes') }
{ fromRev && fromRev._id }{ toRev && toRev._id }
{/* Page path URL */}
{ showDiff && }
); } } /** * Wrapper component for using unstated */ const PageCompareWrapper = withUnstatedContainers(PageCompare, [RevisionCompareContainer]); PageCompare.propTypes = { t: PropTypes.func.isRequired, // i18next revisionCompareContainer: PropTypes.instanceOf(RevisionCompareContainer).isRequired, }; export default withTranslation()(PageCompareWrapper);