Show platform roles in the user menu

src/core/apollo/generated/apollo-hooks.ts

@@ -18056,6 +18056,8 @@ export function refetchSubspacePageQuery(variables: SchemaTypes.SubspacePageQuer
 export const PlatformLevelAuthorizationDocument = gql`
   query PlatformLevelAuthorization {
     platform {
+      id
+      myRoles
       authorization {
         ...MyPrivileges
       }

src/core/apollo/generated/graphql-schema.ts

@@ -23536,6 +23536,8 @@ export type PlatformLevelAuthorizationQuery = {
   __typename?: 'Query';
   platform: {
     __typename?: 'Platform';
+    id: string;
+    myRoles: Array<PlatformRole>;
     authorization?:
       | { __typename?: 'Authorization'; myPrivileges?: Array<AuthorizationPrivilege> | undefined }
       | undefined;

src/core/i18n/en/translation.en.json

@@ -577,6 +577,13 @@
         "year": "{{count}} year",
         "year_plural": "{{count}} years"
       }
+    },
+    "roles": {
+      "GLOBAL_ADMIN": "Global Admin",
+      "SUPPORT": "Support",
+      "LICENSE_MANAGER": "License Manager",
+      "VC_CAMPAIGN": "VC Campaign",
+      "BETA_TESTER": "Beta Tester"
     }
   },
   "community": {
@@ -585,7 +592,7 @@
     "memberOrganizations": "Member Organizations ({{count}})",
     "pendingApplications": "Pending applications",
     "pendingMemberships": "Pending applications & invitations",
-    "invitationSent": "Invitation sent succesfully",
+    "invitationSent": "Invitation sent successfully",
     "leads": "Leads",
     "members": "Members",
     "host": "Host",

src/domain/community/user/providers/UserProvider/UserProvider.tsx

@@ -6,7 +6,12 @@ import {
   useUserProviderQuery,
 } from '@/core/apollo/generated/apollo-hooks';
 import { ErrorPage } from '@/core/pages/Errors/ErrorPage';
-import { AuthorizationPrivilege, LicenseEntitlementType, User } from '@/core/apollo/generated/graphql-schema';
+import {
+  AuthorizationPrivilege,
+  LicenseEntitlementType,
+  PlatformRole,
+  User,
+} from '@/core/apollo/generated/graphql-schema';
 import { useAuthenticationContext } from '@/core/auth/authentication/hooks/useAuthenticationContext';
 import { toUserMetadata, UserMetadata } from '../../hooks/useUserMetadataWrapper';
 
@@ -17,6 +22,7 @@ export interface UserContextValue {
   loadingMe: boolean; // Loading Authentication and Profile data. Once it's false that's enough for showing the page header and avatar.
   verified: boolean;
   isAuthenticated: boolean;
+  platformRoles: PlatformRole[];
   accountPrivileges: AuthorizationPrivilege[];
   accountEntitlements: LicenseEntitlementType[];
 }
@@ -28,6 +34,7 @@ const UserContext = createContext<UserContextValue>({
   loadingMe: true,
   verified: false,
   isAuthenticated: false,
+  platformRoles: [],
   accountPrivileges: [],
   accountEntitlements: [],
 });
@@ -75,6 +82,7 @@ const UserProvider: FC = ({ children }) => {
       loadingMe: loadingMeAndParentQueries,
       verified,
       isAuthenticated,
+      platformRoles: platformLevelAuthorizationData?.platform.myRoles ?? [],
       accountPrivileges: meData?.me.user?.account?.authorization?.myPrivileges ?? [],
       accountEntitlements: meData?.me.user?.account?.license?.myLicensePrivileges ?? [],
     }),

src/domain/platform/PlatformLevelAuthorization.graphql

@@ -1,5 +1,7 @@
 query PlatformLevelAuthorization {
   platform {
+    id
+    myRoles
     authorization {
       ...MyPrivileges
     }

src/main/ui/platformNavigation/PlatformNavigationUserMenu.tsx

@@ -16,7 +16,7 @@ import {
 import SettingsIcon from '@mui/icons-material/SettingsOutlined';
 import { AUTH_LOGOUT_PATH } from '@/core/auth/authentication/constants/authentication.constants';
 import { useTranslation } from 'react-i18next';
-import { AuthorizationPrivilege } from '@/core/apollo/generated/graphql-schema';
+import { AuthorizationPrivilege, PlatformRole } from '@/core/apollo/generated/graphql-schema';
 import { useUserContext } from '@/domain/community/user';
 import Gutters from '@/core/ui/grid/Gutters';
 import { ROUTE_HOME } from '@/domain/platform/routes/constants';
@@ -47,18 +47,31 @@ const PlatformNavigationUserMenu = forwardRef<HTMLDivElement, PropsWithChildren<
     const platformOrigin = usePlatformOrigin();
     const homeUrl = platformOrigin && `${platformOrigin}${ROUTE_HOME}`;
 
-    const { user: { user, hasPlatformPrivilege } = {}, isAuthenticated } = useUserContext();
+    const { user: { user, hasPlatformPrivilege } = {}, isAuthenticated, platformRoles } = useUserContext();
 
+    // todo: change with PlatformRole.GlobalAdmin?
     const isAdmin = hasPlatformPrivilege?.(AuthorizationPrivilege.PlatformAdmin);
 
     const [isHelpDialogOpen, setIsHelpDialogOpen] = useState(false);
 
-    const role = useMemo(() => {
-      if (isAdmin) {
-        // TODO change role name path
-        return t('common.enums.authorization-credentials.GLOBAL_ADMIN.name');
+    // the roles should follow the order
+    const roles = useMemo(() => {
+      const result: string[] = [];
+
+      if (platformRoles.includes(PlatformRole.GlobalAdmin)) {
+        result.push(t('common.roles.GLOBAL_ADMIN'));
+      }
+
+      if (platformRoles.includes(PlatformRole.VcCampaign)) {
+        result.push(t('common.roles.VC_CAMPAIGN'));
       }
-    }, [isAdmin, t]);
+
+      if (platformRoles.includes(PlatformRole.BetaTester)) {
+        result.push(t('common.roles.BETA_TESTER'));
+      }
+
+      return result.join(', ');
+    }, [platformRoles, t]);
 
     const Wrapper = surface ? GlobalMenuSurface : Box;
 
@@ -69,9 +82,9 @@ const PlatformNavigationUserMenu = forwardRef<HTMLDivElement, PropsWithChildren<
             <Gutters disableGap alignItems="center" sx={{ paddingBottom: 1 }}>
               <AlkemioAvatar size="lg" src={user.profile.avatar?.uri} />
               <BlockTitle lineHeight={gutters(2)}>{user.profile.displayName}</BlockTitle>
-              {role && (
+              {roles.length > 0 && (
                 <Caption color="neutralMedium.main" textTransform="uppercase">
-                  {role}
+                  {roles}
                 </Caption>
               )}
             </Gutters>