diff --git a/dashboard/src/components/app/Storage.vue b/dashboard/src/components/app/Storage.vue
new file mode 100644
index 000000000..0ab3b55ae
--- /dev/null
+++ b/dashboard/src/components/app/Storage.vue
@@ -0,0 +1,180 @@
+<script setup>
+
+import { ref, onMounted, computed } from 'vue';
+import { Button, FormGroup, TextInput, SingleSelect } from 'pankow';
+import { prettyBinarySize, prettyDate } from 'pankow/utils';
+import AppsModel from '../../models/AppsModel.js';
+import VolumesModel from '../../models/VolumesModel.js';
+
+const props = defineProps([ 'app' ]);
+
+const appsModel = AppsModel.create();
+const volumesModel = VolumesModel.create();
+
+const DEFAULT_VOLUME_ID = '__default__';
+
+const volumes = ref([]);
+const moveBusy = ref(false);
+const moveError = ref('');
+const diskUsage = ref(-1);
+const diskUsageDate = ref(0);
+const volumeId = ref('');
+const volumePrefix = ref('');
+const selectedMountType = computed(() => {
+  const v = volumes.value.find(v => v.id === volumeId.value);
+  return v ? v.mountType : '';
+});
+
+const mounts = ref([]);
+const mountsBusy = ref(false);
+const mountsError = ref('');
+
+async function onSubmitMove() {
+   moveBusy.value = true;
+   moveError.value = '';
+
+  const data = {
+    storageVolumeId: volumeId.value !== DEFAULT_VOLUME_ID ? volumeId.value : null,
+    storageVolumePrefix: volumeId.value !== DEFAULT_VOLUME_ID ? volumePrefix.value : null ,
+  };
+
+  const [error] = await appsModel.configure(props.app.id, 'storage', data);
+  if (error) {
+    moveError.value = error.body ? error.body.message : 'Internal error';
+    moveBusy.value = false;
+    return console.error(error);
+  }
+
+  moveBusy.value = false;
+}
+
+function onMountAdd() {
+  mounts.value.push({
+    volume: volumes.value[0],
+    readOnly: 'true'
+  });
+}
+
+function onMountRemove(index) {
+  mounts.value.splice(index, 1);
+}
+
+async function onSubmitMounts() {
+  mountsBusy.value = true;
+  mountsError.value = '';
+
+  const data = mounts.value.map((mount) => {
+    return {
+      volumeId: mount.volumeId,
+      readOnly: mount.readOnly === 'true'
+    };
+  });
+
+  const [error] = await appsModel.configure(props.app.id, 'mounts', { mounts: data });
+  if (error) {
+    mountsError.value = error.body ? error.body.message : 'Internal error';
+    mountsBusy.value = false;
+    return console.error(error);
+  }
+
+  mountsBusy.value = false;
+}
+
+onMounted(async () => {
+  const [error, result] = await volumesModel.list();
+  if (error) return console.error(error);
+
+  props.app.mounts.forEach(mount => { // { volumeId, readOnly }
+    const volume = result.find(v => { return v.id === mount.volumeId; });
+    mounts.value.push({ volumeId: volume.id, readOnly: mount.readOnly ? 'true' : 'false' });
+  });
+
+  volumes.value = [{
+    id: DEFAULT_VOLUME_ID,
+    label: 'Default - /home/yellowtent/appsdata/' + props.app.id,
+    mountType: '',
+  }].concat(result.map(v => {
+    return {
+      id: v.id,
+      label: 'Volume - ' + v.name,
+      mountType: v.mountType,
+    };
+  }));
+
+  volumeId.value = props.app.storageVolumeId || DEFAULT_VOLUME_ID;
+  volumePrefix.value = props.app.storageVolumePrefix || '';
+});
+
+</script>
+
+<template>
+  <div>
+    <FormGroup>
+      <label>{{ $t('app.storage.appdata.title') }} <sup><a href="https://docs.cloudron.io/apps/#data-directory" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+      <p v-if="diskUsage !== -1" v-html="$t('app.storage.appdata.diskUsage', { size: '<b>' + prettyBinarySize(diskUsage) + '</b>', date: prettyDate(diskUsageDate) })"></p>
+      <p v-html="$t('app.storage.appdata.description', { storagePath: ('/home/yellowtent/appsdata/' + app.id) })"></p>
+
+      <form @submit.prevent="onSubmitMove()" autocomplete="off">
+        <fieldset :disabled="moveBusy || app.error || app.taskId">
+          <input type="submit" style="display: none"/>
+
+          <SingleSelect v-model="volumeId" :options="volumes" option-key="id" option-label="label"/>
+          <p class="text-warning" v-if="volumeId !== DEFAULT_VOLUME_ID && selectedMountType === 'mountpoint'" v-html="$t('app.storage.appdata.mountTypeWarning')"></p>
+
+          <FormGroup v-if="volumeId !== DEFAULT_VOLUME_ID">
+            <label for="volumePrefixInput">Subdirectory</label>
+            <TextInput id="volumePrefixInput" placeholder="Prefix within the Volume" v-model="volumePrefix" />
+            <div v-if="moveError">{{ moveError }}</div>
+          </FormGroup>
+        </fieldset>
+      </form>
+    </FormGroup>
+
+    <br/>
+    <Button @click="onSubmitMove()" :loading="moveBusy" :disabled="moveBusy || app.error || app.taskId" v-tooltip="app.error ? 'App is in error state' : (app.taskId ? 'App is busy' : '')">{{ $t('app.storage.appdata.moveAction') }}</Button>
+
+    <hr>
+
+    <FormGroup>
+      <label>{{ $t('app.storage.mounts.title') }} <sup><a href="https://docs.cloudron.io/apps/#mounts" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
+      <div class="has-error" v-if="mountsError">{{ mountsError }}</div>
+      <p v-html="$t('storage.mounts.description')"></p>
+
+      <table class="table table-hover" style="margin-top: 10px;" v-if="mounts.length">
+        <thead>
+          <tr>
+            <th style="width: 40%">{{ $t('app.storage.mounts.volume') }}</th>
+            <th class="text-left hidden-xs hidden-sm">{{ $t('app.storage.mounts.permissions.label') }}</th>
+            <th style="width: 100px" class="text-right">{{ $t('main.actions') }}</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(mount, index) in mounts" :key="mount">
+            <td>
+              <SingleSelect v-model="mount.volumeId" :options="volumes" option-key="id" option-label="label"/>
+            </td>
+            <td class="text-left" style="vertical-align: middle;">
+              <select v-model="mount.readOnly">
+                <option value="true">{{ $t('app.storage.mounts.permissions.readOnly') }}</option>
+                <option value="false">{{ $t('app.storage.mounts.permissions.readWrite') }}</option>
+              </select>
+            </td>
+            <td class="text-right no-wrap" style="vertical-align: middle">
+              <Button tool small secondary v-show="mount.volumeId" :href="`/filemanager.html#/home/volume/${mount.volumeId}`" target="_blank" v-tooltip="$t('volumes.openFileManagerActionTooltip')" icon="fa-solid fa-folder"/>
+              <Button tool small danger @click="onMountRemove(index)" icon="fa-solid fa-trash-alt" style="margin-left: 6px"/>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+
+      <div style="margin-top: 5px;">
+        <span v-if="mounts.length === 0">{{ $t('app.storage.mounts.noMounts') }}&nbsp;</span>
+        <span class="actionable" @click="onMountAdd()">{{ $t('app.storage.mounts.addMountAction') }}</span>
+      </div>
+    </FormGroup>
+
+    <br/>
+    <Button @click="onSubmitMounts()" :loading="mountsBusy" :disabled="mountsBusy || app.error || app.taskId" v-tooltip="app.error ? 'App is in error state' : (app.taskId ? 'App is busy' : '')">{{ $t('app.storage.mounts.saveAction') }}</Button>
+
+  </div>
+</template>
diff --git a/dashboard/src/views/AppConfigureView.vue b/dashboard/src/views/AppConfigureView.vue
index 1ccc52072..73fe36731 100644
--- a/dashboard/src/views/AppConfigureView.vue
+++ b/dashboard/src/views/AppConfigureView.vue
@@ -17,6 +17,7 @@ import Location from '../components/app/Location.vue';
 import Resources from '../components/app/Resources.vue';
 import Repair from '../components/app/Repair.vue';
 import Security from '../components/app/Security.vue';
+import Storage from '../components/app/Storage.vue';
 import Uninstall from '../components/app/Uninstall.vue';
 import Updates from '../components/app/Updates.vue';
 import AppsModel from '../models/AppsModel.js';
@@ -216,7 +217,7 @@ onBeforeUnmount(() => {
           <Access :app="app" v-if="view === 'access'"/>
           <Resources :app="app" v-if="view === 'resources'"/>
           <div v-if="view === 'services'"></div>
-          <div v-if="view === 'storage'"></div>
+          <Storage :app="app" v-if="view === 'storage'"/>
           <div v-if="view === 'graphs'"></div>
           <Security :app="app" v-if="view === 'security'"/>
           <Email :app="app" v-if="view === 'email'"/>