From 2df84c243e3cff4e89e53fb8255e463e18a36b6f Mon Sep 17 00:00:00 2001
From: Kristaps Fabians Geikins <fabians@speckle.systems>
Date: Tue, 20 Jun 2023 09:17:49 +0300
Subject: [PATCH] fix(fe-2): invalid comment placement when placed inside
 isolated obj (#1640)

* fix(fe-2): weird comment positioning

* feat: viewer dev helpers
---
 .../lib/viewer/composables/setup/comments.ts  |  1 -
 .../lib/viewer/composables/setup/dev.ts       | 33 +++++++++++++++++++
 .../lib/viewer/composables/setup/postSetup.ts | 22 ++-----------
 .../lib/viewer/composables/setup/selection.ts | 13 ++++----
 packages/frontend-2/plugins/dev.ts            |  6 ++++
 5 files changed, 47 insertions(+), 28 deletions(-)
 create mode 100644 packages/frontend-2/lib/viewer/composables/setup/dev.ts
 create mode 100644 packages/frontend-2/plugins/dev.ts

diff --git a/packages/frontend-2/lib/viewer/composables/setup/comments.ts b/packages/frontend-2/lib/viewer/composables/setup/comments.ts
index e5418be60..a7c9b8e71 100644
--- a/packages/frontend-2/lib/viewer/composables/setup/comments.ts
+++ b/packages/frontend-2/lib/viewer/composables/setup/comments.ts
@@ -24,7 +24,6 @@ export function setupViewerCommentBubbles(
     const ot = Object.values(commentThreads.value).find(
       (t) => t.id === focusedThreadId.value
     )
-    console.log('ot', ot, commentThreads.value, focusedThreadId.value)
     return ot
   })
 
diff --git a/packages/frontend-2/lib/viewer/composables/setup/dev.ts b/packages/frontend-2/lib/viewer/composables/setup/dev.ts
new file mode 100644
index 000000000..f91b59ad0
--- /dev/null
+++ b/packages/frontend-2/lib/viewer/composables/setup/dev.ts
@@ -0,0 +1,33 @@
+import { ViewerEvent } from '@speckle/viewer'
+import { useInjectedViewerState } from '~~/lib/viewer/composables/setup'
+import { useViewerEventListener } from '~~/lib/viewer/composables/viewer'
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+function useDebugViewerEvents() {
+  for (const [key, val] of Object.entries(ViewerEvent)) {
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+    useViewerEventListener(val, (...args) => console.log(key, ...args))
+  }
+}
+
+function useDebugViewer() {
+  const state = useInjectedViewerState()
+  const {
+    viewer: { instance }
+  } = state
+
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-expect-error
+  window.VIEWER = instance
+  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+  // @ts-expect-error
+  window.VIEWER_STATE = () => ({ ...state })
+}
+
+export function setupDebugMode() {
+  if (process.server) return
+  if (!process.dev) return
+
+  // useDebugViewerEvents()
+  useDebugViewer()
+}
diff --git a/packages/frontend-2/lib/viewer/composables/setup/postSetup.ts b/packages/frontend-2/lib/viewer/composables/setup/postSetup.ts
index e4b78f8da..cecb5075c 100644
--- a/packages/frontend-2/lib/viewer/composables/setup/postSetup.ts
+++ b/packages/frontend-2/lib/viewer/composables/setup/postSetup.ts
@@ -46,6 +46,7 @@ import { areVectorsLooselyEqual } from '~~/lib/viewer/helpers/three'
 import { Nullable } from '@speckle/shared'
 import { useCameraUtilities } from '~~/lib/viewer/composables/ui'
 import { watchTriggerable } from '@vueuse/core'
+import { setupDebugMode } from '~~/lib/viewer/composables/setup/dev'
 
 function useViewerIsBusyEventHandler() {
   const state = useInjectedViewerState()
@@ -696,23 +697,6 @@ function useDiffingIntegration() {
   })
 }
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-function useDebugViewerEvents() {
-  if (process.server) return
-  const {
-    viewer: { instance }
-  } = useInjectedViewerState()
-
-  for (const [key, val] of Object.entries(ViewerEvent)) {
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-    useViewerEventListener(val, (...args) => console.log(key, ...args))
-  }
-
-  // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-  // @ts-ignore
-  window.VIEWER = instance
-}
-
 export function useViewerPostSetup() {
   if (process.server) return
   useViewerObjectAutoLoading()
@@ -727,7 +711,5 @@ export function useViewerPostSetup() {
   useLightConfigIntegration()
   useExplodeFactorIntegration()
   useDiffingIntegration()
-
-  // test
-  // useDebugViewerEvents()
+  setupDebugMode()
 }
diff --git a/packages/frontend-2/lib/viewer/composables/setup/selection.ts b/packages/frontend-2/lib/viewer/composables/setup/selection.ts
index 7d3af1564..68cdacb38 100644
--- a/packages/frontend-2/lib/viewer/composables/setup/selection.ts
+++ b/packages/frontend-2/lib/viewer/composables/setup/selection.ts
@@ -1,6 +1,5 @@
 /* eslint-disable @typescript-eslint/no-unsafe-member-access */
-import { Nullable } from '@speckle/shared'
-import { SelectionEvent } from '@speckle/viewer'
+
 import { SpeckleObject } from '~~/lib/common/helpers/sceneExplorer'
 import { useMixpanel } from '~~/lib/core/composables/mp'
 import { useInjectedViewerState } from '~~/lib/viewer/composables/setup'
@@ -12,11 +11,11 @@ function useCollectSelection() {
     ui: { selection }
   } = useInjectedViewerState()
 
-  const selectionCallback = (event: Nullable<SelectionEvent>) => {
-    if (!event) return (selection.value = null) // reset selection location
-
-    const firstHit = event.hits[0]
-    selection.value = firstHit.point
+  const selectionCallback: Parameters<
+    typeof useSelectionEvents
+  >[0]['singleClickCallback'] = (_event, { firstVisibleSelectionHit }) => {
+    if (!firstVisibleSelectionHit) return (selection.value = null) // reset selection location
+    selection.value = firstVisibleSelectionHit.point
   }
   useSelectionEvents({
     singleClickCallback: selectionCallback,
diff --git a/packages/frontend-2/plugins/dev.ts b/packages/frontend-2/plugins/dev.ts
new file mode 100644
index 000000000..b83da9c45
--- /dev/null
+++ b/packages/frontend-2/plugins/dev.ts
@@ -0,0 +1,6 @@
+export default defineNuxtPlugin(() => {
+  if (!process.dev) return
+  if (!process.client) return
+
+  console.debug('🚧 Running FE2 in dev mode, extra debugging tools may be available...')
+})