import React, { useState, useEffect } from 'react' const ActionPerformer = ({ actionHook, LoadingButton, SuccessButton, ErrorButton, errorCallback, completeCallback }) => { // Call our useFetch() hook to start performing our action (i.e. importing a template) const { loading, data, error } = actionHook() // Check if we've successfully completed out action: if (!loading && !error) { // We've successfully imported the template, bubble up a success call after a short timeout // so we can show an "imported" state on the button briefly: setTimeout(() => { completeCallback(data) }, 500) return SuccessButton } // Check if we had an error performing the action: if (error) { setTimeout(() => { errorCallback(data) }, 100) return ErrorButton } // The default state of this component is loading, so we show that loading button here.. return LoadingButton } /** * Generic user action provider. * Used for things like "Import Template" and "Import Photo" buttons * * @param DefaultButton * @param CompletedButton * @param ProcessingButton * @param isAlreadyCompleted * @param completedCallback * @param actionConfirmationMessage * * @returns {*} * @constructor */ const ButtonActionProvider = ({ DefaultButton, CompletedButton, LoadingButton, ErrorButton, SuccessButton, actionHook, isAlreadyCompleted = false, completedCallback = null, errorCallback = null, actionConfirmationMessage = null }) => { const [isProcessing, setIsProcessing] = useState(false) const [isCompleted, setIsCompleted] = useState(isAlreadyCompleted) const [error, setError] = useState(null) useEffect(() => { if (isCompleted && completedCallback && !isAlreadyCompleted) { // We fire off an optional completed callback, if the component didn't start in the completed state. completedCallback(isCompleted) } }, [isCompleted]) useEffect(() => { if (error && errorCallback) { // We fire off an optional error callback, with the error data set below errorCallback(error) } }, [error]) useEffect(() => { // If our parent component resets our completed status prop, we update our local state to reflect this: setIsCompleted(isAlreadyCompleted) }, [isAlreadyCompleted]) // Check if this action has been completed: if (isCompleted) { return CompletedButton } // Check if we're currently performing the action: if (isProcessing) { // As soon as this "Processing" component renders we expect the ajax action to start running. // We provide a "completeCallback" that this "Processing" component can call once it's done it's thing. return ( { // If our action returns an error, we swap back to our default state so the user can try again setTimeout(() => { setIsProcessing(false) }, 500) setError(data) }} completeCallback={(data) => { setIsProcessing(false) setIsCompleted(data) }} /> ) } // Default state is not processing/completed, so we show a default button return React.cloneElement(DefaultButton, { onClick: (event) => { if (actionConfirmationMessage) { if (!confirm(actionConfirmationMessage)) { // user has denied the confirmation dialog, prevent calling our processing action. event.preventDefault() return false } } setIsProcessing(true) } }) } export default ButtonActionProvider Terms Of Service - TranslationSUB
TranslationSUB
Menu
Get a Quote
Get a Quote

Terms Of Service

  • Home
  • Terms Of Service

This website is operated by TranslationSub (hereinafter referred to as “the Business”). Please, be sure to read the following Terms of Use before using this website. By viewing, utilizing or downloading the content or information contained in this website, you agree to the following terms and conditions. Please, be advised that the content, information and URL of this website may be changed or discontinued at any time without notice.

Copyrights

The copyrights to the contents of this website belong to the Business and the pertaining information providers. The contents of the present website may not be reproduced, quoted, transferred, distributed, performed, adapted, modified or added to without permission.

The content of this website may be used exclusively for “reproduction for personal use” or other purposes under copyright law. However, when duplicating or downloading the material, a copyright notice and conditions of use must accompany it. Any other use requires the permission of the Business.

Link

If you wish to link to this website, please be sure to contact us in advance, including the URL of the page you are linking to, the content of the website and the purpose of the link. However, the absence of a response from the Business does not mean that the Business has acknowledged the link in question. In principle, the only URL to link to this website is “https://translationsub.com“

Media Coverage

If you wish to mention this website in any kind of media, please, contact us in advance. Please, specify the media on which this website will be mentioned, the content of the media and the purpose of the feature. However, absence from response from the Business does not imply that the Business has acknowledged the concerned coverage.

Inquiries

If you have any comments or questions about this website, please contact us via the Contact Us page. We attempt to respond to your inquiries, but we may not be able to do so depending on the content. Please, be aware of that in advance.

Governing Law And Jurisdiction

This website and the interpretation and application of the terms and conditions of use shall be governed by the laws of Japan, unless otherwise specified. All disputes arising in relation to this website shall be subject to the exclusive jurisdiction of the Osaka District Court, unless otherwise specified.

TranslationSUB

TranslationSUB