d8dfun/claudecodeui
1
0
Fork 0
mirror of https://github.com/siteboon/claudecodeui.git synced 2026-04-15 10:01:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(version-upgrade-modal): implement reload countdown and update UI messages (#655)

Browse Source 
Co-authored-by: Haileyesus <something@gmail.com>
This commit is contained in:
Haile
2026-04-15 00:02:20 +03:00
committed by GitHub
parent c3599cd2c4
commit 641304242d
1 changed files with 31 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/components/version-upgrade/view/VersionUpgradeModal.tsx
View File

@@ -1,4 +1,4 @@
import { useCallback, useState } from "react";
import { useCallback, useEffect, useState } from "react";
import { useTranslation } from "react-i18next";
import { authenticatedFetch } from "../../../utils/api";
import { ReleaseInfo } from "../../../types/sharedTypes";
@@ -15,6 +15,8 @@ interface VersionUpgradeModalProps {
installMode: InstallMode;
}
const RELOAD_COUNTDOWN_START = 30;
export function VersionUpgradeModal({
isOpen,
onClose,
@@ -32,10 +34,30 @@ export function VersionUpgradeModal({
const [isUpdating, setIsUpdating] = useState(false);
const [updateOutput, setUpdateOutput] = useState('');
const [updateError, setUpdateError] = useState('');
const [reloadCountdown, setReloadCountdown] = useState<number | null>(null);
useEffect(() => {
if (!IS_PLATFORM || reloadCountdown === null || reloadCountdown <= 0) {
return;
}
const timeoutId = window.setTimeout(() => {
setReloadCountdown((previousCountdown) => {
if (previousCountdown === null) {
return null;
}
return Math.max(previousCountdown - 1, 0);
});
}, 1000);
return () => window.clearTimeout(timeoutId);
}, [reloadCountdown]);
const handleUpdateNow = useCallback(async () => {
setIsUpdating(true);
setUpdateOutput('Starting update...\n');
setReloadCountdown(IS_PLATFORM ? RELOAD_COUNTDOWN_START : null);
setUpdateError('');
try {
@@ -49,8 +71,7 @@ export function VersionUpgradeModal({
if (response.ok) {
setUpdateOutput(prev => prev + data.output + '\n');
setUpdateOutput(prev => prev + '\n✅ Update completed successfully!\n');
const text = IS_PLATFORM ? 'Please refresh the page after 5 seconds to load the new version. If that doesn\'t work, RESTART the environment.' : 'Please restart the server to apply changes.';
setUpdateOutput(prev => prev + text + '\n');
setUpdateOutput(prev => prev + 'Please restart the server to apply changes.' + '\n');
} else {
setUpdateError(data.error || 'Update failed');
setUpdateOutput(prev => prev + '\n❌ Update failed: ' + (data.error || 'Unknown error') + '\n');
@@ -147,6 +168,13 @@ export function VersionUpgradeModal({
<div className="max-h-48 overflow-y-auto rounded-lg border border-gray-700 bg-gray-900 p-4 dark:bg-gray-950">
<pre className="whitespace-pre-wrap font-mono text-xs text-green-400">{updateOutput}</pre>
</div>
{IS_PLATFORM && reloadCountdown !== null && (
<div className="rounded-md border border-blue-200 bg-blue-50 px-3 py-2 text-xs text-blue-700 dark:border-blue-900/40 dark:bg-blue-900/20 dark:text-blue-200">
{reloadCountdown === 0
? 'Refresh the page now. If that doesn\'t work, RESTART the environment.'
: `Refresh the page in ${reloadCountdown} ${reloadCountdown === 1 ? 'second' : 'seconds'}. If that doesn\'t work, RESTART the environment.`}
</div>
)}
{updateError && (
<div className="rounded-md border border-red-200 bg-red-50 px-3 py-2 text-xs text-red-700 dark:border-red-900/40 dark:bg-red-900/20 dark:text-red-200">
{updateError}