Remove listGroups while building categories

.github/workflows/gui-changed-files.yml

@@ -39,7 +39,6 @@ jobs:
             .github/workflows/gui*
             .github/workflows/storybook.yml
           files_ignore: |
-            app/ide-desktop/**
             app/gui/scripts/**
             app/gui/.gitignore
             .git-*

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`. */
@@ -488,7 +504,7 @@ export interface UserPermission {
 
 /** User permission for a specific user group. */
 export interface UserGroupPermission {
-  readonly userGroup: UserGroupInfo
+  readonly userGroup: UserGroup
   readonly permission: permissions.PermissionAction
 }
 
@@ -544,7 +560,7 @@ export function isUserGroupPermissionAnd(predicate: (permission: UserGroupPermis
 
 /** Get the property representing the name on an arbitrary variant of {@link UserPermission}. */
 export function getAssetPermissionName(permission: AssetPermission) {
-  return isUserPermission(permission) ? permission.user.name : permission.userGroup.groupName
+  return isUserPermission(permission) ? permission.user.name : permission.userGroup.name
 }
 
 /** Get the property representing the id on an arbitrary variant of {@link UserPermission}. */
@@ -1170,8 +1186,8 @@ export function compareAssetPermissions(a: AssetPermission, b: AssetPermission)
   } else {
     // NOTE [NP]: Although `userId` is unique, and therefore sufficient to sort permissions, sort
     // name first, so that it's easier to find a permission in a long list (i.e., for readability).
-    const aName = 'user' in a ? a.user.name : a.userGroup.groupName
-    const bName = 'user' in b ? b.user.name : b.userGroup.groupName
+    const aName = 'user' in a ? a.user.name : a.userGroup.name
+    const bName = 'user' in b ? b.user.name : b.userGroup.name
     const aUserId = 'user' in a ? a.user.userId : a.userGroup.id
     const bUserId = 'user' in b ? b.user.userId : b.userGroup.id
     return (

app/gui/src/dashboard/components/dashboard/column/SharedWithColumn.tsx

@@ -1,16 +1,8 @@
 /** @file A column listing the users with which this asset is shared. */
-import * as React from 'react'
-
-import Plus2Icon from '#/assets/plus2.svg'
-import { Button } from '#/components/AriaComponents'
 import type { AssetColumnProps } from '#/components/dashboard/column'
 import PermissionDisplay from '#/components/dashboard/PermissionDisplay'
-import { useRemoveSelfPermissionMutation } from '#/hooks/backendHooks'
-import ManagePermissionsModal from '#/modals/ManagePermissionsModal'
-import { useFullUserSession } from '#/providers/AuthProvider'
-import { useSetModal } from '#/providers/ModalProvider'
 import { getAssetPermissionId, getAssetPermissionName } from '#/services/Backend'
-import { PermissionAction, tryFindSelfPermission } from '#/utilities/permissions'
+import { PermissionAction } from '#/utilities/permissions'
 
 // ========================
 // === SharedWithColumn ===
@@ -30,21 +22,10 @@ interface SharedWithColumnPropsInternal extends Pick<AssetColumnProps, 'item'> {
 
 /** A column listing the users with which this asset is shared. */
 export default function SharedWithColumn(props: SharedWithColumnPropsInternal) {
-  const { item, state, isReadonly = false } = props
-  const { backend, category, setQuery } = state
-
-  const { user } = useFullUserSession()
-
-  const removeSelfPermissionMutation = useRemoveSelfPermissionMutation(backend)
+  const { item, state } = props
+  const { category, setQuery } = state
 
   const assetPermissions = item.permissions ?? []
-  const { setModal } = useSetModal()
-  const self = tryFindSelfPermission(user, item.permissions)
-  const plusButtonRef = React.useRef<HTMLButtonElement>(null)
-  const managesThisAsset =
-    !isReadonly &&
-    category.type !== 'trash' &&
-    (self?.permission === PermissionAction.own || self?.permission === PermissionAction.admin)
 
   return (
     <div className="group flex items-center gap-column-items [content-visibility:auto]">
@@ -73,29 +54,6 @@ export default function SharedWithColumn(props: SharedWithColumnPropsInternal) {
           {getAssetPermissionName(other)}
         </PermissionDisplay>
       ))}
-      {managesThisAsset && (
-        <Button
-          ref={plusButtonRef}
-          size="medium"
-          variant="ghost"
-          icon={Plus2Icon}
-          showIconOnHover
-          onPress={() => {
-            setModal(
-              <ManagePermissionsModal
-                backend={backend}
-                category={category}
-                item={item}
-                self={self}
-                eventTarget={plusButtonRef.current}
-                doRemoveSelf={() => {
-                  removeSelfPermissionMutation.mutate(item.id)
-                }}
-              />,
-            )
-          }}
-        />
-      )}
     </div>
   )
 }

app/gui/src/dashboard/hooks/backendHooks.ts

@@ -638,7 +638,6 @@ export function useNewFolder(backend: Backend, category: Category) {
   const setSelectedAssets = useSetSelectedAssets()
   const { user } = useFullUserSession()
   const { data: users } = useBackendQuery(backend, 'listUsers', [])
-  const { data: userGroups } = useBackendQuery(backend, 'listUserGroups', [])
   const createDirectoryMutation = useMutation(backendMutationOptions(backend, 'createDirectory'))
 
   return useEventCallback(async (parentId: DirectoryId, parentPath: string | null | undefined) => {
@@ -658,7 +657,7 @@ export function useNewFolder(backend: Backend, category: Category) {
         category,
         user,
         users ?? [],
-        userGroups ?? [],
+        user.groups ?? [],
       ),
     )
 
@@ -681,7 +680,6 @@ export function useNewProject(backend: Backend, category: Category) {
 
   const { user } = useFullUserSession()
   const { data: users } = useBackendQuery(backend, 'listUsers', [])
-  const { data: userGroups } = useBackendQuery(backend, 'listUserGroups', [])
   const createProjectMutation = useMutation(backendMutationOptions(backend, 'createProject'))
 
   return useEventCallback(
@@ -721,7 +719,7 @@ export function useNewProject(backend: Backend, category: Category) {
           category,
           user,
           users ?? [],
-          userGroups ?? [],
+          user.groups ?? [],
         ),
         user,
         path,
@@ -759,7 +757,6 @@ export function useNewSecret(backend: Backend, category: Category) {
   const toggleDirectoryExpansion = useToggleDirectoryExpansion()
   const { user } = useFullUserSession()
   const { data: users } = useBackendQuery(backend, 'listUsers', [])
-  const { data: userGroups } = useBackendQuery(backend, 'listUserGroups', [])
   const createSecretMutation = useMutation(backendMutationOptions(backend, 'createSecret'))
 
   return useEventCallback(
@@ -778,7 +775,7 @@ export function useNewSecret(backend: Backend, category: Category) {
           category,
           user,
           users ?? [],
-          userGroups ?? [],
+          user.groups ?? [],
         ),
       )
 
@@ -798,7 +795,6 @@ export function useNewDatalink(backend: Backend, category: Category) {
   const toggleDirectoryExpansion = useToggleDirectoryExpansion()
   const { user } = useFullUserSession()
   const { data: users } = useBackendQuery(backend, 'listUsers', [])
-  const { data: userGroups } = useBackendQuery(backend, 'listUserGroups', [])
   const createDatalinkMutation = useMutation(backendMutationOptions(backend, 'createDatalink'))
 
   return useEventCallback(
@@ -817,7 +813,7 @@ export function useNewDatalink(backend: Backend, category: Category) {
           category,
           user,
           users ?? [],
-          userGroups ?? [],
+          user.groups ?? [],
         ),
       )
 

app/gui/src/dashboard/hooks/backendUploadFilesHooks.tsx

@@ -61,7 +61,6 @@ export function useUploadFiles(backend: Backend, category: Category) {
   const { setModal } = useSetModal()
   const { user } = useFullUserSession()
   const { data: users } = useBackendQuery(backend, 'listUsers', [])
-  const { data: userGroups } = useBackendQuery(backend, 'listUserGroups', [])
   const uploadFileMutation = useUploadFileWithToastMutation(backend)
   const setSelectedAssets = useSetSelectedAssets()
 
@@ -83,7 +82,7 @@ export function useUploadFiles(backend: Backend, category: Category) {
         category,
         user,
         users ?? [],
-        userGroups ?? [],
+        user.groups ?? [],
       )
       const files = reversedFiles.filter(fileIsNotProject).map((file) => {
         const asset = createPlaceholderFileAsset(

app/gui/src/dashboard/layouts/AssetContextMenu.tsx

@@ -4,7 +4,6 @@ import * as React from 'react'
 import * as reactQuery from '@tanstack/react-query'
 import * as toast from 'react-toastify'
 
-import * as billingHooks from '#/hooks/billing'
 import * as copyHooks from '#/hooks/copyHooks'
 import * as projectHooks from '#/hooks/projectHooks'
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
@@ -24,7 +23,6 @@ import Separator from '#/components/styled/Separator'
 
 import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
 import ManageLabelsModal from '#/modals/ManageLabelsModal'
-import ManagePermissionsModal from '#/modals/ManagePermissionsModal'
 
 import * as backendModule from '#/services/Backend'
 import * as localBackendModule from '#/services/LocalBackend'
@@ -36,7 +34,7 @@ import {
   downloadAssetsMutationOptions,
   restoreAssetsMutationOptions,
 } from '#/hooks/backendBatchedHooks'
-import { useNewProject, useRemoveSelfPermissionMutation } from '#/hooks/backendHooks'
+import { useNewProject } from '#/hooks/backendHooks'
 import { useUploadFileWithToastMutation } from '#/hooks/backendUploadFilesHooks'
 import { usePasteData } from '#/providers/DriveProvider'
 import { TEAMS_DIRECTORY_ID, USERS_DIRECTORY_ID } from '#/services/remoteBackendPaths'
@@ -64,7 +62,7 @@ export interface AssetContextMenuProps {
 
 /** The context menu for an arbitrary {@link backendModule.Asset}. */
 export default function AssetContextMenu(props: AssetContextMenuProps) {
-  const { innerProps, rootDirectoryId, event, eventTarget, hidden = false, triggerRef } = props
+  const { innerProps, rootDirectoryId, event, hidden = false, triggerRef } = props
   const { doCopy, doCut, doPaste } = props
   const { asset, path: pathRaw, state, setRowState } = innerProps
   const { backend, category, nodeMap } = state
@@ -84,7 +82,6 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
   const restoreAssetsMutation = reactQuery.useMutation(restoreAssetsMutationOptions(backend))
   const copyAssetsMutation = reactQuery.useMutation(copyAssetsMutationOptions(backend))
   const downloadAssetsMutation = reactQuery.useMutation(downloadAssetsMutationOptions(backend))
-  const removeSelfPermissionMutation = useRemoveSelfPermissionMutation(backend)
   const openProjectMutation = projectHooks.useOpenProjectMutation()
   const self = permissions.tryFindSelfPermission(user, asset.permissions)
   const isCloud = categoryModule.isCloudCategory(category)
@@ -102,9 +99,6 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
   const uploadFileToCloudMutation = useUploadFileWithToastMutation(remoteBackend)
   const disabledTooltip = !canOpenProjects ? getText('downloadToOpenWorkflow') : undefined
 
-  const { isFeatureUnderPaywall } = billingHooks.usePaywall({ plan: user.plan })
-  const isUnderPaywall = isFeatureUnderPaywall('share')
-
   const newProject = useNewProject(backend, category)
 
   const systemApi = window.systemApi
@@ -430,29 +424,6 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         )}
         {isCloud && <Separator hidden={hidden} />}
 
-        {isCloud && managesThisAsset && self != null && (
-          <PaywallContextMenuEntry
-            feature="share"
-            isUnderPaywall={isUnderPaywall}
-            action="share"
-            hidden={hidden}
-            doAction={() => {
-              setModal(
-                <ManagePermissionsModal
-                  backend={backend}
-                  category={category}
-                  item={asset}
-                  self={self}
-                  eventTarget={eventTarget}
-                  doRemoveSelf={() => {
-                    removeSelfPermissionMutation.mutate(asset.id)
-                  }}
-                />,
-              )
-            }}
-          />
-        )}
-
         {isCloud && (
           <ContextMenuEntry
             hidden={hidden}

app/gui/src/dashboard/layouts/AssetsTable.tsx

@@ -1722,7 +1722,11 @@ export function AssetsTableAssetsUnselector(props: AssetsTableAssetsUnselectorPr
     invariant(onlyChild != null, 'Children must be a single element when `asChild` is true')
     invariant(isValidElement(onlyChild), 'Children must be a JSX element when `asChild` is true')
 
-    return cloneElement(onlyChild, pressProps)
+    return cloneElement(
+      onlyChild,
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any, no-restricted-syntax
+      mergeProps<any>()(pressProps as any, onlyChild.props as any),
+    )
   }
 
   return (

app/gui/src/dashboard/layouts/CategorySwitcher.tsx

@@ -269,7 +269,7 @@ function CategorySwitcher(props: CategorySwitcherProps) {
             />
           )}
 
-          {teamCategories?.map((teamCategory) => (
+          {teamCategories.map((teamCategory) => (
             <CategorySwitcherItem
               key={teamCategory.id}
               {...itemProps}
@@ -278,8 +278,8 @@ function CategorySwitcher(props: CategorySwitcherProps) {
               icon={teamCategory.icon}
               label={teamCategory.label}
               isDisabled={isOffline}
-              buttonLabel={getText('teamCategoryButtonLabel', teamCategory.team.groupName)}
-              dropZoneLabel={getText('teamCategoryDropZoneLabel', teamCategory.team.groupName)}
+              buttonLabel={getText('teamCategoryButtonLabel', teamCategory.team.name)}
+              dropZoneLabel={getText('teamCategoryDropZoneLabel', teamCategory.team.name)}
             />
           ))}
 

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

@@ -16,8 +16,8 @@ import {
   type DirectoryId,
   type Path,
   type User,
+  type UserGroup,
   type UserGroupId,
-  type UserGroupInfo,
 } from '#/services/Backend'
 import { newDirectoryId } from '#/services/LocalBackend'
 
@@ -72,7 +72,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,
   })