diff --git a/vospace-ui-frontend/src/api/mock/data/collections.json b/vospace-ui-frontend/src/api/mock/data/collections.json
new file mode 100644
index 0000000000000000000000000000000000000000..e3932d306d9c155d506e94ebb29cd9d3108c71e9
--- /dev/null
+++ b/vospace-ui-frontend/src/api/mock/data/collections.json
@@ -0,0 +1,9 @@
+[{
+    "id": "1",
+    "title": "My collection 1"
+  },
+  {
+    "id": "2",
+    "title": "My collection 2"
+  }
+]
diff --git a/vospace-ui-frontend/src/api/mock/index.js b/vospace-ui-frontend/src/api/mock/index.js
index 8d4330f5759606367ab3a91f3d3a8c82675c1e57..ff6664fb85936be336e46e40aeb7d9583b7381ce 100644
--- a/vospace-ui-frontend/src/api/mock/index.js
+++ b/vospace-ui-frontend/src/api/mock/index.js
@@ -8,6 +8,7 @@ import folder1 from './data/nodes/folder1';
 import folder2 from './data/nodes/folder2';
 import job from './data/job';
 import jobs from './data/jobs';
+import collections from './data/collections';
 import user from './data/user';
 import sharing from './data/sharing';
 
@@ -49,6 +50,9 @@ export default {
   loadJobs() {
     return fetch(jobs, false);
   },
+  loadCollections() {
+    return fetch(collections, false);
+  },
   getUserInfo() {
     return fetch(user, false);
   },
diff --git a/vospace-ui-frontend/src/api/server/index.js b/vospace-ui-frontend/src/api/server/index.js
index 063b889ceda8bed2a13888585b0664e556600236..55369503559690cef1f94bc2e18242f028676988 100644
--- a/vospace-ui-frontend/src/api/server/index.js
+++ b/vospace-ui-frontend/src/api/server/index.js
@@ -79,7 +79,7 @@ export default {
       }
     }, false, true);
   },
-  loadNodeCollections() {
+  loadCollections() {
     let url = BASE_API_URL + 'collections';
     return apiRequest({
       method: 'GET',
diff --git a/vospace-ui-frontend/src/components/Collections.vue b/vospace-ui-frontend/src/components/Collections.vue
index 2c548d869d5f63d668f4ab59399e16c71cb313b4..c87aa600ffb643e9a78ad18842995167868f6c59 100644
--- a/vospace-ui-frontend/src/components/Collections.vue
+++ b/vospace-ui-frontend/src/components/Collections.vue
@@ -10,7 +10,7 @@
   <div class="mb-3">
       <b-button variant="success" class="mr-2" v-b-modal.create-collection-modal>New collection</b-button>
   </div>
-  <div v-if="jobs.length > 0" class="mb-3">
+  <div v-if="collections.length > 0" class="mb-3">
     <table class="table b-table table-striped table-hover">
       <thead>
         <tr>
@@ -19,20 +19,17 @@
         </tr>
       </thead>
       <tbody>
-        <tr v-for="job in jobs" :key="job.id">
-          <td>{{job.type}}</td>
-          <td>{{job.creationTime}}</td>
-          <td>{{job.id}}</td>
-          <td><a :href="'download?jobId=' + job.id" v-if="job.phase === 'COMPLETED' && job.type === 'ARCHIVE'">Download archive</a></td>
-          <td>{{job.phase}}</td>
+        <tr v-for="collection in collections" :key="collection.id">
+          <td>{{collection.id}}</td>
+          <td>{{collection.title}}</td>          
         </tr>
       </tbody>
     </table>
   </div>
-  <div v-if="jobs.length === 0">
-    No jobs
+  <div v-if="collections.length === 0">
+    No collections
   </div>
-  <div id="jobs-loading" v-if="jobsLoading" class="loading">
+  <div id="collections-loading" v-if="collectionsLoading" class="loading">
     <div class="spinner-wrapper">
       <b-spinner variant="primary" style="width: 3rem; height: 3rem;" label="Loading"></b-spinner>
     </div>
@@ -52,16 +49,16 @@ export default {
     CreateCollectionModal
   },
   computed: {
-    jobs() { return this.$store.state.jobs },
-    jobsLoading() { return this.$store.state.jobsLoading }
+    collections() { return this.$store.state.collections },
+    collectionsLoading() { return this.$store.state.collectionsLoading }
   },
   mounted() {
-    this.loadJobs();
+    this.loadCollections();
     this.$store.commit('setLoading', false);
   },
   methods: {
-    loadJobs() {
-      this.$store.dispatch('loadJobs');
+    loadCollections() {
+      this.$store.dispatch('loadCollections');
     }
   }
 }
diff --git a/vospace-ui-frontend/src/store.js b/vospace-ui-frontend/src/store.js
index ccdf1a331268bab4636c2514410d6ed018fb74e9..2a0c6bb8450b5ceab290037c689089d3fd267775 100644
--- a/vospace-ui-frontend/src/store.js
+++ b/vospace-ui-frontend/src/store.js
@@ -35,6 +35,8 @@ export default new Vuex.Store({
     jobs: [],
     jobsLoading: true,
     lastJobsCheckTime: null,
+    collections: [],
+    collectionsLoading: true,
     user: 'anonymous',
     nodesToDelete: [],
     selectedUndeletableNodes: [],
@@ -95,6 +97,15 @@ export default new Vuex.Store({
     setJobsLoading(state, loading) {
       state.jobsLoading = loading;
     },
+    setCollections(state, collections) {
+      updateArray(state.collections, collections);
+    },
+    addCollections(state, collection) {
+      state.collections.push(collection);
+    },
+    setCollectionsLoading(state, loading) {
+      state.collectionsLoading = loading;
+    },
     setUsername(state, username) {
       state.user = username;
     },
@@ -229,6 +240,14 @@ export default new Vuex.Store({
           state.lastJobsCheckTime = new Date().getTime();
         });
     },
+    loadCollections({ commit }) {
+      commit('setCollectionsLoading', true);
+      client.loadCollections()
+              .then(collections => {
+                  commit('setCollections', collections);                  
+      });
+      commit('setCollectionsLoading', false);
+    },
     loadUserInfo({ commit }) {
       client.getUserInfo()
         .then(res => commit('setUsername', res.username));