import/restore: automatically detect prefix from the full path

dashboard/src/components/AppImportDialog.vue

@@ -2,7 +2,7 @@
 
 import { ref, useTemplateRef } from 'vue';
 import { Dialog, FormGroup, TextInput, PasswordInput, Checkbox } from '@cloudron/pankow';
-import { s3like, mountlike } from  '../utils.js';
+import { s3like, mountlike, parseFullBackupPath } from  '../utils.js';
 import BackupProviderForm from './BackupProviderForm.vue';
 import AppsModel from '../models/AppsModel.js';
 import { REGIONS_CONTABO, REGIONS_VULTR, REGIONS_IONOS, REGIONS_OVH, REGIONS_LINODE, REGIONS_SCALEWAY, REGIONS_WASABI } from '../constants.js';
@@ -17,7 +17,7 @@ const busy = ref(false);
 const formError = ref({});
 const providerConfig = ref({});
 const provider = ref('');
-const remotePath = ref('');
+const fullPath = ref('');
 const format = ref('');
 const encrypted = ref(false);
 const encryptionPasswordHint = ref('');
@@ -30,15 +30,17 @@ async function onSubmit() {
   formError.value = {};
   busy.value = true;
 
-  let backupPath = remotePath.value;
   const config = {};
 
+  const { prefix, remotePath } = parseFullBackupPath(fullPath.value);
+
   // only set provider specific fields, this will clear them in the db
   if (s3like(provider.value)) {
     config.bucket = providerConfig.value.bucket;
     config.prefix = providerConfig.value.prefix;
     config.accessKeyId = providerConfig.value.accessKeyId;
     config.secretAccessKey = providerConfig.value.secretAccessKey;
+    config.prefix = prefix;
 
     if (providerConfig.value.endpoint) config.endpoint = providerConfig.value.endpoint;
 
@@ -85,7 +87,7 @@ async function onSubmit() {
       config.signatureVersion = 'v4';
     }
   } else if (mountlike(provider.value)) {
-    config.prefix = providerConfig.value.prefix;
+    config.prefix = prefix;
     config.noHardlinks = !providerConfig.value.useHardlinks;
     config.mountOptions = {};
 
@@ -113,21 +115,19 @@ async function onSubmit() {
       config.preserveAttributes = !!providerConfig.value.preserveAttributes;
     }
   } else if (provider.value === 'filesystem') {
-    const parts = remotePath.value.split('/');
-    backupPath = parts.pop() || parts.pop(); // removes any trailing slash. this is basename()
-    config.backupDir = parts.join('/'); // this is dirname()
+    config.backupDir = prefix;
   } else if (provider.value === 'gcs') {
     config.bucket = providerConfig.value.bucket;
-    config.prefix = providerConfig.value.prefix;
     config.projectId = providerConfig.value.projectId;
     config.credentials = providerConfig.value.credentials;
+    config.prefix = prefix;
   }
 
   const data = {
     format: format.value,
     provider: provider.value,
-    config: config,
-    remotePath: backupPath
+    config,
+    remotePath
   };
 
   if (encrypted.value) {
@@ -197,7 +197,7 @@ function onBackupConfigChanged(event) {
     }
 
     provider.value = data.provider;
-    remotePath.value = data.config.prefix ? `${data.config.prefix}/${data.remotePath}` : data.remotePath;
+    fullPath.value = data.config.prefix ? `${data.config.prefix}/${data.remotePath}` : data.remotePath;
     providerConfig.value = data.config;
     format.value = data.format;
     encrypted.value = !!data.encrypted;
@@ -220,7 +220,7 @@ defineExpose({
     formError.value = {};
     provider.value = '';
     providerConfig.value = {};
-    remotePath.value = '';
+    fullPath.value = '';
     encrypted.value = false;
     encryptionPassword.value = '';
     encryptedFilenames.value = false;
@@ -265,7 +265,7 @@ defineExpose({
             <!-- remotePath contains the prefix as well -->
             <FormGroup>
               <label for="inputRemotePath">{{ $t('app.importBackupDialog.remotePath') }} <sup><a href="https://docs.cloudron.io/backups/#import-app-backup" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
-              <TextInput id="inputRemotePath" v-model="remotePath" required />
+              <TextInput id="inputRemotePath" v-model="fullPath" required />
             </FormGroup>
 
             <BackupProviderForm ref="form"