Superminaren
/
kvm
mirror of https://github.com/jetkvm/kvm.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fix update status rendering

This commit is contained in:
Marc Brooks 2025-10-15 04:51:13 +00:00
parent b74f779daa
commit fe277517c1
1 changed files with 19 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
ui/src/routes/devices.$id.settings.general.update.tsx
View File

@ -189,8 +189,6 @@ function UpdatingDeviceState({
otaState: UpdateState["otaState"];
onMinimizeUpgradeDialog: () => void;
}) {
const formatProgress = (progress: number) => `${Math.round(progress)}%`;
const calculateOverallProgress = (type: "system" | "app") => {
const downloadProgress = Math.round((otaState[`${type}DownloadProgress`] || 0) * 100);
const updateProgress = Math.round((otaState[`${type}UpdateProgress`] || 0) * 100);
@ -258,6 +256,11 @@ function UpdatingDeviceState({
);
};
const systemOverallProgress = calculateOverallProgress("system");
const systemUpdateStatus = getUpdateStatus("system");
const appOverallProgress = calculateOverallProgress("app");
const appUpdateStatus = getUpdateStatus("app");
return (
<div className="flex flex-col items-start justify-start space-y-4 text-left">
<div className="w-full max-w-sm space-y-4">
@ -293,7 +296,7 @@ function UpdatingDeviceState({
<p className="text-sm font-semibold text-black dark:text-white">
{m.general_update_system_update_title()}
</p>
{calculateOverallProgress("system") < 100 ? (
{systemOverallProgress < 100 ? (
<LoadingSpinner className="h-4 w-4 text-blue-700 dark:text-blue-500" />
) : (
<CheckCircleIcon className="h-4 w-4 text-blue-700 dark:text-blue-500" />
@ -302,16 +305,14 @@ function UpdatingDeviceState({
<div className="h-2.5 w-full overflow-hidden rounded-full bg-slate-300 dark:bg-slate-600">
<div
className="h-2.5 rounded-full bg-blue-700 transition-all duration-500 ease-linear dark:bg-blue-500"
style={{
width: formatProgress(calculateOverallProgress("system")),
}}
style={{ width: `${systemOverallProgress}%` }}
></div>
</div>
<div className="flex justify-between text-sm text-slate-600 dark:text-slate-300">
<span>{getUpdateStatus("system")}</span>{" "}
{calculateOverallProgress("system") < 100 ? (
<span>{formatProgress(calculateOverallProgress("system"))}</span>
) : null}
<span>{systemUpdateStatus}</span>{" "}
{systemOverallProgress < 100
? (<span>{`${systemOverallProgress}%`}</span>)
: null}
</div>
</div>
)}
@ -325,7 +326,7 @@ function UpdatingDeviceState({
<p className="text-sm font-semibold text-black dark:text-white">
{m.general_update_app_update_title()}
</p>
{calculateOverallProgress("app") < 100 ? (
{appOverallProgress < 100 ? (
<LoadingSpinner className="h-4 w-4 text-blue-700 dark:text-blue-500" />
) : (
<CheckCircleIcon className="h-4 w-4 text-blue-700 dark:text-blue-500" />
@ -334,16 +335,14 @@ function UpdatingDeviceState({
<div className="h-2.5 w-full overflow-hidden rounded-full bg-slate-300 dark:bg-slate-600">
<div
className="h-2.5 rounded-full bg-blue-700 transition-all duration-500 ease-linear dark:bg-blue-500"
style={{
width: formatProgress(calculateOverallProgress("app")),
}}
style={{ width: `${appOverallProgress}%` }}
></div>
</div>
<div className="flex justify-between text-sm text-slate-600 dark:text-slate-300">
<span>{getUpdateStatus("app")}</span>{" "}
{calculateOverallProgress("system") < 100 ? (
<span>{formatProgress(calculateOverallProgress("app"))}</span>
) : null}
<span>{appUpdateStatus}</span>{" "}
{appOverallProgress < 100
? (<span>{`${appOverallProgress}%`}</span>)
: null}
</div>
</div>
</>
@ -411,13 +410,13 @@ function UpdateAvailableState({
<p className="mb-4 text-sm text-slate-600 dark:text-slate-300">
{versionInfo?.systemUpdateAvailable ? (
<>
<span className="font-semibold">{m.general_update_system_type()}</span>:&nbsp;{versionInfo?.remote?.systemVersion}
<span className="font-semibold">{m.general_update_system_type()}</span>: {versionInfo?.remote?.systemVersion}
<br />
</>
) : null}
{versionInfo?.appUpdateAvailable ? (
<>
<span className="font-semibold">{m.general_update_application_type()}</span>:&nbsp;{versionInfo?.remote?.appVersion}
<span className="font-semibold">{m.general_update_application_type()}</span>: {versionInfo?.remote?.appVersion}
</>
) : null}
</p>