gsadmin/sencho
1
0
Fork 0
mirror of https://github.com/Studio-Saelix/sencho.git synced 2026-08-27 18:57:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: rename isActionLoading to loadingAction for clarity and consistency

Browse Source
This commit is contained in:
SaelixCode
2026-03-03 12:47:41 -05:00
parent 10a483a0a6
commit ccf6ed4bc8
1 changed files with 26 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/components/EditorLayout.tsx
+26 -26
View File
@@ -64,7 +64,7 @@ export default function EditorLayout() {
const [newStackName, setNewStackName] = useState(''); const [newStackName, setNewStackName] = useState('');
const [stackToDelete, setStackToDelete] = useState<string | null>(null); const [stackToDelete, setStackToDelete] = useState<string | null>(null);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [isActionLoading, setIsActionLoading] = useState(false); const [loadingAction, setLoadingAction] = useState<string | null>(null);
const [isFileLoading, setIsFileLoading] = useState(false); const [isFileLoading, setIsFileLoading] = useState(false);
const [isDarkMode, setIsDarkMode] = useState(() => { const [isDarkMode, setIsDarkMode] = useState(() => {
const saved = localStorage.getItem('sencho-theme'); const saved = localStorage.getItem('sencho-theme');
@@ -347,9 +347,9 @@ export default function EditorLayout() {
const deployStack = async (e: React.MouseEvent) => { const deployStack = async (e: React.MouseEvent) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if (!selectedFile || isActionLoading) return; if (!selectedFile || loadingAction !== null) return;
const stackName = selectedFile.replace(/\.(yml|yaml)$/, ''); const stackName = selectedFile.replace(/\.(yml|yaml)$/, '');
setIsActionLoading(true); setLoadingAction('deploy');
try { try {
await apiFetch(`/stacks/${stackName}/deploy`, { await apiFetch(`/stacks/${stackName}/deploy`, {
method: 'POST', method: 'POST',
@@ -364,16 +364,16 @@ export default function EditorLayout() {
console.error('Failed to deploy:', error); console.error('Failed to deploy:', error);
toast.error(error.message || "Failed to deploy stack"); toast.error(error.message || "Failed to deploy stack");
} finally { } finally {
setIsActionLoading(false); setLoadingAction(null);
} }
}; };
const stopStack = async (e: React.MouseEvent) => { const stopStack = async (e: React.MouseEvent) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if (!selectedFile || isActionLoading) return; if (!selectedFile || loadingAction !== null) return;
const stackName = selectedFile.replace(/\.(yml|yaml)$/, ''); const stackName = selectedFile.replace(/\.(yml|yaml)$/, '');
setIsActionLoading(true); setLoadingAction('stop');
try { try {
await apiFetch(`/stacks/${stackName}/stop`, { await apiFetch(`/stacks/${stackName}/stop`, {
method: 'POST', method: 'POST',
@@ -386,16 +386,16 @@ export default function EditorLayout() {
} catch (error) { } catch (error) {
console.error('Failed to stop:', error); console.error('Failed to stop:', error);
} finally { } finally {
setIsActionLoading(false); setLoadingAction(null);
} }
}; };
const restartStack = async (e: React.MouseEvent) => { const restartStack = async (e: React.MouseEvent) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if (!selectedFile || isActionLoading) return; if (!selectedFile || loadingAction !== null) return;
const stackName = selectedFile.replace(/\.(yml|yaml)$/, ''); const stackName = selectedFile.replace(/\.(yml|yaml)$/, '');
setIsActionLoading(true); setLoadingAction('restart');
try { try {
await apiFetch(`/stacks/${stackName}/restart`, { await apiFetch(`/stacks/${stackName}/restart`, {
method: 'POST', method: 'POST',
@@ -408,16 +408,16 @@ export default function EditorLayout() {
} catch (error) { } catch (error) {
console.error('Failed to restart:', error); console.error('Failed to restart:', error);
} finally { } finally {
setIsActionLoading(false); setLoadingAction(null);
} }
}; };
const updateStack = async (e: React.MouseEvent) => { const updateStack = async (e: React.MouseEvent) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
if (!selectedFile || isActionLoading) return; if (!selectedFile || loadingAction !== null) return;
const stackName = selectedFile.replace(/\.(yml|yaml)$/, ''); const stackName = selectedFile.replace(/\.(yml|yaml)$/, '');
setIsActionLoading(true); setLoadingAction('update');
try { try {
await apiFetch(`/stacks/${stackName}/update`, { await apiFetch(`/stacks/${stackName}/update`, {
method: 'POST', method: 'POST',
@@ -430,13 +430,13 @@ export default function EditorLayout() {
} catch (error) { } catch (error) {
console.error('Failed to update:', error); console.error('Failed to update:', error);
} finally { } finally {
setIsActionLoading(false); setLoadingAction(null);
} }
}; };
const deleteStack = async () => { const deleteStack = async () => {
if (!stackToDelete) return; if (!stackToDelete) return;
setIsActionLoading(true); setLoadingAction('delete');
try { try {
const response = await apiFetch(`/stacks/${stackToDelete}`, { const response = await apiFetch(`/stacks/${stackToDelete}`, {
method: 'DELETE', method: 'DELETE',
@@ -459,7 +459,7 @@ export default function EditorLayout() {
console.error('Failed to delete stack:', error); console.error('Failed to delete stack:', error);
toast.error('Failed to delete stack'); toast.error('Failed to delete stack');
} finally { } finally {
setIsActionLoading(false); setLoadingAction(null);
} }
}; };
@@ -817,38 +817,38 @@ export default function EditorLayout() {
<div className="flex items-center gap-2 flex-wrap"> <div className="flex items-center gap-2 flex-wrap">
{isRunning ? ( {isRunning ? (
<> <>
<Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={stopStack} disabled={isActionLoading}> <Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={stopStack} disabled={loadingAction !== null}>
<Square className="w-4 h-4 mr-2" /> <Square className="w-4 h-4 mr-2" />
{isActionLoading ? 'Working...' : 'Stop'} {loadingAction === 'stop' ? 'Stopping...' : 'Stop'}
</Button> </Button>
<Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={restartStack} disabled={isActionLoading}> <Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={restartStack} disabled={loadingAction !== null}>
<RotateCw className="w-4 h-4 mr-2" /> <RotateCw className="w-4 h-4 mr-2" />
Restart {loadingAction === 'restart' ? 'Restarting...' : 'Restart'}
</Button> </Button>
</> </>
) : ( ) : (
<Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={deployStack} disabled={isActionLoading}> <Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={deployStack} disabled={loadingAction !== null}>
<Play className="w-4 h-4 mr-2" /> <Play className="w-4 h-4 mr-2" />
{isActionLoading ? 'Working...' : 'Start'} {loadingAction === 'deploy' || loadingAction === 'start' ? 'Starting...' : 'Start'}
</Button> </Button>
)} )}
<Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={updateStack} disabled={isActionLoading}> <Button type="button" size="sm" variant="outline" className="rounded-lg" onClick={updateStack} disabled={loadingAction !== null}>
<CloudDownload className="w-4 h-4 mr-2" /> <CloudDownload className="w-4 h-4 mr-2" />
Update {loadingAction === 'update' ? 'Updating...' : 'Update'}
</Button> </Button>
<Button <Button
type="button" type="button"
size="sm" size="sm"
variant="destructive" variant="destructive"
className="rounded-lg" className="rounded-lg"
disabled={isActionLoading} disabled={loadingAction !== null}
onClick={() => { onClick={() => {
setStackToDelete(selectedFile); setStackToDelete(selectedFile);
setDeleteDialogOpen(true); setDeleteDialogOpen(true);
}} }}
> >
<Trash2 className="w-4 h-4 mr-2" /> <Trash2 className="w-4 h-4 mr-2" />
Delete {loadingAction === 'delete' ? 'Deleting...' : 'Delete'}
</Button> </Button>
</div> </div>
</div> </div>
@@ -983,7 +983,7 @@ export default function EditorLayout() {
<Save className="w-4 h-4 mr-2" /> <Save className="w-4 h-4 mr-2" />
Save Only Save Only
</Button> </Button>
<Button size="sm" variant="default" className="rounded-lg" onClick={handleSaveAndDeploy} disabled={isActionLoading}> <Button size="sm" variant="default" className="rounded-lg" onClick={handleSaveAndDeploy} disabled={loadingAction === 'deploy'}>
<Rocket className="w-4 h-4 mr-2" /> <Rocket className="w-4 h-4 mr-2" />
Save & Deploy Save & Deploy
</Button> </Button>