From c6dec8769fbf21715d14bab303871d85585be545 Mon Sep 17 00:00:00 2001
From: Julien Calixte <julienc@bam.tech>
Date: Sun, 6 Jun 2021 10:47:36 +0200
Subject: [PATCH] display links to the stacked note

---
 src/bus/backlinkEventBus.ts           |  7 ++++++
 src/bus/noteEventBus.ts               |  2 +-
 src/components/LinkedNotes.vue        | 20 ++++++++++++++-
 src/hooks/useBacklinks.hook.ts        | 36 +++++++++++++++++++++++++++
 src/hooks/useComputeBacklinks.hook.ts | 11 ++------
 src/utils/noteTitle.ts                |  2 +-
 6 files changed, 66 insertions(+), 12 deletions(-)
 create mode 100644 src/bus/backlinkEventBus.ts
 create mode 100644 src/hooks/useBacklinks.hook.ts

diff --git a/src/bus/backlinkEventBus.ts b/src/bus/backlinkEventBus.ts
new file mode 100644
index 0000000..94b1133
--- /dev/null
+++ b/src/bus/backlinkEventBus.ts
@@ -0,0 +1,7 @@
+import { createEventBus } from 'retrobus'
+
+interface EventBusParams {
+  fileSha: string
+}
+
+export const backlinkEventBus = createEventBus<EventBusParams>()
diff --git a/src/bus/noteEventBus.ts b/src/bus/noteEventBus.ts
index 29a28b9..0cd507a 100644
--- a/src/bus/noteEventBus.ts
+++ b/src/bus/noteEventBus.ts
@@ -7,4 +7,4 @@ interface EventBusParams {
   currentNoteSHA?: string
 }
 
-export const noteEventBus = createEventBus<EventBusParams>('note')
+export const noteEventBus = createEventBus<EventBusParams>()
diff --git a/src/components/LinkedNotes.vue b/src/components/LinkedNotes.vue
index 7f9113c..1be0189 100644
--- a/src/components/LinkedNotes.vue
+++ b/src/components/LinkedNotes.vue
@@ -1,19 +1,37 @@
 <template>
-  <div class="linked-notes"></div>
+  <div v-if="(backlink?.links.length ?? 0) > 0" class="linked-notes">
+    <hr />
+    <h4 class="subtitle is-4">🔗 Links to this note</h4>
+    <ul>
+      <li v-for="link in backlink?.links" :key="link.sha">
+        {{ link.title }}
+      </li>
+    </ul>
+  </div>
 </template>
 
 <script lang="ts">
+import { useBacklinks } from '@/hooks/useBacklinks.hook'
 import { defineComponent } from 'vue'
 
 export default defineComponent({
   name: 'LinkedNotes',
   props: {
     sha: { type: String, required: true }
+  },
+  setup(props) {
+    const { backlink } = useBacklinks(props.sha)
+    return {
+      backlink: backlink.state
+    }
   }
 })
 </script>
 
 <style scoped lang="scss">
 .linked-notes {
+  .subtitle {
+    font-style: italic;
+  }
 }
 </style>
diff --git a/src/hooks/useBacklinks.hook.ts b/src/hooks/useBacklinks.hook.ts
new file mode 100644
index 0000000..e47ce34
--- /dev/null
+++ b/src/hooks/useBacklinks.hook.ts
@@ -0,0 +1,36 @@
+import { backlinkEventBus } from '@/bus/backlinkEventBus'
+import { data } from '@/data/data'
+import { DataType } from '@/data/DataType.enum'
+import { BacklinkNote } from '@/modules/note/models/BacklinkNote'
+import { useAsyncState } from '@vueuse/core'
+import { onUnmounted } from 'vue'
+
+export const useBacklinks = (sha: string) => {
+  const backlink = useAsyncState(
+    data.get<DataType.BacklinkNote, BacklinkNote>(
+      data.generateId(DataType.BacklinkNote, sha)
+    ),
+    null,
+    {
+      resetOnExecute: true
+    }
+  )
+
+  const unsubscribe = backlinkEventBus.addEventBusListener(
+    ({ fileSha }) => {
+      if (fileSha !== sha) {
+        return
+      }
+      backlink.execute()
+    },
+    {
+      retro: true
+    }
+  )
+
+  onUnmounted(() => unsubscribe())
+
+  return {
+    backlink
+  }
+}
diff --git a/src/hooks/useComputeBacklinks.hook.ts b/src/hooks/useComputeBacklinks.hook.ts
index 78c62b5..af8c530 100644
--- a/src/hooks/useComputeBacklinks.hook.ts
+++ b/src/hooks/useComputeBacklinks.hook.ts
@@ -1,3 +1,4 @@
+import { backlinkEventBus } from '@/bus/backlinkEventBus'
 import { data } from '@/data/data'
 import { DataType } from '@/data/DataType.enum'
 import { useFile } from '@/hooks/useFile.hook'
@@ -80,15 +81,7 @@ export const useComputeBacklinks = () => {
       }
 
       await data.add(backlinkNote)
+      backlinkEventBus.emit({ fileSha: sha })
     }
-
-    const backlinksInDb = await data.getAll<
-      DataType.BacklinkNote,
-      BacklinkNote
-    >({
-      prefix: DataType.BacklinkNote
-    })
-
-    console.log(backlinksInDb.filter((b) => b.links.length))
   })
 }
diff --git a/src/utils/noteTitle.ts b/src/utils/noteTitle.ts
index d3a6865..e27b9c3 100644
--- a/src/utils/noteTitle.ts
+++ b/src/utils/noteTitle.ts
@@ -1,2 +1,2 @@
 export const filenameToNoteTitle = (title: string) =>
-  title.replaceAll('/', ' / ')
+  title.replaceAll('/', ' / ').replaceAll('-', ' ')