feat: show modal on action error when no form

app/src/views/backup/BackupInfo.vue

@@ -39,8 +39,6 @@ const { infos, system, apps } = await api
 
 const allKeys = [...Object.keys(apps), ...Object.keys(system)]
 const selected = ref(allKeys)
-const serverError = ref('')
-const isValid = ref<boolean | null>(null)
 
 const hasBackupData = computed(() => {
   return !isEmptyValue(system) || !isEmptyValue(apps)
@@ -65,12 +63,15 @@ async function restoreBackup() {
       humanKey: { key: 'backups.restore', name: props.name },
     })
     .then(() => {
-      isValid.value = null
+      // FIXME back to backup list or home ?
     })
     .catch((err: APIError) => {
       if (!(err instanceof APIBadRequestError)) throw err
-      serverError.value = err.message
-      isValid.value = false
+      modalConfirm(
+        err.message,
+        { title: t('error'), bodyVariant: 'danger' },
+        { cancelable: false },
+      )
     })
 }
 
@@ -201,12 +202,6 @@ function downloadBackup() {
             <BFormCheckbox :value="appName" :aria-label="$t('check')" />
           </BListGroupItem>
         </BListGroup>
-
-        <BFormInvalidFeedback id="backup-restore-feedback" :state="isValid">
-          <YAlert alert variant="danger" class="mb-0">
-            {{ serverError }}
-          </YAlert>
-        </BFormInvalidFeedback>
       </BFormCheckboxGroup>
 
       <div v-else class="alert alert-warning mb-0">

app/src/views/domain/DomainInfo.vue

@@ -4,6 +4,7 @@ import { useI18n } from 'vue-i18n'
 import { useRouter } from 'vue-router'
 
 import api, { objectToParams } from '@/api'
+import { APIBadRequestError } from '@/api/errors'
 import ConfigPanelsComponent from '@/components/ConfigPanels.vue'
 import { formatConfigPanels, useConfigPanels } from '@/composables/configPanels'
 import { useDomains } from '@/composables/data'
@@ -82,7 +83,7 @@ async function deleteDomain() {
 
   api
     .delete({
-      uri: 'domains',
+      uri: `domains/${props.name}`,
       cachePath: `domains.${props.name}`,
       data,
       humanKey: {
@@ -93,6 +94,14 @@ async function deleteDomain() {
     .then(() => {
       router.push({ name: 'domain-list' })
     })
+    .catch((err) => {
+      if (!(err instanceof APIBadRequestError)) throw err
+      modalConfirm(
+        err.data.error,
+        { headerVariant: 'danger', title: t('error') },
+        { markdown: true, cancelable: false },
+      )
+    })
 }
 
 async function setAsDefaultDomain() {