feat(DownView): ✨ New view! Show all paths going down the child tree.…

… Update on active-leaf-change, press `freeze` to freeze the current view

src/Components/Down.svelte

@@ -0,0 +1,105 @@
+<script lang="ts">
+  import {
+    hoverPreview,
+    isInVault,
+    openOrSwitch,
+  } from "obsidian-community-lib";
+  import FaFire from "svelte-icons/fa/FaFire.svelte";
+  import FaRegSnowflake from "svelte-icons/fa/FaRegSnowflake.svelte";
+  import type DownView from "../DownView";
+  import {
+    dfsAllPaths,
+    getReflexiveClosure,
+    getSubInDirs,
+  } from "../graphUtils";
+  import type BCPlugin from "../main";
+
+  export let plugin: BCPlugin;
+  export let view: DownView;
+
+  const { settings } = plugin;
+  const { userHiers } = settings;
+
+  let frozen = false;
+  let { basename } = plugin.app.workspace.getActiveFile();
+
+  plugin.app.workspace.on("active-leaf-change", () => {
+    if (frozen) return;
+    basename = plugin.app.workspace.getActiveFile().basename;
+  });
+
+  let lines: [string, string][];
+  $: {
+    const { mainG } = plugin;
+    const upnDown = getSubInDirs(mainG, "up", "down");
+    const closed = getReflexiveClosure(upnDown, userHiers);
+    const down = getSubInDirs(closed, "down");
+
+    const allPaths = dfsAllPaths(down, basename);
+    const index = plugin.createIndex(allPaths);
+    console.log({ allPaths, index, down: down.inspect() });
+
+    lines = index.split("\n").map((line) => line.split("- ")) as [
+      string,
+      string
+    ][];
+  }
+</script>
+
+<div>
+  <span
+    class="icon nav-action-button"
+    aria-label={frozen ? `Frozen on: ${basename}` : "Unfrozen"}
+    aria-label-position="left"
+    on:click={() => {
+      frozen = !frozen;
+      if (!frozen) basename = plugin.app.workspace.getActiveFile().basename;
+    }}
+  >
+    {#if frozen}
+      <FaRegSnowflake />
+    {:else}
+      <FaFire />
+    {/if}
+  </span>
+  <button
+    class="icon"
+    aria-label="Refresh Stats View (also refreshes Breadcrumbs Index)"
+    on:click={async () => {
+      await plugin.refreshIndex();
+      await view.draw();
+    }}
+  >
+    ↻
+  </button>
+</div>
+
+{#each lines as line}
+  {#if line.length > 1}
+    <div>
+      <pre>{line[0] + "- "}</pre>
+      <span
+        class="internal-link"
+        on:click={async (e) => await openOrSwitch(plugin.app, line[1], e)}
+        on:mouseover={(e) => hoverPreview(e, view, line[1])}
+      >
+        <!-- svelte-ignore a11y-missing-attribute -->
+        <a
+          class="internal-link {isInVault(plugin.app, line[1])
+            ? ''
+            : 'is-unresolved'}">{line[1]}</a
+        >
+      </span>
+    </div>
+  {/if}
+{/each}
+
+<style>
+  pre {
+    display: inline;
+  }
+
+  .is-unresolved {
+    color: var(--text-muted);
+  }
+</style>

src/DownView.ts

@@ -0,0 +1,49 @@
+import { ItemView, WorkspaceLeaf } from "obsidian";
+import { DOWN_VIEW } from "./constants";
+import type BCPlugin from "./main";
+import Down from "./Components/Down.svelte";
+import { addFeatherIcon } from "obsidian-community-lib";
+
+export default class DownView extends ItemView {
+  private plugin: BCPlugin;
+  private view: Down;
+
+  constructor(leaf: WorkspaceLeaf, plugin: BCPlugin) {
+    super(leaf);
+    this.plugin = plugin;
+  }
+
+  async onload(): Promise<void> {
+    super.onload();
+    this.app.workspace.onLayoutReady(async () => {
+      await this.draw();
+    });
+  }
+
+  getViewType() {
+    return DOWN_VIEW;
+  }
+  getDisplayText() {
+    return "Breadcrumbs Down";
+  }
+
+  icon = addFeatherIcon("corner-right-down") as string;
+
+  async onOpen(): Promise<void> {}
+
+  onClose(): Promise<void> {
+    if (this.view) {
+      this.view.$destroy();
+    }
+    return Promise.resolve();
+  }
+
+  async draw(): Promise<void> {
+    this.contentEl.empty();
+
+    this.view = new Down({
+      target: this.contentEl,
+      props: { plugin: this.plugin, view: this },
+    });
+  }
+}

src/constants.ts

@@ -1,3 +1,4 @@
+import DownView from "./DownView";
 import DucksView from "./DucksView";
 import type {
   BCSettings,
@@ -13,6 +14,7 @@ import StatsView from "./StatsView";
 export const MATRIX_VIEW = "BC-matrix";
 export const STATS_VIEW = "BC-stats";
 export const DUCK_VIEW = "BC-ducks";
+export const DOWN_VIEW = "BC-down";
 
 export const VIEWS: ViewInfo[] = [
   {
@@ -28,6 +30,7 @@ export const VIEWS: ViewInfo[] = [
     openOnLoad: true,
   },
   { plain: "Duck", type: DUCK_VIEW, constructor: DucksView, openOnLoad: false },
+  { plain: "Down", type: DOWN_VIEW, constructor: DownView, openOnLoad: true },
 ];
 
 export const TRAIL_ICON = "BC-trail-icon";

src/interfaces.ts

@@ -1,6 +1,7 @@
 import type { MultiGraph } from "graphology";
 import type { LogLevel } from "loglevel";
 import type { Constructor, FrontMatterCache, Pos, TFile } from "obsidian";
+import type DownView from "./DownView";
 import type { DIRECTIONS } from "./constants";
 import type DucksView from "./DucksView";
 import type MatrixView from "./MatrixView";
@@ -79,7 +80,7 @@ export type UserHier = {
   [dir in Directions]: string[];
 };
 
-export type MyView = MatrixView | DucksView | StatsView;
+export type MyView = MatrixView | DucksView | StatsView | DownView;
 export type ViewInfo = {
   plain: string;
   type: string;