Toast Conflicting or loading infinite in promise at concurrent requests
vikassharmasat opened this issue · comments
The toast don't close if API Request function is centralized and in scenario of concurrent requests. It will process only one result others will be in infinite.
there are some screenshots please check
`
import { Bounce, toast } from "react-toastify";
export class ToastUtil {
constructor( unique_key ) {
this.toast_id = {};
this.unique_key = unique_key;
this.toastify_options = {
position: "top-right",
autoClose: 5000,
hideProgressBar: false,
closeOnClick: true,
pauseOnHover: true,
draggable: true,
progress: undefined,
theme: "colored",
transition: Bounce,
isLoading: false,
};
this.toast = toast;
}
showToast() {
console.log( this.toast_id, 'this is toast id' )
this.toast_id[this.unique_key] = this.toast.loading( `Please wait success...` );
}
updateToast( message, type ) {
this.toast.update( this.toast_id[this.unique_key], {
render: message,
type,
...this.toastify_options,
} );
this.hideToast();
}
hideToast() {
// this.toast.clearWaitingQueue();
// this.toast_id = null;
// delete this.toast_id[this.unique_key];
console.log( Object.keys( this.toast_id ) );
setTimeout(() => {
Object.keys(this.toast_id).forEach(key => toast.dismiss(key));
},5000);
}
}
![api call](https://private-user-images.githubusercontent.com/73014787/325562437-cee39203-23be-4d66-9bdf-1238bce71cfa.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQzODkyMTIsIm5iZiI6MTcxNDM4ODkxMiwicGF0aCI6Ii83MzAxNDc4Ny8zMjU1NjI0MzctY2VlMzkyMDMtMjNiZS00ZDY2LTliZGYtMTIzOGJjZTcxY2ZhLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA0MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNDI5VDExMDgzMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTQzMjA0YjA5MDkzNWVhZGQxZTNlYjI2NGZmOWRjOTRkNGY2ODAxODg1NGU1MDdlNDJhOWI2M2IwMzI2NzNhNjQmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.TLG0CnmwoGBd5lkua8BSzTv3CpSP4DVKwcbR811gHlA)
![infinite progress](https://private-user-images.githubusercontent.com/73014787/325562442-ad153524-6968-419c-b719-c8b820b0af86.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQzODkyMTIsIm5iZiI6MTcxNDM4ODkxMiwicGF0aCI6Ii83MzAxNDc4Ny8zMjU1NjI0NDItYWQxNTM1MjQtNjk2OC00MTljLWI3MTktYzhiODIwYjBhZjg2LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA0MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNDI5VDExMDgzMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTVmYTM4ZDlhN2ZhYTk5MDQ4N2UzNmJiNWU4ZGE4YzkyY2IyMjczODA2ZGI1MWE0Y2I0YmY4OGRmYTBhZWVkNWEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.5vbnZUhbBhou0QnQ6E5gFrxv_rC6-LGaHXhZfhGZ0eU)
![network tab](https://private-user-images.githubusercontent.com/73014787/325562447-9f17d4e4-12f7-46b2-87f1-d45c405737e9.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQzODkyMTIsIm5iZiI6MTcxNDM4ODkxMiwicGF0aCI6Ii83MzAxNDc4Ny8zMjU1NjI0NDctOWYxN2Q0ZTQtMTJmNy00NmIyLTg3ZjEtZDQ1YzQwNTczN2U5LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA0MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNDI5VDExMDgzMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWJmNWM5MTljMTAwOWE2MWVhZDE3NzRhMWFmNmU4YjJmZWRjYmQ5YjE1NWQzM2U2ZDBlYjI0ZTY3ZDdjMmI4YmEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.dUnP36yBcMN1I56gwD6SeUqqNhhbJp3CC2kmoe1nL84)
![all keys are avaialbe](https://private-user-images.githubusercontent.com/73014787/325562450-50aff74c-ba1e-41f1-955f-e29339a8a2d3.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTQzODkyMTIsIm5iZiI6MTcxNDM4ODkxMiwicGF0aCI6Ii83MzAxNDc4Ny8zMjU1NjI0NTAtNTBhZmY3NGMtYmExZS00MWYxLTk1NWYtZTI5MzM5YThhMmQzLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA0MjklMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNDI5VDExMDgzMlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTI0MTU5ODFjNzQ2MGZjZTRiZmEzOTAwNDU5ZThjYmVkOWUzNmIzYTVkMGQ4Y2FmYWRiYzIxZGQ3NjEyMTU3MjgmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.owvMVu8J0dD_JcrXuacSEdWnxdNKTLvngjS-7EbsXLI)