Merge branch 'main' into fabians/fe2-automate-integration

packages/frontend-2/components/viewer/resources/VersionCard.vue

@@ -2,7 +2,7 @@
   <div
     :class="`bg-foundation group relative block w-full space-y-2 rounded-md pb-2 text-left transition ${
       clickable
-        ? 'hover:bg-gray-100 dark:hover:bg-gray-700'
+        ? 'hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer'
         : ' bg-primary-muted cursor-default'
     }
     ${isLoaded ? '' : ''}

packages/frontend-2/lib/common/composables/reactiveCookie.ts

@@ -1,4 +1,4 @@
-import type { CookieOptions } from '#app'
+import type { CookieOptions } from 'nuxt/dist/app/composables/cookie'
 import dayjs from 'dayjs'
 import { useScopedState } from '~~/lib/common/composables/scopedState'
 
@@ -12,9 +12,14 @@ export const useSynchronizedCookie = <CookieValue = string>(
   name: string,
   opts?: CookieOptions<CookieValue>
 ) =>
-  useScopedState(`synchronizedCookiesState-${name}`, () =>
-    useCookie<CookieValue>(name, {
+  useScopedState(`synchronizedCookiesState-${name}`, () => {
+    const finalOpts: CookieOptions<CookieValue> = {
       expires: dayjs().add(1, 'year').toDate(),
-      ...(opts || {})
-    })
-  )
+      ...(opts || {}),
+      readonly: false
+    }
+
+    // something's off with nuxt's types here, have to use any
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any
+    return useCookie<CookieValue>(name, finalOpts as any)
+  })

packages/frontend-2/lib/core/configs/apollo.ts

@@ -267,17 +267,17 @@ function createCache(): InMemoryCache {
   })
 }
 
-async function createWsClient(params: {
+function createWsClient(params: {
   wsEndpoint: string
   authToken: CookieRef<Optional<string>>
   reqId: string
-}): Promise<SubscriptionClient> {
+}): SubscriptionClient {
   const { wsEndpoint, authToken, reqId } = params
 
   // WS IN SSR DOESN'T WORK CURRENTLY CAUSE OF SOME NUXT TRANSPILATION WEIRDNESS
   // SO DON'T RUN createWsClient in SSR
   // eslint-disable-next-line @typescript-eslint/no-var-requires
-  const wsImplementation = process.server ? (await import('ws')).default : undefined
+  // const wsImplementation = process.server ? (await import('ws')).default : undefined
   return new SubscriptionClient(
     wsEndpoint,
     {
@@ -288,8 +288,8 @@ async function createWsClient(params: {
           ? { Authorization, headers: { Authorization, 'x-request-id': reqId } }
           : {}
       }
-    },
-    wsImplementation
+    }
+    // wsImplementation
   )
 }
 
@@ -422,7 +422,7 @@ function createLink(params: {
   return from([...(process.server ? [loggerLink] : []), errorLink, link])
 }
 
-const defaultConfigResolver: ApolloConfigResolver = async () => {
+const defaultConfigResolver: ApolloConfigResolver = () => {
   const {
     public: { speckleServerVersion = 'unknown' }
   } = useRuntimeConfig()
@@ -435,7 +435,7 @@ const defaultConfigResolver: ApolloConfigResolver = async () => {
 
   const authToken = useAuthCookie()
   const wsClient = process.client
-    ? await createWsClient({ wsEndpoint, authToken, reqId })
+    ? createWsClient({ wsEndpoint, authToken, reqId })
     : undefined
   const link = createLink({ httpEndpoint, wsClient, authToken, nuxtApp, reqId })
 

packages/frontend-2/lib/core/nuxt-modules/apollo/module.ts

@@ -2,7 +2,7 @@ import path from 'path'
 import type { ApolloClientOptions } from '@apollo/client/core'
 import { addPluginTemplate, defineNuxtModule } from '@nuxt/kit'
 import type { MaybeAsync } from '@speckle/shared'
-import type { NuxtApp } from 'nuxt/dist/app'
+import type { NuxtApp } from 'nuxt/dist/app/nuxt'
 
 /**
  * Config resolver default exported function expected type

packages/frontend-2/lib/viewer/composables/setup.ts

@@ -51,8 +51,6 @@ import type { CommentBubbleModel } from '~~/lib/viewer/composables/commentBubble
 import { setupUrlHashState } from '~~/lib/viewer/composables/setup/urlHashState'
 import type { SpeckleObject } from '~~/lib/common/helpers/sceneExplorer'
 import { Box3, Vector3 } from 'three'
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-import { wrapRefWithTracking } from '~~/lib/common/helpers/debugging'
 import { writableAsyncComputed } from '~~/lib/common/composables/async'
 import type { AsyncWritableComputedRef } from '~~/lib/common/composables/async'
 import { setupUiDiffState } from '~~/lib/viewer/composables/setup/diff'

packages/frontend-2/lib/viewer/composables/setup/dev.ts

@@ -23,7 +23,7 @@ function useDebugViewer() {
   window.VIEWER = instance
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-expect-error
-  window.VIEWER_STATE = () => ({ ...state })
+  window.VIEWER_STATE = () => state
 }
 
 export function setupDebugMode() {

packages/frontend-2/lib/viewer/composables/viewer.ts

@@ -103,7 +103,7 @@ export function useViewerEventListener<A = any>(
   })
 
   onBeforeUnmount(() => {
-    unmount
+    unmount()
   })
 
   return unmount

packages/frontend-2/nuxt.config.ts

@@ -24,6 +24,10 @@ export default defineNuxtConfig({
     shim: false,
     strict: true
   },
+  features: {
+    // while nuxt's implementation is broken, we disable this: https://github.com/nuxt/nuxt/issues/26369
+    devLogs: false
+  },
   modules: [
     '@nuxt/devtools',
     '@nuxtjs/tailwindcss',

packages/frontend-2/package.json

@@ -47,7 +47,7 @@
     "@tiptap/vue-3": "2.0.0-beta.220",
     "@vue/apollo-composable": "4.0.2",
     "@vue/apollo-ssr": "4.0.0",
-    "@vueuse/core": "^9.13.0",
+    "@vueuse/core": "^10.9.0",
     "apollo-upload-client": "^18.0.1",
     "dayjs": "^1.11.7",
     "graphql": "^16.6.0",
@@ -102,7 +102,7 @@
     "eslint-plugin-vue": "^9.18.1",
     "eslint-plugin-vuejs-accessibility": "^1.2.0",
     "jest": "27",
-    "nuxt": "^3.8.2",
+    "nuxt": "^3.11.1",
     "pino-pretty": "^10.0.1",
     "postcss": "^8.4.31",
     "postcss-custom-properties": "^12.1.9",
@@ -119,7 +119,7 @@
     "tailwindcss": "^3.4.1",
     "type-fest": "^3.5.1",
     "typescript": "^4.8.3",
-    "vue-tsc": "1.8.27",
+    "vue-tsc": "2.0.6",
     "wait-on": "^6.0.1"
   },
   "engines": {

packages/frontend-2/plugins/002-rum.ts

@@ -81,6 +81,9 @@ async function initRumClient(app: PluginNuxtApp) {
     await onAuthStateChange(
       (user, { resolveDistinctId }) => {
         const distinctId = resolveDistinctId(user)
+        // setUser might not be there, if blocked by adblock
+        if (!datadog || !('setUser' in datadog)) return
+
         if (distinctId && user) {
           datadog.setUser({
             id: distinctId

packages/frontend-2/server/plugins/termination.ts

@@ -1,11 +1,5 @@
-import { buildLogger } from '~/server/lib/core/helpers/observability'
-import { useRuntimeConfig } from '#imports'
-
 export default defineNitroPlugin((nitroApp) => {
-  const {
-    public: { logLevel, logPretty }
-  } = useRuntimeConfig()
-  const logger = buildLogger(logLevel, logPretty)
+  const logger = useLogger()
   nitroApp.hooks.hook('close', () => {
     logger.warn('Closing down the server, bye bye!')
   })

packages/frontend-2/type-augmentations/window.d.ts

@@ -1,7 +1,9 @@
 declare global {
   interface Window {
     rg4js?: import('raygun4js').RaygunV2
-    DD_RUM?: import('@datadog/browser-rum').RumGlobal
+    DD_RUM?:
+      | Pick<import('@datadog/browser-rum').RumGlobal, 'onReady'>
+      | import('@datadog/browser-rum').RumGlobal
   }
 }
 

packages/frontend-2/utils/globals.ts

@@ -1,3 +1,10 @@
+import { noop } from 'lodash-es'
+import { wrapRefWithTracking } from '~/lib/common/helpers/debugging'
 import { ToastNotificationType } from '~~/lib/common/composables/toast'
 
-export { ToastNotificationType }
+/**
+ * Debugging helper to ensure variables are available in debugging scope
+ */
+export const markUsed = noop
+
+export { ToastNotificationType, wrapRefWithTracking }

packages/ui-components/src/components/layout/Dialog.vue

@@ -33,7 +33,7 @@
                 widthClasses
               ]"
               :as="isForm ? 'form' : 'div'"
-              @submit.prevent="onSubmit"
+              @submit.prevent="onSubmit || noop"
             >
               <div :class="scrolledFromTop && 'relative z-20 shadow-lg'">
                 <div
@@ -95,7 +95,7 @@ import { Dialog, DialogPanel, TransitionChild, TransitionRoot } from '@headlessu
 import { FormButton } from '~~/src/lib'
 import { XMarkIcon } from '@heroicons/vue/24/outline'
 import { computed, ref, useSlots } from 'vue'
-import { throttle } from 'lodash'
+import { throttle, noop } from 'lodash'
 
 type MaxWidthValue = 'sm' | 'md' | 'lg' | 'xl'
 

packages/viewer-sandbox/src/Extensions/CameraPlanes.ts

@@ -13,7 +13,9 @@ export class CameraPlanes extends Extension {
 
   public constructor(viewer: IViewer) {
     super(viewer)
-    this.camerController = viewer.getExtension(CameraController)
+    this.camerController = viewer.getExtension(
+      CameraController as new () => CameraController
+    )
   }
 
   public onEarlyUpdate(): void {

packages/viewer-sandbox/src/Sandbox.ts

@@ -968,17 +968,7 @@ export default class Sandbox {
         const data = this.properties.find((value) => {
           return value.key === this.filterParams.filterBy
         }) as PropertyInfo
-        data.min = 90.37
-        data.max = 258.17
         this.viewer.getExtension(FilteringExtension).setColorFilter(data)
-        // this.viewer
-        //   .getExtension(FilteringExtension)
-        //   .isolateObjects(['2f2ab0d53fc998bd34581e6ac8593eaa'], 'isolate', true, true)
-        // this.viewer
-        //   .getExtension(FilteringExtension)
-        //   .setUserObjectColors([
-        //     { objectIds: ['2f2ab0d53fc998bd34581e6ac8593eaa'], color: '#ff0000' }
-        //   ])
         this.pane.refresh()
       })
 

packages/viewer-sandbox/src/main.ts

@@ -73,7 +73,7 @@ const createViewer = async (containerName: string, stream: string) => {
   viewer.on(
     ViewerEvent.ObjectClicked,
     (event: { hits: { node: { model: { id: string } } }[] }) => {
-      // if (event) console.log(event.hits[0].node.model.id)
+      if (event) console.log(event.hits[0].node.model.id)
     }
   )
 
@@ -120,7 +120,7 @@ const getStream = () => {
     // prettier-ignore
     // 'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8?c=%5B-7.66134,10.82932,6.41935,-0.07739,-13.88552,1.8697,0,1%5D'
     // Revit sample house (good for bim-like stuff with many display meshes)
-    // 'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8'
+    'https://speckle.xyz/streams/da9e320dad/commits/5388ef24b8'
     // 'https://latest.speckle.dev/streams/58b5648c4d/commits/60371ecb2d'
     // 'Super' heavy revit shit
     // 'https://speckle.xyz/streams/e6f9156405/commits/0694d53bb5'
@@ -365,7 +365,13 @@ const getStream = () => {
     // 'https://latest.speckle.dev/streams/7117052f4e/commits/a646bf659e'
     // 'https://latest.speckle.dev/streams/aea12cab71/commits/787ade768e'
     // 'https://speckle.xyz/streams/a29e5c7772/commits/a8cfae2645'
-    'https://latest.speckle.dev/streams/9d71f041b2/commits/01279333e5'
+    // 'https://latest.speckle.dev/streams/9d71f041b2/commits/01279333e5'
+    // 'https://latest.speckle.dev/streams/65c512f4ea/commits/cc2490830a'
+    // 'https://latest.speckle.dev/streams/65c512f4ea/objects/882497528d1fa06660c28c1fd6aa15e0'
+    // 'https://speckle.xyz/streams/b4086833f8/commits/94df4c6d16'
+
+    // Rebar
+    // 'https://speckle.xyz/streams/b4086833f8/commits/94df4c6d16?overlay=c5b9c260ea,e3dc287d61,eaedd7d0a5,7f126ce0dd,02fee34ce3,9bda31611f,110282c4db,533c311e29,bf6814d779,1ba52affcf,cc4e75125e,3fd628e4e3'
   )
 }
 

packages/viewer/src/modules/LegacyViewer.ts

@@ -34,6 +34,7 @@ import { Queries } from './queries/Queries'
 import { Query, QueryArgsResultMap } from './queries/Query'
 import { DataTreeBuilder } from './tree/DataTree'
 import { SelectionExtensionOptions } from './extensions/SelectionExtension'
+import { StencilOutlineType } from './materials/Materials'
 
 class LegacySelectionExtension extends SelectionExtension {
   /** FE2 'manually' selects objects pon it's own, so we're disabling the extension's event handler
@@ -57,7 +58,7 @@ class HighlightExtension extends SelectionExtension {
         metalness: 0,
         vertexColors: false,
         lineWeight: 1,
-        stencilOutlines: false,
+        stencilOutlines: StencilOutlineType.NONE,
         pointSize: 4
       }
     }
@@ -197,17 +198,14 @@ export class LegacyViewer extends Viewer {
     ghost = false
   ): Promise<FilteringState> {
     return new Promise<FilteringState>((resolve) => {
-      this.selection.unselectObjects(objectIds)
-      const filteringState = this.filtering.hideObjects(
-        objectIds,
-        stateKey,
-        includeDescendants,
-        ghost
-      )
-      if (!filteringState.selectedObjects) filteringState.selectedObjects = []
-      filteringState.selectedObjects.push(
-        ...this.selection.getSelectedObjects().map((obj) => obj.id)
-      )
+      const filteringState = this.preserveSelectionFilter(() => {
+        return this.filtering.hideObjects(
+          objectIds,
+          stateKey,
+          includeDescendants,
+          ghost
+        )
+      })
       resolve(filteringState)
     })
   }
@@ -218,15 +216,9 @@ export class LegacyViewer extends Viewer {
     includeDescendants = false
   ): Promise<FilteringState> {
     return new Promise<FilteringState>((resolve) => {
-      const filteringState = this.filtering.showObjects(
-        objectIds,
-        stateKey,
-        includeDescendants
-      )
-      if (!filteringState.selectedObjects) filteringState.selectedObjects = []
-      filteringState.selectedObjects.push(
-        ...this.selection.getSelectedObjects().map((obj) => obj.id)
-      )
+      const filteringState = this.preserveSelectionFilter(() => {
+        return this.filtering.showObjects(objectIds, stateKey, includeDescendants)
+      })
       resolve(filteringState)
     })
   }

packages/viewer/src/modules/batching/Batch.ts

@@ -42,6 +42,7 @@ export interface Batch {
   getOpaque(): BatchUpdateRange
   getTransparent(): BatchUpdateRange
   getStencil(): BatchUpdateRange
+  getDepth(): BatchUpdateRange
   onUpdate(deltaTime: number)
   onRender(renderer: WebGLRenderer)
   purge()

packages/viewer/src/modules/batching/Batcher.ts

@@ -421,6 +421,14 @@ export default class Batcher {
     return visibilityRanges
   }
 
+  public getDepth(): Record<string, BatchUpdateRange> {
+    const visibilityRanges = {}
+    for (const k in this.batches) {
+      visibilityRanges[k] = this.batches[k].getDepth()
+    }
+    return visibilityRanges
+  }
+
   public overrideMaterial(
     ranges: Record<string, BatchUpdateRange>,
     material: Material