diff --git a/dashboard/src/components/AppRepairDialog.vue b/dashboard/src/components/AppRepairDialog.vue
new file mode 100644
index 000000000..67c539ce3
--- /dev/null
+++ b/dashboard/src/components/AppRepairDialog.vue
@@ -0,0 +1,187 @@
+<script setup>
+
+import { ref, useTemplateRef } from 'vue';
+import { Dialog, FormGroup, SingleSelect, TextInput } from 'pankow';
+import { prettyDate } from 'pankow/utils';
+import { ISTATES } from '../constants.js';
+import { taskNameFromInstallationState } from '../utils.js';
+import AppsModel from '../models/AppsModel.js';
+
+const appsModel = AppsModel.create();
+
+const emit = defineEmits([ 'success' ]);
+
+const dialog = useTemplateRef('dialog');
+
+const busy = ref(false);
+const formError = ref('');
+const id = ref('');
+const fqdn = ref('');
+const appError = ref(null);
+const backups = ref([]);
+const backupId = ref('');
+
+async function onSubmit() {
+  busy.value = true;
+  formError.value = '';
+
+  const errorState = (appError.value && appError.value.installationState) || ISTATES.PENDING_CONFIGURE;
+  const data = {};
+
+  let repairFunc;
+  switch (errorState) {
+    case ISTATES.PENDING_INSTALL:
+    case ISTATES.PENDING_CLONE: // if manifest or bad image, use CLI to provide new manifest
+      repairFunc = appsModel.repair.bind(null, id.value, {}); // this will trigger a re-install
+      break;
+
+    // case ISTATES.PENDING_LOCATION_CHANGE:
+    //   data.subdomain = $scope.repair.subdomain;
+    //   data.domain = $scope.repair.domain.domain;
+    //   data.aliasDomains = $scope.repair.aliasDomains.filter(function (a) { return a.enabled; })
+    //     .map(function (d) { return { subdomain: d.subdomain, domain: d.domain.domain }; });
+    //   data.redirectDomains = $scope.repair.redirectDomains.filter(function (a) { return a.enabled; })
+    //     .map(function (d) { return { subdomain: d.subdomain, domain: d.domain.domain }; });
+    //   data.overwriteDns = true; // always overwriteDns. user can anyway check and uncheck above
+    //   repairFunc = Client.configureApp.bind(null, $scope.app.id, 'location', data);
+    //   break;
+
+    case ISTATES.PENDING_DATA_DIR_MIGRATION:
+      repairFunc = appsModel.configure.bind(null, id.value, 'storage', { storageVolumeId: null, storageVolumePrefix: null });
+      break;
+
+    // this also happens for import faliures. this UI can only show backup listing. use CLI for arbit id/config
+    case ISTATES.PENDING_RESTORE:
+    case ISTATES.PENDING_IMPORT:
+      if (backups.value.length === 0) { // this can happen when you give some invalid backup via CLI and restore via UI
+        repairFunc = appsModel.repair.bind(null, id.value, {}); // this will trigger a re-install
+      } else {
+        repairFunc = appsModel.restore.bind(null, id.value, backupId.value);
+      }
+      break;
+
+    case ISTATES.PENDING_UNINSTALL:
+      repairFunc = appsModel.uninstall.bind(null, id.value);
+      break;
+
+    case ISTATES.PENDING_START:
+    case ISTATES.PENDING_STOP:
+    case ISTATES.PENDING_RESTART:
+    case ISTATES.PENDING_RESIZE:
+    case ISTATES.PENDING_DEBUG:
+    case ISTATES.PENDING_RECREATE_CONTAINER:
+    case ISTATES.PENDING_CONFIGURE:
+    case ISTATES.PENDING_BACKUP: // can happen if the backup task was killed/rebooted
+    case ISTATES.PENDING_UPDATE: // when update failed, just bring it back to current state and user can click update again
+    default:
+      repairFunc = appsModel.repair.bind(null, id.value, {});
+      break;
+  }
+
+  const [error] = await repairFunc();
+  if (error) {
+    busy.value = false;
+    return console.error(error);
+  }
+
+  emit('success');
+  dialog.value.close();
+  busy.value = false;
+}
+
+defineExpose({
+  async open(app) {
+    id.value = app.id;
+    fqdn.value = app.fqdn;
+    appError.value = app.error || null;
+
+    const errorState = (app.error && app.error.installationState) || ISTATES.PENDING_CONFIGURE;
+
+    if (errorState === ISTATES.PENDING_RESTORE || errorState === ISTATES.PENDING_IMPORT) {
+      const [error, result] = await appsModel.backups(app.id);
+      if (error) return console.error(error);
+
+      result.forEach(b => {
+        b.label = prettyDate(b.creationTime) + ` - v${b.packageVersion}`;
+      });
+      backups.value = result;
+      backupId.value = '';
+    }
+
+    dialog.value.open();
+  }
+});
+
+</script>
+
+<template>
+  <div>
+    <Dialog ref="dialog" :title="$t('app.repairDialog.title', { app: fqdn })"
+     :confirm-label="$t('app.repairDialog.retryAction', { task: taskNameFromInstallationState(appError ? appError.installationState : '') })"
+     :confirm-active="!busy"
+     :confirm-busy="busy"
+     :reject-label="busy ? '' : $t('main.dialog.cancel')"
+      reject-style="secondary"
+     @confirm="onSubmit()"
+    >
+      <div>
+        <div class="text-danger" v-if="formError">{{ formError }}</div>
+
+        <div v-if="appError">
+          <p v-html="$t('app.repairDialog.taskError', { task: taskNameFromInstallationState(appError ? appError.installationState : '') })"></p>
+          <p class="text-danger">{{ appError.reason + ': ' + appError.message }}</p>
+        </div>
+        <div v-else>
+          <p>{{ $t('app.repairDialog.description') }}</p>
+        </div>
+
+        <form @submit.prevent="onSubmit()" autocomplete="off">
+          <fieldset :disabled="busy">
+            <FormGroup v-if="backups.length">
+              <label for="backupInput">{{ $t('app.repairDialog.fromBackup') }}</label>
+              <SingleSelect :options="backups" v-model="backupId" option-key="id" option-label="label"/>
+            </FormGroup>
+<!--
+        <div class="form-group" ng-show="repair.subdomain && repair.domain">
+          <p>{{ 'app.repairDialog.domainDescription' | tr }}</p>
+          <label class="control-label">{{ 'app.repairDialog.location' | tr }}</label>
+          <div class="input-group form-inline">
+            <input type="text" class="form-control" ng-model="repair.subdomain" name="location" placeholder="{{ 'Leave empty to use bare domain' }}" autofocus>
+
+            <div class="input-group-btn">
+              <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                <span>{{ '.' + repair.domain.domain }}</span>
+                <span class="caret"></span>
+              </button>
+              <ul class="dropdown-menu dropdown-menu-right" role="menu">
+                <li ng-repeat="domain in domains">
+                  <a href="" ng-click="repair.domain = domain">{{ domain.domain }}</a>
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
+
+        <div ng-show="repair.aliasDomains.length">
+          <p ng-repeat="aliasDomain in repair.aliasDomains">
+            <label class="control-label"><input type="checkbox" ng-model="aliasDomain.enabled">
+               {{ aliasDomain.subdomain + (!aliasDomain.subdomain ? '' : '.') + aliasDomain.domain.domain }}
+              </label>
+          </p>
+        </div>
+
+        <div ng-show="repair.redirectDomains.length">
+          <p ng-repeat="redirectDomain in repair.redirectDomains">
+            <label class="control-label"><input type="checkbox" ng-model="redirectDomain.enabled">
+               {{ redirectDomain.subdomain + (!redirectDomain.subdomain ? '' : '.') + redirectDomain.domain.domain }}
+              </label>
+          </p>
+        </div>
+-->
+          </fieldset>
+        </form>
+      </div>
+    </Dialog>
+  </div>
+</template>
+
diff --git a/dashboard/src/components/app/Repair.vue b/dashboard/src/components/app/Repair.vue
index a18d90f6d..0c058b111 100644
--- a/dashboard/src/components/app/Repair.vue
+++ b/dashboard/src/components/app/Repair.vue
@@ -1,8 +1,9 @@
 <script setup>
 
-import { ref, onMounted, watch } from 'vue';
+import { ref, onMounted, watch, useTemplateRef } from 'vue';
 import { Button, Switch } from 'pankow';
-import { ISTATES } from '../../constants.js';
+import { taskNameFromInstallationState } from '../../utils.js';
+import AppRepairDialog from '../AppRepairDialog.vue';
 import AppsModel from '../../models/AppsModel.js';
 
 const props = defineProps([ 'app' ]);
@@ -21,8 +22,9 @@ watch(debugMode, async (newValue) => {
   if (error) return console.error(error);
 });
 
+const repairDialog = useTemplateRef('repairDialog');
 async function onRepair() {
-  // TODO
+  repairDialog.value.open(props.app);
 }
 
 async function onRestart() {
@@ -34,28 +36,6 @@ async function onRestart() {
   busyRestart.value = false;
 }
 
-function taskName(installationState) {
-  switch (installationState) {
-    case ISTATES.PENDING_INSTALL: return 'install';
-    case ISTATES.PENDING_CLONE: return 'clone';
-    case ISTATES.PENDING_LOCATION_CHANGE: return 'location change';
-    case ISTATES.PENDING_CONFIGURE: return 'configure';
-    case ISTATES.PENDING_RECREATE_CONTAINER: return 'create container';
-    case ISTATES.PENDING_DEBUG: return 'debug';
-    case ISTATES.PENDING_RESIZE: return 'resize';
-    case ISTATES.PENDING_DATA_DIR_MIGRATION: return 'data migration';
-    case ISTATES.PENDING_UNINSTALL: return 'uninstall';
-    case ISTATES.PENDING_RESTORE: return 'restore';
-    case ISTATES.PENDING_IMPORT: return 'import';
-    case ISTATES.PENDING_UPDATE: return 'update';
-    case ISTATES.PENDING_BACKUP: return 'backup';
-    case ISTATES.PENDING_START: return 'start app';
-    case ISTATES.PENDING_STOP: return 'stop app';
-    case ISTATES.PENDING_RESTART: return 'restart app';
-    default: return installationState || '';
-  }
-}
-
 onMounted(() => {
   debugMode.value = !!props.app.debugMode;
 });
@@ -64,6 +44,8 @@ onMounted(() => {
 
 <template>
   <div>
+    <AppRepairDialog ref="repairDialog" />
+
     <label>{{ $t('app.repair.recovery.title') }}</label>
     <p v-html="$t('app.repair.recovery.description', { docsLink: 'https://docs.cloudron.io/troubleshooting/#unresponsive-app' })"></p>
 
@@ -76,7 +58,7 @@ onMounted(() => {
 
     <label>{{ $t('app.repair.taskError.title') }}</label>
     <p>{{ $t('app.repair.taskError.description') }}</p>
-    <p v-if="app.error">An error occurred during the <b>{{ taskName(app.error.installationState) }}</b> operation: <span class="text-danger"><b>{{ app.error.reason + ': ' + app.error.message }}</b></span></p>
-    <Button @click="onRepair()" :disabled="app.taskId || !app.error" v-tooltip="app.taskId ? $t('app.repair.appIsBusyTooltip') : ''">{{ $t('app.repair.taskError.retryAction', { task: app.error ? taskName(app.error.installationState) : '' }) }}</Button>
+    <p v-if="app.error">An error occurred during the <b>{{ taskNameFromInstallationState(app.error.installationState) }}</b> operation: <span class="text-danger"><b>{{ app.error.reason + ': ' + app.error.message }}</b></span></p>
+    <Button @click="onRepair()" :disabled="app.taskId || !app.error" v-tooltip="app.taskId ? $t('app.repair.appIsBusyTooltip') : ''">{{ $t('app.repair.taskError.retryAction', { task: app.error ? taskNameFromInstallationState(app.error.installationState) : '' }) }}</Button>
   </div>
 </template>
diff --git a/dashboard/src/models/AppsModel.js b/dashboard/src/models/AppsModel.js
index ddbe4be9f..82543db38 100644
--- a/dashboard/src/models/AppsModel.js
+++ b/dashboard/src/models/AppsModel.js
@@ -378,6 +378,17 @@ function create() {
       if (result.status !== 200) return [result];
       return [null, result.body];
     },
+    async repair(id, data) {
+      let result;
+      try {
+        result = await fetcher.post(`${API_ORIGIN}/api/v1/apps/${id}/repair`, data, { access_token: accessToken });
+      } catch (e) {
+        return [e];
+      }
+
+      if (result.status !== 200 && result.status !== 202) return [result];
+      return [null, result.body];
+    },
   };
 }
 
diff --git a/dashboard/src/utils.js b/dashboard/src/utils.js
index 616d43af4..46aca44de 100644
--- a/dashboard/src/utils.js
+++ b/dashboard/src/utils.js
@@ -1,5 +1,6 @@
 
 import { prettyBinarySize } from 'pankow/utils';
+import { ISTATES } from './constants.js';
 
 // https://stackoverflow.com/questions/3665115/how-to-create-a-file-in-memory-for-user-to-download-but-not-through-server#18197341
 function download(filename, text) {
@@ -482,6 +483,29 @@ function eventlogSource(eventlog, app = null) {
   return line;
 }
 
+function taskNameFromInstallationState(installationState) {
+  switch (installationState) {
+    case ISTATES.PENDING_INSTALL: return 'install';
+    case ISTATES.PENDING_CLONE: return 'clone';
+    case ISTATES.PENDING_LOCATION_CHANGE: return 'location change';
+    case ISTATES.PENDING_CONFIGURE: return 'configure';
+    case ISTATES.PENDING_RECREATE_CONTAINER: return 'create container';
+    case ISTATES.PENDING_DEBUG: return 'debug';
+    case ISTATES.PENDING_RESIZE: return 'resize';
+    case ISTATES.PENDING_DATA_DIR_MIGRATION: return 'data migration';
+    case ISTATES.PENDING_UNINSTALL: return 'uninstall';
+    case ISTATES.PENDING_RESTORE: return 'restore';
+    case ISTATES.PENDING_IMPORT: return 'import';
+    case ISTATES.PENDING_UPDATE: return 'update';
+    case ISTATES.PENDING_BACKUP: return 'backup';
+    case ISTATES.PENDING_START: return 'start app';
+    case ISTATES.PENDING_STOP: return 'stop app';
+    case ISTATES.PENDING_RESTART: return 'restart app';
+    default: return installationState || '';
+  }
+}
+
+
 // named exports
 export {
   download,
@@ -489,6 +513,7 @@ export {
   s3like,
   eventlogDetails,
   eventlogSource,
+  taskNameFromInstallationState,
 };
 
 // default export
@@ -498,4 +523,5 @@ export default {
   s3like,
   eventlogDetails,
   eventlogSource,
+  taskNameFromInstallationState,
 };