balmet.com

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs

ReduxTemplatesPremiumActivate.js (4180B)


      1 const {__, sprintf} = wp.i18n;
      2 const {useState} = wp.element;
      3 const {apiFetch} = wp;
      4 
      5 export default function ReduxTemplatesPremiumActivate(props) {
      6 
      7 	const [installing, setInstalling] = useState(null);
      8 	const [status, setStatus] = useState(__('Enter your API key to activate and install your copy of Redux Pro.', redux_templates.i18n));
      9 	const [statusType, setStatusType] = useState('');
     10 	const [proKey, setProKey] = useState( atob( redux_templates.key ) );
     11 	const {toPluginStep} = props;
     12 
     13 	const installReduxPlugin = async () => {
     14 		if ( ! redux_templates.supported_plugins['redux-framework'].plugin ) {
     15 			setStatus(__('Installing the redux-framework plugin.', redux_templates.i18n));
     16 			await apiFetch({
     17 				path: 'redux/v1/templates/plugin-install?slug=redux-framework',
     18 			}).then(res => {
     19 				if (res.success) {
     20 					installReduxPro();
     21 				} else {
     22 					setStatus(__('Install of Redux Pro failed, please try again.', redux_templates.i18n));
     23 					setInstalling(null);
     24 				}
     25 			})
     26 			.catch(res => {
     27 				setStatus(__('There seems to be an API issue. Please contact Redux support or try again.', redux_templates.i18n));
     28 				setInstalling(null);
     29 			});
     30 		} else {
     31 			installReduxPro();
     32 		}
     33 	};
     34 
     35 	const installReduxPro = async () => {
     36 		if ( ! redux_templates.supported_plugins['redux-pro'].version ) {
     37 			setStatus(__('Installing Redux Pro.', redux_templates.i18n));
     38 			await apiFetch({
     39 				path: 'redux/v1/templates/plugin-install?slug=redux-pro&redux_pro=1',
     40 			}).then(res => {
     41 				if (res.success) {
     42 					setStatus(__('Redux Pro successfully installed!', redux_templates.i18n));
     43 					redux_templates.mokama = true;
     44 					delete redux_templates.left;
     45 					toPluginStep();
     46 				} else {
     47 					setStatus(__('Install of Redux Pro failed, please try again.', redux_templates.i18n));
     48 				}
     49 			})
     50 			.catch(res => {
     51 				setStatus(__('There seems to be an API issue. Please contact Redux support or try again.', redux_templates.i18n));
     52 				setInstalling(null);
     53 			});
     54 		} else {
     55 			redux_templates.mokama = true;
     56 			delete redux_templates.left;
     57 			toPluginStep();
     58 		}
     59 	};
     60 
     61 	const activateKey = async () => {
     62 		setInstalling(true);
     63 		setStatus(__('Validating license key.', redux_templates.i18n));
     64 		await apiFetch({
     65 			path: 'redux/v1/templates/license?key=' + proKey,
     66 		}).then(res => {
     67 			if (res.success) {
     68 				setStatus(__('API key activated, installing Redux Pro.', redux_templates.i18n));
     69 				installReduxPlugin();
     70 			} else {
     71 				if ( res.msg ) {
     72 					setStatus(res.msg);
     73 				} else {
     74 					setStatus(__('License key failed to activate. Please try again.', redux_templates.i18n));
     75 				}
     76 				setInstalling(null);
     77 			}
     78 		}).catch(res => {
     79 			setStatus(__('There seems to be an API issue. Please contact Redux support or try again.', redux_templates.i18n));
     80 			setInstalling(null);
     81 		});
     82 	};
     83 
     84 	const updateProKey = (e) => {
     85 		setProKey(e.target.value);
     86 	}
     87 
     88 	return (
     89 		<div className="redux-templates-modal-body">
     90 			<div className="section-box premium-box">
     91 				<h3>{__('Activate Redux Pro', redux_templates.i18n)}</h3>
     92 
     93 				<div className={statusType}>{status}</div>
     94 
     95 				<p>
     96 					<input type="text" placeholder={__('Enter your subscription key', redux_templates.i18n)} value={proKey} onChange={updateProKey} disabled={installing !== null} />
     97 				</p>
     98 				<p className="subscription_key">
     99 					<button className="redux-pro-activate-button" aria-label="Activate my key" disabled={installing !== null}
    100 					        onClick={() => activateKey()}>
    101 						{installing !== null && <i className="fas fa-spinner fa-pulse"/>}
    102 						<span>{__('Activate & Install Pro', redux_templates.i18n)}</span>
    103 					</button>
    104 				</p>
    105 				<p style={{fontSize:'1.1em', paddingTop:'10px'}}><small><em dangerouslySetInnerHTML={{__html: redux_templates.tos.replace(__('Register', redux_templates.i18n), __('Activate', redux_templates.i18n))}} /> <br /><span dangerouslySetInnerHTML={{__html: sprintf( __( 'Visit the <a href="%s" target="_blank">account dashboard</a> to recover your subscription key.', redux_templates.i18n ), 'https://redux.io/account/?utm_source=plugin-installation&utm_campaign=import_wizard&utm_medium=appsero&utm_content=activate_pro' )}} /></small>
    106 				</p>
    107 			</div>
    108 		</div>
    109 	);
    110 }