Async load of extensions info

This commit is contained in:
Cohee 2024-07-20 14:08:24 +03:00
parent 5f2a73ac9f
commit 21cdfa1dfa

View File

@ -605,35 +605,41 @@ function getModuleInformation() {
async function showExtensionsDetails() { async function showExtensionsDetails() {
let popupPromise; let popupPromise;
try { try {
showLoader(); const htmlDefault = $('<h3>Built-in Extensions:</h3>');
let htmlDefault = '<h3>Built-in Extensions:</h3>'; const htmlExternal = $('<h3>Installed Extensions:</h3>').addClass('opacity50p');
let htmlExternal = '<h3>Installed Extensions:</h3>'; const htmlLoading = $(`<h3 class="flex-container alignItemsCenter justifyCenter marginTop10 marginBot5">
<i class="fa-solid fa-spinner fa-spin"></i>
<span>Loading third-party extensions... Please wait...</span>
</h3>`);
const extensions = Object.entries(manifests).sort((a, b) => a[1].loading_order - b[1].loading_order); /** @type {Promise<any>[]} */
const promises = []; const promises = [];
const extensions = Object.entries(manifests).sort((a, b) => a[1].loading_order - b[1].loading_order);
for (const extension of extensions) { for (const extension of extensions) {
promises.push(getExtensionData(extension)); promises.push(getExtensionData(extension));
} }
const settledPromises = await Promise.allSettled(promises); promises.forEach(promise => {
promise.then(value => {
settledPromises.forEach(promise => { const { isExternal, extensionHtml } = value;
if (promise.status === 'fulfilled') { const container = isExternal ? htmlExternal : htmlDefault;
const { isExternal, extensionHtml } = promise.value; container.append(extensionHtml);
if (isExternal) { });
htmlExternal += extensionHtml;
} else {
htmlDefault += extensionHtml;
}
}
}); });
const html = ` Promise.allSettled(promises).then(() => {
${getModuleInformation()} htmlLoading.remove();
${htmlDefault} htmlExternal.removeClass('opacity50p');
${htmlExternal} });
`;
const html = $('<div></div>')
.addClass('extensions_info')
.append(getModuleInformation())
.append(htmlDefault)
.append(htmlLoading)
.append(htmlExternal);
/** @type {import('./popup.js').CustomPopupButton} */ /** @type {import('./popup.js').CustomPopupButton} */
const updateAllButton = { const updateAllButton = {
text: 'Update all', text: 'Update all',
@ -651,13 +657,11 @@ async function showExtensionsDetails() {
await oldPopup.complete(POPUP_RESULT.CANCELLED); await oldPopup.complete(POPUP_RESULT.CANCELLED);
} }
const popup = new Popup(`<div class="extensions_info">${html}</div>`, POPUP_TYPE.TEXT, '', { okButton: 'Close', wide: true, large: true, customButtons: [updateAllButton], allowVerticalScrolling: true }); const popup = new Popup(html, POPUP_TYPE.TEXT, '', { okButton: 'Close', wide: true, large: true, customButtons: [updateAllButton], allowVerticalScrolling: true });
popupPromise = popup.show(); popupPromise = popup.show();
} catch (error) { } catch (error) {
toastr.error('Error loading extensions. See browser console for details.'); toastr.error('Error loading extensions. See browser console for details.');
console.error(error); console.error(error);
} finally {
hideLoader();
} }
if (popupPromise) { if (popupPromise) {
await popupPromise; await popupPromise;