From cd16b044565d4bcda7bba07501e2465230916c51 Mon Sep 17 00:00:00 2001
From: Kristaps Fabians Geikins <fabians@speckle.systems>
Date: Fri, 26 Apr 2024 10:44:49 +0300
Subject: [PATCH] fix: model list view query bug w/ names w/ parentheses
 (#2230)

---
 .../project/page/models/StructureItem.vue     | 48 ++++++++++++-------
 .../components/user/profile/EditDialog.vue    | 24 +++++++++-
 .../modules/core/repositories/branches.ts     | 18 ++++---
 3 files changed, 64 insertions(+), 26 deletions(-)

diff --git a/packages/frontend-2/components/project/page/models/StructureItem.vue b/packages/frontend-2/components/project/page/models/StructureItem.vue
index 80bf075a2e..1ff94356ce 100644
--- a/packages/frontend-2/components/project/page/models/StructureItem.vue
+++ b/packages/frontend-2/components/project/page/models/StructureItem.vue
@@ -17,6 +17,9 @@
         <template v-else-if="pendingModel">
           <ArrowUpOnSquareIcon class="w-4 h-4 text-foreground-2 mx-2" />
         </template>
+        <template v-else>
+          <div class="w-4 h-4 mx-2" />
+        </template>
 
         <!-- Name -->
         <div class="flex justify-start space-x-2 items-center">
@@ -200,25 +203,32 @@
         v-if="hasChildren && expanded && !isPendingFileUpload(item)"
         class="pl-8 mt-4 space-y-4"
       >
-        <div v-for="child in children" :key="child.fullName" class="flex">
-          <div class="h-20 absolute -ml-8 flex items-center mt-0 mr-1 pl-1">
-            <ChevronDownIcon class="w-4 h-4 rotate-45 text-foreground-2" />
-          </div>
+        <div v-if="childrenLoading" class="mr-8">
+          <CommonLoadingBar loading />
+        </div>
 
-          <ProjectPageModelsStructureItem
-            :item="child"
-            :project="project"
-            :can-contribute="canContribute"
-            class="flex-grow"
-            @model-updated="onModelUpdated"
-            @create-submodel="emit('create-submodel', $event)"
+        <template v-else>
+          <div v-for="child in children" :key="child.fullName" class="flex">
+            <div class="h-20 absolute -ml-8 flex items-center mt-0 mr-1 pl-1">
+              <ChevronDownIcon class="w-4 h-4 rotate-45 text-foreground-2" />
+            </div>
+
+            <ProjectPageModelsStructureItem
+              :item="child"
+              :project="project"
+              :can-contribute="canContribute"
+              class="flex-grow"
+              @model-updated="onModelUpdated"
+              @create-submodel="emit('create-submodel', $event)"
+            />
+          </div>
+        </template>
+        <div v-if="canContribute" class="mr-8">
+          <ProjectPageModelsNewModelStructureItem
+            :project-id="project.id"
+            :parent-model-name="item.fullName"
           />
         </div>
-        <ProjectPageModelsNewModelStructureItem
-          v-if="canContribute"
-          :project-id="project.id"
-          :parent-model-name="item.fullName"
-        />
       </div>
     </div>
   </div>
@@ -396,7 +406,11 @@ const viewAllUrl = computed(() => {
   return modelRoute(props.project.id, `$${props.item.fullName}`)
 })
 
-const { result: childrenResult, refetch: refetchChildren } = useQuery(
+const {
+  result: childrenResult,
+  refetch: refetchChildren,
+  loading: childrenLoading
+} = useQuery(
   projectModelChildrenTreeQuery,
   () => ({
     projectId: props.project.id,
diff --git a/packages/frontend-2/components/user/profile/EditDialog.vue b/packages/frontend-2/components/user/profile/EditDialog.vue
index 7532781308..a1cb055c39 100644
--- a/packages/frontend-2/components/user/profile/EditDialog.vue
+++ b/packages/frontend-2/components/user/profile/EditDialog.vue
@@ -15,8 +15,17 @@
       </LayoutDialogSection>
       <UserProfileEditDialogChangePassword :user="user" />
       <UserProfileEditDialogDeleteAccount :user="user" @deleted="isOpen = false" />
-      <div class="text-tiny text-foreground-2 mt-4">
-        User #{{ user.id }} {{ distinctId ? ` | ${distinctId}` : '' }}
+      <div class="text-xs text-foreground-2 mt-4">
+        User ID:
+        <CommonTextLink size="xs" no-underline @click="copyUserId">
+          #{{ user.id }}
+        </CommonTextLink>
+        <template v-if="distinctId">
+          |
+          <CommonTextLink size="xs" no-underline @click="copyDistinctId">
+            {{ distinctId }}
+          </CommonTextLink>
+        </template>
       </div>
     </div>
   </LayoutDialog>
@@ -44,6 +53,7 @@ const props = defineProps<{
 }>()
 
 const { activeUser: user, distinctId } = useActiveUser()
+const { copy } = useClipboard()
 
 const isOpen = computed({
   get: () => !!(props.open && user.value),
@@ -59,4 +69,14 @@ const developerSettingsButton = computed(() => ({
     isOpen.value = false
   }
 }))
+
+const copyUserId = () => {
+  if (!user.value) return
+  copy(user.value.id)
+}
+
+const copyDistinctId = () => {
+  if (!distinctId.value) return
+  copy(distinctId.value)
+}
 </script>
diff --git a/packages/server/modules/core/repositories/branches.ts b/packages/server/modules/core/repositories/branches.ts
index eeb099a196..c82709b087 100644
--- a/packages/server/modules/core/repositories/branches.ts
+++ b/packages/server/modules/core/repositories/branches.ts
@@ -406,19 +406,23 @@ function getModelTreeItemsBaseQuery(
   projectId: string,
   options?: Partial<{ filterOutEmptyMain: boolean; parentModelName: string }>
 ) {
-  const cleanInput = (input: string | null | undefined) => {
-    const clean = (input || '').toLowerCase()
-    const trimmed = trim(trim(clean), '/')
-    return trimmed
+  const cleanInput = (
+    input: string | null | undefined,
+    options?: Partial<{ escapeRegexp: boolean }>
+  ) => {
+    let clean = (input || '').toLowerCase()
+    clean = trim(trim(clean), '/')
+    clean = options?.escapeRegexp ? clean.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') : clean
+    return clean
   }
 
   const { filterOutEmptyMain = true, parentModelName } = options || {}
-  const cleanModelName = cleanInput(parentModelName)
+  const cleanModelName = cleanInput(parentModelName, { escapeRegexp: true })
   const branchPartPattern = `[^/]+` // regexp for each branch part between slashes
 
   const regExp = cleanModelName.length
     ? // only direct children of parentModelName
-      `^${cleanModelName.replace('/', '\\/')}\\/(${branchPartPattern})`
+      `^${cleanModelName}\\/(${branchPartPattern})`
     : // only first branch part (top level item)
       `^${branchPartPattern}`
 
@@ -470,7 +474,7 @@ function getModelTreeItemsBaseQuery(
 
   return {
     query: finalQuery,
-    parentModelName: cleanModelName
+    parentModelName: cleanInput(parentModelName)
   }
 }