OwlCyberSecurity - MANAGER
Edit File: ImportPhotoButton.jsx
import React from 'react' import importPhoto from '../../api/importPhoto' import Button from './Button' import ButtonActionProvider from '../Actions/ButtonActionProvider' import ExternalLinkButton from './ExternalLinkButton' import useGlobalConfig from '../Contexts/useGlobalConfig' import { getImportedPhotoUrl } from '../../utils/linkGenerator' /** * Helper to render a series of buttons to install a template kit. * * @param photoId * @param photoTitle * @param showLabel * @param customActionHook * @param completeCallback * @param errorCallback * @returns {*} * @constructor */ const ImportPhotoButton = ({ photoId, photoTitle, showLabel = false, customActionHook = null, completeCallback = null, errorCallback = null }) => { const { getDownloadedItemId, addDownloadedItem } = useGlobalConfig() const importedPhotoId = getDownloadedItemId(photoId) let isAlreadyCompleted = !!importedPhotoId if (typeof window.envatoElements.photoImportCompleteCallback !== 'undefined') { // This variable is set in "main.jsx" and lets us reach into WordPress core code. // If this is set then we treat the download action as incomplete, this means we fire // importPhoto() again when in Deep Photo Integration mode. This allows our API to // return the JSON required for deep integration to work correctly. // The photo isn't imported twice due to a check in PHP so all good. isAlreadyCompleted = false } return ( <ButtonActionProvider DefaultButton={<Button type='primary' icon='download' label={showLabel ? 'Import Photo' : null} />} LoadingButton={<Button type='primary' icon='updateSpinning' label={showLabel ? 'Importing....' : null} disabled />} ErrorButton={<Button type='warning' icon='cross' label={showLabel ? 'Error!' : null} disabled />} SuccessButton={<Button type='primary' label={showLabel ? 'Success!' : null} icon='updateSpinning' disabled />} CompletedButton={<ExternalLinkButton type='primary' icon='eye' label={showLabel ? 'View Imported Photo' : null} href={getImportedPhotoUrl({ importedPhotoId })} />} actionHook={() => customActionHook ? customActionHook() : importPhoto({ photoId, photoTitle })} isAlreadyCompleted={isAlreadyCompleted} completedCallback={(data) => { if (data && data.success && data.imported_photo_id) { if (typeof window.envatoElements.photoImportCompleteCallback !== 'undefined') { window.envatoElements.photoImportCompleteCallback(data) } addDownloadedItem({ humaneId: photoId, importedId: data.imported_photo_id }) } }} errorCallback={errorCallback} /> ) } export default ImportPhotoButton