import: make the ui work again

dashboard/src/components/AppImportDialog.vue

@@ -6,6 +6,7 @@ import { s3like } 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';
+import { SECRET_PLACEHOLDER } from '../constants.js';
 
 const appsModel = AppsModel.create();
 
@@ -18,6 +19,9 @@ const formError = ref({});
 const providerConfig = ref({});
 const provider = ref('');
 const remotePath = ref('');
+const format = ref('');
+const encryptionPassword = ref('');
+const encryptedFilenames = ref(false);
 
 async function onSubmit() {
   if (!form.value.reportValidity()) return;
@@ -163,25 +167,23 @@ function onBackupConfigChanged(event) {
   reader.onload = function (result) {
     if (!result.target || !result.target.result) return console.error('Unable to read backup config');
 
-    let config;
+    let data;
     try {
-      config = JSON.parse(result.target.result);
-      if (config.provider === 'filesystem') { // this allows a user to upload a backup to server and import easily with an absolute path
-        config.remotePath = config.backupFolder + '/' + config.remotePath;
-        delete config.backupFolder;
+      data = JSON.parse(result.target.result); // 'provider', 'config', 'limits', 'format', 'remotePath', 'encrypted', 'encryptedFilenames'
+      if (data.provider === 'filesystem') { // this allows a user to upload a backup to server and import easily with an absolute path
+        data.remotePath = `${data.config.backupFolder}/${data.remotePath}`;
       }
     } catch (e) {
       console.error('Unable to parse backup config', e);
       return;
     }
 
-    provider.value = config.provider;
-    remotePath.value = config.remotePath;
-
-    // we assume property names match here, this does not yet work for gcs keys
-    Object.keys(config).forEach(function (k) {
-      providerConfig.value[k] = config[k];
-    });
+    provider.value = data.provider;
+    remotePath.value = data.remotePath;
+    providerConfig.value = data.config;
+    format.value = data.format;
+    encryptionPassword.value = data.encrypted ? SECRET_PLACEHOLDER : '';
+    encryptedFilenames.value = data.encryptedFilenames;
   };
 
   reader.readAsText(event.target.files[0]);
@@ -233,7 +235,14 @@ defineExpose({
               <TextInput id="inputRemotePath" v-model="remotePath" required />
             </FormGroup>
 
-            <BackupProviderForm ref="form" v-model:provider="provider" v-model:provider-config="providerConfig" :form-error="formError" :import-only="true" />
+            <BackupProviderForm ref="form"
+              v-model:provider="provider"
+              v-model:provider-config="providerConfig"
+              v-model:format="format"
+              v-model:encryptionPassword="encryptionPassword"
+              v-model:encryptedFilenames="encryptedFilenames"
+              :form-error="formError"
+              :import-only="true" />
           </fieldset>
         </form>
       </div>