Move app start/stop back to the main toolbar

This commit is contained in:
Johannes Zellner
2025-10-16 22:26:26 +02:00
parent 91078f7a7e
commit 82c97f7e1c
2 changed files with 49 additions and 50 deletions
@@ -18,42 +18,6 @@ const props = defineProps([ 'app' ]);
const latestBackup = ref(null);
const TARGET_RUN_STATE = {
START: Symbol('start'),
STOP: Symbol('stop'),
};
function targetRunState() {
const app = props.app;
// if we have an error, we want to retry the pending state, otherwise toggle the runstate
if (app.error) {
if (app.error.details.installationState === ISTATES.PENDING_START) return TARGET_RUN_STATE.START;
else return TARGET_RUN_STATE.STOP;
} else {
if (app.runState === RSTATES.STOPPED) return TARGET_RUN_STATE.START;
else return TARGET_RUN_STATE.STOP;
}
}
const toggleRunStateBusy = ref(false);
async function onToggleRunState() {
const app = props.app;
toggleRunStateBusy.value = true;
let error;
if (targetRunState() === TARGET_RUN_STATE.START) [error] = await appsModel.start(app.id);
else [error] = await appsModel.stop(app.id);
if (error) {
toggleRunStateBusy.value = false;
console.error(error);
} else {
setTimeout(() => toggleRunStateBusy.value = false, 3000);
}
}
async function onUninstall() {
const yes = await inputDialog.value.confirm({
title: t('app.uninstallDialog.title', { app: (props.app.label || props.app.fqdn) }),
@@ -111,20 +75,6 @@ onMounted(async () => {
<div>
<InputDialog ref="inputDialog" />
<div>
<label>{{ $t('app.uninstall.startStop.title') }}</label>
<div>{{ $t('app.uninstall.startStop.description') }}</div>
<br/>
<Button @click="onToggleRunState()"
:disabled="toggleRunStateBusy || !!app.taskId || (app.error && (app.error.details.installationState !== 'pending_start' && app.error.details.installationState !== 'pending_stop')) || app.installationState === 'pending_start' || app.installationState === 'pending_stop'"
:loading="toggleRunStateBusy || app.installationState === 'pending_start' || app.installationState === 'pending_stop'"
>
{{ $t(targetRunState() === TARGET_RUN_STATE.START ? 'app.uninstall.startStop.startAction' : 'app.uninstall.startStop.stopAction') }}
</Button>
</div>
<hr style="margin-top: 20px" v-if="app.type !== APP_TYPES.PROXIED"/>
<div v-if="app.type !== APP_TYPES.PROXIED">
<label>{{ $t('app.archive.title') }}</label>
<div v-html="$t('app.archive.description')"></div>
+49
View File
@@ -151,6 +151,47 @@ function isViewEnabled(view, errorState) {
return false;
}
const TARGET_RUN_STATE = {
START: Symbol('start'),
STOP: Symbol('stop'),
};
function targetRunState() {
// if we have an error, we want to retry the pending state, otherwise toggle the runstate
if (app.value.error) {
if (app.value.error.details.installationState === ISTATES.PENDING_START) return TARGET_RUN_STATE.START;
else return TARGET_RUN_STATE.STOP;
} else {
if (app.value.runState === RSTATES.STOPPED) return TARGET_RUN_STATE.START;
else return TARGET_RUN_STATE.STOP;
}
}
const toggleRunStateBusy = ref(false);
async function onStartApp() {
toggleRunStateBusy.value = true;
const [error] = await appsModel.start(app.value.id);
if (error) {
toggleRunStateBusy.value = false;
return console.error(error);
}
setTimeout(() => toggleRunStateBusy.value = false, 3000);
}
async function onStopApp() {
toggleRunStateBusy.value = true;
const [error] = await appsModel.stop(app.value.id);
if (error) {
toggleRunStateBusy.value = false;
return console.error(error);
}
setTimeout(() => toggleRunStateBusy.value = false, 3000);
}
async function onStopAppTask() {
if (!app.value.taskId) return;
@@ -261,6 +302,14 @@ onBeforeUnmount(() => {
<div class="titlebar-toolbar">
<Button v-if="app.taskId" danger tool plain icon="fa-solid fa-xmark" v-tooltip="'Cancel Task'" :loading="busyStopTask" :disabled="busyStopTask" @click="onStopAppTask()"/>
<Button :menu="views" secondary class="pankow-no-desktop" tool>{{ views.find(v => v.id === currentView).label }}</Button>
<!--
TODO check if this should be shown on stop confirmation
<div>{{ $t('app.uninstall.startStop.description') }}</div>
-->
<Button v-if="!app.progress && targetRunState() === TARGET_RUN_STATE.START" secondary plain tool icon="fa-solid fa-circle-play" :loading="toggleRunStateBusy" :disabled="toggleRunStateBusy" v-tooltip="$t('app.uninstall.startStop.startAction')" @click="onStartApp()"/>
<Button v-else-if="!app.progress" secondary plain tool icon="fa-solid fa-circle-stop" :loading="toggleRunStateBusy" :disabled="toggleRunStateBusy" v-tooltip="$t('app.uninstall.startStop.stopAction')" @click="onStopApp()"/>
<ButtonGroup>
<Button secondary tool :href="`/logs.html?appId=${app.id}`" target="_blank" v-tooltip="$t('app.logsActionTooltip')" icon="fa-solid fa-align-left" />
<Button secondary tool v-if="app.type !== APP_TYPES.PROXIED" :href="`/terminal.html?id=${app.id}`" target="_blank" v-tooltip="$t('app.terminalActionTooltip')" icon="fa fa-terminal" />