Blueprint - Add busy state on the import btn (#50716)
* Add busy state * Add changefile(s) from automation for the following project(s): woocommerce --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: Adrian Duffell <9312929+adrianduffell@users.noreply.github.com>
This commit is contained in:
parent
cfdaa7e6cb
commit
454273d6d2
|
@ -25,6 +25,7 @@ export const BuilderIntro = ( {
|
|||
} ) => {
|
||||
const [ file, setFile ] = useState( null );
|
||||
const [ message, setMessage ] = useState( '' );
|
||||
const [ importing, setImporting ] = useState( false );
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
const handleFileChange = ( event: any ) => {
|
||||
|
@ -37,6 +38,8 @@ export const BuilderIntro = ( {
|
|||
return;
|
||||
}
|
||||
|
||||
setImporting( true );
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append( 'file', file );
|
||||
|
||||
|
@ -61,11 +64,14 @@ export const BuilderIntro = ( {
|
|||
data.data.redirect
|
||||
);
|
||||
|
||||
setImporting( false );
|
||||
|
||||
window.setTimeout( () => {
|
||||
// @ts-expect-error tmp
|
||||
window.location.href = data.data.redirect;
|
||||
}, 2000 );
|
||||
} else {
|
||||
setImporting( false );
|
||||
// @ts-expect-error tmp
|
||||
setMessage( `Error: ${ data.message }` );
|
||||
// @ts-expect-error tmp
|
||||
|
@ -78,6 +84,7 @@ export const BuilderIntro = ( {
|
|||
}
|
||||
} )
|
||||
.catch( ( error ) => {
|
||||
setImporting( false );
|
||||
setMessage( `Error: ${ error.message }` );
|
||||
} );
|
||||
};
|
||||
|
@ -106,7 +113,11 @@ export const BuilderIntro = ( {
|
|||
type="file"
|
||||
onChange={ handleFileChange }
|
||||
/>
|
||||
<Button variant="primary" onClick={ handleUpload }>
|
||||
<Button
|
||||
variant="primary"
|
||||
onClick={ handleUpload }
|
||||
isBusy={ importing }
|
||||
>
|
||||
{ __( 'Import', 'woocommerce' ) }
|
||||
</Button>
|
||||
<div>
|
||||
|
|
|
@ -0,0 +1,4 @@
|
|||
Significance: patch
|
||||
Type: tweak
|
||||
Comment: This feature is behind a feature flag.
|
||||
|
Loading…
Reference in New Issue