Use Intersection component to fetch team list on visibility

components/collections/ChooseType.vue

@@ -6,6 +6,7 @@
         <ul>
           <li>
             <span class="select-wrapper">
+              <SmartIntersection @intersecting="onTeamSelectIntersect">
                 <select
                   type="text"
                   id="team"
@@ -20,6 +21,7 @@
                     {{ team.name }}
                   </option>
                 </select>
+              </SmartIntersection>
             </span>
           </li>
         </ul>
@@ -46,10 +48,14 @@ export default {
           }
         }
       `,
-      pollInterval: 5000,
+      pollInterval: 10000,
     },
   },
   methods: {
+    onTeamSelectIntersect() {
+      // Load team data as soon as intersection
+      this.$apollo.queries.myTeams.refetch()
+    },
     updateCollectionsType(tabID) {
       this.$emit("update-collection-type", tabID)
     },