fixes

Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>

components/collections/Collection.vue

@@ -57,12 +57,23 @@
           </button>
         </div>
         <v-popover v-if="!saveRequest">
-          <button class="tooltip-target icon" v-tooltip.left="$t('more')">
+          <button
+            v-if="
+              collectionsType.type == 'team-collections' &&
+              collectionsType.selectedTeam.myRole !== 'VIEWER'
+            "
+            class="tooltip-target icon"
+            v-tooltip.left="$t('more')"
+          >
             <i class="material-icons">more_vert</i>
           </button>
           <template slot="popover">
             <div>
               <button
+                v-if="
+                  collectionsType.type == 'team-collections' &&
+                  collectionsType.selectedTeam.myRole !== 'VIEWER'
+                "
                 class="icon"
                 @click="$emit('add-folder', { folder: collection, path: `${collectionIndex}` })"
                 v-close-popover
@@ -75,7 +86,7 @@
               <button
                 v-if="
                   collectionsType.type == 'team-collections' &&
-                  collectionsType.selectedTeam.myRole == 'VIEWER'
+                  collectionsType.selectedTeam.myRole !== 'VIEWER'
                 "
                 class="icon"
                 @click="$emit('edit-collection')"
@@ -96,7 +107,7 @@
               <button
                 v-if="
                   collectionsType.type == 'team-collections' &&
-                  collectionsType.selectedTeam.myRole == 'VIEWER'
+                  collectionsType.selectedTeam.myRole !== 'VIEWER'
                 "
                 class="icon"
                 @click="confirmRemove = true"
@@ -382,7 +393,10 @@ export default {
             return this.$props.collectionsType.selectedTeam === undefined
           },
           updateQuery(previousResult, { subscriptionData }) {
-            if (subscriptionData.data.teamCollectionAdded.parent.id === this.$props.collection.id) {
+            if (
+              subscriptionData.data.teamCollectionAdded.parent &&
+              subscriptionData.data.teamCollectionAdded.parent.id === this.$props.collection.id
+            ) {
               previousResult.collection.children.push({
                 id: subscriptionData.data.teamCollectionAdded.id,
                 title: subscriptionData.data.teamCollectionAdded.title,
@@ -413,6 +427,7 @@ export default {
           },
           updateQuery(previousResult, { subscriptionData }) {
             if (
+              subscriptionData.data.teamCollectionUpdated.parent &&
               subscriptionData.data.teamCollectionUpdated.parent.id === this.$props.collection.id
             ) {
               const index = previousResult.collection.children.findIndex(

components/collections/Folder.vue

@@ -48,6 +48,10 @@
         <template slot="popover">
           <div>
             <button
+              v-if="
+                collectionsType.type == 'team-collections' &&
+                collectionsType.selectedTeam.myRole !== 'VIEWER'
+              "
               class="icon"
               @click="$emit('add-folder', { folder, path: folderPath })"
               v-close-popover
@@ -58,6 +62,10 @@
           </div>
           <div>
             <button
+              v-if="
+                collectionsType.type == 'team-collections' &&
+                collectionsType.selectedTeam.myRole !== 'VIEWER'
+              "
               class="icon"
               @click="$emit('edit-folder', { folder, folderIndex, collectionIndex })"
               v-close-popover

components/collections/index.vue

@@ -197,6 +197,88 @@ export default {
       `,
       pollInterval: 10000,
     },
+
+    $subscribe: {
+      teamsCollectionAdded: {
+        query: gql`
+          subscription teamCollectionAdded($teamID: String!) {
+            teamCollectionAdded(teamID: $teamID) {
+              id
+              title
+              parent {
+                id
+                title
+              }
+            }
+          }
+        `,
+        variables() {
+          return {
+            teamID: this.collectionsType.selectedTeam.id,
+          }
+        },
+        skip() {
+          return this.collectionsType.selectedTeam == undefined
+        },
+        result({ data }) {
+          this.teamCollections[this.collectionsType.selectedTeam.id].push({
+            id: data.teamCollectionAdded.id,
+            title: data.teamCollectionAdded.title,
+            __typename: data.teamCollectionAdded.__typename,
+          })
+        },
+      },
+      teamsCollectionUpdated: {
+        query: gql`
+          subscription teamCollectionUpdated($teamID: String!) {
+            teamCollectionUpdated(teamID: $teamID) {
+              id
+              title
+              parent {
+                id
+                title
+              }
+            }
+          }
+        `,
+        variables() {
+          return {
+            teamID: this.collectionsType.selectedTeam.id,
+          }
+        },
+        skip() {
+          return this.collectionsType.selectedTeam == undefined
+        },
+        result({ data }) {
+          const current = this.teamCollections[this.collectionsType.selectedTeam.id]
+          const index = current.findIndex((x) => x.id === data.teamCollectionUpdated.id)
+          if (index >= 0) {
+            current[index].title = data.teamCollectionUpdated.title
+          }
+          this.teamCollections[this.collectionsType.selectedTeam.id] = current
+        },
+      },
+      teamsCollectionRemoved: {
+        query: gql`
+          subscription teamCollectionRemoved($teamID: String!) {
+            teamCollectionRemoved(teamID: $teamID)
+          }
+        `,
+        variables() {
+          return {
+            teamID: this.collectionsType.selectedTeam.id,
+          }
+        },
+        skip() {
+          return this.collectionsType.selectedTeam == undefined
+        },
+        result({ data }) {
+          this.teamCollections[this.collectionsType.selectedTeam.id] = this.teamCollections[
+            this.collectionsType.selectedTeam.id
+          ].filter((x) => x.id !== data.teamCollectionRemoved)
+        },
+      },
+    },
   },
   watch: {
     "collectionsType.type": function emitstuff() {