Remove listGroups while building categories

app/common/src/services/Backend.ts

@@ -196,9 +196,25 @@ export interface User extends UserInfo {
   readonly isOrganizationAdmin: boolean
   readonly rootDirectoryId: DirectoryId
   readonly profilePicture?: HttpsUrl
+  /**
+   * Contains the IDs of the user groups that the user is a member of.
+   * @deprecated Use `groups` instead.
+   */
   readonly userGroups: readonly UserGroupId[] | null
   readonly removeAt?: dateTime.Rfc3339DateTime | null
   readonly plan?: Plan | undefined
+  /**
+   * Contains the user groups that the user is a member of.
+   * Has enriched metadata, like the name of the group and the home directory ID.
+   */
+  readonly groups?: readonly UserGroup[]
+}
+
+/** A user related to the current user. */
+export interface UserGroup {
+  readonly id: UserGroupId
+  readonly name: string
+  readonly homeDirectoryId: DirectoryId
 }
 
 /** A `Directory` returned by `createDirectory`. */

app/gui/src/dashboard/layouts/Drive/Categories/Category.ts

@@ -17,8 +17,8 @@ import {
   type DirectoryId,
   type Path,
   type User,
+  type UserGroup,
   type UserGroupId,
-  type UserGroupInfo,
 } from '#/services/Backend'
 import { newDirectoryId } from '#/services/LocalBackend'
 
@@ -73,7 +73,7 @@ export const TEAM_CATEGORY_SCHEMA = z
   .object({
     type: z.literal('team'),
     id: z.custom<UserGroupId>(() => true),
-    team: z.custom<UserGroupInfo>(() => true),
+    team: z.custom<UserGroup>(() => true),
     rootPath: PATH_SCHEMA,
     homeDirectoryId: DIRECTORY_ID_SCHEMA,
   })

app/gui/src/dashboard/layouts/Drive/Categories/categoriesHooks.tsx

@@ -6,8 +6,6 @@
  * It's not the same as the categories like LocalBackend
  */
 
-import { useSuspenseQuery } from '@tanstack/react-query'
-
 import CloudIcon from '#/assets/cloud.svg'
 import ComputerIcon from '#/assets/computer.svg'
 import FolderFilledIcon from '#/assets/folder_filled.svg'
@@ -18,21 +16,16 @@ import Trash2Icon from '#/assets/trash2.svg'
 
 import { useUser } from '#/providers/AuthProvider'
 
-import { backendQueryOptions } from '#/hooks/backendHooks'
 import { useEventCallback } from '#/hooks/eventCallbackHooks'
 import { useOffline } from '#/hooks/offlineHooks'
 import { useSearchParamsState } from '#/hooks/searchParamsStateHooks'
-import { useBackend, useLocalBackend, useRemoteBackend } from '#/providers/BackendProvider'
+import { useBackend, useLocalBackend } from '#/providers/BackendProvider'
 import { useLocalStorageState } from '#/providers/LocalStorageProvider'
 import { useText } from '#/providers/TextProvider'
 import type Backend from '#/services/Backend'
 import { type DirectoryId, Path, userHasUserAndTeamSpaces } from '#/services/Backend'
 import { newDirectoryId } from '#/services/LocalBackend'
-import {
-  organizationIdToDirectoryId,
-  userGroupIdToDirectoryId,
-  userIdToDirectoryId,
-} from '#/services/RemoteBackend'
+import { organizationIdToDirectoryId, userIdToDirectoryId } from '#/services/RemoteBackend'
 import { getFileName } from '#/utilities/fileInfo'
 import LocalStorage from '#/utilities/LocalStorage'
 import type { ReactNode } from 'react'
@@ -75,8 +68,6 @@ export type CloudCategoryResult = ReturnType<typeof useCloudCategoryList>
  * List of categories in the Cloud.
  */
 export function useCloudCategoryList() {
-  const remoteBackend = useRemoteBackend()
-
   const user = useUser()
   const { getText } = useText()
 
@@ -115,13 +106,6 @@ export function useCloudCategoryList() {
     trashCategory,
   ]
 
-  const { data: allUserGroupsRaw } = useSuspenseQuery(
-    backendQueryOptions(remoteBackend, 'listUserGroups', []),
-  )
-
-  const allUserGroups =
-    allUserGroupsRaw.length === 0 || !hasUserAndTeamSpaces ? null : allUserGroupsRaw
-
   const userSpace: UserCategory | null =
     hasUserAndTeamSpaces ?
       {
@@ -135,29 +119,19 @@ export function useCloudCategoryList() {
       }
     : null
 
-  const doesHaveUserGroups =
-    user.userGroups != null && user.userGroups.length > 0 && allUserGroups != null
+  const doesHaveUserGroups = user.groups != null && user.groups.length > 0
 
   const userGroupDynamicCategories =
     doesHaveUserGroups ?
-      user.userGroups.map<TeamCategory>((id) => {
-        const group = allUserGroups.find((userGroup) => userGroup.id === id)
-
-        invariant(
-          group != null,
-          `Unable to find user group by id: ${id}, allUserGroups: ${JSON.stringify(allUserGroups, null, 2)}`,
-        )
-
-        return {
-          type: 'team',
-          id,
-          team: group,
-          rootPath: Path(`enso://Teams/${group.groupName}`),
-          homeDirectoryId: userGroupIdToDirectoryId(group.id),
-          label: getText('teamCategory', group.groupName),
-          icon: PeopleIcon,
-        }
-      })
+      user.groups.map<TeamCategory>((group) => ({
+        type: 'team',
+        id: group.id,
+        team: group,
+        rootPath: Path(`enso://Teams/${group.name}`),
+        homeDirectoryId: group.homeDirectoryId,
+        label: getText('teamCategory', group.name),
+        icon: PeopleIcon,
+      }))
     : null
 
   const categories = [