/**
 * External dependencies.
 */
import { __, sprintf } from '@wordpress/i18n';
import { createInterpolateElement } from '@wordpress/element';
import { Button, Icon } from '@wordpress/components';
import { backup } from '@wordpress/icons';
import { useRollbackContext } from '@wp-rollback/shared-core/context/RollbackContext';
import { getPageData } from '@wp-rollback/shared-core/utils/pageData';
import { findSavedBackup } from '../utils/savedBackup';

const RESTORE_URL =
    'https://wprollback.com/pricing/?utm_source=free-plugin&utm_medium=saved-backup-notice&utm_campaign=premium-rollback';

/**
 * The notice's sentence, whole, so translators can order and space it.
 *
 * @param {{version: string, date?: string, beforeUpdate?: boolean}} saved The saved backup.
 * @return {string} The sentence, with the lead in <strong></strong>.
 */
const message = saved => {
    if ( ! saved.date ) {
        return sprintf(
            // translators: %s: version number.
            __( '<strong>Version %s is backed up on this site.</strong>', 'wp-rollback' ),
            saved.version
        );
    }

    return saved.beforeUpdate
        ? sprintf(
              // translators: 1: version number, 2: date the backup was made.
              __(
                  '<strong>Version %1$s is backed up on this site.</strong> Saved %2$s, right before the update.',
                  'wp-rollback'
              ),
              saved.version,
              saved.date
          )
        : sprintf(
              // translators: 1: version number, 2: date the backup was made.
              __( '<strong>Version %1$s is backed up on this site.</strong> Saved %2$s.', 'wp-rollback' ),
              saved.version,
              saved.date
          );
};

/**
 * A one-line notice on the premium rollback screen about a backup that's
 * already on this site.
 *
 * WP Rollback backs up premium plugins and themes before each update, and Pro
 * restores those backups. The version is on this site, so the claim is
 * definite. Hidden when there's no backup, for WordPress.org items, and when
 * WP Rollback Pro is active.
 *
 * @return {JSX.Element|null} The notice, or null.
 */
const SavedBackupNotice = () => {
    const { type, slug, rollbackInfo, currentVersion } = useRollbackContext();

    const saved = findSavedBackup( {
        type,
        slug,
        versions: rollbackInfo?.versions,
        currentVersion,
        pageData: getPageData( 'savedBackups' ),
    } );

    if ( ! saved ) {
        return null;
    }

    return (
        <div className="wpr-saved-backup-notice">
            <Icon icon={ backup } size={ 20 } className="wpr-saved-backup-notice__icon" />
            <p className="wpr-saved-backup-notice__text">
                { createInterpolateElement( message( saved ), { strong: <strong /> } ) }
            </p>
            <Button
                variant="secondary"
                size="compact"
                href={ RESTORE_URL }
                target="_blank"
                className="wpr-saved-backup-notice__cta"
            >
                { __( 'Restore it with Pro', 'wp-rollback' ) }
            </Button>
        </div>
    );
};

export default SavedBackupNotice;