mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
feat(ui): improve update controls styling and error handling
- Add disabled and loading states for control group buttons with appropriate cursor and opacity styling - Enhance dropdown toggle active state styling for update filter group - Improve dropdown toggle layout with flex centering - Add disabled state styling for dropdown items - Refactor model update check to use shared helper function, removing redundant success handling and simplifying error flow - Maintain existing functionality while improving user experience and code maintainability
This commit is contained in:
@@ -1,9 +1,7 @@
|
||||
import { BaseContextMenu } from './BaseContextMenu.js';
|
||||
import { showToast } from '../../utils/uiHelpers.js';
|
||||
import { state } from '../../state/index.js';
|
||||
import { translate } from '../../utils/i18nHelpers.js';
|
||||
import { getCompleteApiConfig, getCurrentModelType } from '../../api/apiConfig.js';
|
||||
import { resetAndReload } from '../../api/modelApiFactory.js';
|
||||
import { performModelUpdateCheck } from '../../utils/updateCheckHelpers.js';
|
||||
|
||||
export class GlobalContextMenu extends BaseContextMenu {
|
||||
constructor() {
|
||||
@@ -116,68 +114,23 @@ export class GlobalContextMenu extends BaseContextMenu {
|
||||
return;
|
||||
}
|
||||
|
||||
const modelType = getCurrentModelType();
|
||||
const apiConfig = getCompleteApiConfig(modelType);
|
||||
|
||||
if (!apiConfig?.endpoints?.refreshUpdates) {
|
||||
console.warn('Refresh updates endpoint not configured for model type:', modelType);
|
||||
return;
|
||||
}
|
||||
|
||||
this._updateCheckInProgress = true;
|
||||
menuItem?.classList.add('disabled');
|
||||
|
||||
const displayName = apiConfig.config?.displayName ?? 'Model';
|
||||
const loadingMessage = translate(
|
||||
'globalContextMenu.checkModelUpdates.loading',
|
||||
{ type: displayName },
|
||||
`Checking for ${displayName} updates...`
|
||||
);
|
||||
|
||||
state.loadingManager?.showSimpleLoading?.(loadingMessage);
|
||||
|
||||
try {
|
||||
const response = await fetch(apiConfig.endpoints.refreshUpdates, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({ force: false })
|
||||
await performModelUpdateCheck({
|
||||
onComplete: () => {
|
||||
menuItem?.classList.remove('disabled');
|
||||
this._updateCheckInProgress = false;
|
||||
}
|
||||
});
|
||||
|
||||
let payload = {};
|
||||
try {
|
||||
payload = await response.json();
|
||||
} catch {
|
||||
payload = {};
|
||||
}
|
||||
|
||||
if (!response.ok || payload.success !== true) {
|
||||
const errorMessage = payload?.error || response.statusText || 'Unknown error';
|
||||
throw new Error(errorMessage);
|
||||
}
|
||||
|
||||
const records = Array.isArray(payload.records) ? payload.records : [];
|
||||
|
||||
if (records.length > 0) {
|
||||
showToast('globalContextMenu.checkModelUpdates.success', { count: records.length, type: displayName }, 'success');
|
||||
} else {
|
||||
showToast('globalContextMenu.checkModelUpdates.none', { type: displayName }, 'info');
|
||||
}
|
||||
|
||||
await resetAndReload(false);
|
||||
} catch (error) {
|
||||
console.error('Error checking model updates:', error);
|
||||
showToast(
|
||||
'globalContextMenu.checkModelUpdates.error',
|
||||
{ message: error?.message ?? 'Unknown error', type: displayName },
|
||||
'error'
|
||||
);
|
||||
console.error('Failed to check model updates:', error);
|
||||
} finally {
|
||||
state.loadingManager?.hide?.();
|
||||
if (typeof state.loadingManager?.restoreProgressBar === 'function') {
|
||||
state.loadingManager.restoreProgressBar();
|
||||
if (this._updateCheckInProgress) {
|
||||
this._updateCheckInProgress = false;
|
||||
menuItem?.classList.remove('disabled');
|
||||
}
|
||||
menuItem?.classList.remove('disabled');
|
||||
this._updateCheckInProgress = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user