Degree filter on large query

src/components/ConnectivityQuery.vue

@@ -563,12 +563,38 @@ export default defineComponent({
 
             // Update state with new network
             store.dispatch.aggregateNetwork(undefined);
-            store.dispatch.updateNetwork({ network: newNetwork });
             store.commit.setNetworkPreFilter(newNetwork);
             loading.value = false;
             store.commit.setDirectionalEdges(true);
             store.commit.setQueriedNetworkState(true);
             store.commit.setDegreeEntries(setNodeDegreeDict(store.state.networkPreFilter, store.state.networkOnLoad, store.state.queriedNetwork, store.state.directionalEdges));
+            if (promise.length >= 100) {
+              // Create dictionary of degree occurences
+              const orderedList = Object.values(store.state.nodeDegreeDict).sort((a, b) => a - b);
+              const degreeCount: {[key:number]:number} = {};
+              orderedList.forEach((olItem) => {
+                degreeCount[olItem] = (degreeCount[olItem] || 0) + 1;
+              });
+
+              // Set min value if the node degree occurrence < 100
+              // Using every to stop for loop once the conditional is met
+              if (
+                // If all degrees have 100 connections of more
+                Object.entries(degreeCount).every(([degree, occurrence]) => {
+                  if (occurrence < 100) {
+                    store.commit.setMinDegree(Number(degree));
+                    // This calls updateNetwork
+                    store.commit.setDegreeNetwork([Number(degree), store.state.maxDegree]);
+                    return false;
+                  } return true;
+                })
+              ) {
+                store.dispatch.updateNetwork({ network: newNetwork });
+              }
+            } else {
+              // Update state with new network
+              store.dispatch.updateNetwork({ network: newNetwork });
+            }
           } else {
             // Update state with empty network
             store.dispatch.aggregateNetwork(undefined);

src/components/ControlPanel.vue

@@ -88,10 +88,11 @@ export default defineComponent({
     });
     const maxConnections = computed(() => store.state.maxConnections);
     const maxDegree = computed(() => store.state.maxDegree);
-    const degreeRange = ref([0, maxDegree.value]);
+    const minDegree = computed(() => store.state.minDegree);
+    const degreeRange = ref([minDegree.value, maxDegree.value]);
 
-    watch([maxDegree], () => {
-      degreeRange.value = [0, maxDegree.value];
+    watch([maxDegree, minDegree], () => {
+      degreeRange.value = [minDegree.value, maxDegree.value];
     });
 
     // Intermediate node table template objects

src/components/MultiMatrix.vue

@@ -163,7 +163,11 @@ export default defineComponent({
         // Loop through other props to add to tooltip
         Object.keys(networkElement).forEach((key) => {
           if (!['_key', '_rev', 'id', 'neighbors'].includes(key)) {
-            message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement[key]}`;
+            if (key === 'children' && networkElement.children !== undefined) {
+              message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement.children.length}`;
+            } else {
+              message += `<br/> ${capitalizeFirstLetter(key)}: ${networkElement[key]}`;
+            }
           }
         });
       }

src/store/index.ts

@@ -78,6 +78,7 @@ const {
     selectedHops: 1,
     nodeDegreeDict: {},
     maxDegree: 0,
+    minDegree: 0,
     networkPreFilter: null,
     queriedNetwork: false,
     filteredNetwork: false,
@@ -389,6 +390,10 @@ const {
       state.nodeDegreeDict = degreeObject.nodeDegreeDict;
     },
 
+    setMinDegree(state, minDegree: number) {
+      state.minDegree = minDegree;
+    },
+
     setDegreeNetwork(state, degreeRange: number[]) {
       // Determine correct network to use
       let baseNetwork: Network = { nodes: [], edges: [] };

src/types.ts

@@ -129,6 +129,7 @@ export interface State {
   selectedHops: number;
   nodeDegreeDict: { [key: string]: number };
   maxDegree: number;
+  minDegree: number;
   networkPreFilter: Network | null;
   queriedNetwork: boolean;
   filteredNetwork: boolean;