Move composables to their own file

packages/frontend-2/components/projects/MoveToWorkspaceDialog.vue

@@ -76,7 +76,7 @@ import {
   useWorkspaceCustomDataResidencyDisclaimer,
   RegionStaticDataDisclaimerVariant
 } from '~/lib/workspaces/composables/region'
-import { useWorkspacePlanLimits } from '~/lib/workspaces/composables/plan'
+import { useWorkspacePlanLimits } from '~/lib/workspaces/composables/limits'
 
 graphql(`
   fragment ProjectsMoveToWorkspaceDialog_Workspace on Workspace {

packages/frontend-2/components/viewer/anchored-point/thread/Comment.vue

@@ -30,7 +30,9 @@
           readonly
           @created="emit('mounted')"
         />
+
         <ViewerAnchoredPointThreadCommentLimitAlert :limit="10" />
+
         <ViewerAnchoredPointThreadCommentAttachments
           :attachments="comment"
           :project-id="projectId"

packages/frontend-2/components/viewer/anchored-point/thread/CommentLimitAlert.vue

@@ -7,16 +7,20 @@
 </template>
 <script setup lang="ts">
 import type { AlertAction } from '@speckle/ui-components'
+import { useNavigation } from '~/lib/navigation/composables/navigation'
 import { settingsWorkspaceRoutes } from '~~/lib/common/helpers/route'
 
 defineProps<{
   limit: number
 }>()
 
+const { activeWorkspaceSlug } = useNavigation()
+
 const actions = computed((): AlertAction[] => [
   {
     title: 'Upgrade',
-    onClick: () => navigateTo(settingsWorkspaceRoutes.billing)
+    onClick: () =>
+      navigateTo(settingsWorkspaceRoutes.billing.route(activeWorkspaceSlug.value || ''))
   }
 ])
 </script>

packages/frontend-2/components/workspace/MoveProjectsDialog.vue

@@ -89,10 +89,8 @@ import type {
 import { usePaginatedQuery } from '~/lib/common/composables/graphql'
 import { moveProjectsDialogQuery } from '~~/lib/workspaces/graphql/queries'
 import { Roles } from '@speckle/shared'
-import {
-  useWorkspacePlanLimits,
-  useGetWorkspacePlanUsage
-} from '~/lib/workspaces/composables/plan'
+import { useWorkspacePlanLimits } from '~/lib/workspaces/composables/limits'
+import { useGetWorkspacePlanUsage } from '~/lib/workspaces/composables/usage'
 
 graphql(`
   fragment MoveProjectsDialog_Workspace on Workspace {

packages/frontend-2/lib/workspaces/composables/limits.ts

@@ -0,0 +1,53 @@
+export const useWorkspacePlanLimits = (
+  projectCount: ComputedRef<number>,
+  modelCount: ComputedRef<number>
+) => {
+  const projectLimit = computed(() => 3)
+  const modelLimit = computed(() => 8)
+
+  const remainingProjects = computed(() => {
+    return projectLimit.value - projectCount.value
+  })
+
+  const remainingModels = computed(() => {
+    return modelLimit.value - modelCount.value
+  })
+
+  const limitType = computed(() => {
+    if (projectCount.value > projectLimit.value) {
+      return 'project'
+    }
+    if (modelCount.value > modelLimit.value) {
+      return 'model'
+    }
+    return null
+  })
+
+  const activeLimit = computed(() => {
+    const limit =
+      limitType.value === 'project'
+        ? projectLimit.value
+        : limitType.value === 'model'
+        ? modelLimit.value
+        : null
+    return limit
+  })
+
+  const canAddProject = computed(
+    () => remainingProjects.value !== null && remainingProjects.value > 0
+  )
+  const canAddModels = computed(
+    () => remainingModels.value !== null && remainingModels.value > 0
+  )
+
+  return {
+    projectLimit,
+    modelLimit,
+    remainingProjects,
+    remainingModels,
+    canAddProject,
+    canAddModels,
+    limitType,
+    activeLimit
+  }
+}

packages/frontend-2/lib/workspaces/composables/plan.ts

@@ -1,8 +1,5 @@
 import { graphql } from '~~/lib/common/generated/gql'
-import {
-  workspacePlanLimitsQuery,
-  workspacePlanQuery
-} from '~~/lib/workspaces/graphql/queries'
+import { workspacePlanQuery } from '~~/lib/workspaces/graphql/queries'
 import { useQuery } from '@vue/apollo-composable'
 import {
   isNewWorkspacePlan,
@@ -158,85 +155,3 @@ graphql(`
     }
   }
 `)
-
-export const useGetWorkspacePlanUsage = (slug: string) => {
-  const { result } = useQuery(
-    workspacePlanLimitsQuery,
-    () => ({
-      slug
-    }),
-    () => ({
-      enabled: !!slug
-    })
-  )
-
-  const projectCount = computed(
-    () => result.value?.workspaceBySlug?.projects?.totalCount ?? 0
-  )
-  const modelCount = computed(
-    () =>
-      result.value?.workspaceBySlug?.projects?.items?.reduce(
-        (total, project) => total + (project?.models?.totalCount ?? 0),
-        0
-      ) ?? 0
-  )
-
-  return {
-    projectCount,
-    modelCount
-  }
-}
-
-export const useWorkspacePlanLimits = (
-  projectCount: ComputedRef<number>,
-  modelCount: ComputedRef<number>
-) => {
-  const projectLimit = computed(() => 3)
-  const modelLimit = computed(() => 8)
-
-  const remainingProjects = computed(() => {
-    return projectLimit.value - projectCount.value
-  })
-
-  const remainingModels = computed(() => {
-    return modelLimit.value - modelCount.value
-  })
-
-  const limitType = computed(() => {
-    if (projectCount.value > projectLimit.value) {
-      return 'project'
-    }
-    if (modelCount.value > modelLimit.value) {
-      return 'model'
-    }
-    return null
-  })
-
-  const activeLimit = computed(() => {
-    const limit =
-      limitType.value === 'project'
-        ? projectLimit.value
-        : limitType.value === 'model'
-        ? modelLimit.value
-        : null
-    return limit
-  })
-
-  const canAddProject = computed(
-    () => remainingProjects.value !== null && remainingProjects.value > 0
-  )
-  const canAddModels = computed(
-    () => remainingModels.value !== null && remainingModels.value > 0
-  )
-
-  return {
-    projectLimit,
-    modelLimit,
-    remainingProjects,
-    remainingModels,
-    canAddProject,
-    canAddModels,
-    limitType,
-    activeLimit
-  }
-}

packages/frontend-2/lib/workspaces/composables/usage.ts

@@ -0,0 +1,30 @@
+import { useQuery } from '@vue/apollo-composable'
+import { workspacePlanLimitsQuery } from '~/lib/workspaces/graphql/queries'
+
+export const useGetWorkspacePlanUsage = (slug: string) => {
+  const { result } = useQuery(
+    workspacePlanLimitsQuery,
+    () => ({
+      slug
+    }),
+    () => ({
+      enabled: !!slug
+    })
+  )
+
+  const projectCount = computed(
+    () => result.value?.workspaceBySlug?.projects?.totalCount ?? 0
+  )
+  const modelCount = computed(
+    () =>
+      result.value?.workspaceBySlug?.projects?.items?.reduce(
+        (total, project) => total + (project?.models?.totalCount ?? 0),
+        0
+      ) ?? 0
+  )
+
+  return {
+    projectCount,
+    modelCount
+  }
+}