Restructure MIs to more generic Identity

frontend/src/context/OrgPermissionContext/types.ts

@@ -16,7 +16,7 @@ export enum OrgPermissionSubjects {
   Sso = "sso",
   Billing = "billing",
   SecretScanning = "secret-scanning",
-  MachineIdentity = "machine-identity"
+  Identity = "identity"
 }
 
 export type OrgPermissionSet =
@@ -29,6 +29,6 @@ export type OrgPermissionSet =
   | [OrgPermissionActions, OrgPermissionSubjects.Sso]
   | [OrgPermissionActions, OrgPermissionSubjects.SecretScanning]
   | [OrgPermissionActions, OrgPermissionSubjects.Billing]
-  | [OrgPermissionActions, OrgPermissionSubjects.MachineIdentity];
+  | [OrgPermissionActions, OrgPermissionSubjects.Identity];
 
 export type TOrgPermission = MongoAbility<OrgPermissionSet>;

frontend/src/context/ProjectPermissionContext/types.ts

@@ -23,7 +23,7 @@ export enum ProjectPermissionSub {
   SecretRollback = "secret-rollback",
   SecretApproval = "secret-approval",
   SecretRotation = "secret-rotation",
-  MachineIdentity = "machine-identity"
+  Identity = "identity"
 }
 
 type SubjectFields = {
@@ -45,7 +45,7 @@ export type ProjectPermissionSet =
   | [ProjectPermissionActions, ProjectPermissionSub.Environments]
   | [ProjectPermissionActions, ProjectPermissionSub.IpAllowList]
   | [ProjectPermissionActions, ProjectPermissionSub.Settings]
-  | [ProjectPermissionActions, ProjectPermissionSub.MachineIdentity]
+  | [ProjectPermissionActions, ProjectPermissionSub.Identity]
   | [ProjectPermissionActions, ProjectPermissionSub.ServiceTokens]
   | [ProjectPermissionActions, ProjectPermissionSub.SecretApproval]
   | [ProjectPermissionActions, ProjectPermissionSub.SecretRotation]

frontend/src/hooks/api/auditLogs/constants.tsx

@@ -16,9 +16,17 @@ export const eventToNameMap: { [K in EventType]: string } = {
     [EventType.DELETE_TRUSTED_IP]: "Delete trusted IP",
     [EventType.CREATE_SERVICE_TOKEN]: "Create service token",
     [EventType.DELETE_SERVICE_TOKEN]: "Delete service token",
-    [EventType.CREATE_MACHINE_IDENTITY]: "Create machine identity",
-    [EventType.UPDATE_MACHINE_IDENTITY]: "Update machine identity",
-    [EventType.DELETE_MACHINE_IDENTITY]: "Delete machine identity",
+    [EventType.CREATE_IDENTITY]: "Create identity",
+    [EventType.UPDATE_IDENTITY]: "Update identity",
+    [EventType.DELETE_IDENTITY]: "Delete identity",
+    [EventType.LOGIN_IDENTITY_UNIVERSAL_AUTH]: "Login via universal auth",
+    [EventType.ADD_IDENTITY_UNIVERSAL_AUTH]: "Add universal auth",
+    [EventType.UPDATE_IDENTITY_UNIVERSAL_AUTH]: "Update universal auth",
+    [EventType.GET_IDENTITY_UNIVERSAL_AUTH]: "Get universal auth",
+    [EventType.CREATE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET]: "Create universal auth client secret",
+    [EventType.REVOKE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET]: "Revoke universal auth client secret",
+    [EventType.GET_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRETS]: "Get universal auth client secrets",
+    [EventType.GET_IDENTITY_UNIVERSAL_AUTH]: "Get universal auth",
     [EventType.CREATE_ENVIRONMENT]: "Create environment",
     [EventType.UPDATE_ENVIRONMENT]: "Update environment",
     [EventType.DELETE_ENVIRONMENT]: "Delete environment",

frontend/src/hooks/api/auditLogs/enums.tsx

@@ -1,7 +1,7 @@
 export enum ActorType {
   USER = "user",
   SERVICE = "service",
-  MACHINE = "machine"
+  IDENTITY = "identity"
 }
 
 export enum UserAgentType {
@@ -27,9 +27,16 @@ export enum EventType {
   DELETE_TRUSTED_IP = "delete-trusted-ip",
   CREATE_SERVICE_TOKEN = "create-service-token", // v2
   DELETE_SERVICE_TOKEN = "delete-service-token", // v2
-  CREATE_MACHINE_IDENTITY = "create-machine-identity",
-  UPDATE_MACHINE_IDENTITY = "update-machine-identity",
-  DELETE_MACHINE_IDENTITY = "delete-machine-identity",
+  CREATE_IDENTITY = "create-identity",
+  UPDATE_IDENTITY = "update-identity",
+  DELETE_IDENTITY = "delete-identity",
+  LOGIN_IDENTITY_UNIVERSAL_AUTH = "login-identity-universal-auth",
+  ADD_IDENTITY_UNIVERSAL_AUTH = "add-identity-universal-auth",
+  UPDATE_IDENTITY_UNIVERSAL_AUTH = "update-identity-universal-auth",
+  GET_IDENTITY_UNIVERSAL_AUTH = "get-identity-universal-auth",
+  CREATE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET = "create-identity-universal-auth-client-secret",
+  REVOKE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET =  "revoke-identity-universal-auth-client-secret",
+  GET_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRETS = "get-identity-universal-auth-client-secret",
   CREATE_ENVIRONMENT = "create-environment",
   UPDATE_ENVIRONMENT = "update-environment",
   DELETE_ENVIRONMENT = "delete-environment",

frontend/src/hooks/api/auditLogs/types.tsx

@@ -1,3 +1,4 @@
+import { IdentityTrustedIp } from "../identities/types";
 import { ActorType, EventType, UserAgentType } from "./enums";
 
 interface UserActorMetadata {
@@ -10,8 +11,8 @@ interface ServiceActorMetadata {
   name: string;
 }
 
-interface MachineActorMetadata {
-  machineId: string;
+interface IdentityActorMetadata {
+  identityId: string;
   name: string;
 }
 
@@ -25,12 +26,12 @@ export interface ServiceActor {
   metadata: ServiceActorMetadata;
 }
 
-export interface MachineActor {
-  type: ActorType.MACHINE;
-  metadata: MachineActorMetadata;
+export interface IdentityActor {
+  type: ActorType.IDENTITY;
+  metadata: IdentityActorMetadata;
 }
 
-export type Actor = UserActor | ServiceActor | MachineActor;
+export type Actor = UserActor | ServiceActor | IdentityActor;
 
 interface GetSecretsEvent {
   type: EventType.GET_SECRETS;
@@ -193,34 +194,91 @@ interface DeleteServiceTokenEvent {
   };
 }
 
-interface CreateMachineIdentityEvent {
-    type: EventType.CREATE_MACHINE_IDENTITY;
-    metadata: {
-        name: string;
-        isActive: boolean;
-        role: string;
-        expiresAt?: Date;
-    }
+interface CreateIdentityEvent { // note: currently not logging org-role
+  type: EventType.CREATE_IDENTITY;
+  metadata: {
+    identityId: string;
+    name: string;
+  };
 }
 
-interface UpdateMachineIdentityEvent {
-    type: EventType.UPDATE_MACHINE_IDENTITY;
-    metadata: {
-        name?: string;
-        isActive?: boolean;
-        role?: string;
-        expiresAt?: Date;
-    }
+interface UpdateIdentityEvent {
+  type: EventType.UPDATE_IDENTITY;
+  metadata: {
+    identityId: string;
+    name?: string;
+  };
 }
 
-interface DeleteMachineIdentityEvent {
-    type: EventType.DELETE_MACHINE_IDENTITY;
-    metadata: {
-        name: string;
-        isActive: boolean;
-        role?: string;
-        expiresAt?: Date;
-    }
+interface DeleteIdentityEvent {
+  type: EventType.DELETE_IDENTITY;
+  metadata: {
+    identityId: string;
+  };
+}
+
+interface LoginIdentityUniversalAuthEvent {
+  type: EventType.LOGIN_IDENTITY_UNIVERSAL_AUTH ;
+  metadata: {
+    identityId: string;
+    clientSecretId: string;
+    identityAccessTokenId: string;
+  };
+}
+
+interface AddIdentityUniversalAuthEvent {
+  type: EventType.ADD_IDENTITY_UNIVERSAL_AUTH;
+  metadata: {
+    identityId: string;
+    clientSecretTrustedIps: Array<IdentityTrustedIp>;
+    accessTokenTTL: number;
+    accessTokenMaxTTL: number;
+    accessTokenNumUsesLimit: number;
+    accessTokenTrustedIps: Array<IdentityTrustedIp>;
+  };
+}
+
+interface UpdateIdentityUniversalAuthEvent {
+  type: EventType.UPDATE_IDENTITY_UNIVERSAL_AUTH;
+  metadata: {
+    identityId: string;
+    clientSecretTrustedIps?: Array<IdentityTrustedIp>;
+    accessTokenTTL?: number;
+    accessTokenMaxTTL?: number;
+    accessTokenNumUsesLimit?: number;
+    accessTokenTrustedIps?: Array<IdentityTrustedIp>;
+  };
+}
+
+interface GetIdentityUniversalAuthEvent {
+  type: EventType.GET_IDENTITY_UNIVERSAL_AUTH;
+  metadata: {
+    identityId: string;
+  };
+}
+
+interface CreateIdentityUniversalAuthClientSecretEvent {
+  type: EventType.CREATE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET ;
+  metadata: {
+    identityId: string;
+    clientSecretId: string;
+  };
+}
+
+interface GetIdentityUniversalAuthClientSecretsEvent {
+  type: EventType.GET_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRETS;
+  metadata: {
+    identityId: string;
+  };
+}
+
+
+interface RevokeIdentityUniversalAuthClientSecretEvent {
+  type: EventType.REVOKE_IDENTITY_UNIVERSAL_AUTH_CLIENT_SECRET ;
+  metadata: {
+    identityId: string;
+    clientSecretId: string;
+  };
 }
 
 interface CreateEnvironmentEvent {
@@ -419,9 +477,16 @@ export type Event =
   | DeleteTrustedIPEvent
   | CreateServiceTokenEvent
   | DeleteServiceTokenEvent
-  | CreateMachineIdentityEvent
-  | UpdateMachineIdentityEvent
-  | DeleteMachineIdentityEvent
+  | CreateIdentityEvent
+  | UpdateIdentityEvent
+  | DeleteIdentityEvent
+  | LoginIdentityUniversalAuthEvent
+  | AddIdentityUniversalAuthEvent
+  | UpdateIdentityUniversalAuthEvent
+  | GetIdentityUniversalAuthEvent
+  | CreateIdentityUniversalAuthClientSecretEvent
+  | GetIdentityUniversalAuthClientSecretsEvent
+  | RevokeIdentityUniversalAuthClientSecretEvent
   | CreateEnvironmentEvent
   | UpdateEnvironmentEvent
   | DeleteEnvironmentEvent

frontend/src/hooks/api/identities/constants.tsx

@@ -0,0 +1,5 @@
+import { IdentityAuthMethod } from "./enums";
+
+export const identityAuthToNameMap: { [I in IdentityAuthMethod]: string } = {
+    [IdentityAuthMethod.UNIVERSAL_AUTH]: "Universal Auth"
+};

frontend/src/hooks/api/identities/enums.tsx

@@ -0,0 +1,3 @@
+export enum IdentityAuthMethod {
+    UNIVERSAL_AUTH = "universal-auth"
+}

frontend/src/hooks/api/identities/index.tsx

@@ -0,0 +1,14 @@
+export { identityAuthToNameMap } from "./constants";
+export { IdentityAuthMethod } from "./enums";
+export {
+    useAddIdentityUniversalAuth,
+    useCreateIdentity,
+    useCreateIdentityUniversalAuthClientSecret,
+    useDeleteIdentity,
+    useDeleteIdentityUniversalAuthClientSecret,
+    useUpdateIdentity,
+    useUpdateIdentityUniversalAuth} from "./mutations";
+export {
+    useGetIdentityUniversalAuth,
+    useGetIdentityUniversalAuthClientSecrets
+} from "./queries";

frontend/src/hooks/api/identities/mutations.tsx

@@ -0,0 +1,163 @@
+import { useMutation, useQueryClient } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { organizationKeys } from "../organization/queries";
+import { identitiesKeys } from "./queries";
+import { 
+    AddIdentityUniversalAuthDTO,
+    CreateIdentityDTO, 
+    CreateIdentityUniversalAuthClientSecretDTO,
+    CreateIdentityUniversalAuthClientSecretRes,
+    DeleteIdentityDTO,
+    DeleteIdentityUniversalAuthClientSecretDTO,
+    Identity,
+    IdentityUniversalAuth,
+    UpdateIdentityDTO,
+    UpdateIdentityUniversalAuthDTO} from "./types";
+
+export const useCreateIdentity = () => {
+    const queryClient = useQueryClient();
+    return useMutation<Identity, {}, CreateIdentityDTO>({
+        mutationFn: async (body) => {
+            const { data: { identity } } = await apiRequest.post("/api/v1/identities/", body);
+            return identity;
+        },
+        onSuccess: (_, { organizationId }) => {
+            queryClient.invalidateQueries(organizationKeys.getOrgIdentityMemberships(organizationId));
+        }
+    });
+};
+
+export const useUpdateIdentity = () => {
+    const queryClient = useQueryClient();
+    return useMutation<Identity, {}, UpdateIdentityDTO>({
+        mutationFn: async ({
+            identityId,
+            name,
+            role
+        }) => {
+            
+            const { data: { identity } } = await apiRequest.patch(`/api/v1/identities/${identityId}`, {
+                name,
+                role
+            });
+
+            return identity;
+        },
+        onSuccess: (_, { organizationId }) => {
+            queryClient.invalidateQueries(organizationKeys.getOrgIdentityMemberships(organizationId));
+        }
+    });
+}
+
+export const useDeleteIdentity = () => {
+    const queryClient = useQueryClient();
+    return useMutation<Identity, {}, DeleteIdentityDTO>({
+        mutationFn: async ({
+            identityId,
+        }) => {
+            const { data: { identity } } = await apiRequest.delete(`/api/v1/identities/${identityId}`);
+            return identity;
+        },
+        onSuccess: (_, { organizationId }) => {
+            queryClient.invalidateQueries(organizationKeys.getOrgIdentityMemberships(organizationId));
+        }
+    });
+};
+
+// TODO: move these to /auth
+
+export const useAddIdentityUniversalAuth = () => {
+    const queryClient = useQueryClient();
+    return useMutation<IdentityUniversalAuth, {}, AddIdentityUniversalAuthDTO>({
+        mutationFn: async ({
+            identityId,
+            clientSecretTrustedIps,
+            accessTokenTTL,
+            accessTokenMaxTTL,
+            accessTokenNumUsesLimit,
+            accessTokenTrustedIps,
+        }) => {
+            const { data: { identityUniversalAuth } } = await apiRequest.post(`/api/v1/auth/universal-auth/identities/${identityId}`,
+                {
+                    clientSecretTrustedIps,
+                    accessTokenTTL,
+                    accessTokenMaxTTL,
+                    accessTokenNumUsesLimit,
+                    accessTokenTrustedIps,
+                }
+            );
+            return identityUniversalAuth;
+        },
+        onSuccess: (_, { organizationId }) => {
+            queryClient.invalidateQueries(organizationKeys.getOrgIdentityMemberships(organizationId));
+        }
+    });
+};
+
+export const useUpdateIdentityUniversalAuth = () => {
+    const queryClient = useQueryClient();
+    return useMutation<IdentityUniversalAuth, {}, UpdateIdentityUniversalAuthDTO>({
+        mutationFn: async ({
+            identityId,
+            clientSecretTrustedIps,
+            accessTokenTTL,
+            accessTokenMaxTTL,
+            accessTokenNumUsesLimit,
+            accessTokenTrustedIps,
+        }) => {
+            const { data: { identityUniversalAuth } } = await apiRequest.patch(`/api/v1/auth/universal-auth/identities/${identityId}`,
+                {
+                    clientSecretTrustedIps,
+                    accessTokenTTL,
+                    accessTokenMaxTTL,
+                    accessTokenNumUsesLimit,
+                    accessTokenTrustedIps,
+                }
+            );
+            return identityUniversalAuth;
+        },
+        onSuccess: (_, { organizationId }) => {
+            queryClient.invalidateQueries(organizationKeys.getOrgIdentityMemberships(organizationId));
+        }
+    });
+};
+
+export const useCreateIdentityUniversalAuthClientSecret = () => {
+    const queryClient = useQueryClient();
+    return useMutation<CreateIdentityUniversalAuthClientSecretRes, {}, CreateIdentityUniversalAuthClientSecretDTO>({
+        mutationFn: async ({
+            identityId,
+            description,
+            ttl,
+            numUsesLimit
+        }) => {
+            const { data } = await apiRequest.post(`/api/v1/auth/universal-auth/identities/${identityId}/client-secrets`, {
+                description,
+                ttl,
+                numUsesLimit
+            });
+            return data;
+        },
+        onSuccess: (_, { identityId }) => {
+            queryClient.invalidateQueries(identitiesKeys.getIdentityUniversalAuthClientSecrets(identityId));
+        }
+    });
+};
+
+export const useDeleteIdentityUniversalAuthClientSecret = () => {
+    const queryClient = useQueryClient();
+    return useMutation<Identity, {}, DeleteIdentityUniversalAuthClientSecretDTO>({
+        mutationFn: async ({
+            identityId,
+            clientSecretId
+        }) => {
+            const { data: { identity } } = await apiRequest.delete(`/api/v1/auth/universal-auth/identities/${identityId}/client-secrets/${clientSecretId}`);
+            return identity;
+        },
+        onSuccess: (_, { identityId }) => {
+            queryClient.invalidateQueries(identitiesKeys.getIdentityUniversalAuthClientSecrets(identityId));
+        }
+    });
+};

frontend/src/hooks/api/identities/queries.tsx

@@ -0,0 +1,40 @@
+import { useQuery } from "@tanstack/react-query";
+
+import { apiRequest } from "@app/config/request";
+
+import { ClientSecretData , IdentityUniversalAuth } from "./types";
+
+export const identitiesKeys = {
+    getIdentityUniversalAuth: (identityId: string) => [{ identityId }, "identity-universal-auth"] as const,
+    getIdentityUniversalAuthClientSecrets: (identityId: string) => [{ identityId }, "identity-universal-auth-client-secrets"] as const
+}
+
+export const useGetIdentityUniversalAuth = (identityId: string) => {
+    return useQuery({
+        queryKey: identitiesKeys.getIdentityUniversalAuth(identityId),
+        queryFn: async () => {
+            if (identityId === "") return undefined;
+
+            const { data: { identityUniversalAuth } } = await apiRequest.get<{ identityUniversalAuth: IdentityUniversalAuth }>(
+                `/api/v1/auth/universal-auth/identities/${identityId}`
+            );
+        
+            return identityUniversalAuth;
+        }
+    });
+}
+
+export const useGetIdentityUniversalAuthClientSecrets = (identityId: string) => {
+    return useQuery({
+        queryKey: identitiesKeys.getIdentityUniversalAuthClientSecrets(identityId),
+        queryFn: async () => {
+            if (identityId === "") return [];
+
+            const { data: { clientSecretData } } = await apiRequest.get<{ clientSecretData: ClientSecretData[] }>(
+                `/api/v1/auth/universal-auth/identities/${identityId}/client-secrets`
+            );
+        
+            return clientSecretData;
+        }
+    });
+}

frontend/src/hooks/api/identities/types.ts

@@ -1,29 +1,108 @@
 import { TRole } from "../roles/types";
+import { IdentityAuthMethod } from "./enums";
 
-export type MachineTrustedIp = {
+export type IdentityTrustedIp = {
     _id: string;
     ipAddress: string;
     type: "ipv4" | "ipv6";
     prefix?: number;
 }
 
-export type MachineIdentity = {
+export type Identity = {
     _id: string;
-    clientId: string;
     name: string;
-    organization: string;
-    accessTokenTTL: number;
-    accessTokenMaxTTL: number;
-    accessTokenNumUsesLimit: number;
-    clientSecretTrustedIps: MachineTrustedIp[];
-    accessTokenTrustedIps: MachineTrustedIp[];
+    authMethod?: IdentityAuthMethod;
     createdAt: string;
     updatedAt: string;
 };
 
-export type MachineIdentityClientSecret = {
+export type IdentityMembershipOrg = {
     _id: string;
-    machineIdentity: string;
+    identity: Identity;
+    organization: string;
+    role: "admin" | "member" | "viewer" | "no-access" | "custom";
+    customRole?: TRole<string>;
+    createdAt: string;
+    updatedAt: string;
+}
+
+export type IdentityMembership = {
+    _id: string;
+    identity: Identity;
+    organization: string;
+    role: "admin" | "member" | "viewer" | "no-access" | "custom";
+    customRole?: TRole<string>;
+    createdAt: string;
+    updatedAt: string;
+}
+
+export type CreateIdentityDTO = {
+    name: string;
+    organizationId: string;
+    role?: string;
+}
+
+export type UpdateIdentityDTO = {
+    identityId: string;
+    name?: string;
+    role?: string;
+    organizationId: string;
+}
+
+export type DeleteIdentityDTO = {
+    identityId: string;
+    organizationId: string;
+}
+
+export type IdentityUniversalAuth = {
+    identityId: string;
+    clientId: string;
+    clientSecretTrustedIps: IdentityTrustedIp[];
+    accessTokenTTL: number;
+    accessTokenMaxTTL: number;
+    accessTokenNumUsesLimit: number;
+    accessTokenTrustedIps: IdentityTrustedIp[];
+}
+
+export type AddIdentityUniversalAuthDTO = {
+    organizationId: string;
+    identityId: string;
+    clientSecretTrustedIps: {
+        ipAddress: string;
+    }[];
+    accessTokenTTL: number;
+    accessTokenMaxTTL: number;
+    accessTokenNumUsesLimit: number;
+    accessTokenTrustedIps: {
+        ipAddress: string;
+    }[];
+}
+
+export type UpdateIdentityUniversalAuthDTO = {
+    organizationId: string;
+    identityId: string;
+    clientSecretTrustedIps?: {
+        ipAddress: string;
+    }[];
+    accessTokenTTL?: number;
+    accessTokenMaxTTL?: number;
+    accessTokenNumUsesLimit?: number;
+    accessTokenTrustedIps?: {
+        ipAddress: string;
+    }[];
+}
+
+export type CreateIdentityUniversalAuthClientSecretDTO = {
+    identityId: string;
+    description?: string;
+    ttl?: number;
+    numUsesLimit?: number;
+}
+
+export type ClientSecretData = {
+    _id: string;
+    identityUniversalAuth: string;
+    isClientSecretRevoked: boolean;
     description: string;
     clientSecretPrefix: string;
     clientSecretNumUses: number;
@@ -31,80 +110,14 @@ export type MachineIdentityClientSecret = {
     clientSecretTTL: number;
     createdAt: string;
     updatedAt: string;
-    isClientSecretRevoked: boolean;
 }
 
-export type MachineMembershipOrg = {
-    _id: string;
-    machineIdentity: MachineIdentity;
-    organization: string;
-    role: "admin" | "member" | "viewer" | "no-access" | "custom";
-    customRole?: TRole<string>;
-    createdAt: string;
-    updatedAt: string;
-}
-
-export type MachineMembership = {
-    _id: string;
-    machineIdentity: MachineIdentity;
-    organization: string;
-    role: "admin" | "member" | "viewer" | "no-access" | "custom";
-    customRole?: TRole<string>;
-    createdAt: string;
-    updatedAt: string;
-}
-
-export type CreateMachineIdentityDTO = {
-    name: string;
-    organizationId: string;
-    role?: string;
-    clientSecretTrustedIps: {
-      ipAddress: string;
-    }[];
-    accessTokenTrustedIps: {
-      ipAddress: string;
-    }[];
-    accessTokenTTL: number;
-    accessTokenMaxTTL: number;
-    accessTokenNumUsesLimit: number;
-}
-
-export type CreateMachineIdentityClientSecretDTO = {
-    machineId: string;
-    description?: string;
-    ttl?: number;
-    numUsesLimit?: number;
-}
-
-export type CreateMachineIdentityClientSecretRes = {
+export type CreateIdentityUniversalAuthClientSecretRes = {
     clientSecret: string;
-    machineIdentity: string;
-    isActive: boolean;
-    description: string;
-    clientSecretNumUses: number;
-    clientSecretNumUsesLimit: number;
-    expiresAt?: Date;
+    clientSecretData: ClientSecretData;
 }
 
-export type CreateMachineIdentityRes = {
-    machineIdentity: MachineIdentity;
-}
-
-export type UpdateMachineIdentityDTO = {
-    machineId: string;
-    name?: string;
-    role?: string;
-    clientSecretTrustedIps?: {
-        ipAddress: string;
-    }[];
-    accessTokenTrustedIps?: {
-        ipAddress: string;
-    }[];
-    accessTokenTTL?: number;
-    accessTokenMaxTTL?: number;
-    accessTokenNumUsesLimit?: number;
-}
-
-export type DeleteMachineIdentityDTO = {
-    machineId: string;
+export type DeleteIdentityUniversalAuthClientSecretDTO = {
+    identityId: string;
+    clientSecretId: string;
 }

frontend/src/hooks/api/index.tsx

@@ -3,11 +3,11 @@ export * from "./apiKeys";
 export * from "./auditLogs";
 export * from "./auth";
 export * from "./bots";
+export * from "./identities";
 export * from "./incidentContacts";
 export * from "./integrationAuth";
 export * from "./integrations";
 export * from "./keys";
-export * from "./machineIdentities";
 export * from "./organization";
 export * from "./roles";
 export * from "./secretApproval";

frontend/src/hooks/api/machineIdentities/index.tsx

@@ -1,9 +0,0 @@
-export {
-    useCreateMachineIdentity,
-    useCreateMachineIdentityClientSecret,
-    useDeleteMachineIdentity,
-    useDeleteMachineIdentityClientSecret,
-    useUpdateMachineIdentity} from "./mutations";
-export {
-    useGetMachineIdentityClientSecrets
-} from "./queries";

frontend/src/hooks/api/machineIdentities/mutations.tsx

@@ -1,119 +0,0 @@
-import { useMutation, useQueryClient } from "@tanstack/react-query";
-
-import { apiRequest } from "@app/config/request";
-
-import { organizationKeys } from "../organization/queries";
-import { machineIdentityKeys } from "./queries";
-import {
-    CreateMachineIdentityClientSecretDTO,
-    CreateMachineIdentityClientSecretRes,
-    CreateMachineIdentityDTO,
-    CreateMachineIdentityRes,
-    DeleteMachineIdentityDTO,
-    MachineIdentity,
-    UpdateMachineIdentityDTO,
-} from "./types";
-
-export const useCreateMachineIdentity = () => {
-    const queryClient = useQueryClient();
-    return useMutation<CreateMachineIdentityRes, {}, CreateMachineIdentityDTO>({
-        mutationFn: async (body) => {
-            const { data } = await apiRequest.post("/api/v1/machine-identities/", body);
-            return data;
-        },
-        onSuccess: ({ machineIdentity }) => {
-            queryClient.invalidateQueries(organizationKeys.getOrgServiceMemberships(machineIdentity.organization));
-        }
-    });
-};
-
-export const useCreateMachineIdentityClientSecret = () => {
-    const queryClient = useQueryClient();
-    return useMutation<CreateMachineIdentityClientSecretRes, {}, CreateMachineIdentityClientSecretDTO>({
-        mutationFn: async ({
-            machineId,
-            description,
-            ttl,
-            numUsesLimit
-        }) => {
-
-            const { data } = await apiRequest.post(`/api/v1/machine-identities/${machineId}/client-secrets`, {
-                machineId,
-                description,
-                ttl,
-                numUsesLimit
-            });
-
-            return data;
-        },
-        onSuccess: (_, { machineId }) => {
-            queryClient.invalidateQueries(machineIdentityKeys.getMachineIdentityClientSecrets(machineId));
-        }
-    });
-};
-
-export const useDeleteMachineIdentityClientSecret = () => {
-    const queryClient = useQueryClient();
-    return useMutation({
-        mutationFn: async ({
-            machineId,
-            clientSecretId
-        }: {
-            machineId:string;
-            clientSecretId: string;
-        }) => {
-            const { data } = await apiRequest.post(`/api/v1/machine-identities/${machineId}/client-secrets/${clientSecretId}/revoke`);
-            return data;
-        },
-        onSuccess: (_, { machineId }) => {
-            queryClient.invalidateQueries(machineIdentityKeys.getMachineIdentityClientSecrets(machineId));
-        }
-    });
-};
-
-export const useUpdateMachineIdentity = () => {
-    const queryClient = useQueryClient();
-    return useMutation<MachineIdentity, {}, UpdateMachineIdentityDTO>({
-        mutationFn: async ({
-            machineId,
-            name,
-            role,
-            clientSecretTrustedIps,
-            accessTokenTrustedIps,
-            accessTokenTTL,
-            accessTokenNumUsesLimit,
-            accessTokenMaxTTL
-        }) => {
-            
-            const { data: { machineIdentity } } = await apiRequest.patch(`/api/v1/machine-identities/${machineId}`, {
-                name,
-                role,
-                clientSecretTrustedIps,
-                accessTokenTrustedIps,
-                accessTokenTTL,
-                accessTokenNumUsesLimit,
-                accessTokenMaxTTL
-            });
-
-            return machineIdentity;
-        },
-        onSuccess: ({ organization }) => {
-            queryClient.invalidateQueries(organizationKeys.getOrgServiceMemberships(organization));
-        }
-    });
-};
-
-export const useDeleteMachineIdentity = () => {
-    const queryClient = useQueryClient();
-    return useMutation<MachineIdentity, {}, DeleteMachineIdentityDTO>({
-        mutationFn: async ({
-            machineId
-        }) => {
-            const { data: { machineIdentity } } = await apiRequest.delete(`/api/v1/machine-identities/${machineId}`);
-            return machineIdentity;
-        },
-        onSuccess: ({ organization }) => {
-            queryClient.invalidateQueries(organizationKeys.getOrgServiceMemberships(organization));
-        }
-    });
-};

frontend/src/hooks/api/machineIdentities/queries.tsx

@@ -1,26 +0,0 @@
-import { useQuery } from "@tanstack/react-query";
-
-import { apiRequest } from "@app/config/request";
-
-import {
-    MachineIdentityClientSecret
-} from "./types";
-
-export const machineIdentityKeys = {
-    getMachineIdentityClientSecrets: (machineId: string) => [{ machineId }, "machine-identity-client-secrets"] as const
-}
-
-export const useGetMachineIdentityClientSecrets = (machineId: string) => {
-    return useQuery({
-        queryKey: machineIdentityKeys.getMachineIdentityClientSecrets(machineId),
-        queryFn: async () => {
-            if (machineId === "") return [];
-
-            const { data: { clientSecretData } } = await apiRequest.get<{ clientSecretData: MachineIdentityClientSecret[] }>(
-                `/api/v1/machine-identities/${machineId}/client-secrets`
-            );
-        
-            return clientSecretData;
-        }
-    });
-}

frontend/src/hooks/api/organization/index.ts

@@ -6,7 +6,7 @@ export {
     useDeleteOrgById,
     useDeleteOrgPmtMethod,
     useDeleteOrgTaxId,
-    useGetMachineMembershipOrgs,
+    useGetIdentityMembershipOrgs,
     useGetOrganizations, 
     useGetOrgBillingDetails,
     useGetOrgInvoices,
@@ -18,4 +18,5 @@ export {
     useGetOrgTaxIds,
     useGetOrgTrialUrl,
     useRenameOrg, 
-    useUpdateOrgBillingDetails} from "./queries";
+    useUpdateOrgBillingDetails
+} from "./queries";

frontend/src/hooks/api/organization/queries.tsx

@@ -2,7 +2,7 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 import { apiRequest } from "@app/config/request";
 
-import { MachineMembershipOrg } from "../machineIdentities/types";
+import { IdentityMembershipOrg } from "../identities/types";
 import {
   BillingDetails,
   Invoice,
@@ -27,7 +27,7 @@ export const organizationKeys = {
   getOrgTaxIds: (orgId: string) => [{ orgId }, "organization-tax-ids"] as const,
   getOrgInvoices: (orgId: string) => [{ orgId }, "organization-invoices"] as const,
   getOrgLicenses: (orgId: string) => [{ orgId }, "organization-licenses"] as const,
-  getOrgServiceMemberships: (orgId: string) => [{ orgId }, "organization-service-memberships"] as const,
+  getOrgIdentityMemberships: (orgId: string) => [{ orgId }, "organization-identity-memberships"] as const,
 };
 
 export const fetchOrganizations = async () => {
@@ -351,17 +351,17 @@ export const useGetOrgLicenses = (organizationId: string) => {
   });
 };
 
-export const useGetMachineMembershipOrgs = (organizationId: string) => {
+export const useGetIdentityMembershipOrgs = (organizationId: string) => {
   return useQuery({
-    queryKey: organizationKeys.getOrgServiceMemberships(organizationId),
+    queryKey: organizationKeys.getOrgIdentityMemberships(organizationId),
     queryFn: async () => {
       const {
-        data: { machineMemberships }
-      } = await apiRequest.get<{ machineMemberships: MachineMembershipOrg[] }>(
-        `/api/v2/organizations/${organizationId}/machine-memberships`
+        data: { identityMemberships }
+      } = await apiRequest.get<{ identityMemberships: IdentityMembershipOrg[] }>(
+        `/api/v2/organizations/${organizationId}/identity-memberships`
       );
 
-      return machineMemberships;
+      return identityMemberships;
     },
     enabled: true
   });

frontend/src/hooks/api/workspace/index.tsx

@@ -1,9 +1,9 @@
 export {
-  useAddMachineToWorkspace,
+  useAddIdentityToWorkspace,
   useAddUserToWorkspace,
   useCreateWorkspace,
   useCreateWsEnvironment,
-  useDeleteMachineFromWorkspace,
+  useDeleteIdentityFromWorkspace,
   useDeleteUserFromWorkspace,
   useDeleteWorkspace,
   useDeleteWsEnvironment,
@@ -11,15 +11,15 @@ export {
   useGetUserWorkspaces,
   useGetWorkspaceAuthorizations,
   useGetWorkspaceById,
+  useGetWorkspaceIdentityMemberships,
   useGetWorkspaceIndexStatus,
   useGetWorkspaceIntegrations,
-  useGetWorkspaceMachineMemberships,
   useGetWorkspaceSecrets,
   useGetWorkspaceUsers,
   useNameWorkspaceSecrets,
   useRenameWorkspace,
   useReorderWsEnvironment,
   useToggleAutoCapitalization,
-  useUpdateMachineWorkspaceRole,
+  useUpdateIdentityWorkspaceRole,
   useUpdateUserWorkspaceRole,
   useUpdateWsEnvironment} from "./queries";

frontend/src/hooks/api/workspace/queries.tsx

@@ -2,9 +2,9 @@ import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 
 import { apiRequest } from "@app/config/request";
 
+import { IdentityMembership } from "../identities/types";
 import { IntegrationAuth } from "../integrationAuth/types";
 import { TIntegration } from "../integrations/types";
-import { MachineMembership } from "../machineIdentities/types";
 import { EncryptedSecret } from "../secrets/types";
 import { TWorkspaceUser } from "../users/types";
 import {
@@ -31,7 +31,7 @@ export const workspaceKeys = {
   getAllUserWorkspace: ["workspaces"] as const,
   getWorkspaceAuditLogs: (workspaceId: string) => [{ workspaceId }] as const,
   getWorkspaceUsers: (workspaceId: string) => [{ workspaceId }] as const,
-  getWorkspaceMachineMemberships: (workspaceId: string) => [{ workspaceId }, "workspace-machine-memberships"] as const
+  getWorkspaceIdentityMemberships: (workspaceId: string) => [{ workspaceId }, "workspace-identity-memberships"] as const
 };
 
 const fetchWorkspaceById = async (workspaceId: string) => {
@@ -356,97 +356,92 @@ export const useUpdateUserWorkspaceRole = () => {
   });
 };
 
-export const useAddMachineToWorkspace = () => {
+export const useAddIdentityToWorkspace = () => {
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async ({
-      machineId,
+      identityId,
       workspaceId,
       role
     }: {
-      machineId: string;
+      identityId: string;
       workspaceId: string;
       role?: string;
     }) => {
 
       const {
-        data: { serviceMembership }
-      } = await apiRequest.post(`/api/v2/workspace/${workspaceId}/machine-memberships/${machineId}`, {
+        data: { identityMembership }
+      } = await apiRequest.post(`/api/v2/workspace/${workspaceId}/identity-memberships/${identityId}`, {
         role
       });
       
-      return serviceMembership;
+      return identityMembership;
     },
     onSuccess: (_, { workspaceId }) => {
-      queryClient.invalidateQueries(workspaceKeys.getWorkspaceMachineMemberships(workspaceId));
+      queryClient.invalidateQueries(workspaceKeys.getWorkspaceIdentityMemberships(workspaceId));
     }
   });
 };
 
-export const useUpdateMachineWorkspaceRole = () => {
+export const useUpdateIdentityWorkspaceRole = () => {
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async ({
-      machineId,
+      identityId,
       workspaceId,
       role
     }: {
-      machineId: string;
+      identityId: string;
       workspaceId: string;
       role?: string;
     }) => {
 
       const {
-        data: { serviceMembership }
-      } = await apiRequest.patch(`/api/v2/workspace/${workspaceId}/machine-memberships/${machineId}`, {
+        data: { identityMembership }
+      } = await apiRequest.patch(`/api/v2/workspace/${workspaceId}/identity-memberships/${identityId}`, {
         role
       });
-      
-      return serviceMembership;
+
+      return identityMembership;
     },
     onSuccess: (_, { workspaceId }) => {
-      queryClient.invalidateQueries(workspaceKeys.getWorkspaceMachineMemberships(workspaceId));
+      queryClient.invalidateQueries(workspaceKeys.getWorkspaceIdentityMemberships(workspaceId));
     }
   });
 };
 
-export const useDeleteMachineFromWorkspace = () => {
+export const useDeleteIdentityFromWorkspace = () => {
   const queryClient = useQueryClient();
   return useMutation({
     mutationFn: async ({
-      machineId,
+      identityId,
       workspaceId,
     }: {
-      machineId: string;
+      identityId: string;
       workspaceId: string;
     }) => {
-      
       const {
-        data: { serviceMembership }
-      } = await apiRequest.delete(`/api/v2/workspace/${workspaceId}/machine-memberships/${machineId}`);
-      
-      return serviceMembership;
+        data: { identityMembership }
+      } = await apiRequest.delete(`/api/v2/workspace/${workspaceId}/identity-memberships/${identityId}`);
+      return identityMembership;
     },
     onSuccess: (_, { workspaceId }) => {
-      queryClient.invalidateQueries(workspaceKeys.getWorkspaceMachineMemberships(workspaceId));
+      queryClient.invalidateQueries(workspaceKeys.getWorkspaceIdentityMemberships(workspaceId));
     }
   });
 };
 
-
-export const useGetWorkspaceMachineMemberships = (workspaceId: string) => {
+export const useGetWorkspaceIdentityMemberships = (workspaceId: string) => {
   return useQuery({
-    queryKey: workspaceKeys.getWorkspaceMachineMemberships(workspaceId),
+    queryKey: workspaceKeys.getWorkspaceIdentityMemberships(workspaceId),
     queryFn: async () => {
-      
       const {
-        data: { machineMemberships }
-      } = await apiRequest.get<{ machineMemberships: MachineMembership[] }>(
-        `/api/v2/workspace/${workspaceId}/machine-memberships`
+        data: { identityMemberships }
+      } = await apiRequest.get<{ identityMemberships: IdentityMembership[] }>(
+        `/api/v2/workspace/${workspaceId}/identity-memberships`
       );
-
-      return machineMemberships;
+      return identityMemberships;
     },
     enabled: true
   });
-};
+};

frontend/src/views/Org/MembersPage/MembersPage.tsx

@@ -4,14 +4,15 @@ import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
 import { withPermission } from "@app/hoc";
 
 import {
-  OrgMachineIdentityTab,
+  OrgIdentityTab,
   OrgMembersTab,
-  OrgRoleTabSection} from "./components";
+  OrgRoleTabSection
+} from "./components";
 
 enum TabSections {
   Member = "members",
   Roles = "roles",
-  MachineIdentities = "machine-identities"
+  Identities = "identities"
 }
 
 export const MembersPage = withPermission(
@@ -25,7 +26,7 @@ export const MembersPage = withPermission(
           <Tabs defaultValue={TabSections.Member}>
             <TabList>
               <Tab value={TabSections.Member}>People</Tab>
-              <Tab value={TabSections.MachineIdentities}>
+              <Tab value={TabSections.Identities}>
                 <div className="flex items-center">
                   <p>Machine Identities</p>
                   <div className="ml-2 rounded-md text-yellow text-sm inline-block bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] opacity-80 hover:opacity-100 cursor-default">
@@ -38,8 +39,8 @@ export const MembersPage = withPermission(
             <TabPanel value={TabSections.Member}>
               <OrgMembersTab />
             </TabPanel>
-            <TabPanel value={TabSections.MachineIdentities}>
-              <OrgMachineIdentityTab />
+            <TabPanel value={TabSections.Identities}>
+              <OrgIdentityTab />
             </TabPanel>
             <TabPanel value={TabSections.Roles}>
               <OrgRoleTabSection />

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/OrgIdentityTab.tsx

@@ -1,8 +1,10 @@
 import { motion } from "framer-motion";
 
-import { MachineIdentitySection } from "./components";
+import { 
+    IdentitySection
+} from "./components";
 
-export const OrgMachineIdentityTab = () => {
+export const OrgIdentityTab = () => {
     return (
         <motion.div
             key="panel-service-token"
@@ -11,7 +13,7 @@ export const OrgMachineIdentityTab = () => {
             animate={{ opacity: 1, translateX: 0 }}
             exit={{ opacity: 0, translateX: 30 }}
         >
-            <MachineIdentitySection />
+            <IdentitySection />
         </motion.div>
     );
 }

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityAuthMethodModal.tsx

@@ -0,0 +1,108 @@
+import { Controller, useForm } from "react-hook-form"; 
+import { yupResolver } from "@hookform/resolvers/yup";
+import * as yup from "yup";
+
+import {
+    FormControl,
+    Modal,
+    ModalContent,
+    Select,
+    SelectItem,
+    UpgradePlanModal
+} from "@app/components/v2";
+import { IdentityAuthMethod } from "@app/hooks/api/identities";
+import { UsePopUpState } from "@app/hooks/usePopUp";
+
+import { IdentityUniversalAuthForm } from "./IdentityUniversalAuthForm";
+
+type Props = {
+    popUp: UsePopUpState<["identityAuthMethod", "upgradePlan"]>;
+    handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
+    handlePopUpToggle: (popUpName: keyof UsePopUpState<["identityAuthMethod", "upgradePlan"]>, state?: boolean) => void;
+}
+
+const identityAuthMethods = [
+    { label: "Universal Auth", value: IdentityAuthMethod.UNIVERSAL_AUTH }
+];
+
+const schema = yup.object({
+    authMethod: yup.string().required("Auth method is required"), // TODO: better enforcement here
+}).required();
+
+export type FormData = yup.InferType<typeof schema>;
+
+export const IdentityAuthMethodModal = ({
+    popUp,
+    handlePopUpOpen,
+    handlePopUpToggle
+}: Props) => {
+
+    const {
+        control,
+        // watch,
+    } = useForm<FormData>({
+        resolver: yupResolver(schema)
+    });
+
+    const identityAuthMethodData = popUp?.identityAuthMethod?.data as {
+        identityId: string;
+        name: string;
+        authMethod?: IdentityAuthMethod;
+    }
+    
+    // const authMethod = watch("authMethod");
+    
+    const renderIdentityAuthForm = () => {
+        return (
+            <IdentityUniversalAuthForm 
+                handlePopUpOpen={handlePopUpOpen}
+                handlePopUpToggle={handlePopUpToggle}
+                identityAuthMethodData={identityAuthMethodData}
+            />
+        );
+    }
+    
+    return (
+        <Modal
+            isOpen={popUp?.identityAuthMethod?.isOpen}
+                onOpenChange={(isOpen) => {
+                handlePopUpToggle("identityAuthMethod", isOpen);
+            }}
+        >
+            <ModalContent title={`${identityAuthMethodData?.authMethod ? "Update" : "Configure"} Identity Auth Method for ${identityAuthMethodData?.name ?? ""}`}>
+                <Controller
+                    control={control}
+                    name="authMethod"
+                    defaultValue={IdentityAuthMethod.UNIVERSAL_AUTH}
+                    render={({ field: { onChange, ...field }, fieldState: { error } }) => (
+                        <FormControl
+                            label="Auth Method"
+                            errorText={error?.message}
+                            isError={Boolean(error)}
+                        >
+                            <Select
+                                defaultValue={field.value}
+                                {...field}
+                                onValueChange={(e) => onChange(e)}
+                                className="w-full"
+                            >
+                                {identityAuthMethods.map(({ label, value }) => (
+                                    <SelectItem value={String(value || "")} key={label}>
+                                        {label}
+                                    </SelectItem>
+                                ))}
+                            </Select>
+                        </FormControl>
+                    )}
+                />
+                {renderIdentityAuthForm()}
+                <UpgradePlanModal
+                    isOpen={popUp?.upgradePlan?.isOpen}
+                    onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+                    text="You can use IP allowlisting if you switch to Infisical's Pro plan."
+                />
+            </ModalContent>
+        </Modal>
+    );
+}
+

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityModal.tsx

@@ -0,0 +1,239 @@
+import { useEffect } from "react";
+import { Controller, useForm } from "react-hook-form"; 
+import { yupResolver } from "@hookform/resolvers/yup";
+import * as yup from "yup";
+
+import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
+import {
+    Button,
+    FormControl,
+    Input,
+    Modal,
+    ModalContent,
+    Select,
+    SelectItem
+} from "@app/components/v2";
+import { useOrganization } from "@app/context";
+import { 
+    useCreateIdentity,
+    useGetRoles,
+    useUpdateIdentity
+} from "@app/hooks/api";
+import { IdentityAuthMethod } from "@app/hooks/api/identities";
+import { UsePopUpState } from "@app/hooks/usePopUp";
+
+const schema = yup.object({
+    name: yup.string().required("MI name is required"),
+    role: yup.string(),
+}).required();
+
+export type FormData = yup.InferType<typeof schema>;
+
+type Props = {
+  popUp: UsePopUpState<["identity"]>;
+  handlePopUpOpen: (
+    popUpName: keyof UsePopUpState<["identityAuthMethod"]>,
+    data: {
+        identityId: string;
+        name: string;
+        authMethod?: IdentityAuthMethod;
+    }
+  ) => void;
+  handlePopUpToggle: (popUpName: keyof UsePopUpState<["identity"]>, state?: boolean) => void;
+};
+
+export const IdentityModal = ({
+    popUp,
+    handlePopUpOpen,
+    handlePopUpToggle
+}: Props) => {
+    const { createNotification } = useNotificationContext();
+
+    const { currentOrg } = useOrganization();
+    const orgId = currentOrg?._id || "";
+
+    const { data: roles } = useGetRoles({
+        orgId
+    });
+    
+    const { mutateAsync: createMutateAsync } = useCreateIdentity();
+    const { mutateAsync: updateMutateAsync } = useUpdateIdentity();
+    
+    const {
+        control,
+        handleSubmit,
+        reset,
+        formState: { isSubmitting }
+    } = useForm<FormData>({
+        resolver: yupResolver(schema),
+        defaultValues: {
+            name: ""
+        }
+    });
+    
+    useEffect(() => {
+        
+        const identity = popUp?.identity?.data as { 
+            identityId: string;
+            name: string;
+            role: string;
+            customRole: {
+                name: string;
+                slug: string;
+            };
+        };
+
+        if (!roles?.length) return;
+    
+        if (identity) {
+            reset({
+                name: identity.name,
+                role: identity?.customRole?.slug ?? identity.role
+            });
+        } else {
+            reset({
+                name: "",
+                role: roles[0].slug
+            });
+        }
+    }, [popUp?.identity?.data, roles]);
+    
+    const onFormSubmit = async ({
+        name,
+        role,
+    }: FormData) => {
+        try {
+            
+            const identity = popUp?.identity?.data as { 
+                identityId: string;
+                name: string;
+                role: string;
+            };
+            
+            if (identity) {
+                // update
+                
+                await updateMutateAsync({
+                    identityId: identity.identityId,
+                    name,
+                    role: role || undefined,
+                    organizationId: orgId
+                });
+                
+                handlePopUpToggle("identity", false);
+            } else {
+                // create
+                
+                const { 
+                    _id: createdId,
+                    name: createdName,
+                    authMethod
+                } = await createMutateAsync({
+                    name,
+                    role: role || undefined,
+                    organizationId: orgId
+                });
+                
+                handlePopUpToggle("identity", false);
+                handlePopUpOpen("identityAuthMethod", {
+                    identityId: createdId,
+                    name: createdName,
+                    authMethod
+                });
+            }
+            
+            createNotification({
+                text: `Successfully ${popUp?.identity?.data ? "updated" : "created"} identity`,
+                type: "success"
+            });
+
+            reset();
+        } catch (err) {
+            console.error(err);
+            const error = err as any;
+            const text = error?.response?.data?.message
+                ?? `Failed to ${popUp?.identity?.data ? "updated" : "created"} identity`;
+            
+            createNotification({
+                text,
+                type: "error"
+            });
+        }
+    }
+
+    return (
+        <Modal
+            isOpen={popUp?.identity?.isOpen}
+                onOpenChange={(isOpen) => {
+                handlePopUpToggle("identity", isOpen);
+                reset();
+            }}
+        >
+            <ModalContent title={`${popUp?.identity?.data ? "Update" : "Create"} Identity`}>
+                <form onSubmit={handleSubmit(onFormSubmit)}>
+                    <Controller
+                        control={control}
+                        defaultValue=""
+                        name="name"
+                        render={({ field, fieldState: { error } }) => (
+                            <FormControl
+                                label="Name"
+                                isError={Boolean(error)}
+                                errorText={error?.message}
+                            >
+                            <Input 
+                                {...field} 
+                                placeholder="Machine 1"
+                            />
+                            </FormControl>
+                        )}
+                    />
+                    <Controller
+                        control={control}
+                        name="role"
+                        defaultValue=""
+                        render={({ field: { onChange, ...field }, fieldState: { error } }) => (
+                            <FormControl
+                                label={`${popUp?.identity?.data ? "Update" : ""} Role`}
+                                errorText={error?.message}
+                                isError={Boolean(error)}
+                                className="mt-4"
+                            >
+                                <Select
+                                    defaultValue={field.value}
+                                    {...field}
+                                    onValueChange={(e) => onChange(e)}
+                                    className="w-full"
+                                >
+                                    {(roles || []).map(({ name, slug }) => (
+                                        <SelectItem value={slug} key={`st-role-${slug}`}>
+                                            {name}
+                                        </SelectItem>
+                                    ))}
+                                </Select>
+                            </FormControl>
+                        )}
+                    />
+                    <div className="flex items-center">
+                        <Button
+                            className="mr-4"
+                            size="sm"
+                            type="submit"
+                            isLoading={isSubmitting}
+                            isDisabled={isSubmitting}
+                        >
+                            {popUp?.identity?.data ? "Update" : "Create"}
+                        </Button>
+                        <Button 
+                            colorSchema="secondary" 
+                            variant="plain"
+                            onClick={() => handlePopUpToggle("identity", false)}
+                        >
+                            Cancel
+                        </Button>
+                    </div>
+                </form>
+            </ModalContent>
+        </Modal>
+    );
+}

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentitySection.tsx

@@ -0,0 +1,118 @@
+import { faPlus } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
+import { OrgPermissionCan } from "@app/components/permissions";
+import { 
+  Button,
+  DeleteActionModal
+} from "@app/components/v2";
+import { 
+    OrgPermissionActions, 
+    OrgPermissionSubjects, 
+    useOrganization} from "@app/context";
+import { withPermission } from "@app/hoc";
+import { useDeleteIdentity } from "@app/hooks/api";
+import { usePopUp } from "@app/hooks/usePopUp";
+
+import { IdentityAuthMethodModal } from "./IdentityAuthMethodModal";
+import { IdentityModal } from "./IdentityModal";
+import { IdentityTable } from "./IdentityTable";
+import { IdentityUniversalAuthClientSecretModal } from "./IdentityUniversalAuthClientSecretModal";
+
+export const IdentitySection = withPermission(
+    () => {
+        const { currentOrg } = useOrganization();
+        const orgId = currentOrg?._id || "";
+    
+        const { createNotification } = useNotificationContext();
+        const { mutateAsync: deleteMutateAsync } = useDeleteIdentity();
+        const { popUp, handlePopUpOpen, handlePopUpClose,  handlePopUpToggle } = usePopUp([
+            "identity",
+            "identityAuthMethod",
+            "deleteIdentity",
+            "universalAuthClientSecret",
+            "deleteUniversalAuthClientSecret",
+            "upgradePlan"
+        ] as const);
+        
+        const onDeleteIdentitySubmit = async (identityId: string) => {
+            try {
+                
+                await deleteMutateAsync({
+                    identityId,
+                    organizationId: orgId
+                });
+                
+                createNotification({
+                    text: "Successfully deleted identity",
+                    type: "success"
+                });
+                
+                handlePopUpClose("deleteIdentity");
+            } catch (err) {
+                console.error(err);
+                createNotification({
+                    text: "Failed to delete identity",
+                    type: "error"
+                });
+            }
+        }
+        
+        return (
+            <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
+                <div className="flex justify-between mb-8">
+                    <p className="text-xl font-semibold text-mineshaft-100">
+                        Identities
+                    </p>
+                    <OrgPermissionCan
+                        I={OrgPermissionActions.Create}
+                        a={OrgPermissionSubjects.Identity}
+                    >
+                        {(isAllowed) => (
+                        <Button
+                            colorSchema="secondary"
+                            type="submit"
+                            leftIcon={<FontAwesomeIcon icon={faPlus} />}
+                            onClick={() => handlePopUpOpen("identity")}
+                            isDisabled={!isAllowed}
+                        >
+                            Create identity
+                        </Button>
+                        )}
+                    </OrgPermissionCan>
+                </div>
+                <IdentityTable handlePopUpOpen={handlePopUpOpen} />
+                <IdentityModal
+                    popUp={popUp}
+                    handlePopUpOpen={handlePopUpOpen}
+                    handlePopUpToggle={handlePopUpToggle}
+                />
+                <IdentityAuthMethodModal 
+                    popUp={popUp}
+                    handlePopUpOpen={handlePopUpOpen}
+                    handlePopUpToggle={handlePopUpToggle}
+                />
+                <IdentityUniversalAuthClientSecretModal 
+                    popUp={popUp}
+                    handlePopUpOpen={handlePopUpOpen}
+                    handlePopUpToggle={handlePopUpToggle}
+                />
+                <DeleteActionModal
+                    isOpen={popUp.deleteIdentity.isOpen}
+                    title={`Are you sure want to delete ${
+                        (popUp?.deleteIdentity?.data as { name: string })?.name || ""
+                    }?`}
+                    onChange={(isOpen) => handlePopUpToggle("deleteIdentity", isOpen)}
+                    deleteKey="confirm"
+                    onDeleteApproved={() => 
+                        onDeleteIdentitySubmit(
+                            (popUp?.deleteIdentity?.data as { identityId: string })?.identityId
+                        )
+                    }
+                />
+        </div>
+        );
+    },
+  { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.Identity }
+);

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityTable.tsx

@@ -0,0 +1,267 @@
+import { faKey, faLock,faPencil, faServer, faXmark } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
+import { OrgPermissionCan } from "@app/components/permissions";
+import {
+    EmptyState,
+    IconButton,
+    Select,
+    SelectItem,
+    Table,
+    TableContainer,
+    TableSkeleton,
+    TBody,
+    Td,
+    Th,
+    THead,
+    Tooltip,
+    Tr
+} from "@app/components/v2";
+import { 
+    OrgPermissionActions,
+    OrgPermissionSubjects,
+    useOrganization} from "@app/context";
+import {
+    useGetIdentityMembershipOrgs,
+    useGetRoles,
+    useUpdateIdentity} from "@app/hooks/api";
+import { IdentityAuthMethod, identityAuthToNameMap } from "@app/hooks/api/identities";
+import { UsePopUpState } from "@app/hooks/usePopUp";
+
+// TODO: some kind of map
+
+type Props = {
+    handlePopUpOpen: (
+      popUpName: keyof UsePopUpState<["deleteIdentity", "identity", "universalAuthClientSecret", "identityAuthMethod"]>,
+      data?: {
+        identityId?: string;
+        name?: string;
+        authMethod?: string;
+        role?: string;
+        customRole?: {
+            name: string;
+            slug: string;
+        };
+      }
+    ) => void;
+  };
+
+export const IdentityTable = ({
+    handlePopUpOpen
+}: Props) => {
+    const { createNotification } = useNotificationContext();
+    const { currentOrg } = useOrganization();
+    const orgId = currentOrg?._id || "";
+
+    const { mutateAsync: updateMutateAsync } = useUpdateIdentity();
+    const { data, isLoading } = useGetIdentityMembershipOrgs(orgId);
+    
+    const { data: roles } = useGetRoles({
+        orgId
+    });
+    
+    const handleChangeRole = async ({
+        identityId,
+        role
+    }: {
+        identityId: string;
+        role: string;
+    }) => {
+        try {
+            
+            await updateMutateAsync({
+                identityId,
+                role,
+                organizationId: orgId
+            });
+            
+            createNotification({
+                text: "Successfully updated identity role",
+                type: "success"
+            });
+        } catch (err) {
+            console.error(err);
+            const error = err as any;
+            const text = error?.response?.data?.message ?? "Failed to update identity role"
+            
+            createNotification({
+                text,
+                type: "error"
+              });
+        }
+    }
+      
+    return (
+        <TableContainer>
+            <Table>
+                <THead>
+                    <Tr>
+                        <Th>Name</Th>
+                        <Th>Role</Th>
+                        <Th>Auth Method</Th>
+                        <Th className="w-5" />
+                    </Tr>
+                </THead>
+                <TBody>
+                    {isLoading && <TableSkeleton columns={4} innerKey="org-identities" />}
+                    {!isLoading &&
+                    data &&
+                    data.length > 0 &&
+                    data.map(({
+                        identity: {
+                            _id,
+                            name,
+                            authMethod
+                        },
+                        role,
+                        customRole
+                    }) => {
+                        return (
+                            <Tr className="h-10" key={`identity-${_id}`}>
+                                <Td>{name}</Td>
+                                <Td>
+                                    <OrgPermissionCan
+                                        I={OrgPermissionActions.Edit}
+                                        a={OrgPermissionSubjects.Identity}
+                                    >
+                                        {(isAllowed) => {
+                                            return (
+                                                <Select
+                                                    value={
+                                                        role === "custom" ? (customRole?.slug as string) : role
+                                                    }
+                                                    isDisabled={!isAllowed}
+                                                    className="w-40 bg-mineshaft-600"
+                                                    dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
+                                                    onValueChange={(selectedRole) => 
+                                                        handleChangeRole({
+                                                            identityId: _id,
+                                                            role: selectedRole
+                                                        })
+                                                    }
+                                                >
+                                                    {(roles || [])
+                                                        .map(({ slug, name: roleName }) => (
+                                                            <SelectItem value={slug} key={`owner-option-${slug}`}>
+                                                            {roleName}
+                                                            </SelectItem>
+                                                        ))}
+                                                </Select>
+                                            );
+                                        }}
+                                    </OrgPermissionCan>
+                                </Td> 
+                                <Td>{authMethod ? identityAuthToNameMap[authMethod] : "Not configured"}</Td>
+                                <Td>
+                                    <div className="flex justify-end items-center">
+                                        {authMethod === IdentityAuthMethod.UNIVERSAL_AUTH && (
+                                            <Tooltip content="Manage client ID/secrets">
+                                                <IconButton
+                                                    onClick={async () => {
+                                                        handlePopUpOpen("universalAuthClientSecret", {
+                                                            identityId: _id,
+                                                            name
+                                                        });
+                                                    }}
+                                                    size="lg"
+                                                    colorSchema="primary"
+                                                    variant="plain"
+                                                    ariaLabel="update"
+                                                    // isDisabled={!isAllowed}
+                                                >
+                                                    <FontAwesomeIcon icon={faKey} />
+                                                </IconButton>
+                                            </Tooltip>
+                                        )}
+                                        <OrgPermissionCan
+                                            I={OrgPermissionActions.Edit}
+                                            a={OrgPermissionSubjects.Identity}
+                                        >
+                                            {(isAllowed) => (
+                                                <Tooltip content="Manage auth method">
+                                                    <IconButton
+                                                        onClick={async () => {
+                                                            handlePopUpOpen("identityAuthMethod", {
+                                                                identityId: _id,
+                                                                name,
+                                                                authMethod
+                                                            });
+                                                        }}
+                                                        size="lg"
+                                                        colorSchema="primary"
+                                                        variant="plain"
+                                                        ariaLabel="update"
+                                                        className="ml-4"
+                                                        isDisabled={!isAllowed}
+                                                    >
+                                                        <FontAwesomeIcon icon={faLock} />
+                                                    </IconButton>
+                                                </Tooltip>
+                                            )}
+                                        </OrgPermissionCan>
+                                        <OrgPermissionCan
+                                            I={OrgPermissionActions.Edit}
+                                            a={OrgPermissionSubjects.Identity}
+                                        >
+                                            {(isAllowed) => (
+                                                <IconButton
+                                                    onClick={async () => {
+                                                        handlePopUpOpen("identity", {
+                                                            identityId: _id,
+                                                            name,
+                                                            role,
+                                                            customRole
+                                                        });
+                                                    }}
+                                                    size="lg"
+                                                    colorSchema="primary"
+                                                    variant="plain"
+                                                    ariaLabel="update"
+                                                    className="ml-4"
+                                                    isDisabled={!isAllowed}
+                                                >
+                                                    <FontAwesomeIcon icon={faPencil} />
+                                                </IconButton>
+                                            )}
+                                        </OrgPermissionCan>
+                                        <OrgPermissionCan
+                                            I={OrgPermissionActions.Delete}
+                                            a={OrgPermissionSubjects.Identity}
+                                        >
+                                            {(isAllowed) => (
+                                                <IconButton
+                                                    onClick={() => {
+                                                        handlePopUpOpen("deleteIdentity", {
+                                                            identityId: _id,
+                                                            name
+                                                        });
+                                                    }}
+                                                    size="lg"
+                                                    colorSchema="danger"
+                                                    variant="plain"
+                                                    ariaLabel="update"
+                                                    className="ml-4"
+                                                    isDisabled={!isAllowed}
+                                                >
+                                                    <FontAwesomeIcon icon={faXmark} />
+                                                </IconButton>
+                                            )}
+                                        </OrgPermissionCan>
+                                    </div>
+                                </Td>
+                            </Tr>
+                        );
+                    })}
+                    {!isLoading && data && data?.length === 0 && (
+                        <Tr>
+                            <Td colSpan={4}>
+                                <EmptyState title="No identities have been created in this organization" icon={faServer} />
+                            </Td>
+                        </Tr>
+                    )}
+                </TBody>
+            </Table>
+        </TableContainer>
+    );
+}

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthClientSecretModal.tsx

@@ -28,9 +28,10 @@ import {
 } from "@app/components/v2";
 import { useToggle } from "@app/hooks";
 import { 
-    useCreateMachineIdentityClientSecret,
-    useDeleteMachineIdentityClientSecret,
-    useGetMachineIdentityClientSecrets} from "@app/hooks/api";
+    useCreateIdentityUniversalAuthClientSecret,
+    useDeleteIdentityUniversalAuthClientSecret,
+    useGetIdentityUniversalAuth,
+    useGetIdentityUniversalAuthClientSecrets} from "@app/hooks/api";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 const schema = yup.object({
@@ -42,18 +43,18 @@ const schema = yup.object({
 export type FormData = yup.InferType<typeof schema>;
 
 type Props = {
-    popUp: UsePopUpState<["clientSecret", "deleteClientSecret"]>;
+    popUp: UsePopUpState<["universalAuthClientSecret", "deleteUniversalAuthClientSecret"]>;
     handlePopUpOpen: (
-        popUpName: keyof UsePopUpState<["deleteClientSecret"]>,
+        popUpName: keyof UsePopUpState<["deleteUniversalAuthClientSecret"]>,
         data?: {
             clientSecretPrefix: string;
             clientSecretId: string;
         }
     ) => void;
-    handlePopUpToggle: (popUpName: keyof UsePopUpState<["clientSecret", "deleteClientSecret"]>, state?: boolean) => void;
+    handlePopUpToggle: (popUpName: keyof UsePopUpState<["universalAuthClientSecret", "deleteUniversalAuthClientSecret"]>, state?: boolean) => void;
 };
 
-export const CreateClientSecretModal = ({
+export const IdentityUniversalAuthClientSecretModal = ({
     popUp,
     handlePopUpOpen,
     handlePopUpToggle
@@ -63,15 +64,16 @@ export const CreateClientSecretModal = ({
     const [token, setToken] = useState("");
     const [isTokenCopied, setIsTokenCopied] = useToggle(false);
 
-    const popUpData = (popUp?.clientSecret?.data as {
-        machineId?: string;
+    const popUpData = (popUp?.universalAuthClientSecret?.data as {
+        identityId?: string;
         name?: string;
     });
     
-    const { data, isLoading } = useGetMachineIdentityClientSecrets(popUpData?.machineId ?? "");
-    
-    const { mutateAsync: createClientSecretMutateAsync } = useCreateMachineIdentityClientSecret();
-    const { mutateAsync: deleteClientSecretMutateAsync } = useDeleteMachineIdentityClientSecret();
+    const { data, isLoading } = useGetIdentityUniversalAuthClientSecrets(popUpData?.identityId ?? "");
+    const { data: identityUniversalAuth } = useGetIdentityUniversalAuth(popUpData?.identityId ?? "");
+
+    const { mutateAsync: createClientSecretMutateAsync } = useCreateIdentityUniversalAuthClientSecret();
+    const { mutateAsync: deleteClientSecretMutateAsync } = useDeleteIdentityUniversalAuthClientSecret();
 
     const {
         control,
@@ -108,10 +110,10 @@ export const CreateClientSecretModal = ({
     }: FormData) => {
         try {
             
-            if (!popUpData?.machineId) return;
-            
+            if (!popUpData?.identityId) return;
+
             const { clientSecret } = await createClientSecretMutateAsync({
-                machineId: popUpData.machineId,
+                identityId: popUpData.identityId,
                 description,
                 ttl: Number(ttl),
                 numUsesLimit: Number(numUsesLimit)
@@ -141,19 +143,19 @@ export const CreateClientSecretModal = ({
     }) => {
         try {
             
-            if (!popUpData?.machineId) return;
+            if (!popUpData?.identityId) return;
 
             await deleteClientSecretMutateAsync({
-                machineId: popUpData.machineId,
+                identityId: popUpData.identityId,
                 clientSecretId
             });
-
+            
             if (token.startsWith(clientSecretPrefix)) {
                 reset();
                 setToken("");
             }
             
-            handlePopUpToggle("deleteClientSecret", false);
+            handlePopUpToggle("deleteUniversalAuthClientSecret", false);
         
             createNotification({
                 text: "Successfully deleted client secret",
@@ -173,14 +175,29 @@ export const CreateClientSecretModal = ({
 
     return (
         <Modal
-            isOpen={popUp?.clientSecret?.isOpen}
+            isOpen={popUp?.universalAuthClientSecret?.isOpen}
                 onOpenChange={(isOpen) => {
-                handlePopUpToggle("clientSecret", isOpen);
+                handlePopUpToggle("universalAuthClientSecret", isOpen);
                 reset();
                 setToken("");
             }}
         >
-            <ModalContent title={`Manage Client Secrets for ${popUpData?.name ?? ""}`}>
+            <ModalContent title={`Manage Client ID/Secrets for ${popUpData?.name ?? ""}`}>
+                <h2 className="mb-4">Client ID</h2>
+                <div className="mb-8 flex items-center justify-between rounded-md bg-white/[0.07] p-2 text-base text-gray-400">
+                    <p className="mr-4 break-all">{identityUniversalAuth?.clientId ?? ""}</p>
+                    <IconButton
+                        ariaLabel="copy icon"
+                        colorSchema="secondary"
+                        className="group relative"
+                        onClick={() => navigator.clipboard.writeText(identityUniversalAuth?.clientId ?? "")}
+                    >
+                        <FontAwesomeIcon icon={isTokenCopied ? faCheck : faCopy} />
+                        <span className="absolute -left-8 -top-20 hidden w-28 translate-y-full rounded-md bg-bunker-800 py-2 pl-3 text-center text-sm text-gray-400 group-hover:flex group-hover:animate-fadeIn">
+                            {t("common.click-to-copy")}
+                        </span>
+                    </IconButton>
+                </div>
                 <h2 className="mb-4">New Client Secret</h2>
                 {hasToken ? (
                     <div>
@@ -306,7 +323,7 @@ export const CreateClientSecretModal = ({
                             </Tr>
                         </THead>
                         <TBody>
-                            {isLoading && <TableSkeleton columns={5} innerKey="org-machine-identities-client-secrets" />}
+                            {isLoading && <TableSkeleton columns={5} innerKey="org-identities-client-secrets" />}
                             {!isLoading &&
                             data &&
                             data.length > 0 && 
@@ -333,7 +350,7 @@ export const CreateClientSecretModal = ({
                                         <Td>
                                             <IconButton
                                                 onClick={() => {
-                                                    handlePopUpOpen("deleteClientSecret", {
+                                                    handlePopUpOpen("deleteUniversalAuthClientSecret", {
                                                         clientSecretPrefix,
                                                         clientSecretId: _id
                                                     });
@@ -352,7 +369,7 @@ export const CreateClientSecretModal = ({
                             {!isLoading && data && data?.length === 0 && (
                                 <Tr>
                                     <Td colSpan={5}>
-                                        <EmptyState title="No client secrets have been created for this machine identity yet" icon={faKey} />
+                                        <EmptyState title="No client secrets have been created for this identity yet" icon={faKey} />
                                     </Td>
                                 </Tr>
                             )}
@@ -360,14 +377,14 @@ export const CreateClientSecretModal = ({
                     </Table>
                 </TableContainer>
                 <DeleteActionModal
-                    isOpen={popUp.deleteClientSecret.isOpen}
+                    isOpen={popUp.deleteUniversalAuthClientSecret.isOpen}
                     title={`Are you sure want to delete the client secret ${
-                        (popUp?.deleteClientSecret?.data as { clientSecretPrefix: string })?.clientSecretPrefix || ""
+                        (popUp?.deleteUniversalAuthClientSecret?.data as { clientSecretPrefix: string })?.clientSecretPrefix || ""
                     }************?`}
-                    onChange={(isOpen) => handlePopUpToggle("deleteClientSecret", isOpen)}
+                    onChange={(isOpen) => handlePopUpToggle("deleteUniversalAuthClientSecret", isOpen)}
                     deleteKey="confirm"
                     onDeleteApproved={() => {
-                        const deleteClientSecretData = (popUp?.deleteClientSecret?.data as {
+                        const deleteClientSecretData = (popUp?.deleteUniversalAuthClientSecret?.data as {
                             clientSecretId: string;
                             clientSecretPrefix: string;
                         });

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/IdentityUniversalAuthForm.tsx

@@ -0,0 +1,428 @@
+import { useEffect } from "react";
+import { Controller, useFieldArray, useForm } from "react-hook-form"; 
+import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { yupResolver } from "@hookform/resolvers/yup";
+import * as yup from "yup";
+
+import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
+import {
+    Button,
+    FormControl,
+    IconButton,
+    Input,
+} from "@app/components/v2";
+import {
+    useOrganization,
+    useSubscription
+} from "@app/context";
+import { 
+    useAddIdentityUniversalAuth,
+    useGetIdentityUniversalAuth,
+    useUpdateIdentityUniversalAuth
+} from "@app/hooks/api";
+import { IdentityAuthMethod } from "@app/hooks/api/identities";
+import { IdentityTrustedIp } from "@app/hooks/api/identities/types";
+import { UsePopUpState } from "@app/hooks/usePopUp";
+
+const schema = yup.object({
+    accessTokenTTL: yup
+        .string()
+        .required("Access Token TTL is required"),
+    accessTokenMaxTTL: yup
+        .string()
+        .required("Access Max Token TTL is required"),
+    accessTokenNumUsesLimit: yup
+        .string()
+        .required("Access Token Max Number of Uses is required"),
+    clientSecretTrustedIps: yup
+        .array(
+        yup.object({
+            ipAddress: yup.string().max(50).required().label("IP Address")
+        })
+        )
+        .min(1)
+        .required()
+        .label("Client Secret Trusted IP"),
+    accessTokenTrustedIps: yup
+        .array(
+        yup.object({
+            ipAddress: yup.string().max(50).required().label("IP Address")
+        })
+        )
+        .min(1)
+        .required()
+        .label("Access Token Trusted IP")
+}).required();
+
+export type FormData = yup.InferType<typeof schema>;
+
+type Props = {
+    handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
+    handlePopUpToggle: (popUpName: keyof UsePopUpState<["identityAuthMethod"]>, state?: boolean) => void;
+    identityAuthMethodData: {
+        identityId: string;
+        name: string;
+        authMethod?: IdentityAuthMethod;
+    }
+}
+
+export const IdentityUniversalAuthForm = ({
+    handlePopUpOpen,
+    handlePopUpToggle,
+    identityAuthMethodData
+}: Props) => {
+    const { createNotification } = useNotificationContext();
+    const { currentOrg } = useOrganization();
+    const orgId = currentOrg?._id || "";
+    const { subscription } = useSubscription();
+    const { mutateAsync: addMutateAsync } = useAddIdentityUniversalAuth();
+    const { mutateAsync: updateMutateAsync } = useUpdateIdentityUniversalAuth();
+    const { data } = useGetIdentityUniversalAuth(identityAuthMethodData?.identityId ?? "");
+
+    const {
+        control,
+        handleSubmit,
+        reset,
+        formState: { isSubmitting }
+    } = useForm<FormData>({
+        resolver: yupResolver(schema),
+        defaultValues: {
+            accessTokenTTL: "7200",
+            accessTokenMaxTTL: "0",
+            accessTokenNumUsesLimit: "0",
+            clientSecretTrustedIps: [{
+                ipAddress: "0.0.0.0/0"
+            }],
+            accessTokenTrustedIps: [{
+                ipAddress: "0.0.0.0/0"
+            }],
+        }
+    });
+
+    const {
+        fields: clientSecretTrustedIpsFields, 
+        append: appendClientSecretTrustedIp, 
+        remove: removeClientSecretTrustedIp 
+    } = useFieldArray({ control, name: "clientSecretTrustedIps" });
+    const { 
+        fields: accessTokenTrustedIpsFields, 
+        append: appendAccessTokenTrustedIp, 
+        remove: removeAccessTokenTrustedIp 
+    } = useFieldArray({ control, name: "accessTokenTrustedIps" });
+    
+    useEffect(() => {
+        if (data) { // TODO: fix data type
+            reset({
+                accessTokenTTL: String(data.accessTokenTTL),
+                accessTokenMaxTTL: String(data.accessTokenMaxTTL),
+                accessTokenNumUsesLimit: String(data.accessTokenNumUsesLimit),
+                clientSecretTrustedIps: data.clientSecretTrustedIps.map(({ 
+                    ipAddress, 
+                    prefix 
+                }: IdentityTrustedIp) => {
+                    return ({
+                        ipAddress: `${ipAddress}${prefix !== undefined ? `/${prefix}` : ""}`
+                    });
+                }),
+                accessTokenTrustedIps: data.accessTokenTrustedIps.map(({ 
+                    ipAddress, 
+                    prefix 
+                }: IdentityTrustedIp) => {
+                    return ({
+                        ipAddress: `${ipAddress}${prefix !== undefined ? `/${prefix}` : ""}`
+                    });
+                })
+            });
+        } else {
+            reset({
+                accessTokenTTL: "7200",
+                accessTokenMaxTTL: "0",
+                accessTokenNumUsesLimit: "0",
+                clientSecretTrustedIps: [{
+                    ipAddress: "0.0.0.0/0"
+                }],
+                accessTokenTrustedIps: [{
+                    ipAddress: "0.0.0.0/0"
+                }]
+            });
+        }
+    }, [data]);
+
+    const onFormSubmit = async ({
+        accessTokenTTL,
+        accessTokenMaxTTL,
+        accessTokenNumUsesLimit,
+        clientSecretTrustedIps,
+        accessTokenTrustedIps
+    }: FormData) => {
+        try {
+            
+            if (!identityAuthMethodData) return;
+            
+            if (data) {
+                // update universal auth configuration
+                await updateMutateAsync({
+                    organizationId: orgId,
+                    identityId: identityAuthMethodData.identityId,
+                    clientSecretTrustedIps,
+                    accessTokenTTL: Number(accessTokenTTL),
+                    accessTokenMaxTTL: Number(accessTokenMaxTTL),
+                    accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
+                    accessTokenTrustedIps,
+                });
+
+            } else {
+                // create new universal auth configuration
+
+                await addMutateAsync({
+                    organizationId: orgId,
+                    identityId: identityAuthMethodData.identityId,
+                    clientSecretTrustedIps,
+                    accessTokenTTL: Number(accessTokenTTL),
+                    accessTokenMaxTTL: Number(accessTokenMaxTTL),
+                    accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit),
+                    accessTokenTrustedIps,
+                });
+            }
+            
+            handlePopUpToggle("identityAuthMethod", false);
+            
+            createNotification({
+                text: `Successfully ${identityAuthMethodData?.authMethod ? "updated" : "configured"} auth method`,
+                type: "success"
+            });
+
+            reset();
+        } catch (err) {
+            console.error(err);
+            const error = err as any;
+            const text = error?.response?.data?.message
+                ?? `Failed to ${identityAuthMethodData?.authMethod ? "update" : "configure"} identity`;
+            
+            createNotification({
+                text,
+                type: "error"
+            });
+        }
+    }
+    
+    return (
+        <form onSubmit={handleSubmit(onFormSubmit)}>
+            <Controller
+                control={control}
+                defaultValue="7200"
+                name="accessTokenTTL"
+                render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                        label="Access Token TTL (seconds)"
+                        isError={Boolean(error)}
+                        errorText={error?.message}
+                    >
+                    <Input 
+                        {...field} 
+                        placeholder="7200"
+                        type="number"
+                        min="0"
+                        step="1"
+                    />
+                    </FormControl>
+                )}
+            />
+            <Controller
+                control={control}
+                defaultValue="7200"
+                name="accessTokenMaxTTL"
+                render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                        label="Access Token Max TTL (seconds)"
+                        isError={Boolean(error)}
+                        errorText={error?.message}
+                    >
+                    <Input 
+                        {...field} 
+                        placeholder="7200"
+                        type="number"
+                        min="0"
+                        step="1"
+                    />
+                    </FormControl>
+                )}
+            />
+            <Controller
+                control={control}
+                defaultValue="0"
+                name="accessTokenNumUsesLimit"
+                render={({ field, fieldState: { error } }) => (
+                    <FormControl
+                        label="Access Token Max Number of Uses"
+                        isError={Boolean(error)}
+                        errorText={error?.message}
+                    >
+                    <Input 
+                        {...field} 
+                        placeholder="0"
+                        type="number"
+                        min="0"
+                        step="1"
+                    />
+                    </FormControl>
+                )}
+            />
+            {clientSecretTrustedIpsFields.map(({ id }, index) => (
+                <div className="flex items-end space-x-2 mb-3" key={id}>
+                    <Controller
+                        control={control}
+                        name={`clientSecretTrustedIps.${index}.ipAddress`}
+                        defaultValue="0.0.0.0/0"
+                        render={({ field, fieldState: { error } }) => {
+                            return (
+                                <FormControl
+                                    className="mb-0 flex-grow"
+                                    label={index === 0 ? "Client Secret Trusted IPs" : undefined}
+                                    isError={Boolean(error)}
+                                    errorText={error?.message}
+                                >
+                                <Input 
+                                    value={field.value}
+                                    onChange={(e) => {
+                                        if (subscription?.ipAllowlisting) {
+                                            field.onChange(e);
+                                            return;
+                                        }
+                                        
+                                        handlePopUpOpen("upgradePlan");
+                                    }}
+                                    placeholder="123.456.789.0" 
+                                />
+                                </FormControl>
+                            );
+                        }}
+                    />
+                    <IconButton
+                        onClick={() => {
+                            if (subscription?.ipAllowlisting) {
+                                removeClientSecretTrustedIp(index);
+                                return;
+                            }
+                            
+                            handlePopUpOpen("upgradePlan");
+                        }}
+                        size="lg"
+                        colorSchema="danger"
+                        variant="plain"
+                        ariaLabel="update"
+                        className="p-3"
+                    >
+                        <FontAwesomeIcon icon={faXmark} />
+                    </IconButton>
+                </div>
+            ))}
+            <div className="my-4 ml-1">
+                <Button
+                    variant="outline_bg"
+                    onClick={() => {
+                        if (subscription?.ipAllowlisting) {
+                            appendClientSecretTrustedIp({
+                                ipAddress: "0.0.0.0/0"
+                            })
+                            return;
+                        }
+
+                        handlePopUpOpen("upgradePlan");
+                    }}
+                    leftIcon={<FontAwesomeIcon icon={faPlus} />}
+                    size="xs"
+                >
+                    Add IP Address
+                </Button>
+            </div>
+            {accessTokenTrustedIpsFields.map(({ id }, index) => (
+                <div className="flex items-end space-x-2 mb-3" key={id}>
+                    <Controller
+                        control={control}
+                        name={`accessTokenTrustedIps.${index}.ipAddress`}
+                        defaultValue="0.0.0.0/0"
+                        render={({ field, fieldState: { error } }) => {
+                            return (
+                                <FormControl
+                                    className="mb-0 flex-grow"
+                                    label={index === 0 ? "Access Token Trusted IPs" : undefined}
+                                    isError={Boolean(error)}
+                                    errorText={error?.message}
+                                >
+                                <Input 
+                                    value={field.value}
+                                    onChange={(e) => {
+                                        if (subscription?.ipAllowlisting) {
+                                            field.onChange(e);
+                                            return;
+                                        }
+                                        
+                                        handlePopUpOpen("upgradePlan");
+                                    }}
+                                    placeholder="123.456.789.0" 
+                                />
+                                </FormControl>
+                            );
+                        }}
+                    />
+                    <IconButton
+                        onClick={() => {
+                            if (subscription?.ipAllowlisting) {
+                                removeAccessTokenTrustedIp(index);
+                                return;
+                            }
+                            
+                            handlePopUpOpen("upgradePlan");
+                        }}
+                        size="lg"
+                        colorSchema="danger"
+                        variant="plain"
+                        ariaLabel="update"
+                        className="p-3"
+                    >
+                        <FontAwesomeIcon icon={faXmark} />
+                    </IconButton>
+                </div>
+            ))}
+            <div className="my-4 ml-1">
+                <Button
+                    variant="outline_bg"
+                    onClick={() => {
+                        if (subscription?.ipAllowlisting) {
+                            appendAccessTokenTrustedIp({
+                                ipAddress: "0.0.0.0/0"
+                            })
+                            return;
+                        }
+
+                        handlePopUpOpen("upgradePlan");
+                    }}
+                    leftIcon={<FontAwesomeIcon icon={faPlus} />}
+                    size="xs"
+                >
+                    Add IP Address
+                </Button>
+            </div>
+            <div className="flex items-center">
+                <Button
+                    className="mr-4"
+                    size="sm"
+                    type="submit"
+                    isLoading={isSubmitting}
+                    isDisabled={isSubmitting}
+                >
+                    {identityAuthMethodData?.authMethod ? "Update" : "Configure"}
+                </Button>
+                <Button 
+                    colorSchema="secondary" 
+                    variant="plain"
+                    onClick={() => handlePopUpToggle("identityAuthMethod", false)}
+                >
+                    Cancel
+                </Button>
+            </div>
+        </form>
+    );
+}

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/IdentitySection/index.tsx

@@ -0,0 +1 @@
+export { IdentitySection } from "./IdentitySection";

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/components/index.tsx

@@ -0,0 +1 @@
+export { IdentitySection } from "./IdentitySection";

frontend/src/views/Org/MembersPage/components/OrgIdentityTab/index.tsx

@@ -0,0 +1 @@
+export { OrgIdentityTab } from "./OrgIdentityTab";

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/components/MachineIdentitySection/AddMachineIdentityModal.tsx

@@ -1,596 +0,0 @@
-import { useEffect } from "react";
-import { Controller, useFieldArray, useForm } from "react-hook-form"; 
-import { faPlus, faXmark } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { yupResolver } from "@hookform/resolvers/yup";
-import { motion } from "framer-motion";
-import * as yup from "yup";
-
-import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
-import {
-    Button,
-    FormControl,
-    IconButton,
-    Input,
-    Modal,
-    ModalContent,
-    Select,
-    SelectItem,
-    Tab,
-    TabList,
-    TabPanel,
-    Tabs,
-    UpgradePlanModal} from "@app/components/v2";
-import {
-    useOrganization,
-    useSubscription
-} from "@app/context";
-import { useToggle } from "@app/hooks";
-import { 
-    useCreateMachineIdentity,
-    useGetRoles,
-    useUpdateMachineIdentity
-} from "@app/hooks/api";
-import { MachineTrustedIp } from "@app/hooks/api/machineIdentities/types";
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-enum TabSections {
-    General = "general",
-    Advanced = "advanced"
-}
-
-const schema = yup.object({
-    name: yup.string().required("MI name is required"),
-    accessTokenTTL: yup
-        .string()
-        .required("Access Token TTL is required"),
-    accessTokenMaxTTL: yup
-        .string()
-        .required("Access Max Token TTL is required"),
-    accessTokenNumUsesLimit: yup
-        .string()
-        .required("Access Token Max Number of Uses is required"),
-    role: yup.string(),
-    clientSecretTrustedIps: yup
-        .array(
-        yup.object({
-            ipAddress: yup.string().max(50).required().label("IP Address")
-        })
-        )
-        .min(1)
-        .required()
-        .label("Client Secret Trusted IP"),
-    accessTokenTrustedIps: yup
-        .array(
-        yup.object({
-            ipAddress: yup.string().max(50).required().label("IP Address")
-        })
-        )
-        .min(1)
-        .required()
-        .label("Access Token Trusted IP")
-}).required();
-
-export type FormData = yup.InferType<typeof schema>;
-
-type Props = {
-  popUp: UsePopUpState<["machineIdentity", "upgradePlan"]>;
-  handlePopUpOpen: (popUpName: keyof UsePopUpState<["upgradePlan"]>) => void;
-  handlePopUpToggle: (popUpName: keyof UsePopUpState<["machineIdentity", "upgradePlan"]>, state?: boolean) => void;
-};
-
-export const AddMachineIdentityModal = ({
-    popUp,
-    handlePopUpOpen,
-    handlePopUpToggle
-}: Props) => {
-    const { createNotification } = useNotificationContext();
-    const [isServiceTokenJSONCopied, setIsServiceTokenJSONCopied] = useToggle(false);
-
-    const { subscription } = useSubscription();
-    const { currentOrg } = useOrganization();
-
-    const orgId = currentOrg?._id || "";
-
-    const { data: roles } = useGetRoles({
-        orgId
-    });
-    
-    const { mutateAsync: createMutateAsync } = useCreateMachineIdentity();
-    const { mutateAsync: updateMutateAsync } = useUpdateMachineIdentity();
-    
-    const {
-        control,
-        handleSubmit,
-        reset,
-        formState: { isSubmitting }
-    } = useForm<FormData>({
-        resolver: yupResolver(schema),
-        defaultValues: {
-            name: "",
-            accessTokenTTL: "7200",
-            accessTokenMaxTTL: "0",
-            accessTokenNumUsesLimit: "0",
-            clientSecretTrustedIps: [{
-                ipAddress: "0.0.0.0/0"
-            }],
-            accessTokenTrustedIps: [{
-                ipAddress: "0.0.0.0/0"
-            }],
-        }
-    });
-
-    useEffect(() => {
-        let timer: NodeJS.Timeout;
-
-        if (isServiceTokenJSONCopied) {
-            timer = setTimeout(() => setIsServiceTokenJSONCopied.off(), 2000);
-        }
-
-        return () => clearTimeout(timer);
-    }, [setIsServiceTokenJSONCopied]);
-    
-    useEffect(() => {
-        
-        const machineIdentity = popUp?.machineIdentity?.data as { 
-            machineId: string;
-            name: string;
-            role: string;
-            customRole: {
-                name: string;
-                slug: string;
-            };
-            clientSecretTrustedIps: MachineTrustedIp[];
-            accessTokenTrustedIps: MachineTrustedIp[];
-            accessTokenTTL: number;
-            accessTokenMaxTTL: number;
-            accessTokenNumUsesLimit: number;
-        };
-
-        if (!roles?.length) return;
-    
-        if (machineIdentity) {
-            reset({
-                name: machineIdentity.name,
-                accessTokenNumUsesLimit: String(machineIdentity.accessTokenNumUsesLimit),
-                role: machineIdentity?.customRole?.slug ?? machineIdentity.role,
-                clientSecretTrustedIps: machineIdentity.clientSecretTrustedIps.map(({ 
-                    ipAddress, 
-                    prefix 
-                }: MachineTrustedIp) => {
-                    return ({
-                        ipAddress: `${ipAddress}${prefix !== undefined ? `/${prefix}` : ""}`
-                    });
-                }),
-                accessTokenTrustedIps: machineIdentity.accessTokenTrustedIps.map(({ 
-                    ipAddress, 
-                    prefix 
-                }: MachineTrustedIp) => {
-                    return ({
-                        ipAddress: `${ipAddress}${prefix !== undefined ? `/${prefix}` : ""}`
-                    });
-                }),
-                accessTokenTTL: String(machineIdentity.accessTokenTTL),
-                accessTokenMaxTTL: String(machineIdentity.accessTokenMaxTTL)
-            });
-        } else {
-            reset({
-                name: "",
-                accessTokenTTL: "7200",
-                accessTokenMaxTTL: "0",
-                accessTokenNumUsesLimit: "0",
-                role: roles[0].slug,
-                clientSecretTrustedIps: [{
-                    ipAddress: "0.0.0.0/0"
-                }],
-                accessTokenTrustedIps: [{
-                    ipAddress: "0.0.0.0/0"
-                }]
-            });
-        }
-    }, [popUp?.machineIdentity?.data, roles]);
-    
-    const { 
-        fields: clientSecretTrustedIpsFields, 
-        append: appendClientSecretTrustedIp, 
-        remove: removeClientSecretTrustedIp 
-    } = useFieldArray({ control, name: "clientSecretTrustedIps" });
-    const { 
-        fields: accessTokenTrustedIpsFields, 
-        append: appendAccessTokenTrustedIp, 
-        remove: removeAccessTokenTrustedIp 
-    } = useFieldArray({ control, name: "accessTokenTrustedIps" });
-    
-    const onFormSubmit = async ({
-        name,
-        accessTokenTTL,
-        accessTokenMaxTTL,
-        role,
-        clientSecretTrustedIps,
-        accessTokenTrustedIps,
-        accessTokenNumUsesLimit
-    }: FormData) => {
-        try {
-            
-            const machineIdentity = popUp?.machineIdentity?.data as { 
-                machineId: string;
-                name: string;
-                role: string;
-            };
-            
-            if (machineIdentity) {
-                // update
-                
-                await updateMutateAsync({
-                    machineId: machineIdentity.machineId,
-                    name,
-                    role: role || undefined,
-                    clientSecretTrustedIps,
-                    accessTokenTrustedIps,
-                    accessTokenTTL: Number(accessTokenTTL),
-                    accessTokenMaxTTL: Number(accessTokenMaxTTL),
-                    accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit)
-                });
-                
-                handlePopUpToggle("machineIdentity", false);
-            } else {
-
-                await createMutateAsync({
-                    name,
-                    role: role || undefined,
-                    organizationId: orgId,
-                    clientSecretTrustedIps,
-                    accessTokenTrustedIps,
-                    accessTokenTTL: Number(accessTokenTTL),
-                    accessTokenMaxTTL: Number(accessTokenMaxTTL),
-                    accessTokenNumUsesLimit: Number(accessTokenNumUsesLimit)
-                });
-                
-                handlePopUpToggle("machineIdentity", false);
-            }
-            
-            createNotification({
-                text: `Successfully ${popUp?.machineIdentity?.data ? "updated" : "created"} machine identity`,
-                type: "success"
-            });
-
-            reset();
-        } catch (err) {
-            console.error(err);
-            const error = err as any;
-            const text = error?.response?.data?.message
-                ?? `Failed to ${popUp?.machineIdentity?.data ? "updated" : "created"} machine identity`;
-            
-            createNotification({
-                text,
-                type: "error"
-            });
-        }
-    }
-
-    return (
-        <Modal
-            isOpen={popUp?.machineIdentity?.isOpen}
-                onOpenChange={(isOpen) => {
-                handlePopUpToggle("machineIdentity", isOpen);
-                reset();
-            }}
-        >
-            <ModalContent title={`${popUp?.machineIdentity?.data ? "Update" : "Create"} Machine Identity`}>
-                <form onSubmit={handleSubmit(onFormSubmit)}>
-                    <Tabs defaultValue={TabSections.General}>
-                        <TabList>
-                            <div className="flex flex-row border-b border-mineshaft-600 w-full">
-                                <Tab value={TabSections.General}>General</Tab>
-                                <Tab value={TabSections.Advanced}>Advanced</Tab>
-                            </div>
-                        </TabList>
-                        <TabPanel value={TabSections.General}>
-                            <motion.div
-                                key="panel-1"
-                                transition={{ duration: 0.15 }}
-                                initial={{ opacity: 0, translateX: 30 }}
-                                animate={{ opacity: 1, translateX: 0 }}
-                                exit={{ opacity: 0, translateX: 30 }}
-                            >
-                                <Controller
-                                    control={control}
-                                    defaultValue=""
-                                    name="name"
-                                    render={({ field, fieldState: { error } }) => (
-                                        <FormControl
-                                            label="Name"
-                                            isError={Boolean(error)}
-                                            errorText={error?.message}
-                                        >
-                                        <Input 
-                                            {...field} 
-                                            placeholder="Machine 1"
-                                        />
-                                        </FormControl>
-                                    )}
-                                />
-                                <Controller
-                                    control={control}
-                                    name="role"
-                                    defaultValue=""
-                                    render={({ field: { onChange, ...field }, fieldState: { error } }) => (
-                                        <FormControl
-                                            label={`${popUp?.machineIdentity?.data ? "Update" : ""} Role`}
-                                            errorText={error?.message}
-                                            isError={Boolean(error)}
-                                            className="mt-4"
-                                        >
-                                            <Select
-                                                defaultValue={field.value}
-                                                {...field}
-                                                onValueChange={(e) => onChange(e)}
-                                                className="w-full"
-                                            >
-                                                {(roles || []).map(({ name, slug }) => (
-                                                    <SelectItem value={slug} key={`st-role-${slug}`}>
-                                                        {name}
-                                                    </SelectItem>
-                                                ))}
-                                            </Select>
-                                        </FormControl>
-                                    )}
-                                />
-                                
-                            </motion.div>
-                        </TabPanel>
-                        <TabPanel value={TabSections.Advanced}>
-                            <div>
-                            {/* <Controller
-                                    control={control}
-                                    name="expiresIn"
-                                    defaultValue=""
-                                    render={({ field: { onChange, ...field }, fieldState: { error } }) => (
-                                        <FormControl
-                                            label={`${popUp?.machineIdentity?.data ? "Update" : ""} Refresh Token Expires In`}
-                                            errorText={error?.message}
-                                            isError={Boolean(error)}
-                                            className="mt-4"
-                                        >
-                                            <Select
-                                                defaultValue={field.value}
-                                                {...field}
-                                                onValueChange={(e) => onChange(e)}
-                                                className="w-full"
-                                            >
-                                                {expirations.map(({ label, value }) => (
-                                                    <SelectItem value={String(value || "")} key={`api-key-expiration-${label}`}>
-                                                        {label}
-                                                    </SelectItem>
-                                                ))}
-                                            </Select>
-                                        </FormControl>
-                                    )}
-                                /> */}
-                                {/* <Controller
-                                    control={control}
-                                    defaultValue="7200"
-                                    name="accessTokenMaxTTL"
-                                    render={({ field, fieldState: { error } }) => (
-                                        <FormControl
-                                            label="Access Token Max TTL (seconds)"
-                                            isError={Boolean(error)}
-                                            errorText={error?.message}
-                                        >
-                                        <Input 
-                                            {...field} 
-                                            placeholder="7200"
-                                            type="number"
-                                            min="0"
-                                            step="1"
-                                        />
-                                        </FormControl>
-                                    )}
-                                /> */}
-                                <Controller
-                                    control={control}
-                                    defaultValue="7200"
-                                    name="accessTokenTTL"
-                                    render={({ field, fieldState: { error } }) => (
-                                        <FormControl
-                                            label="Access Token TTL (seconds)"
-                                            isError={Boolean(error)}
-                                            errorText={error?.message}
-                                        >
-                                        <Input 
-                                            {...field} 
-                                            placeholder="7200"
-                                            type="number"
-                                            min="0"
-                                            step="1"
-                                        />
-                                        </FormControl>
-                                    )}
-                                />
-                                <Controller
-                                    control={control}
-                                    defaultValue="0"
-                                    name="accessTokenNumUsesLimit"
-                                    render={({ field, fieldState: { error } }) => (
-                                        <FormControl
-                                            label="Access Token Max Number of Uses"
-                                            isError={Boolean(error)}
-                                            errorText={error?.message}
-                                        >
-                                        <Input 
-                                            {...field} 
-                                            placeholder="0"
-                                            type="number"
-                                            min="0"
-                                            step="1"
-                                        />
-                                        </FormControl>
-                                    )}
-                                />
-                                {clientSecretTrustedIpsFields.map(({ id }, index) => (
-                                    <div className="flex items-end space-x-2 mb-3" key={id}>
-                                        <Controller
-                                            control={control}
-                                            name={`clientSecretTrustedIps.${index}.ipAddress`}
-                                            defaultValue="0.0.0.0/0"
-                                            render={({ field, fieldState: { error } }) => {
-                                                return (
-                                                    <FormControl
-                                                        className="mb-0 flex-grow"
-                                                        label={index === 0 ? "Client Secret Trusted IPs" : undefined}
-                                                        isError={Boolean(error)}
-                                                        errorText={error?.message}
-                                                    >
-                                                    <Input 
-                                                        value={field.value}
-                                                        onChange={(e) => {
-                                                            if (subscription?.ipAllowlisting) {
-                                                                field.onChange(e);
-                                                                return;
-                                                            }
-                                                            
-                                                            handlePopUpOpen("upgradePlan");
-                                                        }}
-                                                        placeholder="123.456.789.0" 
-                                                    />
-                                                    </FormControl>
-                                                );
-                                            }}
-                                        />
-                                        <IconButton
-                                            onClick={() => {
-                                                if (subscription?.ipAllowlisting) {
-                                                    removeClientSecretTrustedIp(index);
-                                                    return;
-                                                }
-                                                
-                                                handlePopUpOpen("upgradePlan");
-                                            }}
-                                            size="lg"
-                                            colorSchema="danger"
-                                            variant="plain"
-                                            ariaLabel="update"
-                                            className="p-3"
-                                        >
-                                            <FontAwesomeIcon icon={faXmark} />
-                                        </IconButton>
-                                    </div>
-                                ))}
-                                <div className="my-4 ml-1">
-                                    <Button
-                                        variant="outline_bg"
-                                        onClick={() => {
-                                            if (subscription?.ipAllowlisting) {
-                                                appendClientSecretTrustedIp({
-                                                    ipAddress: "0.0.0.0/0"
-                                                })
-                                                return;
-                                            }
-
-                                            handlePopUpOpen("upgradePlan");
-                                        }}
-                                        leftIcon={<FontAwesomeIcon icon={faPlus} />}
-                                        size="xs"
-                                    >
-                                        Add IP Address
-                                    </Button>
-                                </div>
-                                {accessTokenTrustedIpsFields.map(({ id }, index) => (
-                                    <div className="flex items-end space-x-2 mb-3" key={id}>
-                                        <Controller
-                                            control={control}
-                                            name={`accessTokenTrustedIps.${index}.ipAddress`}
-                                            defaultValue="0.0.0.0/0"
-                                            render={({ field, fieldState: { error } }) => {
-                                                return (
-                                                    <FormControl
-                                                        className="mb-0 flex-grow"
-                                                        label={index === 0 ? "Access Token Trusted IPs" : undefined}
-                                                        isError={Boolean(error)}
-                                                        errorText={error?.message}
-                                                    >
-                                                    <Input 
-                                                        value={field.value}
-                                                        onChange={(e) => {
-                                                            if (subscription?.ipAllowlisting) {
-                                                                field.onChange(e);
-                                                                return;
-                                                            }
-                                                            
-                                                            handlePopUpOpen("upgradePlan");
-                                                        }}
-                                                        placeholder="123.456.789.0" 
-                                                    />
-                                                    </FormControl>
-                                                );
-                                            }}
-                                        />
-                                        <IconButton
-                                            onClick={() => {
-                                                if (subscription?.ipAllowlisting) {
-                                                    removeAccessTokenTrustedIp(index);
-                                                    return;
-                                                }
-                                                
-                                                handlePopUpOpen("upgradePlan");
-                                            }}
-                                            size="lg"
-                                            colorSchema="danger"
-                                            variant="plain"
-                                            ariaLabel="update"
-                                            className="p-3"
-                                        >
-                                            <FontAwesomeIcon icon={faXmark} />
-                                        </IconButton>
-                                    </div>
-                                ))}
-                                <div className="my-4 ml-1">
-                                    <Button
-                                        variant="outline_bg"
-                                        onClick={() => {
-                                            if (subscription?.ipAllowlisting) {
-                                                appendAccessTokenTrustedIp({
-                                                    ipAddress: "0.0.0.0/0"
-                                                })
-                                                return;
-                                            }
-
-                                            handlePopUpOpen("upgradePlan");
-                                        }}
-                                        leftIcon={<FontAwesomeIcon icon={faPlus} />}
-                                        size="xs"
-                                    >
-                                        Add IP Address
-                                    </Button>
-                                </div>
-                            </div>
-                        </TabPanel>
-                    </Tabs>
-                    <div className="flex items-center">
-                        <Button
-                            className="mr-4"
-                            size="sm"
-                            type="submit"
-                            isLoading={isSubmitting}
-                            isDisabled={isSubmitting}
-                        >
-                            {popUp?.machineIdentity?.data ? "Update" : "Create"}
-                        </Button>
-                        <Button 
-                            colorSchema="secondary" 
-                            variant="plain"
-                            onClick={() => handlePopUpToggle("machineIdentity", false)}
-                        >
-                            Cancel
-                        </Button>
-                    </div>
-                </form>
-                <UpgradePlanModal
-                    isOpen={popUp?.upgradePlan?.isOpen}
-                    onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
-                    text="You can use IP allowlisting if you switch to Infisical's Pro plan."
-                />
-            </ModalContent>
-        </Modal>
-    );
-}

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/components/MachineIdentitySection/MachineIdentitySection.tsx

@@ -1,104 +0,0 @@
-import { faPlus } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
-import { OrgPermissionCan } from "@app/components/permissions";
-import { 
-  Button,
-  DeleteActionModal
-} from "@app/components/v2";
-import { OrgPermissionActions, OrgPermissionSubjects } from "@app/context";
-import { withPermission } from "@app/hoc";
-import { useDeleteMachineIdentity } from "@app/hooks/api";
-import { usePopUp } from "@app/hooks/usePopUp";
-
-import { AddMachineIdentityModal } from "./AddMachineIdentityModal";
-import { CreateClientSecretModal } from "./CreateClientSecretModal";
-import { MachineIdentityTable } from "./MachineIdentityTable";
-
-export const MachineIdentitySection = withPermission(
-  () => {
-    const { createNotification } = useNotificationContext();
-    const { mutateAsync: deleteMutateAsync } = useDeleteMachineIdentity();
-    const { popUp, handlePopUpOpen, handlePopUpClose,  handlePopUpToggle } = usePopUp([
-      "machineIdentity",
-      "deleteMachineIdentity",
-      "clientSecret",
-      "deleteClientSecret",
-      "upgradePlan"
-    ] as const);
-    
-    const onDeleteMachineIdentitySubmit = async (machineId: string) => {
-      try {
-        await deleteMutateAsync({
-          machineId 
-        });
-        createNotification({
-            text: "Successfully deleted machine identity",
-            type: "success"
-        });
-        
-        handlePopUpClose("deleteMachineIdentity");
-      } catch (err) {
-          console.error(err);
-          createNotification({
-              text: "Failed to delete machine identity",
-              type: "error"
-          });
-      }
-    }
-
-    return (
-        <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
-          <div className="flex justify-between mb-8">
-            <p className="text-xl font-semibold text-mineshaft-100">
-              Machine Identities
-            </p>
-            <OrgPermissionCan
-              I={OrgPermissionActions.Create}
-              a={OrgPermissionSubjects.MachineIdentity}
-            >
-              {(isAllowed) => (
-                <Button
-                  colorSchema="secondary"
-                  type="submit"
-                  leftIcon={<FontAwesomeIcon icon={faPlus} />}
-                  onClick={() => handlePopUpOpen("machineIdentity")}
-                  isDisabled={!isAllowed}
-                >
-                  Create identity
-                </Button>
-              )}
-            </OrgPermissionCan>
-          </div>
-          <MachineIdentityTable 
-            handlePopUpOpen={handlePopUpOpen}
-          />
-          <AddMachineIdentityModal 
-            popUp={popUp}
-            handlePopUpOpen={handlePopUpOpen}
-            handlePopUpToggle={handlePopUpToggle}
-          />
-          <CreateClientSecretModal 
-            popUp={popUp}
-            handlePopUpOpen={handlePopUpOpen}
-            handlePopUpToggle={handlePopUpToggle}
-          />
-          <DeleteActionModal
-            isOpen={popUp.deleteMachineIdentity.isOpen}
-            title={`Are you sure want to delete ${
-              (popUp?.deleteMachineIdentity?.data as { name: string })?.name || ""
-            }?`}
-            onChange={(isOpen) => handlePopUpToggle("deleteMachineIdentity", isOpen)}
-            deleteKey="confirm"
-            onDeleteApproved={() => 
-              onDeleteMachineIdentitySubmit(
-                (popUp?.deleteMachineIdentity?.data as { machineId: string })?.machineId
-              )
-            }
-          />
-        </div>
-    );
-  },
-  { action: OrgPermissionActions.Read, subject: OrgPermissionSubjects.MachineIdentity }
-);

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/components/MachineIdentitySection/MachineIdentityTable.tsx

@@ -1,284 +0,0 @@
-import { faKey,faPencil,faServer, faXmark } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { useNotificationContext } from "@app/components/context/Notifications/NotificationProvider";
-import { OrgPermissionCan } from "@app/components/permissions";
-import {
-    EmptyState,
-    IconButton,
-    Select,
-    SelectItem,
-    Table,
-    TableContainer,
-    TableSkeleton,
-    TBody,
-    Td,
-    Th,
-    THead,
-    Tooltip,
-    Tr} from "@app/components/v2";
-import { 
-    OrgPermissionActions,
-    OrgPermissionSubjects,
-    useOrganization} from "@app/context";
-import {
-    useGetMachineMembershipOrgs,
-    useGetRoles,
-    useUpdateMachineIdentity,
-} from "@app/hooks/api";
-import { MachineTrustedIp } from "@app/hooks/api/machineIdentities/types";
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-type Props = {
-    handlePopUpOpen: (
-      popUpName: keyof UsePopUpState<["deleteMachineIdentity", "machineIdentity", "clientSecret"]>,
-      data?: {
-        machineId?: string;
-        name?: string;
-        role?: string;
-        customRole?: {
-            name: string;
-            slug: string;
-        };
-        clientSecretTrustedIps?: MachineTrustedIp[];
-        accessTokenTrustedIps?: MachineTrustedIp[];
-        accessTokenMaxTTL?: number;
-        accessTokenTTL?: number;
-        accessTokenNumUsesLimit?: number;
-      }
-    ) => void;
-  };
-
-export const MachineIdentityTable = ({
-    handlePopUpOpen
-}: Props) => {
-    const { createNotification } = useNotificationContext();
-    const { currentOrg } = useOrganization();
-    const orgId = currentOrg?._id || "";
-
-    const { mutateAsync: updateMutateAsync } = useUpdateMachineIdentity();
-    const { data, isLoading } = useGetMachineMembershipOrgs(currentOrg?._id || "");
-    
-    const { data: roles } = useGetRoles({
-        orgId
-    });
-    
-    const handleChangeRole = async ({
-        machineId,
-        role
-    }: {
-        machineId: string;
-        role: string;
-    }) => {
-        try {
-            
-            await updateMutateAsync({
-                machineId,
-                role
-            });
-            
-            createNotification({
-                text: "Successfully updated machine identity role",
-                type: "success"
-            });
-        } catch (err) {
-            console.error(err);
-            const error = err as any;
-            const text = error?.response?.data?.message ?? "Failed to update machine identity role"
-            
-            createNotification({
-                text,
-                type: "error"
-              });
-        }
-    }
-
-    // const handleToggleStatus = async ({
-    //     serviceTokenDataId,
-    //     isActive
-    // }: {
-    //     serviceTokenDataId: string;
-    //     isActive: boolean;
-    // }) => {
-    //     try {
-    //         await updateMutateAsync({
-    //             serviceTokenDataId,
-    //             isActive
-    //         });
-
-    //         createNotification({
-    //             text: `Successfully ${isActive ? "enabled" : "disabled"} machine identity`,
-    //             type: "success"
-    //           });
-    //     } catch (err) {
-    //         console.log(err);
-    //         createNotification({
-    //             text: `Failed to ${isActive ? "enable" : "disable"} machine identity`,
-    //             type: "error"
-    //         });
-    //     }
-    // }
-      
-    return (
-        <TableContainer>
-            <Table>
-                <THead>
-                    <Tr>
-                        <Th>Name</Th>
-                        <Th>Client ID</Th>
-                        {/* <Th>Status</Th> */}
-                        <Th>Role</Th>
-                        {/* <Th>Trusted IPs</Th> */}
-                        {/* <Th>Access Token TTL</Th> */}
-                        {/* <Th>Created At</Th> */}
-                        {/* <Th>Valid Until</Th> */}
-                        <Th className="w-5" />
-                    </Tr>
-                </THead>
-                <TBody>
-                    {isLoading && <TableSkeleton columns={7} innerKey="org-machine-identities" />}
-                    {!isLoading &&
-                    data &&
-                    data.length > 0 &&
-                    data.map(({
-                        machineIdentity: {
-                            _id,
-                            name,
-                            clientId,
-                            // isActive,
-                            clientSecretTrustedIps,
-                            accessTokenTrustedIps,
-                            // createdAt,
-                            // expiresAt,
-                            accessTokenMaxTTL,
-                            accessTokenTTL,
-                            accessTokenNumUsesLimit
-                        },
-                        role,
-                        customRole
-                    }) => {
-                        return (
-                            <Tr className="h-10" key={`machine-identity-${_id}`}>
-                                <Td>{name}</Td>
-                                <Td>{clientId}</Td>
-                                <Td>
-                                    <OrgPermissionCan
-                                        I={OrgPermissionActions.Edit}
-                                        a={OrgPermissionSubjects.MachineIdentity}
-                                    >
-                                        {(isAllowed) => {
-                                            return (
-                                                <Select
-                                                    value={
-                                                        role === "custom" ? (customRole?.slug as string) : role
-                                                    }
-                                                    isDisabled={!isAllowed}
-                                                    className="w-40 bg-mineshaft-600"
-                                                    dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
-                                                    onValueChange={(selectedRole) => 
-                                                        handleChangeRole({
-                                                            machineId: _id,
-                                                            role: selectedRole
-                                                        })
-                                                    }
-                                                >
-                                                    {(roles || [])
-                                                        .map(({ slug, name: roleName }) => (
-                                                            <SelectItem value={slug} key={`owner-option-${slug}`}>
-                                                            {roleName}
-                                                            </SelectItem>
-                                                        ))}
-                                                </Select>
-                                            );
-                                        }}
-                                    </OrgPermissionCan>
-                                </Td> 
-                                <Td>
-                                    <div className="flex justify-end items-center">
-                                    <Tooltip content="Manage client secrets">
-                                        <IconButton
-                                            onClick={async () => {
-                                                handlePopUpOpen("clientSecret", {
-                                                    machineId: _id,
-                                                    name
-                                                });
-                                            }}
-                                            size="lg"
-                                            colorSchema="primary"
-                                            variant="plain"
-                                            ariaLabel="update"
-                                            // isDisabled={!isAllowed}
-                                        >
-                                            <FontAwesomeIcon icon={faKey} />
-                                        </IconButton>
-                                    </Tooltip>
-                                    <OrgPermissionCan
-                                        I={OrgPermissionActions.Edit}
-                                        a={OrgPermissionSubjects.MachineIdentity}
-                                    >
-                                        {(isAllowed) => (
-                                            <IconButton
-                                                onClick={async () => {
-                                                    handlePopUpOpen("machineIdentity", {
-                                                        machineId: _id,
-                                                        name,
-                                                        role,
-                                                        customRole,
-                                                        clientSecretTrustedIps,
-                                                        accessTokenTrustedIps,
-                                                        accessTokenTTL,
-                                                        accessTokenMaxTTL,
-                                                        accessTokenNumUsesLimit
-                                                    });
-                                                }}
-                                                size="lg"
-                                                colorSchema="primary"
-                                                variant="plain"
-                                                ariaLabel="update"
-                                                className="ml-4"
-                                                isDisabled={!isAllowed}
-                                            >
-                                                <FontAwesomeIcon icon={faPencil} />
-                                            </IconButton>
-                                        )}
-                                    </OrgPermissionCan>
-                                    <OrgPermissionCan
-                                        I={OrgPermissionActions.Delete}
-                                        a={OrgPermissionSubjects.MachineIdentity}
-                                    >
-                                        {(isAllowed) => (
-                                            <IconButton
-                                                onClick={() => {
-                                                    handlePopUpOpen("deleteMachineIdentity", {
-                                                        machineId: _id,
-                                                        name
-                                                    });
-                                                }}
-                                                size="lg"
-                                                colorSchema="danger"
-                                                variant="plain"
-                                                ariaLabel="update"
-                                                className="ml-4"
-                                                isDisabled={!isAllowed}
-                                            >
-                                                <FontAwesomeIcon icon={faXmark} />
-                                            </IconButton>
-                                        )}
-                                    </OrgPermissionCan>
-                                    </div>
-                                </Td>
-                            </Tr>
-                        );
-                    })}
-                    {!isLoading && data && data?.length === 0 && (
-                        <Tr>
-                            <Td colSpan={7}>
-                                <EmptyState title="No machine identities have been created in this organization" icon={faServer} />
-                            </Td>
-                        </Tr>
-                    )}
-                </TBody>
-            </Table>
-        </TableContainer>
-    );
-}

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/components/MachineIdentitySection/index.tsx

@@ -1 +0,0 @@
-export { MachineIdentitySection } from "./MachineIdentitySection";

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/components/index.tsx

@@ -1 +0,0 @@
-export { MachineIdentitySection } from "./MachineIdentitySection";

frontend/src/views/Org/MembersPage/components/OrgMachineIdentityTab/index.tsx

@@ -1 +0,0 @@
-export { OrgMachineIdentityTab } from "./OrgMachineIdentityTab";

frontend/src/views/Org/MembersPage/components/OrgRoleTabSection/OrgRoleModifySection/OrgRoleModifySection.tsx

@@ -41,9 +41,9 @@ const SIMPLE_PERMISSION_OPTIONS = [
   },
   {
     title: "Machine identity management",
-    subtitle: "Create, view, update and remove machine identities from the organization",
+    subtitle: "Create, view, update and remove (machine) identities from the organization",
     icon: faServer,
-    formName: "machine-identity"
+    formName: "identity"
   },
   {
     title: "Billing & usage",

frontend/src/views/Org/MembersPage/components/OrgRoleTabSection/OrgRoleModifySection/OrgRoleModifySection.utils.ts

@@ -32,7 +32,7 @@ export const formSchema = z.object({
       "secret-scanning": generalPermissionSchema,
       sso: generalPermissionSchema,
       billing: generalPermissionSchema,
-      "machine-identity": generalPermissionSchema
+      "identity": generalPermissionSchema
     })
     .optional()
 });

frontend/src/views/Org/MembersPage/components/index.tsx

@@ -1,3 +1,3 @@
-export { OrgMachineIdentityTab } from "./OrgMachineIdentityTab";
+export { OrgIdentityTab } from "./OrgIdentityTab";
 export { OrgMembersTab } from "./OrgMembersTab";
 export { OrgRoleTabSection } from "./OrgRoleTabSection";

frontend/src/views/Project/AuditLogsPage/components/LogsFilter.tsx

@@ -50,11 +50,11 @@ export const LogsFilter = ({ control, reset }: Props) => {
             {actor.metadata.name}
           </SelectItem>
         );
-      case ActorType.MACHINE:
+      case ActorType.IDENTITY:
         return (
           <SelectItem
-            value={`${actor.type}-${actor.metadata.machineId}`}
-            key={`machine-filter-${actor.metadata.machineId}`}
+            value={`${actor.type}-${actor.metadata.identityId}`}
+            key={`identity-filter-${actor.metadata.identityId}`}
           >
             {actor.metadata.name}
           </SelectItem>

frontend/src/views/Project/AuditLogsPage/components/LogsTableRow.tsx

@@ -29,11 +29,11 @@ export const LogsTableRow = ({
                         <p>Service token</p>
                     </Td>
                 ); 
-            case ActorType.MACHINE:
+            case ActorType.IDENTITY:
                     return (
                         <Td>
                             <p>{`${actor.metadata.name}`}</p>
-                            <p>Machine identity</p>
+                            <p>Machine Identity</p>
                         </Td>
                     );
             default:
@@ -167,22 +167,24 @@ export const LogsTableRow = ({
                         <p>{`Name: ${event.metadata.name}`}</p>
                     </Td>
                 );
-                case EventType.CREATE_MACHINE_IDENTITY:
+                case EventType.CREATE_IDENTITY:
                     return (
                         <Td>
+                            <p>{`ID: ${event.metadata.identityId}`}</p>
                             <p>{`Name: ${event.metadata.name}`}</p>
                         </Td>
                     );
-                case EventType.UPDATE_MACHINE_IDENTITY:
+                case EventType.UPDATE_IDENTITY:
                     return (
                         <Td>
+                            <p>{`ID: ${event.metadata.identityId}`}</p>
                             <p>{`Name: ${event.metadata.name}`}</p>
                         </Td>
                     );
-                case EventType.DELETE_MACHINE_IDENTITY:
+                case EventType.DELETE_IDENTITY:
                     return (
                         <Td>
-                            <p>{`Name: ${event.metadata.name}`}</p>
+                            <p>{`ID: ${event.metadata.identityId}`}</p>
                         </Td>
                     );
             case EventType.CREATE_ENVIRONMENT:

frontend/src/views/Project/MembersPage/MembersPage.tsx

@@ -6,7 +6,7 @@ import { ProjectPermissionActions, ProjectPermissionSub } from "@app/context";
 import { withProjectPermission } from "@app/hoc";
 
 import {
-  MachineIdentityTab,
+  IdentityTab,
   MemberListTab,
   ProjectRoleListTab,
   ServiceTokenTab
@@ -15,7 +15,7 @@ import {
 enum TabSections {
   Member = "members",
   Roles = "roles",
-  MachineIdentities = "machine-identities",
+  Identities = "identities",
   ServiceTokens = "service-tokens"
 }
 
@@ -30,7 +30,7 @@ export const MembersPage = withProjectPermission(
           <Tabs defaultValue={TabSections.Member}>
             <TabList>
               <Tab value={TabSections.Member}>People</Tab>
-              <Tab value={TabSections.MachineIdentities}>
+              <Tab value={TabSections.Identities}>
                 <div className="flex items-center">
                   <p>Machine Identities</p>
                   <div className="ml-2 rounded-md text-yellow text-sm inline-block bg-yellow/20 px-1.5 pb-[0.03rem] pt-[0.04rem] opacity-80 hover:opacity-100 cursor-default">
@@ -52,8 +52,8 @@ export const MembersPage = withProjectPermission(
                 <MemberListTab />
               </motion.div>
             </TabPanel>
-            <TabPanel value={TabSections.MachineIdentities}>
-              <MachineIdentityTab />
+            <TabPanel value={TabSections.Identities}>
+              <IdentityTab />
             </TabPanel>
             <TabPanel value={TabSections.ServiceTokens}>
               <ServiceTokenTab />

frontend/src/views/Project/MembersPage/components/IdentityTab/IdentityTab.tsx

@@ -1,19 +1,19 @@
 import { motion } from "framer-motion";
 
 import { 
-    MachineIdentitySection
+    IdentitySection,
 } from "./components";
 
-export const MachineIdentityTab = () => {
+export const IdentityTab = () => {
     return (
         <motion.div
-            key="panel-machine-identity"
+            key="panel-identity"
             transition={{ duration: 0.15 }}
             initial={{ opacity: 0, translateX: 30 }}
             animate={{ opacity: 1, translateX: 0 }}
             exit={{ opacity: 0, translateX: 30 }}
         >
-            <MachineIdentitySection />
+            <IdentitySection />
         </motion.div>
     );
 }

frontend/src/views/Project/MembersPage/components/IdentityTab/components/IdentitySection/IdentityModal.tsx

@@ -18,26 +18,26 @@ import {
     useWorkspace
 } from "@app/context";
 import { 
-    useAddMachineToWorkspace,
-    useGetMachineMembershipOrgs,
+    useAddIdentityToWorkspace,
+    useGetIdentityMembershipOrgs,
     useGetRoles,
-    useGetWorkspaceMachineMemberships
+    useGetWorkspaceIdentityMemberships
 } from "@app/hooks/api";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 const schema = yup.object({
-    machineId: yup.string().required("Machine identity id is required"),
+    identityId: yup.string().required("Identity id is required"),
     role: yup.string()
 }).required();
 
 export type FormData = yup.InferType<typeof schema>;
 
 type Props = {
-  popUp: UsePopUpState<["machineIdentity"]>;
-  handlePopUpToggle: (popUpName: keyof UsePopUpState<["machineIdentity"]>, state?: boolean) => void;
+  popUp: UsePopUpState<["identity"]>;
+  handlePopUpToggle: (popUpName: keyof UsePopUpState<["identity"]>, state?: boolean) => void;
 };
 
-export const AddMachineIdentityModal = ({
+export const IdentityModal = ({
     popUp,
     handlePopUpToggle
 }: Props) => {
@@ -48,28 +48,28 @@ export const AddMachineIdentityModal = ({
 
     const orgId = currentOrg?._id || "";
     const workspaceId = currentWorkspace?._id || "";
-
-    const { data: machineMembershipOrgs } = useGetMachineMembershipOrgs(orgId);
-    const { data: machineMemberships } = useGetWorkspaceMachineMemberships(workspaceId);
+    
+    const { data: identityMembershipOrgs } = useGetIdentityMembershipOrgs(orgId);
+    const { data: identityMemberships } = useGetWorkspaceIdentityMemberships(workspaceId);
 
     const { data: roles } = useGetRoles({
         orgId,
         workspaceId
     });
 
-    const { mutateAsync: addMachineToWorkspaceMutateAsync } = useAddMachineToWorkspace();
+    const { mutateAsync: addIdentityToWorkspaceMutateAsync } = useAddIdentityToWorkspace();
     
-    const filteredMachineMembershipOrgs = useMemo(() => {
-        const wsMachineIds = new Map();
+    const filteredIdentityMembershipOrgs = useMemo(() => {
+        const wsIdentityIds = new Map();
         
-        machineMemberships?.forEach((machineMembership) => {
-            wsMachineIds.set(machineMembership.machineIdentity._id, true);
+        identityMemberships?.forEach((identityMembership) => {
+            wsIdentityIds.set(identityMembership.identity._id, true);
         });
         
-        return (machineMembershipOrgs || []).filter(
-          ({ machineIdentity: mi }) => !wsMachineIds.has(mi._id)
+        return (identityMembershipOrgs || []).filter(
+          ({ identity: i }) => !wsIdentityIds.has(i._id)
         );
-    }, [machineMembershipOrgs, machineMemberships]);
+    }, [identityMembershipOrgs, identityMemberships]);
     
     const {
         control,
@@ -81,29 +81,29 @@ export const AddMachineIdentityModal = ({
     });
     
     const onFormSubmit = async ({
-        machineId,
+        identityId,
         role
     }: FormData) => {
         try {
-        
-            await addMachineToWorkspaceMutateAsync({
+
+            await addIdentityToWorkspaceMutateAsync({
                 workspaceId,
-                machineId,
+                identityId,
                 role: role || undefined
             });
-
+            
             createNotification({
-                text: "Successfully added machine identity to project",
+                text: "Successfully added identity to project",
                 type: "success"
             });
 
             reset();
-            handlePopUpToggle("machineIdentity", false);
+            handlePopUpToggle("identity", false);
         } catch (err) {
             console.error(err);
             const error = err as any;
             const text = error?.response?.data?.message
-                ?? "Failed to add machine identity to project";
+                ?? "Failed to add identity to project";
             
             createNotification({
                 text,
@@ -114,22 +114,22 @@ export const AddMachineIdentityModal = ({
     
     return (
         <Modal
-            isOpen={popUp?.machineIdentity?.isOpen}
+            isOpen={popUp?.identity?.isOpen}
                 onOpenChange={(isOpen) => {
-                handlePopUpToggle("machineIdentity", isOpen);
+                handlePopUpToggle("identity", isOpen);
                 reset();
             }}
         >
-            <ModalContent title="Add Machine Identity to Project">
-                {filteredMachineMembershipOrgs.length ? (
+            <ModalContent title="Add Identity to Project">
+                {filteredIdentityMembershipOrgs.length ? (
                     <form onSubmit={handleSubmit(onFormSubmit)}>
                         <Controller
                             control={control}
-                            name="machineId"
-                            defaultValue={filteredMachineMembershipOrgs?.[0]?._id}
+                            name="identityId"
+                            defaultValue={filteredIdentityMembershipOrgs?.[0]?._id}
                             render={({ field: { onChange, ...field }, fieldState: { error } }) => (
                                 <FormControl
-                                    label="Machine Identity"
+                                    label="Identity"
                                     errorText={error?.message}
                                     isError={Boolean(error)}
                                 >
@@ -139,9 +139,9 @@ export const AddMachineIdentityModal = ({
                                         onValueChange={(e) => onChange(e)}
                                         className="w-full"
                                     >
-                                        {filteredMachineMembershipOrgs.map(({ machineIdentity }) => (
-                                            <SelectItem value={machineIdentity._id} key={`org-service-${machineIdentity._id}`}>
-                                                {machineIdentity.name}
+                                        {filteredIdentityMembershipOrgs.map(({ identity }) => (
+                                            <SelectItem value={identity._id} key={`org-identity-${identity._id}`}>
+                                                {identity.name}
                                             </SelectItem>
                                         ))}
                                     </Select>
@@ -182,7 +182,7 @@ export const AddMachineIdentityModal = ({
                                 isLoading={isSubmitting}
                                 isDisabled={isSubmitting}
                             >
-                                {popUp?.machineIdentity?.data ? "Update" : "Create"}
+                                {popUp?.identity?.data ? "Update" : "Create"}
                             </Button>
                             <Button colorSchema="secondary" variant="plain">
                                 Cancel
@@ -191,9 +191,9 @@ export const AddMachineIdentityModal = ({
                     </form>
                 ) : (
                     <div className="flex flex-col space-y-4">
-                        <div>All the machine identities in your organization are already added.</div>
+                        <div>All identities in your organization are already added.</div>
                         <Link href={`/org/${currentWorkspace?.organization}/members`}>
-                            <Button variant="outline_bg">Create a new/another machine identities</Button>
+                            <Button variant="outline_bg">Create a new/another identities</Button>
                         </Link>
                     </div>
                 )}

frontend/src/views/Project/MembersPage/components/IdentityTab/components/IdentitySection/IdentitySection.tsx

@@ -12,47 +12,45 @@ import {
   ProjectPermissionSub, 
   useWorkspace} from "@app/context";
 import { withProjectPermission } from "@app/hoc";
-import {
-  useDeleteMachineFromWorkspace
-} from "@app/hooks/api";
+import { useDeleteIdentityFromWorkspace } from "@app/hooks/api";
 import { usePopUp } from "@app/hooks/usePopUp";
 
-import { AddMachineIdentityModal } from "./AddMachineIdentityModal";
-import { MachineIdentityTable } from "./MachineIdentityTable";
+import { IdentityModal } from "./IdentityModal";
+import { IdentityTable } from "./IdentityTable";
 
-export const MachineIdentitySection = withProjectPermission(
+export const IdentitySection = withProjectPermission(
   () => {
     const { createNotification } = useNotificationContext();
     const { currentWorkspace } = useWorkspace();
 
     const workspaceId = currentWorkspace?._id ?? "";
 
-    const { mutateAsync: deleteMutateAsync } = useDeleteMachineFromWorkspace();
+    const { mutateAsync: deleteMutateAsync } = useDeleteIdentityFromWorkspace();
     
     const { popUp, handlePopUpOpen, handlePopUpClose,  handlePopUpToggle } = usePopUp([
-      "machineIdentity",
-      "deleteMachineIdentity",
+      "identity",
+      "deleteIdentity",
       "upgradePlan"
     ] as const);
     
-    const onRemoveMachineIdentitySubmit = async (machineId: string) => {
+    const onRemoveIdentitySubmit = async (identityId: string) => {
       try {
 
         await deleteMutateAsync({
-          machineId,
-          workspaceId
+            identityId,
+            workspaceId
         });
-        
+
         createNotification({
-            text: "Successfully removed machine identity from project",
+            text: "Successfully removed identity from project",
             type: "success"
         });
         
-        handlePopUpClose("deleteMachineIdentity");
+        handlePopUpClose("deleteIdentity");
       } catch (err) {
         console.error(err);
         const error = err as any;
-        const text = error?.response?.data?.message ?? "Failed to remove machine identity from project"
+        const text = error?.response?.data?.message ?? "Failed to remove identity from project"
         
         createNotification({
             text,
@@ -65,18 +63,18 @@ export const MachineIdentitySection = withProjectPermission(
         <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
           <div className="flex justify-between mb-8">
             <p className="text-xl font-semibold text-mineshaft-100">
-              Machine Identities
+                Identities
             </p>
             <ProjectPermissionCan
               I={ProjectPermissionActions.Create}
-              a={ProjectPermissionSub.MachineIdentity}
+              a={ProjectPermissionSub.Identity}
             >
               {(isAllowed) => (
                 <Button
                   colorSchema="secondary"
                   type="submit"
                   leftIcon={<FontAwesomeIcon icon={faPlus} />}
-                  onClick={() => handlePopUpOpen("machineIdentity")}
+                  onClick={() => handlePopUpOpen("identity")}
                   isDisabled={!isAllowed}
                 >
                   Add identity
@@ -84,28 +82,28 @@ export const MachineIdentitySection = withProjectPermission(
               )}
             </ProjectPermissionCan>
           </div>
-          <MachineIdentityTable 
-            handlePopUpOpen={handlePopUpOpen}
-          />
-          <AddMachineIdentityModal 
-            popUp={popUp}
-            handlePopUpToggle={handlePopUpToggle}
-          />
+            <IdentityTable 
+                handlePopUpOpen={handlePopUpOpen}
+            />
+            <IdentityModal 
+                popUp={popUp}
+                handlePopUpToggle={handlePopUpToggle}
+            />
           <DeleteActionModal
-            isOpen={popUp.deleteMachineIdentity.isOpen}
+            isOpen={popUp.deleteIdentity.isOpen}
             title={`Are you sure want to remove ${
-              (popUp?.deleteMachineIdentity?.data as { name: string })?.name || ""
+              (popUp?.deleteIdentity?.data as { name: string })?.name || ""
             } from the project?`}
-            onChange={(isOpen) => handlePopUpToggle("deleteMachineIdentity", isOpen)}
+            onChange={(isOpen) => handlePopUpToggle("deleteIdentity", isOpen)}
             deleteKey="confirm"
             onDeleteApproved={() => 
-              onRemoveMachineIdentitySubmit(
-                (popUp?.deleteMachineIdentity?.data as { machineId: string })?.machineId
+              onRemoveIdentitySubmit(
+                (popUp?.deleteIdentity?.data as { identityId: string })?.identityId
               )
             }
           />
         </div>
     );
   },
-  { action: ProjectPermissionActions.Read, subject: ProjectPermissionSub.MachineIdentity }
+  { action: ProjectPermissionActions.Read, subject: ProjectPermissionSub.Identity }
 );

frontend/src/views/Project/MembersPage/components/IdentityTab/components/IdentitySection/IdentityTable.tsx

@@ -26,31 +26,21 @@ import {
 } from "@app/context";
 import {
     useGetRoles,
-    useGetWorkspaceMachineMemberships,
-    useUpdateMachineWorkspaceRole
-} from "@app/hooks/api";
-import { MachineTrustedIp} from "@app/hooks/api/machineIdentities/types";
+    useGetWorkspaceIdentityMemberships,
+    useUpdateIdentityWorkspaceRole} from "@app/hooks/api";
 import { UsePopUpState } from "@app/hooks/usePopUp";
 
 type Props = {
     handlePopUpOpen: (
-      popUpName: keyof UsePopUpState<["deleteMachineIdentity", "machineIdentity"]>,
+      popUpName: keyof UsePopUpState<["deleteIdentity", "identity"]>,
       data?: {
-        machineId?: string;
+        identityId?: string;
         name?: string;
-        role?: string;
-        customRole?: {
-            name: string;
-            slug: string;
-        };
-        trustedIps?: MachineTrustedIp[];
-        accessTokenTTL?: number;
-        isRefreshTokenRotationEnabled?: boolean;
       }
     ) => void;
 };
 
-export const MachineIdentityTable = ({
+export const IdentityTable = ({
     handlePopUpOpen
 }: Props) => {
     const { createNotification } = useNotificationContext();
@@ -58,39 +48,38 @@ export const MachineIdentityTable = ({
     const { currentWorkspace } = useWorkspace();
     const orgId = currentOrg?._id || "";
     const workspaceId = currentWorkspace?._id || "";
-
-    const { data, isLoading } = useGetWorkspaceMachineMemberships(currentWorkspace?._id || "");
-
+    const { data, isLoading } = useGetWorkspaceIdentityMemberships(currentWorkspace?._id || "");
+    
     const { data: roles } = useGetRoles({
         orgId,
         workspaceId
     });
 
-    const { mutateAsync: updateMutateAsync } = useUpdateMachineWorkspaceRole();
+    const { mutateAsync: updateMutateAsync } = useUpdateIdentityWorkspaceRole();
 
     const handleChangeRole = async ({
-        machineId,
+        identityId,
         role
     }: {
-        machineId: string;
+        identityId: string;
         role: string;
     }) => {
         try {
 
             await updateMutateAsync({
-                machineId,
+                identityId,
                 workspaceId,
                 role
             });
             
             createNotification({
-                text: "Successfully updated machine identity role",
+                text: "Successfully updated identity role",
                 type: "success"
             });
         } catch (err) {
             console.error(err);
             const error = err as any;
-            const text = error?.response?.data?.message ?? "Failed to update machine identity role"
+            const text = error?.response?.data?.message ?? "Failed to update identity role"
             
             createNotification({
                 text,
@@ -111,12 +100,12 @@ export const MachineIdentityTable = ({
                     </Tr>
                 </THead>
                 <TBody>
-                    {isLoading && <TableSkeleton columns={7} innerKey="project-machine-identities" />}
+                    {isLoading && <TableSkeleton columns={7} innerKey="project-identities" />}
                     {!isLoading &&
                     data &&
                     data.length > 0 &&
                     data.map(({
-                        machineIdentity: {
+                        identity: {
                             _id,
                             name
                         },
@@ -130,7 +119,7 @@ export const MachineIdentityTable = ({
                                 <Td>
                                     <ProjectPermissionCan
                                         I={ProjectPermissionActions.Edit}
-                                        a={ProjectPermissionSub.MachineIdentity}
+                                        a={ProjectPermissionSub.Identity}
                                     >
                                         {(isAllowed) => {
                                             return (
@@ -143,7 +132,7 @@ export const MachineIdentityTable = ({
                                                     dropdownContainerClassName="border border-mineshaft-600 bg-mineshaft-800"
                                                     onValueChange={(selectedRole) => 
                                                         handleChangeRole({
-                                                            machineId: _id,
+                                                            identityId: _id,
                                                             role: selectedRole
                                                         })
                                                     }
@@ -163,13 +152,13 @@ export const MachineIdentityTable = ({
                                 <Td className="flex justify-end">
                                     <ProjectPermissionCan
                                         I={ProjectPermissionActions.Delete}
-                                        a={ProjectPermissionSub.MachineIdentity}
+                                        a={ProjectPermissionSub.Identity}
                                     >
                                         {(isAllowed) => (
                                             <IconButton
                                                 onClick={() => {
-                                                    handlePopUpOpen("deleteMachineIdentity", {
-                                                        machineId: _id,
+                                                    handlePopUpOpen("deleteIdentity", {
+                                                        identityId: _id,
                                                         name
                                                     });
                                                 }}
@@ -191,7 +180,7 @@ export const MachineIdentityTable = ({
                     {!isLoading && data && data?.length === 0 && (
                         <Tr>
                             <Td colSpan={7}>
-                                <EmptyState title="No machine identities have been added to this project" icon={faServer} />
+                                <EmptyState title="No identities have been added to this project" icon={faServer} />
                             </Td>
                         </Tr>
                     )}

frontend/src/views/Project/MembersPage/components/IdentityTab/components/IdentitySection/index.tsx

@@ -0,0 +1 @@
+export { IdentitySection } from "./IdentitySection";

frontend/src/views/Project/MembersPage/components/IdentityTab/components/index.tsx

@@ -0,0 +1 @@
+export { IdentitySection } from "./IdentitySection";

frontend/src/views/Project/MembersPage/components/IdentityTab/index.tsx

@@ -0,0 +1 @@
+export { IdentityTab } from "./IdentityTab";

frontend/src/views/Project/MembersPage/components/MachineIdentityTab/components/MachineIdentitySection/index.tsx

@@ -1 +0,0 @@
-export { MachineIdentitySection } from "./MachineIdentitySection";

frontend/src/views/Project/MembersPage/components/MachineIdentityTab/components/index.tsx

@@ -1 +0,0 @@
-export { MachineIdentitySection } from "./MachineIdentitySection";

frontend/src/views/Project/MembersPage/components/MachineIdentityTab/index.tsx

@@ -1 +0,0 @@
-export { MachineIdentityTab } from "./MachineIdentityTab";

frontend/src/views/Project/MembersPage/components/ProjectRoleListTab/components/ProjectRoleModifySection/ProjectRoleModifySection.tsx

@@ -62,9 +62,9 @@ const SINGLE_PERMISSION_LIST = [
   },
   {
     title: "Machine identity management",
-    subtitle: "Add, view, update and remove machine identities from the project",
+    subtitle: "Add, view, update and remove (machine) identities from the project",
     icon: faServer,
-    formName: "machine-identity"
+    formName: "identity"
   },
   {
     title: "Webhooks",

frontend/src/views/Project/MembersPage/components/ProjectRoleListTab/components/ProjectRoleModifySection/ProjectRoleModifySection.utils.ts

@@ -33,7 +33,7 @@ export const formSchema = z.object({
     .object({
       secrets: z.record(multiEnvPermissionSchema).optional(),
       member: generalPermissionSchema,
-      "machine-identity": generalPermissionSchema,
+      "identity": generalPermissionSchema,
       role: generalPermissionSchema,
       integrations: generalPermissionSchema,
       webhooks: generalPermissionSchema,

frontend/src/views/Project/MembersPage/components/ProjectRoleListTab/components/ProjectRoleModifySection/SingleProjectPermission.tsx

@@ -23,7 +23,7 @@ type Props = {
     | "tags"
     | "audit-logs"
     | "ip-allowlist"
-    | "machine-identity"
+    | "identity"
     | ProjectPermissionSub.SecretApproval;
   isNonEditable?: boolean;
   setValue: UseFormSetValue<TFormSchema>;

frontend/src/views/Project/MembersPage/components/index.tsx

@@ -1,4 +1,4 @@
-export { MachineIdentityTab } from "./MachineIdentityTab";
+export { IdentityTab } from "./IdentityTab";
 export { MemberListTab } from "./MemberListTab";
 export { ProjectRoleListTab } from "./ProjectRoleListTab";
 export { ServiceTokenTab } from "./ServiceTokenTab";