Start using the new filemanager

filemanager/src/views/Home.vue

@@ -36,7 +36,6 @@
           <Menu ref="createMenu" id="create_menu" :model="createMenuModel" :popup="true" />
           <Button type="button" label="Upload" icon="pi pi-upload" @click="onUploadMenu" aria-haspopup="true" aria-controls="upload_menu" style="margin-right: 10px" />
           <Menu ref="uploadMenu" id="upload_menu" :model="uploadMenuModel" :popup="true" />
-          <Dropdown v-model="activeResource" filter :options="resourcesDropdownModel" optionLabel="label" optionGroupLabel="label" optionGroupChildren="items" dataKey="id" @change="onAppChange" placeholder="Select an App or Volume" style="margin-right: 10px" />
         </template>
       </TopBar>
     </template>
@@ -87,7 +86,6 @@ import superagent from 'superagent';
 
 import Button from 'primevue/button';
 import Dialog from 'primevue/dialog';
-import Dropdown from 'primevue/dropdown';
 import InputText from 'primevue/inputtext';
 import Menu from 'primevue/menu';
 
@@ -109,7 +107,6 @@ export default {
     Button,
     Dialog,
     DirectoryView,
-    Dropdown,
     FileUploader,
     InputText,
     MainLayout,
@@ -131,11 +128,6 @@ export default {
       },
       accessToken: localStorage.token,
       apiOrigin: API_ORIGIN || '',
-      apps: [],
-      volumes: [],
-      resources: [],
-      resourcesDropdownModel: [],
-      selectedAppId: '',
       activeResource: null,
       visible: true,
       newFileDialog: {
@@ -360,78 +352,34 @@ export default {
   async mounted() {
     useConfirm();
 
-    // load all apps
-    let error, result;
-    try {
-      result = await superagent.get(`${this.apiOrigin}/api/v1/apps`).query({ access_token: this.accessToken });
-    } catch (e) {
-      error = e;
-    }
-
-    if (error || result.statusCode !== 200) {
-      console.error('Failed to list apps', error || result.statusCode);
-      this.apps = [];
-    } else {
-      this.apps = result.body ? result.body.apps.filter(a => !!a.manifest.addons.localstorage) : [];
-    }
-    this.apps.forEach(function (a) { a.type = 'app'; a.label = a.fqdn; });
-
-    // load all volumes
-    try {
-      result = await superagent.get(`${this.apiOrigin}/api/v1/volumes`).query({ access_token: this.accessToken });
-    } catch (e) {
-      error = e;
-    }
-
-    if (error || result.statusCode !== 200) {
-      console.error('Failed to list volumes', error || result.statusCode);
-      this.volumes = [];
-    } else {
-      this.volumes = result.body ? result.body.volumes : [];
-    }
-    this.volumes.forEach(function (a) { a.type = 'volume'; a.label = a.name; });
-
-    this.resources = this.apps.concat(this.volumes);
-
-    this.resourcesDropdownModel = [{
-      label: 'Apps',
-      items: this.apps
-    }, {
-      label: 'Volumes',
-      items: this.volumes
-    }];
-
     const type = this.$route.params.type || 'app';
     const resourceId = this.$route.params.resourceId;
 
-    if (type === 'volume') {
-      this.activeResource = this.volumes.find(a => a.id === resourceId);
-      if (!this.activeResource) this.activeResource = this.volumes[0];
-      if (!this.activeResource) return console.error('Unable to find volumes', resourceId);
-    } else if (type === 'app') {
-      this.activeResource = this.apps.find(a => a.id === resourceId);
-      if (!this.activeResource) this.activeResource = this.apps[0];
-      if (!this.activeResource) return console.error('Unable to find app', resourceId);
-    } else {
-      this.activeResource = this.apps[0];
-    }
-
-    if (!this.activeResource) {
-      console.error('Not able to load apps or volumes. Cannot continue');
-      return;
-    }
+    // load via api to test
+    const resource = {
+      fqdn: 'FIXME',
+      type,
+      id: resourceId
+    };
 
     this.cwd = sanitize('/' + (this.$route.params.cwd ? this.$route.params.cwd.join('/') : '/'));
 
-    this.loadResource(this.activeResource);
+    this.loadResource(resource);
 
     this.$watch(() => this.$route.params, (toParams, previousParams) => {
-      if (toParams.type === 'volume') {
-        this.activeResource = this.volumes.find(a => a.id === toParams.resourceId);
-      } else if (toParams.type === 'app') {
-        this.activeResource = this.apps.find(a => a.id === toParams.resourceId);
-      } else {
+      if (toParams.type !== 'app' && toParams.type !== 'volume') {
         console.error(`Unknown type ${toParams.type}`);
+        return;
+      }
+
+      if ((toParams.type !== this.activeResource.type) || (toParams.resourceId !== this.activeResource.id)) {
+        const resource = {
+          fqdn: 'FIXME',
+          type: toParams.type,
+          id: toParams.resourceId
+        };
+
+        this.loadResource(resource);
       }
 
       this.cwd = toParams.cwd ? `/${toParams.cwd.join('/')}` : '/';