jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Show raw platform startup errors in dialog

Browse Source
This commit is contained in:
Johannes Zellner
2025-11-28 14:50:18 +01:00
parent 6e9cd4c11b
commit 5b5c15b7f3
4 changed files with 58 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboard/src/components/Headerbar.vue
+21 -9
View File
@@ -7,12 +7,12 @@ const t = i18n.t;
import { onMounted, onUnmounted, ref, useTemplateRef, inject } from 'vue';
import { marked } from 'marked';
import { eachLimit } from 'async';
import { Button, Popover, Icon, Spinner } from '@cloudron/pankow';
import { Button, Popover, Icon, InputDialog, Spinner } from '@cloudron/pankow';
import { prettyDate, prettyLongDate } from '@cloudron/pankow/utils';
import NotificationsModel from '../models/NotificationsModel.js';
import ServicesModel from '../models/ServicesModel.js';
const props = defineProps(['config', 'subscription']);
defineProps(['config', 'subscription']);
const profile = inject('profile');
@@ -98,6 +98,15 @@ async function trackPlatformStatus() {
if (result.state === 'starting') platformTimeoutId = setTimeout(trackPlatformStatus, 5000);
}
const inputDialog = useTemplateRef('inputDialog');
function onShowPlatformError() {
inputDialog.value.info({
confirmLabel: t('main.dialog.close'),
title: t('main.platform.startupFailed'),
message: platformStatus.value.message,
});
}
const description = marked.parse(t('support.help.description', {
docsLink: 'https://docs.cloudron.io',
packagingLink: 'https://docs.cloudron.io/packaging/tutorial',
@@ -119,6 +128,7 @@ onUnmounted(() => {
<template>
<div class="headerbar">
<InputDialog ref="inputDialog"/>
<Popover ref="notificationPopover" :width="'min(80%, 400px)'" :height="'min(80%, 600px)'">
<div style="padding: 10px; display: flex; flex-direction: column; overflow: hidden; height: 100%;">
<div v-if="notifications.length" style="overflow: auto; margin-bottom: 10px">
@@ -158,17 +168,18 @@ onUnmounted(() => {
<div style="flex-grow: 1;"></div>
<div v-if="platformStatus.state !== 'ready'" class="headerbar-info">
<i v-if="platformStatus.state === 'error'" class="fa fa-exclamation-triangle text-danger"/>
<Spinner v-if="platformStatus.state === 'starting'" style="margin-right: 10px"/>
{{ platformStatus.message }}
<div v-if="platformStatus.state === 'starting'" class="headerbar-info">
<Spinner style="margin-right: 10px"/>{{ platformStatus.message }}
</div>
<div v-else-if="platformStatus.state === 'failed'" class="headerbar-info text-danger" style="cursor: pointer" @click="onShowPlatformError">
<Icon :icon="'fa fa-exclamation-triangle'"/> {{ $t('main.platform.startupFailed') }}
</div>
<!-- Warnings if subscription is expired or unpaid -->
<div v-if="profile.isAtLeastOwner && subscription.plan.id === 'expired'" class="headerbar-action subscription-expired" style="gap: 6px" @click="onSubscriptionRequired()">Subscription Expired</div>
<div class="headerbar-action" style="gap: 6px" v-if="profile.isAtLeastAdmin" ref="notificationButton" @click="onOpenNotifications(notificationPopover, $event, notificationButton)"><Icon :icon="notifications.length ? 'fas fa-bell' : 'far fa-bell'"/> {{ notifications.length > 99 ? '99+' : notifications.length }}</div>
<div class="headerbar-action pankow-no-mobile" style="gap: 6px" v-if="profile.isAtLeastAdmin" ref="helpButton" @click="onOpenHelp(helpPopover, $event, helpButton)"><Icon icon="fa fa-question"/></div>
<div class="headerbar-action" v-if="profile.isAtLeastAdmin" ref="notificationButton" @click="onOpenNotifications(notificationPopover, $event, notificationButton)"><Icon :icon="notifications.length ? 'fas fa-bell' : 'far fa-bell'"/> {{ notifications.length > 99 ? '99+' : notifications.length }}</div>
<div class="headerbar-action pankow-no-mobile" v-if="profile.isAtLeastAdmin" ref="helpButton" @click="onOpenHelp(helpPopover, $event, helpButton)"><Icon icon="fa fa-question"/></div>
<!-- <a class="headerbar-action" v-if="profile.isAtLeastAdmin" href="#/support"><Icon icon="fa fa-question"/></a> -->
<a class="headerbar-action" href="#/profile"><img :src="profile.avatarUrl" @error="event => event.target.src = '/img/avatar-default-symbolic.svg'"/> {{ profile.username }}</a>
</div>
@@ -185,13 +196,14 @@ onUnmounted(() => {
.headerbar-info {
display: flex;
gap: 6px;
align-items: center;
color: var(--pankow-text-color);
padding: 4px 15px;
}
.headerbar-action {
display: flex;
gap: 6px;
align-items: center;
cursor: pointer;
color: var(--pankow-text-color);