fix: hide the instance bar when nothing is running
This commit is contained in:
1 parent
13ba1ae18f
commit
0a80cadbc0
1 file changed
+222
@@ -0,0 +1,222 @@
|
|||||||
|
From 0000000000000000000000000000000000000000 Mon Sep 17 00:00:00 2001
|
||||||
|
From: Modrinth Enhanced <patches@modrinth-enhanced.invalid>
|
||||||
|
Date: Sat, 19 Sep 2026 02:42:55 +0200
|
||||||
|
Subject: [PATCH] Show the running instance bar only while one is running
|
||||||
|
|
||||||
|
---
|
||||||
|
.../src/components/ui/AppActionBar.vue | 189 +++++++++---------
|
||||||
|
1 file changed, 91 insertions(+), 98 deletions(-)
|
||||||
|
|
||||||
|
diff --git a/apps/app-frontend/src/components/ui/AppActionBar.vue b/apps/app-frontend/src/components/ui/AppActionBar.vue
|
||||||
|
index eff399e..d4648a5 100644
|
||||||
|
--- a/apps/app-frontend/src/components/ui/AppActionBar.vue
|
||||||
|
+++ b/apps/app-frontend/src/components/ui/AppActionBar.vue
|
||||||
|
@@ -17,106 +17,103 @@
|
||||||
|
<span class="text-sm text-contrast"> {{ formatMessage(messages.offline) }} </span>
|
||||||
|
</div>
|
||||||
|
<AppUpdateButton />
|
||||||
|
+ <!-- Nothing running is worth no chip at all: it is there while an
|
||||||
|
+ instance is, and out of the way the rest of the time. -->
|
||||||
|
<div
|
||||||
|
+ v-if="selectedProcess"
|
||||||
|
class="flex border-solid border-surface-5 text-sm font-medium items-center gap-2 py-1.5 px-3 rounded-xl border"
|
||||||
|
>
|
||||||
|
- <template v-if="selectedProcess">
|
||||||
|
- <OnlineIndicatorIcon />
|
||||||
|
- <div class="text-contrast flex items-center gap-2">
|
||||||
|
- <router-link
|
||||||
|
- v-tooltip="formatMessage(messages.viewInstance)"
|
||||||
|
- :to="`/instance/${encodeURIComponent(selectedProcess.instance.id)}`"
|
||||||
|
- class="hover:underline"
|
||||||
|
- >
|
||||||
|
- {{ selectedProcess.instance.name }}
|
||||||
|
- </router-link>
|
||||||
|
- <FloatingMenu
|
||||||
|
- v-if="currentProcesses.length > 1"
|
||||||
|
- placement="bottom"
|
||||||
|
- @open="showInstances = true"
|
||||||
|
- @close="showInstances = false"
|
||||||
|
+ <OnlineIndicatorIcon />
|
||||||
|
+ <div class="text-contrast flex items-center gap-2">
|
||||||
|
+ <router-link
|
||||||
|
+ v-tooltip="formatMessage(messages.viewInstance)"
|
||||||
|
+ :to="`/instance/${encodeURIComponent(selectedProcess.instance.id)}`"
|
||||||
|
+ class="hover:underline"
|
||||||
|
+ >
|
||||||
|
+ {{ selectedProcess.instance.name }}
|
||||||
|
+ </router-link>
|
||||||
|
+ <FloatingMenu
|
||||||
|
+ v-if="currentProcesses.length > 1"
|
||||||
|
+ placement="bottom"
|
||||||
|
+ @open="showInstances = true"
|
||||||
|
+ @close="showInstances = false"
|
||||||
|
+ >
|
||||||
|
+ <IconButton
|
||||||
|
+ v-tooltip="
|
||||||
|
+ showInstances
|
||||||
|
+ ? formatMessage(messages.hideMoreRunningInstances)
|
||||||
|
+ : formatMessage(messages.showMoreRunningInstances)
|
||||||
|
+ "
|
||||||
|
+ class="!size-6"
|
||||||
|
+ type="quiet"
|
||||||
|
+ size="xs"
|
||||||
|
+ :label="
|
||||||
|
+ showInstances
|
||||||
|
+ ? formatMessage(messages.hideMoreRunningInstances)
|
||||||
|
+ : formatMessage(messages.showMoreRunningInstances)
|
||||||
|
+ "
|
||||||
|
>
|
||||||
|
- <IconButton
|
||||||
|
- v-tooltip="
|
||||||
|
- showInstances
|
||||||
|
- ? formatMessage(messages.hideMoreRunningInstances)
|
||||||
|
- : formatMessage(messages.showMoreRunningInstances)
|
||||||
|
- "
|
||||||
|
- class="!size-6"
|
||||||
|
- type="quiet"
|
||||||
|
- size="xs"
|
||||||
|
- :label="
|
||||||
|
- showInstances
|
||||||
|
- ? formatMessage(messages.hideMoreRunningInstances)
|
||||||
|
- : formatMessage(messages.showMoreRunningInstances)
|
||||||
|
- "
|
||||||
|
- >
|
||||||
|
- <DropdownIcon :class="{ 'rotate-180': !!showInstances }" />
|
||||||
|
- </IconButton>
|
||||||
|
- <template #popper>
|
||||||
|
- <div class="flex w-[20rem] max-h-[24rem] flex-col gap-2 overflow-auto">
|
||||||
|
- <div
|
||||||
|
- v-for="process in currentProcesses"
|
||||||
|
- :key="process.uuid"
|
||||||
|
- class="flex w-full items-center gap-2 rounded-xl bg-surface-4 p-2 text-sm"
|
||||||
|
+ <DropdownIcon :class="{ 'rotate-180': !!showInstances }" />
|
||||||
|
+ </IconButton>
|
||||||
|
+ <template #popper>
|
||||||
|
+ <div class="flex w-[20rem] max-h-[24rem] flex-col gap-2 overflow-auto">
|
||||||
|
+ <div
|
||||||
|
+ v-for="process in currentProcesses"
|
||||||
|
+ :key="process.uuid"
|
||||||
|
+ class="flex w-full items-center gap-2 rounded-xl bg-surface-4 p-2 text-sm"
|
||||||
|
+ >
|
||||||
|
+ <button
|
||||||
|
+ v-tooltip.left="
|
||||||
|
+ process.uuid === selectedProcess.uuid
|
||||||
|
+ ? formatMessage(messages.primaryInstance)
|
||||||
|
+ : formatMessage(messages.makePrimaryInstance)
|
||||||
|
+ "
|
||||||
|
+ class="flex flex-grow items-center gap-2"
|
||||||
|
+ :class="{
|
||||||
|
+ 'active:scale-95 transition-transform': process.uuid !== selectedProcess.uuid,
|
||||||
|
+ }"
|
||||||
|
+ :disabled="process.uuid === selectedProcess.uuid"
|
||||||
|
+ @click="selectProcess(process)"
|
||||||
|
+ >
|
||||||
|
+ <OnlineIndicatorIcon />
|
||||||
|
+ <span class="mr-auto text-contrast flex items-center gap-2">
|
||||||
|
+ {{ process.instance.name }}
|
||||||
|
+ <StarIcon v-if="process.uuid === selectedProcess.uuid" class="text-orange" />
|
||||||
|
+ </span>
|
||||||
|
+ </button>
|
||||||
|
+ <button
|
||||||
|
+ v-tooltip="formatMessage(messages.stopInstance)"
|
||||||
|
+ class="active:scale-95 flex"
|
||||||
|
+ @click.stop="stop(process)"
|
||||||
|
+ >
|
||||||
|
+ <StopCircleIcon class="text-red size-5" />
|
||||||
|
+ </button>
|
||||||
|
+ <button
|
||||||
|
+ v-tooltip="formatMessage(messages.viewLogs)"
|
||||||
|
+ class="active:scale-95 flex"
|
||||||
|
+ @click.stop="goToTerminal(process.instance.id)"
|
||||||
|
>
|
||||||
|
- <button
|
||||||
|
- v-tooltip.left="
|
||||||
|
- process.uuid === selectedProcess.uuid
|
||||||
|
- ? formatMessage(messages.primaryInstance)
|
||||||
|
- : formatMessage(messages.makePrimaryInstance)
|
||||||
|
- "
|
||||||
|
- class="flex flex-grow items-center gap-2"
|
||||||
|
- :class="{
|
||||||
|
- 'active:scale-95 transition-transform': process.uuid !== selectedProcess.uuid,
|
||||||
|
- }"
|
||||||
|
- :disabled="process.uuid === selectedProcess.uuid"
|
||||||
|
- @click="selectProcess(process)"
|
||||||
|
- >
|
||||||
|
- <OnlineIndicatorIcon />
|
||||||
|
- <span class="mr-auto text-contrast flex items-center gap-2">
|
||||||
|
- {{ process.instance.name }}
|
||||||
|
- <StarIcon v-if="process.uuid === selectedProcess.uuid" class="text-orange" />
|
||||||
|
- </span>
|
||||||
|
- </button>
|
||||||
|
- <button
|
||||||
|
- v-tooltip="formatMessage(messages.stopInstance)"
|
||||||
|
- class="active:scale-95 flex"
|
||||||
|
- @click.stop="stop(process)"
|
||||||
|
- >
|
||||||
|
- <StopCircleIcon class="text-red size-5" />
|
||||||
|
- </button>
|
||||||
|
- <button
|
||||||
|
- v-tooltip="formatMessage(messages.viewLogs)"
|
||||||
|
- class="active:scale-95 flex"
|
||||||
|
- @click.stop="goToTerminal(process.instance.id)"
|
||||||
|
- >
|
||||||
|
- <TerminalSquareIcon class="text-secondary size-5" />
|
||||||
|
- </button>
|
||||||
|
- </div>
|
||||||
|
+ <TerminalSquareIcon class="text-secondary size-5" />
|
||||||
|
+ </button>
|
||||||
|
</div>
|
||||||
|
- </template>
|
||||||
|
- </FloatingMenu>
|
||||||
|
- </div>
|
||||||
|
- <button
|
||||||
|
- v-tooltip="formatMessage(messages.stopInstance)"
|
||||||
|
- class="active:scale-95 flex"
|
||||||
|
- @click="stop(selectedProcess)"
|
||||||
|
- >
|
||||||
|
- <StopCircleIcon class="text-red size-5" />
|
||||||
|
- </button>
|
||||||
|
- <button
|
||||||
|
- v-tooltip="formatMessage(messages.viewLogs)"
|
||||||
|
- class="active:scale-95 flex"
|
||||||
|
- @click="goToTerminal()"
|
||||||
|
- >
|
||||||
|
- <TerminalSquareIcon class="text-secondary size-5" />
|
||||||
|
- </button>
|
||||||
|
- </template>
|
||||||
|
- <template v-else>
|
||||||
|
- <span class="size-2 rounded-full bg-secondary" />
|
||||||
|
- <span class="text-secondary"> {{ formatMessage(messages.noInstancesRunning) }} </span>
|
||||||
|
- </template>
|
||||||
|
+ </div>
|
||||||
|
+ </template>
|
||||||
|
+ </FloatingMenu>
|
||||||
|
+ </div>
|
||||||
|
+ <button
|
||||||
|
+ v-tooltip="formatMessage(messages.stopInstance)"
|
||||||
|
+ class="active:scale-95 flex"
|
||||||
|
+ @click="stop(selectedProcess)"
|
||||||
|
+ >
|
||||||
|
+ <StopCircleIcon class="text-red size-5" />
|
||||||
|
+ </button>
|
||||||
|
+ <button
|
||||||
|
+ v-tooltip="formatMessage(messages.viewLogs)"
|
||||||
|
+ class="active:scale-95 flex"
|
||||||
|
+ @click="goToTerminal()"
|
||||||
|
+ >
|
||||||
|
+ <TerminalSquareIcon class="text-secondary size-5" />
|
||||||
|
+ </button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
@@ -202,10 +199,6 @@ const messages = defineMessages({
|
||||||
|
id: 'app.action-bar.view-logs',
|
||||||
|
defaultMessage: 'View logs',
|
||||||
|
},
|
||||||
|
- noInstancesRunning: {
|
||||||
|
- id: 'app.action-bar.no-instances-running',
|
||||||
|
- defaultMessage: 'No instances running',
|
||||||
|
- },
|
||||||
|
downloadingJava: {
|
||||||
|
id: 'app.action-bar.downloading-java',
|
||||||
|
defaultMessage: 'Downloading Java {version}',
|
||||||
Reference in new issue
Block a user