+ {/* Progress */}
+ |
+
+ {isActiveInstall ? (
+
+
+
+ ) : displayStatus === 'paused' ? (
+
+
+
+ ) : displayStatus === 'cancelled' ? (
+
+
+
+ ) : displayStatus === 'error' ? (
+
+
+
+ ) : (
+
+
+
)}
- {showPause && (
- }
- onClick={handlePauseModelInstall}
- variant="ghost"
- />
+
+ |
+
+ {/* Model Info */}
+
+
+ {modelName}
+
+ {sourceLocation}
+
+ {hasRestartRequired && (
+
+ {restartRequiredParts.map((part) => {
+ const fileName = part.source.split(/[/\\]/).slice(-1)[0] ?? t('common.unknown');
+ const isResumeRequired = part.resume_required;
+ return (
+
+
+
+ {fileName}
+
+
+ {isResumeRequired ? t('modelManager.restartRequired') : t('queue.failed')}
+
+
+ {isResumeRequired ? t('modelManager.resumeRefused') : t('queue.failed')}
+
+ }
+ onClick={getRestartFileHandler(part.source)}
+ variant="ghost"
+ ml="auto"
+ isDisabled={isActionInFlight}
+ />
+
+ );
+ })}
+
)}
+
+ |
+
+ {/* Status */}
+
+
+ {showDisconnectedIndicator && (
+
+
+
+
+
+ )}
+
{hasRestartRequired && (
-
+
+ {t('modelManager.restartRequired')}
+
+
+ )}
+
+ |
+
+ {/* Actions */}
+
+
+ {/* Pause/Resume installatino */}
+ {(canResume || canPause) && (
+ : }
+ onClick={canResume ? handleResumeModelInstall : handlePauseModelInstall}
+ variant={canResume ? 'solid' : 'outline'}
+ isDisabled={isActionInFlight}
+ >
+ {canResume ? t('modelManager.resume') : t('modelManager.pause')}
+
+ )}
+
+ {/* Restart installation if required */}
+ {hasRestartRequired && (
+ }
+ size="sm"
+ leftIcon={}
onClick={handleRestartFailed}
+ colorScheme="error"
variant="ghost"
- />
+ isDisabled={isActionInFlight}
+ >
+ {t('modelManager.restartFailed')}
+
)}
- {showCancel && (
+
+ {/* Cancel installation */}
+ {canCancel && (
}
+ aria-label={t('modelManager.cancel')}
onClick={handleDeleteModelImport}
- variant="ghost"
+ size="sm"
+ colorScheme="error"
+ isDisabled={isActionInFlight}
/>
)}
- {!showResume && !showPause && !showCancel && }
-
-
- {hasRestartRequired && (
-
- {restartRequiredParts.map((part) => {
- const fileName = part.source.split('/').slice(-1)[0] ?? t('common.unknown');
- const isResumeRequired = part.resume_required;
- return (
-
-
- {fileName}
-
-
- {isResumeRequired ? t('modelManager.restartRequired') : t('queue.failed')}
-
-
- {isResumeRequired ? t('modelManager.resumeRefused') : t('queue.failed')}
-
- }
- onClick={getRestartFileHandler(part.source)}
- variant="ghost"
- />
-
- );
- })}
+
+ {!canCancel && !canPause && !canResume && (
+ // TODO: Add an individual prune action here?
+ No actions available
+ )}
- )}
- >
+ |
+
);
});
ModelInstallQueueItem.displayName = 'ModelInstallQueueItem';
-
-type TooltipLabelProps = {
- installJob: ModelInstallJob;
- name: string;
- source: string;
-};
-
-const TooltipLabel = memo(({ name, source, installJob }: TooltipLabelProps) => {
- const progressString = useMemo(() => {
- if (installJob.status !== 'downloading') {
- return '';
- }
- const parts = installJob.download_parts;
- if (parts && parts.length > 0) {
- const totalBytesFromParts = parts.reduce((sum, part) => sum + (part.total_bytes ?? 0), 0);
- const currentBytesFromParts = parts.reduce((sum, part) => sum + (part.bytes ?? 0), 0);
- const totalBytes = Math.max(totalBytesFromParts, installJob.total_bytes ?? 0);
- const currentBytes = Math.max(currentBytesFromParts, installJob.bytes ?? 0);
- if (totalBytes > 0) {
- return `${formatBytes(currentBytes)} / ${formatBytes(totalBytes)}`;
- }
- return '';
- }
- if (!isNil(installJob.bytes) && !isNil(installJob.total_bytes) && installJob.total_bytes > 0) {
- return `${formatBytes(installJob.bytes)} / ${formatBytes(installJob.total_bytes)}`;
- }
- return '';
- }, [installJob.bytes, installJob.download_parts, installJob.total_bytes, installJob.status]);
-
- return (
- <>
-