fix: prevent stacking a duplicate of the main note when clicking a self-link

src/components/StackedPublicNote.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { computed, nextTick, ref, watch } from "vue"
+import { useRoute } from "vue-router"
 import { errorMessage } from "@/utils/notif"
 import { useATProtoLinks } from "@/hooks/useATProtoLinks.hook"
 import { useNoteOverlay } from "@/hooks/useNoteOverlay.hook"
@@ -33,8 +34,16 @@ const url = computedAsync(async () =>
 const className = computed(() => `stacked-note-${props.index}`)
 const titleClassName = computed(() => `title-${className.value}`)
 
+const route = useRoute()
+const mainNoteId = computed(
+  () => `${route.params.shortDid}-${route.params.rkey}`,
+)
+
 const { scrollToFocusedNote } = useRouteQueryStackedNotes()
-const { listenToClick } = useATProtoLinks(className.value, didrkey)
+const { listenToClick } = useATProtoLinks(className.value, {
+  currentAtUri: didrkey,
+  mainNoteId,
+})
 const { displayNoteOverlay } = useNoteOverlay(className.value, index)
 
 const noteNotFound = ref(false)

src/hooks/useATProtoLinks.hook.ts

@@ -8,9 +8,14 @@ import { router } from "@/router/router"
 
 export const useATProtoLinks = (
   className: ComputedRef<string> | string,
-  currentAtUri?: Ref<string> | string,
+  options: {
+    currentAtUri?: Ref<string> | string | ComputedRef<string>
+    mainNoteId: Ref<string> | string | ComputedRef<string>
+  },
 ) => {
-  const { addStackedNote } = useRouteQueryStackedNotes()
+  const { addStackedNote, scrollToFocusedNote } = useRouteQueryStackedNotes()
+  const { currentAtUri, mainNoteId } = options
+
   const linkNote = (event: Event) => {
     const target = event.target as HTMLElement
     const href = target.getAttribute("href")
@@ -44,6 +49,11 @@ export const useATProtoLinks = (
         ? `${params.shortDid}-${params.rkey}-${params.slug}`
         : `${params.shortDid}-${params.rkey}`
 
+      if (noteId === toValue(mainNoteId)) {
+        scrollToFocusedNote(null)
+        return
+      }
+
       addStackedNote(
         toValue(currentAtUri) ?? "",
         noteId,
@@ -56,6 +66,11 @@ export const useATProtoLinks = (
       const { did, rkey } = parseAtUri(href)
       const noteId = `${toShortDid(did)}-${rkey}`
 
+      if (noteId === toValue(mainNoteId)) {
+        scrollToFocusedNote(null)
+        return
+      }
+
       addStackedNote(toValue(currentAtUri) ?? "", noteId)
     }
   }

src/views/PublicNoteView.vue

@@ -108,8 +108,10 @@ const language = computed(() =>
     : null,
 )
 
+const mainNoteId = computed(() => `${props.shortDid}-${props.rkey}`)
+
 const { stackedNotes, scrollToFocusedNote } = useRouteQueryStackedNotes()
-const { listenToClick } = useATProtoLinks("note-display")
+const { listenToClick } = useATProtoLinks("note-display", { mainNoteId })
 useResizeContainer("note-container", stackedNotes)
 
 watch(