react-filerobot-video-editor/lib/components/common/ExportModal/index.js

React component version of filerobot video editor (FVE).

import React,{useCallback,useMemo}from"react";import{Success,Error}from"@scaleflex/icons";import{Color as PC}from"@scaleflex/ui/utils/types/palette";import{useStore}from"../../../hooks";import Modal from"../Modal";import Spinner from"../Spinner";var getExportState=function(a,b,c){var d={completed:{title:c("exportCompleted"),hint:c("exportCompletedHint"),cancelLabel:c("done")},error:{title:c("exportError"),hint:c("exportErrorHint"),cancelLabel:c("ok")},inProgress:{title:c("exportProgress"),hint:c("exportProgressHint"),cancelLabel:c("cancel")}};return 100===a?d.completed:b?d.error:d.inProgress},ExportModal=function(a){var b=a.open,c=a.progress,d=a.onCancel,e=a.error,f=useStore(),g=f.t,h=f.theme,i=useMemo(function(){return getExportState(c,e,g)},[c,e,g]),j=i.title,k=i.hint,l=i.cancelLabel,m=useCallback(function(){return React.createElement(React.Fragment,null,e&&React.createElement(Error,{size:58,color:h.palette[PC.Error]}),100===c&&!e&&React.createElement(Success,{size:58,color:h.palette[PC.Success]}),100>c&&!e&&React.createElement(Spinner,{isLoading:!0,theme:h,iconSize:58,showInline:!0},c,"%"))},[h,c,b,e]);return b&&React.createElement(Modal,{title:j,hint:k,isOpened:b,onCancel:d,Icon:m,cancelLabel:l,width:"400px",hideShadow:!0,iconMarginBottom:0,iconPadding:12,modalActionsStyles:{padding:"24px 32px 32px 32px"},modalTitleStyles:{padding:"24px 32px 0 32px"},disableOverlayClick:100>c&&!e})};export default ExportModal;