feat(Stats View): ✨ Progress on new stats view

src/Components/Stats.svelte

@@ -1,52 +1,142 @@
 <script lang="ts">
-  import { closeImpliedLinks, complement, copy } from "src/sharedFunctions";
+  import {
+    closeImpliedLinks,
+    complement,
+    copy,
+    hierToStr,
+  } from "src/sharedFunctions";
 
   import type BreadcrumbsPlugin from "src/main";
+  import { map, sum } from "lodash";
 
   export let plugin: BreadcrumbsPlugin;
 
   const { settings } = plugin;
+  const { userHierarchies } = settings;
   const separator = settings.trailSeperator;
 
   const graphs = plugin.currGraphs;
-  const allR = Object.values(graphs);
-
-  const allRNodes = allR.map((g) => g.nodes());
-
-  const allRNodesStr = allRNodes.map((rNodes) => rNodes.join("\n"));
-
-  const allREdges = allR.map((g) => g.edges());
-
-  const allREdgesStr = allREdges.map((edges) =>
-    edges.map((e) => `${e.v} → ${e.w}`).join("\n")
-  );
-
-  const [closedP, closedS, closedC] = [
-    closeImpliedLinks(gParents, gChildren),
-    closeImpliedLinks(gSiblings, gSiblings),
-    closeImpliedLinks(gChildren, gParents),
-  ];
-  const allG = [closedP, closedS, closedC];
-
-  const [pANodes, sANodes, cANodes] = allG.map((g) => g.nodes());
-  const [pAEdges, sAEdges, cAEdges] = allG.map((g) => g.edges());
-
-  const [pIEdgesStr, sIEdgesStr, cIEdgesStr] = [
-    complement(
-      pAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
-      pREdges.map((e) => `${e.v} ${separator} ${e.w}`)
-    ).join("\n"),
-    complement(
-      sAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
-      sREdges.map((e) => `${e.v} ${separator} ${e.w}`)
-    ).join("\n"),
-    complement(
-      cAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
-      cREdges.map((e) => `${e.v} ${separator} ${e.w}`)
-    ).join("\n"),
-  ];
+  const hierGs = plugin.currGraphs;
+
+  let hierStrs: string[] = userHierarchies.map(hierToStr);
+  console.log({ hierStrs });
+
+  const allUpGs = hierGs
+    .map((hier) => hier.up)
+    .map((fields) => Object.values(fields));
+
+  console.log({ allUpGs });
+
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+  //
+
+  //   const allR = Object.values(graphs);
+
+  //   const allRNodes = allR.map((g) => g.nodes());
+
+  //   const allRNodesStr = allRNodes.map((rNodes) => rNodes.join("\n"));
+
+  //   const allREdges = allR.map((g) => g.edges());
+
+  //   const allREdgesStr = allREdges.map((edges) =>
+  //     edges.map((e) => `${e.v} → ${e.w}`).join("\n")
+  //   );
+
+  //   const [closedP, closedS, closedC] = [
+  //     closeImpliedLinks(gParents, gChildren),
+  //     closeImpliedLinks(gSiblings, gSiblings),
+  //     closeImpliedLinks(gChildren, gParents),
+  //   ];
+  //   const allG = [closedP, closedS, closedC];
+
+  //   const [pANodes, sANodes, cANodes] = allG.map((g) => g.nodes());
+  //   const [pAEdges, sAEdges, cAEdges] = allG.map((g) => g.edges());
+
+  //   const [pIEdgesStr, sIEdgesStr, cIEdgesStr] = [
+  //     complement(
+  //       pAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
+  //       pREdges.map((e) => `${e.v} ${separator} ${e.w}`)
+  //     ).join("\n"),
+  //     complement(
+  //       sAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
+  //       sREdges.map((e) => `${e.v} ${separator} ${e.w}`)
+  //     ).join("\n"),
+  //     complement(
+  //       cAEdges.map((e) => `${e.v} ${separator} ${e.w}`),
+  //       cREdges.map((e) => `${e.v} ${separator} ${e.w}`)
+  //     ).join("\n"),
+  //   ];
 </script>
 
+<table>
+  <thead>
+    <tr>
+      <th scope="col">Hierarchy</th>
+      <th scope="col" colspan="5">Count</th>
+    </tr>
+  </thead>
+
+  <tr>
+    <td />
+    <td>Measure</td>
+    <td>Up</td>
+    <td>Same</td>
+    <td>Down</td>
+    <td>Total</td>
+  </tr>
+
+  {#each userHierarchies as hier, i}
+    <tr>
+      <td rowspan="2">
+        {hierStrs[i]}
+      </td>
+      <td>Nodes</td>
+      {#each ["up", "same", "down"] as dir}
+        <td>
+          {Math.max(
+            ...Object.values(hierGs[i][dir]).map((g) => g.nodes().length)
+          )}
+        </td>
+      {/each}
+    </tr>
+    <tr>
+      <td>Edges</td>
+      {#each ["up", "same", "down"] as dir}
+        <td>
+          {sum(Object.values(hierGs[i][dir]).map((g) => g.edges().length))}
+        </td>
+      {/each}
+    </tr>
+  {/each}
+</table>
+
+<!-- 
 <table>
   <thead>
     <tr>
@@ -99,8 +189,7 @@
     >
     <td>{pREdges.length + sREdges.length + cREdges.length}</td>
   </tr>
-</table>
-
+</table> -->
 <style>
   table {
   }
@@ -112,5 +201,10 @@
   th {
     padding: 3px;
     border: 1px solid var(--text-accent);
+    white-space: pre-line;
+  }
+
+  td.filler {
+    opacity: 0;
   }
 </style>