Fix: Use workspace in breadcrumb on versions page (#3184)

packages/frontend-2/components/project/model-page/Header.vue

@@ -2,19 +2,18 @@
   <div>
     <Portal to="navigation">
       <HeaderNavLink
-        :to="projectsRoute"
-        name="Projects"
+        v-if="project.workspace && isWorkspacesEnabled"
+        :to="workspaceRoute(project.workspace.slug)"
+        :name="project.workspace.name"
         :separator="false"
-      ></HeaderNavLink>
-      <HeaderNavLink
-        :to="projectRoute(project.id)"
-        :name="project.name"
-      ></HeaderNavLink>
+      />
+      <HeaderNavLink v-else :to="projectsRoute" name="Projects" :separator="false" />
+      <HeaderNavLink :to="projectRoute(project.id)" :name="project.name" />
       <HeaderNavLink
         v-if="props.project.model"
         :to="modelVersionsRoute(project.id, props.project.model.id)"
         :name="props.project.model.name"
-      ></HeaderNavLink>
+      />
     </Portal>
 
     <CommonTitleDescription
@@ -32,6 +31,7 @@ import {
   modelVersionsRoute,
   projectsRoute
 } from '~~/lib/common/helpers/route'
+import { workspaceRoute } from '~/lib/common/helpers/route'
 
 graphql(`
   fragment ProjectModelPageHeaderProject on Project {
@@ -42,10 +42,17 @@ graphql(`
       name
       description
     }
+    workspace {
+      id
+      slug
+      name
+    }
   }
 `)
 
 const props = defineProps<{
   project: ProjectModelPageHeaderProjectFragment
 }>()
+
+const isWorkspacesEnabled = useIsWorkspacesEnabled()
 </script>

packages/frontend-2/components/project/page/Header.vue

@@ -64,9 +64,9 @@ graphql(`
   }
 `)
 
-const isWorkspacesEnabled = useIsWorkspacesEnabled()
-
 defineProps<{
   project: ProjectPageProjectHeaderFragment
 }>()
+
+const isWorkspacesEnabled = useIsWorkspacesEnabled()
 </script>

packages/frontend-2/lib/common/generated/gql/gql.ts

@@ -46,7 +46,7 @@ const documents = {
     "\n  fragment FormSelectProjects_Project on Project {\n    id\n    name\n  }\n": types.FormSelectProjects_ProjectFragmentDoc,
     "\n  fragment FormUsersSelectItem on LimitedUser {\n    id\n    name\n    avatar\n  }\n": types.FormUsersSelectItemFragmentDoc,
     "\n  fragment HeaderNavShare_Project on Project {\n    id\n    visibility\n    ...ProjectsModelPageEmbed_Project\n  }\n": types.HeaderNavShare_ProjectFragmentDoc,
-    "\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n  }\n": types.ProjectModelPageHeaderProjectFragmentDoc,
+    "\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n    workspace {\n      id\n      slug\n      name\n    }\n  }\n": types.ProjectModelPageHeaderProjectFragmentDoc,
     "\n  fragment ProjectModelPageVersionsPagination on Project {\n    id\n    visibility\n    model(id: $modelId) {\n      id\n      versions(limit: 16, cursor: $versionsCursor) {\n        cursor\n        totalCount\n        items {\n          ...ProjectModelPageVersionsCardVersion\n        }\n      }\n    }\n    ...ProjectsModelPageEmbed_Project\n  }\n": types.ProjectModelPageVersionsPaginationFragmentDoc,
     "\n  fragment ProjectModelPageVersionsProject on Project {\n    ...ProjectPageProjectHeader\n    model(id: $modelId) {\n      id\n      name\n      pendingImportedVersions {\n        ...PendingFileUpload\n      }\n    }\n    ...ProjectModelPageVersionsPagination\n    ...ProjectsModelPageEmbed_Project\n  }\n": types.ProjectModelPageVersionsProjectFragmentDoc,
     "\n  fragment ProjectModelPageDialogDeleteVersion on Version {\n    id\n    message\n  }\n": types.ProjectModelPageDialogDeleteVersionFragmentDoc,
@@ -485,7 +485,7 @@ export function graphql(source: "\n  fragment HeaderNavShare_Project on Project
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */
-export function graphql(source: "\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n  }\n"): (typeof documents)["\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n  }\n"];
+export function graphql(source: "\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n    workspace {\n      id\n      slug\n      name\n    }\n  }\n"): (typeof documents)["\n  fragment ProjectModelPageHeaderProject on Project {\n    id\n    name\n    model(id: $modelId) {\n      id\n      name\n      description\n    }\n    workspace {\n      id\n      slug\n      name\n    }\n  }\n"];
 /**
  * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
  */