Merge remote-tracking branch 'origin/main' into ENG-3546

backend/package.json

@@ -37,7 +37,7 @@
     "build": "tsup --sourcemap",
     "build:frontend": "npm run build --prefix ../frontend",
     "start": "node --enable-source-maps dist/main.mjs",
-    "type:check": "tsc --noEmit",
+    "type:check": "node --max-old-space-size=8192 ./node_modules/.bin/tsc --noEmit",
     "lint:fix": "node --max-old-space-size=8192 ./node_modules/.bin/eslint --fix --ext js,ts ./src",
     "lint": "node --max-old-space-size=8192 ./node_modules/.bin/eslint 'src/**/*.ts'",
     "test:unit": "vitest run -c vitest.unit.config.ts",

backend/src/@types/fastify.d.ts

@@ -83,6 +83,7 @@ import { TIdentityUaServiceFactory } from "@app/services/identity-ua/identity-ua
 import { TIntegrationServiceFactory } from "@app/services/integration/integration-service";
 import { TIntegrationAuthServiceFactory } from "@app/services/integration-auth/integration-auth-service";
 import { TMicrosoftTeamsServiceFactory } from "@app/services/microsoft-teams/microsoft-teams-service";
+import { TOfflineUsageReportServiceFactory } from "@app/services/offline-usage-report/offline-usage-report-service";
 import { TOrgRoleServiceFactory } from "@app/services/org/org-role-service";
 import { TOrgServiceFactory } from "@app/services/org/org-service";
 import { TOrgAdminServiceFactory } from "@app/services/org-admin/org-admin-service";
@@ -115,7 +116,6 @@ import { TUserServiceFactory } from "@app/services/user/user-service";
 import { TUserEngagementServiceFactory } from "@app/services/user-engagement/user-engagement-service";
 import { TWebhookServiceFactory } from "@app/services/webhook/webhook-service";
 import { TWorkflowIntegrationServiceFactory } from "@app/services/workflow-integration/workflow-integration-service";
-import { TOfflineUsageReportServiceFactory } from "@app/services/offline-usage-report/offline-usage-report-service";
 
 declare module "@fastify/request-context" {
   interface RequestContextData {

backend/src/ee/routes/v1/github-org-sync-router.ts

@@ -126,4 +126,39 @@ export const registerGithubOrgSyncRouter = async (server: FastifyZodProvider) =>
       return { githubOrgSyncConfig };
     }
   });
+
+  server.route({
+    url: "/sync-all-teams",
+    method: "POST",
+    config: {
+      rateLimit: writeLimit
+    },
+    onRequest: verifyAuth([AuthMode.JWT]),
+    schema: {
+      response: {
+        200: z.object({
+          totalUsers: z.number(),
+          errors: z.array(z.string()),
+          createdTeams: z.array(z.string()),
+          updatedTeams: z.array(z.string()),
+          removedMemberships: z.number(),
+          syncDuration: z.number()
+        })
+      }
+    },
+    handler: async (req) => {
+      const result = await server.services.githubOrgSync.syncAllTeams({
+        orgPermission: req.permission
+      });
+
+      return {
+        totalUsers: result.totalUsers,
+        errors: result.errors,
+        createdTeams: result.createdTeams,
+        updatedTeams: result.updatedTeams,
+        removedMemberships: result.removedMemberships,
+        syncDuration: result.syncDuration
+      };
+    }
+  });
 };

backend/src/ee/services/github-org-sync/github-org-sync-service.ts

@@ -1,14 +1,19 @@
+/* eslint-disable @typescript-eslint/return-await */
+/* eslint-disable no-await-in-loop */
 import { ForbiddenError } from "@casl/ability";
 import { Octokit } from "@octokit/core";
 import { paginateGraphql } from "@octokit/plugin-paginate-graphql";
 import { Octokit as OctokitRest } from "@octokit/rest";
+import RE2 from "re2";
 
 import { OrgMembershipRole } from "@app/db/schemas";
 import { BadRequestError, NotFoundError } from "@app/lib/errors";
 import { groupBy } from "@app/lib/fn";
 import { logger } from "@app/lib/logger";
+import { retryWithBackoff } from "@app/lib/retry";
 import { TKmsServiceFactory } from "@app/services/kms/kms-service";
 import { KmsDataKey } from "@app/services/kms/kms-types";
+import { TOrgMembershipDALFactory } from "@app/services/org-membership/org-membership-dal";
 
 import { TGroupDALFactory } from "../group/group-dal";
 import { TUserGroupMembershipDALFactory } from "../group/user-group-membership-dal";
@@ -16,20 +21,67 @@ import { TLicenseServiceFactory } from "../license/license-service";
 import { OrgPermissionActions, OrgPermissionSubjects } from "../permission/org-permission";
 import { TPermissionServiceFactory } from "../permission/permission-service-types";
 import { TGithubOrgSyncDALFactory } from "./github-org-sync-dal";
-import { TCreateGithubOrgSyncDTO, TDeleteGithubOrgSyncDTO, TUpdateGithubOrgSyncDTO } from "./github-org-sync-types";
+import {
+  TCreateGithubOrgSyncDTO,
+  TDeleteGithubOrgSyncDTO,
+  TSyncAllTeamsDTO,
+  TSyncResult,
+  TUpdateGithubOrgSyncDTO,
+  TValidateGithubTokenDTO
+} from "./github-org-sync-types";
 
 const OctokitWithPlugin = Octokit.plugin(paginateGraphql);
 
+// Type definitions for GitHub API errors
+interface GitHubApiError extends Error {
+  status?: number;
+  response?: {
+    status?: number;
+    headers?: {
+      "x-ratelimit-reset"?: string;
+    };
+  };
+}
+
+interface OrgMembershipWithUser {
+  id: string;
+  orgId: string;
+  role: string;
+  status: string;
+  isActive: boolean;
+  inviteEmail: string | null;
+  user: {
+    id: string;
+    email: string;
+    username: string | null;
+    firstName: string | null;
+    lastName: string | null;
+  } | null;
+}
+
+interface GroupMembership {
+  id: string;
+  groupId: string;
+  groupName: string;
+  orgMembershipId: string;
+  firstName: string | null;
+  lastName: string | null;
+}
+
 type TGithubOrgSyncServiceFactoryDep = {
   githubOrgSyncDAL: TGithubOrgSyncDALFactory;
   permissionService: Pick<TPermissionServiceFactory, "getOrgPermission">;
   kmsService: Pick<TKmsServiceFactory, "createCipherPairWithDataKey">;
   userGroupMembershipDAL: Pick<
     TUserGroupMembershipDALFactory,
-    "findGroupMembershipsByUserIdInOrg" | "insertMany" | "delete"
+    "findGroupMembershipsByUserIdInOrg" | "findGroupMembershipsByGroupIdInOrg" | "insertMany" | "delete"
   >;
   groupDAL: Pick<TGroupDALFactory, "insertMany" | "transaction" | "find">;
   licenseService: Pick<TLicenseServiceFactory, "getPlan">;
+  orgMembershipDAL: Pick<
+    TOrgMembershipDALFactory,
+    "find" | "findOrgMembershipById" | "findOrgMembershipsWithUsersByOrgId"
+  >;
 };
 
 export type TGithubOrgSyncServiceFactory = ReturnType<typeof githubOrgSyncServiceFactory>;
@@ -40,7 +92,8 @@ export const githubOrgSyncServiceFactory = ({
   kmsService,
   userGroupMembershipDAL,
   groupDAL,
-  licenseService
+  licenseService,
+  orgMembershipDAL
 }: TGithubOrgSyncServiceFactoryDep) => {
   const createGithubOrgSync = async ({
     githubOrgName,
@@ -304,8 +357,8 @@ export const githubOrgSyncServiceFactory = ({
     const removeFromTeams = infisicalUserGroups.filter((el) => !githubUserTeamSet.has(el.groupName));
 
     if (newTeams.length || updateTeams.length || removeFromTeams.length) {
-      await groupDAL.transaction(async (tx) => {
       if (newTeams.length) {
+        await groupDAL.transaction(async (tx) => {
           const newGroups = await groupDAL.insertMany(
             newTeams.map((newGroupName) => ({
               name: newGroupName,
@@ -322,9 +375,11 @@ export const githubOrgSyncServiceFactory = ({
             })),
             tx
           );
+        });
       }
 
       if (updateTeams.length) {
+        await groupDAL.transaction(async (tx) => {
           await userGroupMembershipDAL.insertMany(
             updateTeams.map((el) => ({
               groupId: githubUserTeamOnInfisicalGroupByName[el][0].id,
@@ -332,16 +387,433 @@ export const githubOrgSyncServiceFactory = ({
             })),
             tx
           );
+        });
       }
 
       if (removeFromTeams.length) {
+        await groupDAL.transaction(async (tx) => {
           await userGroupMembershipDAL.delete(
             { userId, $in: { groupId: removeFromTeams.map((el) => el.groupId) } },
             tx
           );
+        });
+      }
+    }
+  };
+
+  const validateGithubToken = async ({ orgPermission, githubOrgAccessToken }: TValidateGithubTokenDTO) => {
+    const { permission } = await permissionService.getOrgPermission(
+      orgPermission.type,
+      orgPermission.id,
+      orgPermission.orgId,
+      orgPermission.authMethod,
+      orgPermission.orgId
+    );
+
+    ForbiddenError.from(permission).throwUnlessCan(OrgPermissionActions.Read, OrgPermissionSubjects.GithubOrgSync);
+
+    const plan = await licenseService.getPlan(orgPermission.orgId);
+    if (!plan.githubOrgSync) {
+      throw new BadRequestError({
+        message:
+          "Failed to validate GitHub token due to plan restriction. Upgrade plan to use GitHub organization sync."
+      });
+    }
+
+    const config = await githubOrgSyncDAL.findOne({ orgId: orgPermission.orgId });
+    if (!config) {
+      throw new BadRequestError({ message: "GitHub organization sync is not configured" });
+    }
+
+    try {
+      const testOctokit = new OctokitRest({
+        auth: githubOrgAccessToken,
+        request: {
+          signal: AbortSignal.timeout(10000)
+        }
+      });
+
+      const { data: org } = await testOctokit.rest.orgs.get({
+        org: config.githubOrgName
+      });
+
+      const octokitGraphQL = new OctokitWithPlugin({
+        auth: githubOrgAccessToken,
+        request: {
+          signal: AbortSignal.timeout(10000)
+        }
+      });
+
+      await octokitGraphQL.graphql(`query($org: String!) { organization(login: $org) { id name } }`, {
+        org: config.githubOrgName
+      });
+
+      return {
+        valid: true,
+        organizationInfo: {
+          id: org.id,
+          login: org.login,
+          name: org.name || org.login,
+          publicRepos: org.public_repos,
+          privateRepos: org.owned_private_repos || 0
+        }
+      };
+    } catch (error) {
+      logger.error(error, `GitHub token validation failed for org ${config.githubOrgName}`);
+
+      const gitHubError = error as GitHubApiError;
+      const statusCode = gitHubError.status || gitHubError.response?.status;
+      if (statusCode) {
+        if (statusCode === 401) {
+          throw new BadRequestError({
+            message: "GitHub access token is invalid or expired."
+          });
+        }
+        if (statusCode === 403) {
+          throw new BadRequestError({
+            message:
+              "GitHub access token lacks required permissions. Required: 1) 'read:org' scope for organization teams, 2) Token owner must be an organization member with team visibility access, 3) Organization settings must allow team visibility. Check GitHub token scopes and organization member permissions."
+          });
+        }
+        if (statusCode === 404) {
+          throw new BadRequestError({
+            message: `Organization '${config.githubOrgName}' not found or access token does not have access to it.`
+          });
+        }
+      }
+
+      throw new BadRequestError({
+        message: `GitHub token validation failed: ${(error as Error).message}`
+      });
+    }
+  };
+
+  const syncAllTeams = async ({ orgPermission }: TSyncAllTeamsDTO): Promise<TSyncResult> => {
+    const { permission } = await permissionService.getOrgPermission(
+      orgPermission.type,
+      orgPermission.id,
+      orgPermission.orgId,
+      orgPermission.authMethod,
+      orgPermission.orgId
+    );
+
+    ForbiddenError.from(permission).throwUnlessCan(
+      OrgPermissionActions.Edit,
+      OrgPermissionSubjects.GithubOrgSyncManual
+    );
+
+    const plan = await licenseService.getPlan(orgPermission.orgId);
+    if (!plan.githubOrgSync) {
+      throw new BadRequestError({
+        message:
+          "Failed to sync all GitHub teams due to plan restriction. Upgrade plan to use GitHub organization sync."
+      });
+    }
+
+    const config = await githubOrgSyncDAL.findOne({ orgId: orgPermission.orgId });
+    if (!config || !config?.isActive) {
+      throw new BadRequestError({ message: "GitHub organization sync is not configured or not active" });
+    }
+
+    const { decryptor } = await kmsService.createCipherPairWithDataKey({
+      type: KmsDataKey.Organization,
+      orgId: orgPermission.orgId
+    });
+
+    if (!config.encryptedGithubOrgAccessToken) {
+      throw new BadRequestError({
+        message: "GitHub organization access token is required. Please set a token first."
+      });
+    }
+
+    const orgAccessToken = decryptor({ cipherTextBlob: config.encryptedGithubOrgAccessToken }).toString();
+
+    try {
+      const testOctokit = new OctokitRest({
+        auth: orgAccessToken,
+        request: {
+          signal: AbortSignal.timeout(10000)
+        }
+      });
+
+      await testOctokit.rest.orgs.get({
+        org: config.githubOrgName
+      });
+
+      await testOctokit.rest.users.getAuthenticated();
+    } catch (error) {
+      throw new BadRequestError({
+        message: "Stored GitHub access token is invalid or expired. Please set a new token."
+      });
+    }
+
+    const allMembers = await orgMembershipDAL.findOrgMembershipsWithUsersByOrgId(orgPermission.orgId);
+    const activeMembers = allMembers.filter(
+      (member) => member.status === "accepted" && member.isActive
+    ) as OrgMembershipWithUser[];
+
+    const startTime = Date.now();
+    const syncErrors: string[] = [];
+
+    const octokit = new OctokitWithPlugin({
+      auth: orgAccessToken,
+      request: {
+        signal: AbortSignal.timeout(30000)
+      }
+    });
+
+    const data = await retryWithBackoff(async () => {
+      return octokit.graphql
+        .paginate<{
+          organization: {
+            teams: {
+              totalCount: number;
+              edges: {
+                node: {
+                  name: string;
+                  description: string;
+                  members: {
+                    edges: {
+                      node: {
+                        login: string;
+                      };
+                    }[];
+                  };
+                };
+              }[];
+            };
+          };
+        }>(
+          `
+        query orgTeams($cursor: String, $org: String!) {
+          organization(login: $org) {
+            teams(first: 100, after: $cursor) {
+              totalCount
+              edges {
+                node {
+                  name
+                  description
+                  members(first: 100) {
+                    edges {
+                      node {
+                        login
+                      }
+                    }
+                  }
+                }
+              }
+              pageInfo {
+                hasNextPage
+                endCursor
+              }
+            }
+          }
+        }
+        `,
+          {
+            org: config.githubOrgName
+          }
+        )
+        .catch((err) => {
+          logger.error(err, "GitHub GraphQL error for batched team sync");
+
+          const gitHubError = err as GitHubApiError;
+          const statusCode = gitHubError.status || gitHubError.response?.status;
+          if (statusCode) {
+            if (statusCode === 401) {
+              throw new BadRequestError({
+                message: "GitHub access token is invalid or expired. Please provide a new token."
+              });
+            }
+            if (statusCode === 403) {
+              throw new BadRequestError({
+                message:
+                  "GitHub access token lacks required permissions for organization team sync. Required: 1) 'admin:org' scope, 2) Token owner must be organization owner or have team read permissions, 3) Organization settings must allow team visibility. Check token scopes and user role."
+              });
+            }
+            if (statusCode === 404) {
+              throw new BadRequestError({
+                message: `Organization ${config.githubOrgName} not found or access token does not have sufficient permissions to read it.`
+              });
+            }
+          }
+
+          if ((err as Error)?.message?.includes("Although you appear to have the correct authorization credential")) {
+            throw new BadRequestError({
+              message:
+                "Organization has restricted OAuth app access. Please check that: 1) Your organization has approved the Infisical OAuth application, 2) The token owner has sufficient organization permissions."
+            });
+          }
+          throw new BadRequestError({ message: `GitHub GraphQL query failed: ${(err as Error)?.message}` });
+        });
+    });
+
+    const {
+      organization: { teams }
+    } = data;
+
+    const userTeamMap = new Map<string, string[]>();
+    const allGithubUsernamesInTeams = new Set<string>();
+
+    teams?.edges?.forEach((teamEdge) => {
+      const teamName = teamEdge.node.name.toLowerCase();
+
+      teamEdge.node.members.edges.forEach((memberEdge) => {
+        const username = memberEdge.node.login.toLowerCase();
+        allGithubUsernamesInTeams.add(username);
+
+        if (!userTeamMap.has(username)) {
+          userTeamMap.set(username, []);
+        }
+        userTeamMap.get(username)!.push(teamName);
+      });
+    });
+
+    const allGithubTeamNames = Array.from(new Set(teams?.edges?.map((edge) => edge.node.name.toLowerCase()) || []));
+
+    const existingTeamsOnInfisical = await groupDAL.find({
+      orgId: orgPermission.orgId,
+      $in: { name: allGithubTeamNames }
+    });
+    const existingTeamsMap = groupBy(existingTeamsOnInfisical, (i) => i.name);
+
+    const teamsToCreate = allGithubTeamNames.filter((teamName) => !(teamName in existingTeamsMap));
+    const createdTeams = new Set<string>();
+    const updatedTeams = new Set<string>();
+    const totalRemovedMemberships = 0;
+
+    await groupDAL.transaction(async (tx) => {
+      if (teamsToCreate.length > 0) {
+        const newGroups = await groupDAL.insertMany(
+          teamsToCreate.map((teamName) => ({
+            name: teamName,
+            role: OrgMembershipRole.Member,
+            slug: teamName,
+            orgId: orgPermission.orgId
+          })),
+          tx
+        );
+
+        newGroups.forEach((group) => {
+          if (!existingTeamsMap[group.name]) {
+            existingTeamsMap[group.name] = [];
+          }
+          existingTeamsMap[group.name].push(group);
+          createdTeams.add(group.name);
+        });
+      }
+
+      const allTeams = [...Object.values(existingTeamsMap).flat()];
+
+      for (const team of allTeams) {
+        const teamName = team.name.toLowerCase();
+
+        const currentMemberships = (await userGroupMembershipDAL.findGroupMembershipsByGroupIdInOrg(
+          team.id,
+          orgPermission.orgId
+        )) as GroupMembership[];
+
+        const expectedUserIds = new Set<string>();
+        teams?.edges?.forEach((teamEdge) => {
+          if (teamEdge.node.name.toLowerCase() === teamName) {
+            teamEdge.node.members.edges.forEach((memberEdge) => {
+              const githubUsername = memberEdge.node.login.toLowerCase();
+
+              const matchingMember = activeMembers.find((member) => {
+                const email = member.user?.email || member.inviteEmail;
+                if (!email) return false;
+
+                const emailPrefix = email.split("@")[0].toLowerCase();
+                const emailDomain = email.split("@")[1].toLowerCase();
+
+                if (emailPrefix === githubUsername) {
+                  return true;
+                }
+                const domainName = emailDomain.split(".")[0];
+                if (githubUsername.endsWith(domainName) && githubUsername.length > domainName.length) {
+                  const baseUsername = githubUsername.slice(0, -domainName.length);
+                  if (emailPrefix === baseUsername) {
+                    return true;
+                  }
+                }
+                const emailSplitRegex = new RE2(/[._-]/);
+                const emailParts = emailPrefix.split(emailSplitRegex);
+                const longestEmailPart = emailParts.reduce((a, b) => (a.length > b.length ? a : b), "");
+                if (longestEmailPart.length >= 4 && githubUsername.includes(longestEmailPart)) {
+                  return true;
+                }
+                return false;
+              });
+
+              if (matchingMember?.user?.id) {
+                expectedUserIds.add(matchingMember.user.id);
+                logger.info(
+                  `Matched GitHub user ${githubUsername} to email ${matchingMember.user?.email || matchingMember.inviteEmail}`
+                );
               }
             });
           }
+        });
+
+        const currentUserIds = new Set<string>();
+        currentMemberships.forEach((membership) => {
+          const activeMember = activeMembers.find((am) => am.id === membership.orgMembershipId);
+          if (activeMember?.user?.id) {
+            currentUserIds.add(activeMember.user.id);
+          }
+        });
+
+        const usersToAdd = Array.from(expectedUserIds).filter((userId) => !currentUserIds.has(userId));
+
+        const membershipsToRemove = currentMemberships.filter((membership) => {
+          const activeMember = activeMembers.find((am) => am.id === membership.orgMembershipId);
+          return activeMember?.user?.id && !expectedUserIds.has(activeMember.user.id);
+        });
+
+        if (usersToAdd.length > 0) {
+          await userGroupMembershipDAL.insertMany(
+            usersToAdd.map((userId) => ({
+              userId,
+              groupId: team.id
+            })),
+            tx
+          );
+          updatedTeams.add(teamName);
+        }
+
+        if (membershipsToRemove.length > 0) {
+          await userGroupMembershipDAL.delete(
+            {
+              $in: {
+                id: membershipsToRemove.map((m) => m.id)
+              }
+            },
+            tx
+          );
+          updatedTeams.add(teamName);
+        }
+      }
+    });
+
+    const syncDuration = Date.now() - startTime;
+
+    logger.info(
+      {
+        orgId: orgPermission.orgId,
+        createdTeams: createdTeams.size,
+        syncDuration
+      },
+      "GitHub team sync completed"
+    );
+
+    return {
+      totalUsers: activeMembers.length,
+      errors: syncErrors,
+      createdTeams: Array.from(createdTeams),
+      updatedTeams: Array.from(updatedTeams),
+      removedMemberships: totalRemovedMemberships,
+      syncDuration
+    };
   };
 
   return {
@@ -349,6 +821,8 @@ export const githubOrgSyncServiceFactory = ({
     updateGithubOrgSync,
     deleteGithubOrgSync,
     getGithubOrgSync,
-    syncUserGroups
+    syncUserGroups,
+    syncAllTeams,
+    validateGithubToken
   };
 };

backend/src/ee/services/github-org-sync/github-org-sync-types.ts

@@ -21,3 +21,21 @@ export interface TDeleteGithubOrgSyncDTO {
 export interface TGetGithubOrgSyncDTO {
   orgPermission: OrgServiceActor;
 }
+
+export interface TSyncAllTeamsDTO {
+  orgPermission: OrgServiceActor;
+}
+
+export interface TSyncResult {
+  totalUsers: number;
+  errors: string[];
+  createdTeams: string[];
+  updatedTeams: string[];
+  removedMemberships: number;
+  syncDuration: number;
+}
+
+export interface TValidateGithubTokenDTO {
+  orgPermission: OrgServiceActor;
+  githubOrgAccessToken: string;
+}

backend/src/ee/services/permission/org-permission.ts

@@ -94,6 +94,7 @@ export enum OrgPermissionSubjects {
   Sso = "sso",
   Scim = "scim",
   GithubOrgSync = "github-org-sync",
+  GithubOrgSyncManual = "github-org-sync-manual",
   Ldap = "ldap",
   Groups = "groups",
   Billing = "billing",
@@ -123,6 +124,7 @@ export type OrgPermissionSet =
   | [OrgPermissionActions, OrgPermissionSubjects.Sso]
   | [OrgPermissionActions, OrgPermissionSubjects.Scim]
   | [OrgPermissionActions, OrgPermissionSubjects.GithubOrgSync]
+  | [OrgPermissionActions, OrgPermissionSubjects.GithubOrgSyncManual]
   | [OrgPermissionActions, OrgPermissionSubjects.Ldap]
   | [OrgPermissionGroupActions, OrgPermissionSubjects.Groups]
   | [OrgPermissionActions, OrgPermissionSubjects.SecretScanning]
@@ -192,6 +194,10 @@ export const OrgPermissionSchema = z.discriminatedUnion("subject", [
     subject: z.literal(OrgPermissionSubjects.GithubOrgSync).describe("The entity this permission pertains to."),
     action: CASL_ACTION_SCHEMA_NATIVE_ENUM(OrgPermissionActions).describe("Describe what action an entity can take.")
   }),
+  z.object({
+    subject: z.literal(OrgPermissionSubjects.GithubOrgSyncManual).describe("The entity this permission pertains to."),
+    action: CASL_ACTION_SCHEMA_NATIVE_ENUM(OrgPermissionActions).describe("Describe what action an entity can take.")
+  }),
   z.object({
     subject: z.literal(OrgPermissionSubjects.Ldap).describe("The entity this permission pertains to."),
     action: CASL_ACTION_SCHEMA_NATIVE_ENUM(OrgPermissionActions).describe("Describe what action an entity can take.")
@@ -315,6 +321,11 @@ const buildAdminPermission = () => {
   can(OrgPermissionActions.Edit, OrgPermissionSubjects.GithubOrgSync);
   can(OrgPermissionActions.Delete, OrgPermissionSubjects.GithubOrgSync);
 
+  can(OrgPermissionActions.Read, OrgPermissionSubjects.GithubOrgSyncManual);
+  can(OrgPermissionActions.Create, OrgPermissionSubjects.GithubOrgSyncManual);
+  can(OrgPermissionActions.Edit, OrgPermissionSubjects.GithubOrgSyncManual);
+  can(OrgPermissionActions.Delete, OrgPermissionSubjects.GithubOrgSyncManual);
+
   can(OrgPermissionActions.Read, OrgPermissionSubjects.Ldap);
   can(OrgPermissionActions.Create, OrgPermissionSubjects.Ldap);
   can(OrgPermissionActions.Edit, OrgPermissionSubjects.Ldap);

backend/src/keystore/keystore.ts

@@ -41,6 +41,7 @@ export const KeyStorePrefixes = {
   SecretRotationLock: (rotationId: string) => `secret-rotation-v2-mutex-${rotationId}` as const,
   SecretScanningLock: (dataSourceId: string, resourceExternalId: string) =>
     `secret-scanning-v2-mutex-${dataSourceId}-${resourceExternalId}` as const,
+  IdentityLockoutLock: (lockoutKey: string) => `identity-lockout-lock-${lockoutKey}` as const,
   CaOrderCertificateForSubscriberLock: (subscriberId: string) =>
     `ca-order-certificate-for-subscriber-lock-${subscriberId}` as const,
   SecretSyncLastRunTimestamp: (syncId: string) => `secret-sync-last-run-${syncId}` as const,

backend/src/lib/ip/index.test.ts

@@ -0,0 +1,121 @@
+import { extractIPDetails, IPType, isValidCidr, isValidIp, isValidIpOrCidr } from "./index";
+
+describe("IP Validation", () => {
+  describe("isValidIp", () => {
+    test("should validate IPv4 addresses with ports", () => {
+      expect(isValidIp("192.168.1.1:8080")).toBe(true);
+      expect(isValidIp("10.0.0.1:1234")).toBe(true);
+      expect(isValidIp("172.16.0.1:80")).toBe(true);
+    });
+
+    test("should validate IPv6 addresses with ports", () => {
+      expect(isValidIp("[2001:db8::1]:8080")).toBe(true);
+      expect(isValidIp("[fe80::1ff:fe23:4567:890a]:1234")).toBe(true);
+      expect(isValidIp("[::1]:80")).toBe(true);
+    });
+
+    test("should validate regular IPv4 addresses", () => {
+      expect(isValidIp("192.168.1.1")).toBe(true);
+      expect(isValidIp("10.0.0.1")).toBe(true);
+      expect(isValidIp("172.16.0.1")).toBe(true);
+    });
+
+    test("should validate regular IPv6 addresses", () => {
+      expect(isValidIp("2001:db8::1")).toBe(true);
+      expect(isValidIp("fe80::1ff:fe23:4567:890a")).toBe(true);
+      expect(isValidIp("::1")).toBe(true);
+    });
+
+    test("should reject invalid IP addresses", () => {
+      expect(isValidIp("256.256.256.256")).toBe(false);
+      expect(isValidIp("192.168.1")).toBe(false);
+      expect(isValidIp("192.168.1.1.1")).toBe(false);
+      expect(isValidIp("2001:db8::1::1")).toBe(false);
+      expect(isValidIp("invalid")).toBe(false);
+    });
+
+    test("should reject malformed IP addresses with ports", () => {
+      expect(isValidIp("192.168.1.1:")).toBe(false);
+      expect(isValidIp("192.168.1.1:abc")).toBe(false);
+      expect(isValidIp("[2001:db8::1]")).toBe(false);
+      expect(isValidIp("[2001:db8::1]:")).toBe(false);
+      expect(isValidIp("[2001:db8::1]:abc")).toBe(false);
+    });
+  });
+
+  describe("isValidCidr", () => {
+    test("should validate IPv4 CIDR blocks", () => {
+      expect(isValidCidr("192.168.1.0/24")).toBe(true);
+      expect(isValidCidr("10.0.0.0/8")).toBe(true);
+      expect(isValidCidr("172.16.0.0/16")).toBe(true);
+    });
+
+    test("should validate IPv6 CIDR blocks", () => {
+      expect(isValidCidr("2001:db8::/32")).toBe(true);
+      expect(isValidCidr("fe80::/10")).toBe(true);
+      expect(isValidCidr("::/0")).toBe(true);
+    });
+
+    test("should reject invalid CIDR blocks", () => {
+      expect(isValidCidr("192.168.1.0/33")).toBe(false);
+      expect(isValidCidr("2001:db8::/129")).toBe(false);
+      expect(isValidCidr("192.168.1.0/abc")).toBe(false);
+      expect(isValidCidr("invalid/24")).toBe(false);
+    });
+  });
+
+  describe("isValidIpOrCidr", () => {
+    test("should validate both IP addresses and CIDR blocks", () => {
+      expect(isValidIpOrCidr("192.168.1.1")).toBe(true);
+      expect(isValidIpOrCidr("2001:db8::1")).toBe(true);
+      expect(isValidIpOrCidr("192.168.1.0/24")).toBe(true);
+      expect(isValidIpOrCidr("2001:db8::/32")).toBe(true);
+    });
+
+    test("should reject invalid inputs", () => {
+      expect(isValidIpOrCidr("invalid")).toBe(false);
+      expect(isValidIpOrCidr("192.168.1.0/33")).toBe(false);
+      expect(isValidIpOrCidr("2001:db8::/129")).toBe(false);
+    });
+  });
+
+  describe("extractIPDetails", () => {
+    test("should extract IPv4 address details", () => {
+      const result = extractIPDetails("192.168.1.1");
+      expect(result).toEqual({
+        ipAddress: "192.168.1.1",
+        type: IPType.IPV4
+      });
+    });
+
+    test("should extract IPv6 address details", () => {
+      const result = extractIPDetails("2001:db8::1");
+      expect(result).toEqual({
+        ipAddress: "2001:db8::1",
+        type: IPType.IPV6
+      });
+    });
+
+    test("should extract IPv4 CIDR details", () => {
+      const result = extractIPDetails("192.168.1.0/24");
+      expect(result).toEqual({
+        ipAddress: "192.168.1.0",
+        type: IPType.IPV4,
+        prefix: 24
+      });
+    });
+
+    test("should extract IPv6 CIDR details", () => {
+      const result = extractIPDetails("2001:db8::/32");
+      expect(result).toEqual({
+        ipAddress: "2001:db8::",
+        type: IPType.IPV6,
+        prefix: 32
+      });
+    });
+
+    test("should throw error for invalid IP", () => {
+      expect(() => extractIPDetails("invalid")).toThrow("Failed to extract IP details");
+    });
+  });
+});

backend/src/lib/ip/index.ts

@@ -1,5 +1,7 @@
 import net from "node:net";
 
+import RE2 from "re2";
+
 import { ForbiddenRequestError } from "../errors";
 
 export enum IPType {
@@ -7,25 +9,55 @@ export enum IPType {
   IPV6 = "ipv6"
 }
 
+const PORT_REGEX = new RE2(/^\d+$/);
+
+/**
+ * Strips port from IP address if present.
+ * Handles both IPv4 (e.g. 1.2.3.4:1234) and IPv6 (e.g. [2001:db8::1]:8080) formats.
+ * Returns the IP address without port and a boolean indicating if a port was present.
+ */
+const stripPort = (ip: string): { ipAddress: string } => {
+  // Handle IPv6 with port (e.g. [2001:db8::1]:8080)
+  if (ip.startsWith("[") && ip.includes("]:")) {
+    const endBracketIndex = ip.indexOf("]");
+    if (endBracketIndex === -1) return { ipAddress: ip };
+    const ipPart = ip.slice(1, endBracketIndex);
+    const portPart = ip.slice(endBracketIndex + 2);
+    if (!portPart || !PORT_REGEX.test(portPart)) return { ipAddress: ip };
+    return { ipAddress: ipPart };
+  }
+
+  // Handle IPv4 with port (e.g. 1.2.3.4:1234)
+  if (ip.includes(":")) {
+    const [ipPart, portPart] = ip.split(":");
+    if (!portPart || !PORT_REGEX.test(portPart)) return { ipAddress: ip };
+    return { ipAddress: ipPart };
+  }
+
+  return { ipAddress: ip };
+};
+
 /**
  * Return details of IP [ip]:
  * - If [ip] is a specific IP address then return the IPv4/IPv6 address
  * - If [ip] is a subnet then return the network IPv4/IPv6 address and prefix
  */
 export const extractIPDetails = (ip: string) => {
-  if (net.isIPv4(ip))
+  const { ipAddress } = stripPort(ip);
+
+  if (net.isIPv4(ipAddress))
     return {
-      ipAddress: ip,
+      ipAddress,
       type: IPType.IPV4
     };
 
-  if (net.isIPv6(ip))
+  if (net.isIPv6(ipAddress))
     return {
-      ipAddress: ip,
+      ipAddress,
       type: IPType.IPV6
     };
 
-  const [ipNet, prefix] = ip.split("/");
+  const [ipNet, prefix] = ipAddress.split("/");
 
   let type;
   switch (net.isIP(ipNet)) {
@@ -57,7 +89,8 @@ export const extractIPDetails = (ip: string) => {
  *
  */
 export const isValidCidr = (cidr: string): boolean => {
-  const [ip, prefix] = cidr.split("/");
+  const { ipAddress } = stripPort(cidr);
+  const [ip, prefix] = ipAddress.split("/");
 
   const prefixNum = parseInt(prefix, 10);
 
@@ -90,13 +123,15 @@ export const isValidCidr = (cidr: string): boolean => {
  *
  */
 export const isValidIpOrCidr = (ip: string): boolean => {
+  const { ipAddress } = stripPort(ip);
+
   // if the string contains a slash, treat it as a CIDR block
-  if (ip.includes("/")) {
-    return isValidCidr(ip);
+  if (ipAddress.includes("/")) {
+    return isValidCidr(ipAddress);
   }
 
   // otherwise, treat it as a standalone IP address
-  if (net.isIPv4(ip) || net.isIPv6(ip)) {
+  if (net.isIPv4(ipAddress) || net.isIPv6(ipAddress)) {
     return true;
   }
 
@@ -104,7 +139,8 @@ export const isValidIpOrCidr = (ip: string): boolean => {
 };
 
 export const isValidIp = (ip: string) => {
-  return net.isIPv4(ip) || net.isIPv6(ip);
+  const { ipAddress } = stripPort(ip);
+  return net.isIPv4(ipAddress) || net.isIPv6(ipAddress);
 };
 
 export type TIp = {
@@ -112,6 +148,7 @@ export type TIp = {
   type: IPType;
   prefix: number;
 };
+
 /**
  * Validates the IP address [ipAddress] against the trusted IPs [trustedIps].
  */
@@ -126,8 +163,9 @@ export const checkIPAgainstBlocklist = ({ ipAddress, trustedIps }: { ipAddress:
     }
   }
 
-  const { type } = extractIPDetails(ipAddress);
-  const check = blockList.check(ipAddress, type);
+  const { type, ipAddress: cleanIpAddress } = extractIPDetails(ipAddress);
+
+  const check = blockList.check(cleanIpAddress, type);
 
   if (!check)
     throw new ForbiddenRequestError({

backend/src/lib/retry/index.ts

@@ -0,0 +1,43 @@
+/* eslint-disable no-await-in-loop */
+interface GitHubApiError extends Error {
+  status?: number;
+  response?: {
+    status?: number;
+    headers?: {
+      "x-ratelimit-reset"?: string;
+    };
+  };
+}
+
+const delay = (ms: number) =>
+  new Promise<void>((resolve) => {
+    setTimeout(() => resolve(), ms);
+  });
+
+export const retryWithBackoff = async <T>(fn: () => Promise<T>, maxRetries = 3, baseDelay = 1000): Promise<T> => {
+  let lastError: Error;
+
+  for (let attempt = 0; attempt <= maxRetries; attempt += 1) {
+    try {
+      return await fn();
+    } catch (error) {
+      lastError = error as Error;
+      const gitHubError = error as GitHubApiError;
+      const statusCode = gitHubError.status || gitHubError.response?.status;
+      if (statusCode === 403) {
+        const rateLimitReset = gitHubError.response?.headers?.["x-ratelimit-reset"];
+        if (rateLimitReset) {
+          const resetTime = parseInt(rateLimitReset, 10) * 1000;
+          const waitTime = Math.max(resetTime - Date.now(), baseDelay);
+          await delay(Math.min(waitTime, 60000));
+        } else {
+          await delay(baseDelay * 2 ** attempt);
+        }
+      } else if (attempt < maxRetries) {
+        await delay(baseDelay * 2 ** attempt);
+      }
+    }
+  }
+
+  throw lastError!;
+};

backend/src/server/routes/index.ts

@@ -683,7 +683,8 @@ export const registerRoutes = async (
     kmsService,
     permissionService,
     groupDAL,
-    userGroupMembershipDAL
+    userGroupMembershipDAL,
+    orgMembershipDAL
   });
 
   const ldapService = ldapConfigServiceFactory({
@@ -844,7 +845,9 @@ export const registerRoutes = async (
     licenseService,
     kmsService,
     microsoftTeamsService,
-    invalidateCacheQueue
+    invalidateCacheQueue,
+    smtpService,
+    tokenService
   });
 
   const offlineUsageReportService = offlineUsageReportServiceFactory({

backend/src/server/routes/v1/admin-router.ts

@@ -13,6 +13,7 @@ import { crypto } from "@app/lib/crypto/cryptography";
 import { BadRequestError } from "@app/lib/errors";
 import { invalidateCacheLimit, readLimit, writeLimit } from "@app/server/config/rateLimiter";
 import { addAuthOriginDomainCookie } from "@app/server/lib/cookie";
+import { GenericResourceNameSchema } from "@app/server/lib/schemas";
 import { getTelemetryDistinctId } from "@app/server/lib/telemetry";
 import { verifySuperAdmin } from "@app/server/plugins/auth/superAdmin";
 import { verifyAuth } from "@app/server/plugins/auth/verify-auth";
@@ -217,7 +218,8 @@ export const registerAdminRouter = async (server: FastifyZodProvider) => {
                 }),
                 membershipId: z.string(),
                 role: z.string(),
-                roleId: z.string().nullish()
+                roleId: z.string().nullish(),
+                status: z.string().nullish()
               })
               .array(),
             projects: z
@@ -841,7 +843,92 @@ export const registerAdminRouter = async (server: FastifyZodProvider) => {
     }
   });
 
-  // Usage Report Routes
+  server.route({
+    method: "POST",
+    url: "/organization-management/organizations",
+    config: {
+      rateLimit: writeLimit
+    },
+    schema: {
+      body: z.object({
+        name: GenericResourceNameSchema,
+        inviteAdminEmails: z.string().email().array().min(1)
+      }),
+      response: {
+        200: z.object({
+          organization: OrganizationsSchema
+        })
+      }
+    },
+    onRequest: (req, res, done) => {
+      verifyAuth([AuthMode.JWT, AuthMode.IDENTITY_ACCESS_TOKEN])(req, res, () => {
+        verifySuperAdmin(req, res, done);
+      });
+    },
+    handler: async (req) => {
+      const organization = await server.services.superAdmin.createOrganization(req.body, req.permission);
+      return { organization };
+    }
+  });
+
+  server.route({
+    method: "POST",
+    url: "/organization-management/organizations/:organizationId/memberships/:membershipId/resend-invite",
+    config: {
+      rateLimit: writeLimit
+    },
+    schema: {
+      params: z.object({
+        organizationId: z.string(),
+        membershipId: z.string()
+      }),
+      response: {
+        200: z.object({
+          organizationMembership: OrgMembershipsSchema
+        })
+      }
+    },
+    onRequest: (req, res, done) => {
+      verifyAuth([AuthMode.JWT, AuthMode.IDENTITY_ACCESS_TOKEN])(req, res, () => {
+        verifySuperAdmin(req, res, done);
+      });
+    },
+    handler: async (req) => {
+      const organizationMembership = await server.services.superAdmin.resendOrgInvite(req.params, req.permission);
+      return { organizationMembership };
+    }
+  });
+
+  server.route({
+    method: "POST",
+    url: "/organization-management/organizations/:organizationId/access",
+    config: {
+      rateLimit: writeLimit
+    },
+    schema: {
+      params: z.object({
+        organizationId: z.string()
+      }),
+      response: {
+        200: z.object({
+          organizationMembership: OrgMembershipsSchema
+        })
+      }
+    },
+    onRequest: (req, res, done) => {
+      verifyAuth([AuthMode.JWT])(req, res, () => {
+        verifySuperAdmin(req, res, done);
+      });
+    },
+    handler: async (req) => {
+      const organizationMembership = await server.services.superAdmin.joinOrganization(
+        req.params.organizationId,
+        req.permission
+      );
+      return { organizationMembership };
+    }
+  });
+
   server.route({
     method: "POST",
     url: "/usage-report/generate",

backend/src/server/routes/v3/external-migration-router.ts

@@ -2,10 +2,13 @@ import fastifyMultipart from "@fastify/multipart";
 import { z } from "zod";
 
 import { BadRequestError } from "@app/lib/errors";
-import { writeLimit } from "@app/server/config/rateLimiter";
+import { readLimit, writeLimit } from "@app/server/config/rateLimiter";
 import { verifyAuth } from "@app/server/plugins/auth/verify-auth";
 import { AuthMode } from "@app/services/auth/auth-type";
-import { VaultMappingType } from "@app/services/external-migration/external-migration-types";
+import {
+  ExternalMigrationProviders,
+  VaultMappingType
+} from "@app/services/external-migration/external-migration-types";
 
 const MB25_IN_BYTES = 26214400;
 
@@ -81,4 +84,33 @@ export const registerExternalMigrationRouter = async (server: FastifyZodProvider
       });
     }
   });
+
+  server.route({
+    method: "GET",
+    url: "/custom-migration-enabled/:provider",
+    config: {
+      rateLimit: readLimit
+    },
+    schema: {
+      params: z.object({
+        provider: z.nativeEnum(ExternalMigrationProviders)
+      }),
+      response: {
+        200: z.object({
+          enabled: z.boolean()
+        })
+      }
+    },
+    onRequest: verifyAuth([AuthMode.JWT]),
+    handler: async (req) => {
+      const enabled = await server.services.migration.hasCustomVaultMigration({
+        actorId: req.permission.id,
+        actor: req.permission.type,
+        actorOrgId: req.permission.orgId,
+        actorAuthMethod: req.permission.authMethod,
+        provider: req.params.provider
+      });
+      return { enabled };
+    }
+  });
 };

backend/src/services/app-connection/app-connection-service.ts

@@ -600,7 +600,7 @@ export const appConnectionServiceFactory = ({
     azureClientSecrets: azureClientSecretsConnectionService(connectAppConnectionById, appConnectionDAL, kmsService),
     azureDevOps: azureDevOpsConnectionService(connectAppConnectionById, appConnectionDAL, kmsService),
     auth0: auth0ConnectionService(connectAppConnectionById, appConnectionDAL, kmsService),
-    hcvault: hcVaultConnectionService(connectAppConnectionById),
+    hcvault: hcVaultConnectionService(connectAppConnectionById, gatewayService),
     windmill: windmillConnectionService(connectAppConnectionById),
     teamcity: teamcityConnectionService(connectAppConnectionById),
     oci: ociConnectionService(connectAppConnectionById, licenseService),

backend/src/services/app-connection/auth0/auth0-connection-fns.ts

@@ -91,7 +91,7 @@ export const validateAuth0ConnectionCredentials = async ({ credentials }: TAuth0
     };
   } catch (e: unknown) {
     throw new BadRequestError({
-      message: (e as Error).message ?? `Unable to validate connection: verify credentials`
+      message: (e as Error).message ?? "Unable to validate connection: verify credentials"
     });
   }
 };

backend/src/services/app-connection/azure-app-configuration/azure-app-configuration-connection-fns.ts

@@ -70,7 +70,7 @@ export const validateAzureAppConfigurationConnectionCredentials = async (
           tokenError = e;
         } else {
           throw new BadRequestError({
-            message: `Unable to validate connection: verify credentials`
+            message: "Unable to validate connection: verify credentials"
           });
         }
       }

backend/src/services/app-connection/azure-client-secrets/azure-client-secrets-connection-fns.ts

@@ -186,7 +186,7 @@ export const validateAzureClientSecretsConnectionCredentials = async (config: TA
           tokenError = e;
         } else {
           throw new BadRequestError({
-            message: `Unable to validate connection: verify credentials`
+            message: "Unable to validate connection: verify credentials"
           });
         }
       }

backend/src/services/app-connection/azure-devops/azure-devops-fns.ts

@@ -204,7 +204,7 @@ export const validateAzureDevOpsConnectionCredentials = async (config: TAzureDev
           tokenError = e;
         } else {
           throw new BadRequestError({
-            message: `Unable to validate connection: verify credentials`
+            message: "Unable to validate connection: verify credentials"
           });
         }
       }

backend/src/services/app-connection/azure-key-vault/azure-key-vault-connection-fns.ts

@@ -186,7 +186,7 @@ export const validateAzureKeyVaultConnectionCredentials = async (config: TAzureK
           tokenError = e;
         } else {
           throw new BadRequestError({
-            message: `Unable to validate connection: verify credentials`
+            message: "Unable to validate connection: verify credentials"
           });
         }
       }

backend/src/services/app-connection/camunda/camunda-connection-fns.ts

@@ -82,7 +82,7 @@ export const validateCamundaConnectionCredentials = async (appConnection: TCamun
     };
   } catch (e: unknown) {
     throw new BadRequestError({
-      message: `Unable to validate connection: verify credentials`
+      message: "Unable to validate connection: verify credentials"
     });
   }
 };

backend/src/services/app-connection/databricks/databricks-connection-fns.ts

@@ -89,7 +89,7 @@ export const validateDatabricksConnectionCredentials = async (appConnection: TDa
     };
   } catch (e: unknown) {
     throw new BadRequestError({
-      message: `Unable to validate connection: verify credentials`
+      message: "Unable to validate connection: verify credentials"
     });
   }
 };

backend/src/services/app-connection/github-radar/github-radar-connection-fns.ts

@@ -114,7 +114,7 @@ export const validateGitHubRadarConnectionCredentials = async (config: TGitHubRa
     }
 
     throw new BadRequestError({
-      message: `Unable to validate connection: verify credentials`
+      message: "Unable to validate connection: verify credentials"
     });
   }
 

backend/src/services/app-connection/github/github-connection-fns.ts

@@ -447,7 +447,7 @@ export const validateGitHubConnectionCredentials = async (
     }
 
     throw new BadRequestError({
-      message: `Unable to validate connection: verify credentials`
+      message: "Unable to validate connection: verify credentials"
     });
   }
 

backend/src/services/app-connection/hc-vault/hc-vault-connection-fns.ts

@@ -1,18 +1,18 @@
-import { AxiosError } from "axios";
+import { AxiosError, AxiosRequestConfig, AxiosResponse } from "axios";
+import https from "https";
 
+import { verifyHostInputValidity } from "@app/ee/services/dynamic-secret/dynamic-secret-fns";
+import { TGatewayServiceFactory } from "@app/ee/services/gateway/gateway-service";
 import { request } from "@app/lib/config/request";
 import { BadRequestError } from "@app/lib/errors";
 import { removeTrailingSlash } from "@app/lib/fn";
+import { GatewayProxyProtocol, withGatewayProxy } from "@app/lib/gateway";
+import { logger } from "@app/lib/logger";
 import { blockLocalAndPrivateIpAddresses } from "@app/lib/validator";
 import { AppConnection } from "@app/services/app-connection/app-connection-enums";
 
 import { HCVaultConnectionMethod } from "./hc-vault-connection-enums";
-import {
-  THCVaultConnection,
-  THCVaultConnectionConfig,
-  THCVaultMountResponse,
-  TValidateHCVaultConnectionCredentials
-} from "./hc-vault-connection-types";
+import { THCVaultConnection, THCVaultConnectionConfig, THCVaultMountResponse } from "./hc-vault-connection-types";
 
 export const getHCVaultInstanceUrl = async (config: THCVaultConnectionConfig) => {
   const instanceUrl = removeTrailingSlash(config.credentials.instanceUrl);
@@ -37,7 +37,78 @@ type TokenRespData = {
   };
 };
 
-export const getHCVaultAccessToken = async (connection: TValidateHCVaultConnectionCredentials) => {
+export const requestWithHCVaultGateway = async <T>(
+  appConnection: { gatewayId?: string | null },
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">,
+  requestConfig: AxiosRequestConfig
+): Promise<AxiosResponse<T>> => {
+  const { gatewayId } = appConnection;
+
+  // If gateway isn't set up, don't proxy request
+  if (!gatewayId) {
+    return request.request(requestConfig);
+  }
+
+  const url = new URL(requestConfig.url as string);
+
+  await blockLocalAndPrivateIpAddresses(url.toString());
+
+  const [targetHost] = await verifyHostInputValidity(url.hostname, true);
+  const relayDetails = await gatewayService.fnGetGatewayClientTlsByGatewayId(gatewayId);
+  const [relayHost, relayPort] = relayDetails.relayAddress.split(":");
+
+  return withGatewayProxy(
+    async (proxyPort) => {
+      const httpsAgent = new https.Agent({
+        servername: targetHost
+      });
+
+      url.protocol = "https:";
+      url.host = `localhost:${proxyPort}`;
+
+      const finalRequestConfig: AxiosRequestConfig = {
+        ...requestConfig,
+        url: url.toString(),
+        httpsAgent,
+        headers: {
+          ...requestConfig.headers,
+          Host: targetHost
+        }
+      };
+
+      try {
+        return await request.request(finalRequestConfig);
+      } catch (error) {
+        if (error instanceof AxiosError) {
+          logger.error(
+            { message: error.message, data: (error.response as undefined | { data: unknown })?.data },
+            "Error during HashiCorp Vault gateway request:"
+          );
+        }
+        throw error;
+      }
+    },
+    {
+      protocol: GatewayProxyProtocol.Tcp,
+      targetHost,
+      targetPort: url.port ? Number(url.port) : 8200, // 8200 is the default port for Vault self-hosted/dedicated
+      relayHost,
+      relayPort: Number(relayPort),
+      identityId: relayDetails.identityId,
+      orgId: relayDetails.orgId,
+      tlsOptions: {
+        ca: relayDetails.certChain,
+        cert: relayDetails.certificate,
+        key: relayDetails.privateKey.toString()
+      }
+    }
+  );
+};
+
+export const getHCVaultAccessToken = async (
+  connection: THCVaultConnection,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
   // Return access token directly if not using AppRole method
   if (connection.method !== HCVaultConnectionMethod.AppRole) {
     return connection.credentials.accessToken;
@@ -46,16 +117,16 @@ export const getHCVaultAccessToken = async (connection: TValidateHCVaultConnecti
   // Generate temporary token for AppRole method
   try {
     const { instanceUrl, roleId, secretId } = connection.credentials;
-    const tokenResp = await request.post<TokenRespData>(
-      `${removeTrailingSlash(instanceUrl)}/v1/auth/approle/login`,
-      { role_id: roleId, secret_id: secretId },
-      {
+
+    const tokenResp = await requestWithHCVaultGateway<TokenRespData>(connection, gatewayService, {
+      url: `${removeTrailingSlash(instanceUrl)}/v1/auth/approle/login`,
+      method: "POST",
       headers: {
         "Content-Type": "application/json",
         ...(connection.credentials.namespace ? { "X-Vault-Namespace": connection.credentials.namespace } : {})
-        }
-      }
-    );
+      },
+      data: { role_id: roleId, secret_id: secretId }
+    });
 
     if (tokenResp.status !== 200) {
       throw new BadRequestError({
@@ -71,38 +142,55 @@ export const getHCVaultAccessToken = async (connection: TValidateHCVaultConnecti
   }
 };
 
-export const validateHCVaultConnectionCredentials = async (config: THCVaultConnectionConfig) => {
-  const instanceUrl = await getHCVaultInstanceUrl(config);
+export const validateHCVaultConnectionCredentials = async (
+  connection: THCVaultConnection,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
+  const instanceUrl = await getHCVaultInstanceUrl(connection);
 
   try {
-    const accessToken = await getHCVaultAccessToken(config);
+    const accessToken = await getHCVaultAccessToken(connection, gatewayService);
 
     // Verify token
-    await request.get(`${instanceUrl}/v1/auth/token/lookup-self`, {
+    await requestWithHCVaultGateway(connection, gatewayService, {
+      url: `${instanceUrl}/v1/auth/token/lookup-self`,
+      method: "GET",
       headers: { "X-Vault-Token": accessToken }
     });
 
-    return config.credentials;
+    return connection.credentials;
   } catch (error: unknown) {
+    logger.error(error, "Unable to verify HC Vault connection");
+
     if (error instanceof AxiosError) {
       throw new BadRequestError({
         message: `Failed to validate credentials: ${error.message || "Unknown error"}`
       });
     }
+
+    if (error instanceof BadRequestError) {
+      throw error;
+    }
+
     throw new BadRequestError({
       message: "Unable to validate connection: verify credentials"
     });
   }
 };
 
-export const listHCVaultMounts = async (appConnection: THCVaultConnection) => {
-  const instanceUrl = await getHCVaultInstanceUrl(appConnection);
-  const accessToken = await getHCVaultAccessToken(appConnection);
+export const listHCVaultMounts = async (
+  connection: THCVaultConnection,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
+  const instanceUrl = await getHCVaultInstanceUrl(connection);
+  const accessToken = await getHCVaultAccessToken(connection, gatewayService);
 
-  const { data } = await request.get<THCVaultMountResponse>(`${instanceUrl}/v1/sys/mounts`, {
+  const { data } = await requestWithHCVaultGateway<THCVaultMountResponse>(connection, gatewayService, {
+    url: `${instanceUrl}/v1/sys/mounts`,
+    method: "GET",
     headers: {
       "X-Vault-Token": accessToken,
-      ...(appConnection.credentials.namespace ? { "X-Vault-Namespace": appConnection.credentials.namespace } : {})
+      ...(connection.credentials.namespace ? { "X-Vault-Namespace": connection.credentials.namespace } : {})
     }
   });
 

backend/src/services/app-connection/hc-vault/hc-vault-connection-schemas.ts

@@ -55,11 +55,18 @@ export const HCVaultConnectionSchema = z.intersection(
 export const SanitizedHCVaultConnectionSchema = z.discriminatedUnion("method", [
   BaseHCVaultConnectionSchema.extend({
     method: z.literal(HCVaultConnectionMethod.AccessToken),
-    credentials: HCVaultConnectionAccessTokenCredentialsSchema.pick({})
+    credentials: HCVaultConnectionAccessTokenCredentialsSchema.pick({
+      namespace: true,
+      instanceUrl: true
+    })
   }),
   BaseHCVaultConnectionSchema.extend({
     method: z.literal(HCVaultConnectionMethod.AppRole),
-    credentials: HCVaultConnectionAppRoleCredentialsSchema.pick({})
+    credentials: HCVaultConnectionAppRoleCredentialsSchema.pick({
+      namespace: true,
+      instanceUrl: true,
+      roleId: true
+    })
   })
 ]);
 
@@ -81,7 +88,7 @@ export const ValidateHCVaultConnectionCredentialsSchema = z.discriminatedUnion("
 ]);
 
 export const CreateHCVaultConnectionSchema = ValidateHCVaultConnectionCredentialsSchema.and(
-  GenericCreateAppConnectionFieldsSchema(AppConnection.HCVault)
+  GenericCreateAppConnectionFieldsSchema(AppConnection.HCVault, { supportsGateways: true })
 );
 
 export const UpdateHCVaultConnectionSchema = z
@@ -91,7 +98,7 @@ export const UpdateHCVaultConnectionSchema = z
       .optional()
       .describe(AppConnections.UPDATE(AppConnection.HCVault).credentials)
   })
-  .and(GenericUpdateAppConnectionFieldsSchema(AppConnection.HCVault));
+  .and(GenericUpdateAppConnectionFieldsSchema(AppConnection.HCVault, { supportsGateways: true }));
 
 export const HCVaultConnectionListItemSchema = z.object({
   name: z.literal("HCVault"),

backend/src/services/app-connection/hc-vault/hc-vault-connection-service.ts

@@ -1,3 +1,4 @@
+import { TGatewayServiceFactory } from "@app/ee/services/gateway/gateway-service";
 import { logger } from "@app/lib/logger";
 import { OrgServiceActor } from "@app/lib/types";
 
@@ -11,12 +12,15 @@ type TGetAppConnectionFunc = (
   actor: OrgServiceActor
 ) => Promise<THCVaultConnection>;
 
-export const hcVaultConnectionService = (getAppConnection: TGetAppConnectionFunc) => {
+export const hcVaultConnectionService = (
+  getAppConnection: TGetAppConnectionFunc,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
   const listMounts = async (connectionId: string, actor: OrgServiceActor) => {
     const appConnection = await getAppConnection(AppConnection.HCVault, connectionId, actor);
 
     try {
-      const mounts = await listHCVaultMounts(appConnection);
+      const mounts = await listHCVaultMounts(appConnection, gatewayService);
       return mounts;
     } catch (error) {
       logger.error(error, "Failed to establish connection with Hashicorp Vault");

backend/src/services/auth/auth-login-service.ts

@@ -453,23 +453,24 @@ export const authLoginServiceFactory = ({
 
     const selectedOrg = await orgDAL.findById(organizationId);
 
+    if (!selectedOrgMembership) {
+      throw new ForbiddenRequestError({
+        message: `User does not have access to the organization named ${selectedOrg?.name}`
+      });
+    }
+
     // Check if authEnforced is true and the current auth method is not an enforced method
     if (
       selectedOrg.authEnforced &&
       !isAuthMethodSaml(decodedToken.authMethod) &&
-      decodedToken.authMethod !== AuthMethod.OIDC
+      decodedToken.authMethod !== AuthMethod.OIDC &&
+      !(selectedOrg.bypassOrgAuthEnabled && selectedOrgMembership.userRole === OrgMembershipRole.Admin)
     ) {
       throw new BadRequestError({
         message: "Login with the auth method required by your organization."
       });
     }
 
-    if (!selectedOrgMembership) {
-      throw new ForbiddenRequestError({
-        message: `User does not have access to the organization named ${selectedOrg?.name}`
-      });
-    }
-
     if (selectedOrg.googleSsoAuthEnforced && decodedToken.authMethod !== AuthMethod.GOOGLE) {
       const canBypass = selectedOrg.bypassOrgAuthEnabled && selectedOrgMembership.userRole === OrgMembershipRole.Admin;
 

backend/src/services/external-migration/external-migration-fns/vault.ts

@@ -408,19 +408,123 @@ export const transformToInfisicalFormatNamespaceToProjects = (
   };
 };
 
+export const transformToInfisicalFormatKeyVaultToProjectsCustomC1 = (vaultData: VaultData[]): InfisicalImportData => {
+  const projects: Array<{ name: string; id: string }> = [];
+  const environments: Array<{ name: string; id: string; projectId: string; envParentId?: string }> = [];
+  const folders: Array<{ id: string; name: string; environmentId: string; parentFolderId?: string }> = [];
+  const secrets: Array<{ id: string; name: string; environmentId: string; value: string; folderId?: string }> = [];
+
+  // track created entities to avoid duplicates
+  const projectMap = new Map<string, string>(); // team name -> projectId
+  const environmentMap = new Map<string, string>(); // team-name:envName -> environmentId
+  const folderMap = new Map<string, string>(); // team-name:envName:folderPath -> folderId
+
+  for (const data of vaultData) {
+    const { path, secretData } = data;
+
+    const pathParts = path.split("/").filter(Boolean);
+    if (pathParts.length < 2) {
+      // eslint-disable-next-line no-continue
+      continue;
+    }
+
+    // first level: environment (dev, prod, staging, etc.)
+    const environmentName = pathParts[0];
+    // second level: team name (team1, team2, etc.)
+    const teamName = pathParts[1];
+    // remaining parts: folder structure
+    const folderParts = pathParts.slice(2);
+
+    // create project (team) if if doesn't exist
+    if (!projectMap.has(teamName)) {
+      const projectId = uuidv4();
+      projectMap.set(teamName, projectId);
+      projects.push({
+        name: teamName,
+        id: projectId
+      });
+    }
+    const projectId = projectMap.get(teamName)!;
+
+    // create environment (dev, prod, etc.) for team
+    const envKey = `${teamName}:${environmentName}`;
+    if (!environmentMap.has(envKey)) {
+      const environmentId = uuidv4();
+      environmentMap.set(envKey, environmentId);
+      environments.push({
+        name: environmentName,
+        id: environmentId,
+        projectId
+      });
+    }
+    const environmentId = environmentMap.get(envKey)!;
+
+    // create folder structure for path segments
+    let currentFolderId: string | undefined;
+    let currentPath = "";
+
+    for (const folderName of folderParts) {
+      currentPath = currentPath ? `${currentPath}/${folderName}` : folderName;
+      const folderKey = `${teamName}:${environmentName}:${currentPath}`;
+
+      if (!folderMap.has(folderKey)) {
+        const folderId = uuidv4();
+        folderMap.set(folderKey, folderId);
+        folders.push({
+          id: folderId,
+          name: folderName,
+          environmentId,
+          parentFolderId: currentFolderId || environmentId
+        });
+        currentFolderId = folderId;
+      } else {
+        currentFolderId = folderMap.get(folderKey)!;
+      }
+    }
+
+    for (const [key, value] of Object.entries(secretData)) {
+      secrets.push({
+        id: uuidv4(),
+        name: key,
+        environmentId,
+        value: String(value),
+        folderId: currentFolderId
+      });
+    }
+  }
+
+  return {
+    projects,
+    environments,
+    folders,
+    secrets
+  };
+};
+
+// refer to internal doc for more details on which ID's belong to which orgs.
+// when its a custom migration, then it doesn't matter which mapping type is used (as of now).
+export const vaultMigrationTransformMappings: Record<
+  string,
+  (vaultData: VaultData[], mappingType: VaultMappingType) => InfisicalImportData
+> = {
+  "68c57ab3-cea5-41fc-ae38-e156b10c14d2": transformToInfisicalFormatKeyVaultToProjectsCustomC1
+} as const;
+
 export const importVaultDataFn = async (
   {
     vaultAccessToken,
     vaultNamespace,
     vaultUrl,
     mappingType,
-    gatewayId
+    gatewayId,
+    orgId
   }: {
     vaultAccessToken: string;
     vaultNamespace?: string;
     vaultUrl: string;
     mappingType: VaultMappingType;
     gatewayId?: string;
+    orgId: string;
   },
   { gatewayService }: { gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId"> }
 ) => {
@@ -432,6 +536,25 @@ export const importVaultDataFn = async (
     });
   }
 
+  let transformFn: (vaultData: VaultData[], mappingType: VaultMappingType) => InfisicalImportData;
+
+  if (mappingType === VaultMappingType.Custom) {
+    transformFn = vaultMigrationTransformMappings[orgId];
+
+    if (!transformFn) {
+      throw new BadRequestError({
+        message: "Please contact our sales team to enable custom vault migrations."
+      });
+    }
+  } else {
+    transformFn = transformToInfisicalFormatNamespaceToProjects;
+  }
+
+  logger.info(
+    { orgId, mappingType },
+    `[importVaultDataFn]: Running ${orgId in vaultMigrationTransformMappings ? "custom" : "default"} transform`
+  );
+
   const vaultApi = vaultFactory(gatewayService);
 
   const vaultData = await vaultApi.collectVaultData({
@@ -441,7 +564,5 @@ export const importVaultDataFn = async (
     gatewayId
   });
 
-  const infisicalData = transformToInfisicalFormatNamespaceToProjects(vaultData, mappingType);
-
-  return infisicalData;
+  return transformFn(vaultData, mappingType);
 };

backend/src/services/external-migration/external-migration-service.ts

@@ -5,9 +5,20 @@ import { crypto } from "@app/lib/crypto/cryptography";
 import { BadRequestError, ForbiddenRequestError } from "@app/lib/errors";
 
 import { TUserDALFactory } from "../user/user-dal";
-import { decryptEnvKeyDataFn, importVaultDataFn, parseEnvKeyDataFn } from "./external-migration-fns";
+import {
+  decryptEnvKeyDataFn,
+  importVaultDataFn,
+  parseEnvKeyDataFn,
+  vaultMigrationTransformMappings
+} from "./external-migration-fns";
 import { TExternalMigrationQueueFactory } from "./external-migration-queue";
-import { ExternalPlatforms, TImportEnvKeyDataDTO, TImportVaultDataDTO } from "./external-migration-types";
+import {
+  ExternalMigrationProviders,
+  ExternalPlatforms,
+  THasCustomVaultMigrationDTO,
+  TImportEnvKeyDataDTO,
+  TImportVaultDataDTO
+} from "./external-migration-types";
 
 type TExternalMigrationServiceFactoryDep = {
   permissionService: TPermissionServiceFactory;
@@ -101,7 +112,8 @@ export const externalMigrationServiceFactory = ({
         vaultNamespace,
         vaultUrl,
         mappingType,
-        gatewayId
+        gatewayId,
+        orgId: actorOrgId
       },
       {
         gatewayService
@@ -127,8 +139,37 @@ export const externalMigrationServiceFactory = ({
     });
   };
 
+  const hasCustomVaultMigration = async ({
+    actor,
+    actorId,
+    actorOrgId,
+    actorAuthMethod,
+    provider
+  }: THasCustomVaultMigrationDTO) => {
+    const { membership } = await permissionService.getOrgPermission(
+      actor,
+      actorId,
+      actorOrgId,
+      actorAuthMethod,
+      actorOrgId
+    );
+
+    if (membership.role !== OrgMembershipRole.Admin) {
+      throw new ForbiddenRequestError({ message: "Only admins can check custom migration status" });
+    }
+
+    if (provider !== ExternalMigrationProviders.Vault) {
+      throw new BadRequestError({
+        message: "Invalid provider. Vault is the only supported provider for custom migrations."
+      });
+    }
+
+    return actorOrgId in vaultMigrationTransformMappings;
+  };
+
   return {
     importEnvKeyData,
-    importVaultData
+    importVaultData,
+    hasCustomVaultMigration
   };
 };

backend/src/services/external-migration/external-migration-types.ts

@@ -4,7 +4,8 @@ import { ActorAuthMethod, ActorType } from "../auth/auth-type";
 
 export enum VaultMappingType {
   Namespace = "namespace",
-  KeyVault = "key-vault"
+  KeyVault = "key-vault",
+  Custom = "custom"
 }
 
 export type InfisicalImportData = {
@@ -26,6 +27,10 @@ export type TImportEnvKeyDataDTO = {
   encryptedJson: { nonce: string; data: string };
 } & Omit<TOrgPermission, "orgId">;
 
+export type THasCustomVaultMigrationDTO = {
+  provider: ExternalMigrationProviders;
+} & Omit<TOrgPermission, "orgId">;
+
 export type TImportVaultDataDTO = {
   vaultAccessToken: string;
   vaultNamespace?: string;
@@ -111,3 +116,8 @@ export enum ExternalPlatforms {
   EnvKey = "EnvKey",
   Vault = "Vault"
 }
+
+export enum ExternalMigrationProviders {
+  Vault = "vault",
+  EnvKey = "env-key"
+}

backend/src/services/identity-ua/identity-ua-service.ts

@@ -8,11 +8,18 @@ import {
   validatePrivilegeChangeOperation
 } from "@app/ee/services/permission/permission-fns";
 import { TPermissionServiceFactory } from "@app/ee/services/permission/permission-service-types";
-import { TKeyStoreFactory } from "@app/keystore/keystore";
+import { KeyStorePrefixes, TKeyStoreFactory } from "@app/keystore/keystore";
 import { getConfig } from "@app/lib/config/env";
 import { crypto } from "@app/lib/crypto/cryptography";
-import { BadRequestError, NotFoundError, PermissionBoundaryError, UnauthorizedError } from "@app/lib/errors";
+import {
+  BadRequestError,
+  NotFoundError,
+  PermissionBoundaryError,
+  RateLimitError,
+  UnauthorizedError
+} from "@app/lib/errors";
 import { checkIPAgainstBlocklist, extractIPDetails, isValidIpOrCidr, TIp } from "@app/lib/ip";
+import { logger } from "@app/lib/logger";
 
 import { ActorType, AuthTokenType } from "../auth/auth-type";
 import { TIdentityOrgDALFactory } from "../identity/identity-org-dal";
@@ -40,15 +47,18 @@ type TIdentityUaServiceFactoryDep = {
   identityOrgMembershipDAL: TIdentityOrgDALFactory;
   permissionService: Pick<TPermissionServiceFactory, "getOrgPermission">;
   licenseService: Pick<TLicenseServiceFactory, "getPlan">;
-  keyStore: Pick<TKeyStoreFactory, "setItemWithExpiry" | "getItem" | "deleteItem" | "getKeysByPattern" | "deleteItems">;
+  keyStore: Pick<
+    TKeyStoreFactory,
+    "setItemWithExpiry" | "getItem" | "deleteItem" | "getKeysByPattern" | "deleteItems" | "acquireLock"
+  >;
 };
 
 export type TIdentityUaServiceFactory = ReturnType<typeof identityUaServiceFactory>;
 
-// type LockoutObject = {
-//   lockedOut: boolean;
-//   failedAttempts: number;
-// };
+type LockoutObject = {
+  lockedOut: boolean;
+  failedAttempts: number;
+};
 
 export const identityUaServiceFactory = ({
   identityUaDAL,
@@ -62,15 +72,8 @@ export const identityUaServiceFactory = ({
   const login = async (clientId: string, clientSecret: string, ip: string) => {
     const identityUa = await identityUaDAL.findOne({ clientId });
     if (!identityUa) {
-      throw new NotFoundError({
-        message: "No identity with specified client ID was found"
-      });
-    }
-
-    const identityMembershipOrg = await identityOrgMembershipDAL.findOne({ identityId: identityUa.identityId });
-    if (!identityMembershipOrg) {
-      throw new NotFoundError({
-        message: "No identity with the org membership was found"
+      throw new UnauthorizedError({
+        message: "Invalid credentials"
       });
     }
 
@@ -78,15 +81,53 @@ export const identityUaServiceFactory = ({
       ipAddress: ip,
       trustedIps: identityUa.clientSecretTrustedIps as TIp[]
     });
+
+    const LOCKOUT_KEY = `lockout:identity:${identityUa.identityId}:${IdentityAuthMethod.UNIVERSAL_AUTH}:${clientId}`;
+
+    let lock: Awaited<ReturnType<typeof keyStore.acquireLock>>;
+    try {
+      lock = await keyStore.acquireLock([KeyStorePrefixes.IdentityLockoutLock(LOCKOUT_KEY)], 500, {
+        retryCount: 3,
+        retryDelay: 300,
+        retryJitter: 100
+      });
+    } catch (e) {
+      logger.info(
+        `identity login failed to acquire lock [identityId=${identityUa.identityId}] [authMethod=${IdentityAuthMethod.UNIVERSAL_AUTH}]`
+      );
+      throw new RateLimitError({ message: "Rate limit exceeded" });
+    }
+
+    try {
+      const lockoutRaw = await keyStore.getItem(LOCKOUT_KEY);
+
+      let lockout: LockoutObject | undefined;
+      if (lockoutRaw) {
+        lockout = JSON.parse(lockoutRaw) as LockoutObject;
+      }
+
+      if (lockout && lockout.lockedOut) {
+        throw new UnauthorizedError({
+          message: "This identity auth method is temporarily locked, please try again later"
+        });
+      }
+
+      const identityMembershipOrg = await identityOrgMembershipDAL.findOne({ identityId: identityUa.identityId });
+      if (!identityMembershipOrg) {
+        throw new UnauthorizedError({
+          message: "Invalid credentials"
+        });
+      }
+
       const clientSecretPrefix = clientSecret.slice(0, 4);
-    const clientSecrtInfo = await identityUaClientSecretDAL.find({
+      const clientSecretInfo = await identityUaClientSecretDAL.find({
         identityUAId: identityUa.id,
         isClientSecretRevoked: false,
         clientSecretPrefix
       });
 
-    let validClientSecretInfo: (typeof clientSecrtInfo)[0] | null = null;
-    for await (const info of clientSecrtInfo) {
+      let validClientSecretInfo: (typeof clientSecretInfo)[0] | null = null;
+      for await (const info of clientSecretInfo) {
         const isMatch = await crypto.hashing().compareHash(clientSecret, info.clientSecretHash);
 
         if (isMatch) {
@@ -95,7 +136,31 @@ export const identityUaServiceFactory = ({
         }
       }
 
-    if (!validClientSecretInfo) throw new UnauthorizedError({ message: "Invalid credentials" });
+      if (!validClientSecretInfo) {
+        if (identityUa.lockoutEnabled) {
+          if (!lockout) {
+            lockout = {
+              lockedOut: false,
+              failedAttempts: 0
+            };
+          }
+
+          lockout.failedAttempts += 1;
+          if (lockout.failedAttempts >= identityUa.lockoutThreshold) {
+            lockout.lockedOut = true;
+          }
+
+          await keyStore.setItemWithExpiry(
+            LOCKOUT_KEY,
+            lockout.lockedOut ? identityUa.lockoutDurationSeconds : identityUa.lockoutCounterResetSeconds,
+            JSON.stringify(lockout)
+          );
+        }
+
+        throw new UnauthorizedError({ message: "Invalid credentials" });
+      } else if (lockout) {
+        await keyStore.deleteItem(LOCKOUT_KEY);
+      }
 
       const { clientSecretTTL, clientSecretNumUses, clientSecretNumUsesLimit } = validClientSecretInfo;
       if (Number(clientSecretTTL) > 0) {
@@ -115,7 +180,7 @@ export const identityUaServiceFactory = ({
         }
       }
 
-    if (clientSecretNumUsesLimit > 0 && clientSecretNumUses === clientSecretNumUsesLimit) {
+      if (clientSecretNumUsesLimit > 0 && clientSecretNumUses >= clientSecretNumUsesLimit) {
         // number of times client secret can be used for
         // a login operation reached
         await identityUaClientSecretDAL.updateById(validClientSecretInfo.id, {
@@ -191,6 +256,9 @@ export const identityUaServiceFactory = ({
         identityMembershipOrg,
         ...accessTokenTTLParams
       };
+    } finally {
+      await lock.release();
+    }
   };
 
   const attachUniversalAuth = async ({

backend/src/services/org-membership/org-membership-dal.ts

@@ -153,10 +153,64 @@ export const orgMembershipDALFactory = (db: TDbClient) => {
     }
   };
 
+  const findOrgMembershipsWithUsersByOrgId = async (orgId: string) => {
+    try {
+      const members = await db
+        .replicaNode()(TableName.OrgMembership)
+        .where(`${TableName.OrgMembership}.orgId`, orgId)
+        .join(TableName.Users, `${TableName.OrgMembership}.userId`, `${TableName.Users}.id`)
+        .leftJoin<TUserEncryptionKeys>(
+          TableName.UserEncryptionKey,
+          `${TableName.UserEncryptionKey}.userId`,
+          `${TableName.Users}.id`
+        )
+        .leftJoin(TableName.IdentityMetadata, (queryBuilder) => {
+          void queryBuilder
+            .on(`${TableName.OrgMembership}.userId`, `${TableName.IdentityMetadata}.userId`)
+            .andOn(`${TableName.OrgMembership}.orgId`, `${TableName.IdentityMetadata}.orgId`);
+        })
+        .select(
+          db.ref("id").withSchema(TableName.OrgMembership),
+          db.ref("inviteEmail").withSchema(TableName.OrgMembership),
+          db.ref("orgId").withSchema(TableName.OrgMembership),
+          db.ref("role").withSchema(TableName.OrgMembership),
+          db.ref("roleId").withSchema(TableName.OrgMembership),
+          db.ref("status").withSchema(TableName.OrgMembership),
+          db.ref("isActive").withSchema(TableName.OrgMembership),
+          db.ref("email").withSchema(TableName.Users),
+          db.ref("username").withSchema(TableName.Users),
+          db.ref("firstName").withSchema(TableName.Users),
+          db.ref("lastName").withSchema(TableName.Users),
+          db.ref("isEmailVerified").withSchema(TableName.Users),
+          db.ref("id").withSchema(TableName.Users).as("userId")
+        )
+        .where({ isGhost: false });
+
+      return members.map((member) => ({
+        id: member.id,
+        orgId: member.orgId,
+        role: member.role,
+        status: member.status,
+        isActive: member.isActive,
+        inviteEmail: member.inviteEmail,
+        user: {
+          id: member.userId,
+          email: member.email,
+          username: member.username,
+          firstName: member.firstName,
+          lastName: member.lastName
+        }
+      }));
+    } catch (error) {
+      throw new DatabaseError({ error, name: "Find org memberships with users by org id" });
+    }
+  };
+
   return {
     ...orgMembershipOrm,
     findOrgMembershipById,
     findRecentInvitedMemberships,
-    updateLastInvitedAtByIds
+    updateLastInvitedAtByIds,
+    findOrgMembershipsWithUsersByOrgId
   };
 };

backend/src/services/org/org-dal.ts

@@ -83,6 +83,7 @@ export const orgDALFactory = (db: TDbClient) => {
         .select(db.ref("id").withSchema(TableName.OrgMembership).as("orgMembershipId"))
         .select(db.ref("role").withSchema(TableName.OrgMembership).as("orgMembershipRole"))
         .select(db.ref("roleId").withSchema(TableName.OrgMembership).as("orgMembershipRoleId"))
+        .select(db.ref("status").withSchema(TableName.OrgMembership).as("orgMembershipStatus"))
         .select(db.ref("name").withSchema(TableName.OrgRoles).as("orgMembershipRoleName"));
 
       const formattedDocs = sqlNestRelationships({
@@ -112,7 +113,8 @@ export const orgDALFactory = (db: TDbClient) => {
               orgMembershipId,
               orgMembershipRole,
               orgMembershipRoleName,
-              orgMembershipRoleId
+              orgMembershipRoleId,
+              orgMembershipStatus
             }) => ({
               user: {
                 id: userId,
@@ -121,6 +123,7 @@ export const orgDALFactory = (db: TDbClient) => {
                 firstName,
                 lastName
               },
+              status: orgMembershipStatus,
               membershipId: orgMembershipId,
               role: orgMembershipRoleName || orgMembershipRole, // custom role name or pre-defined role name
               roleId: orgMembershipRoleId
@@ -488,6 +491,15 @@ export const orgDALFactory = (db: TDbClient) => {
     }
   };
 
+  const bulkCreateMemberships = async (data: TOrgMembershipsInsert[], tx?: Knex) => {
+    try {
+      const memberships = await (tx || db)(TableName.OrgMembership).insert(data).returning("*");
+      return memberships;
+    } catch (error) {
+      throw new DatabaseError({ error, name: "Create org memberships" });
+    }
+  };
+
   const updateMembershipById = async (id: string, data: TOrgMembershipsUpdate, tx?: Knex) => {
     try {
       const [membership] = await (tx || db)(TableName.OrgMembership).where({ id }).update(data).returning("*");
@@ -668,6 +680,7 @@ export const orgDALFactory = (db: TDbClient) => {
     findMembership,
     findMembershipWithScimFilter,
     createMembership,
+    bulkCreateMemberships,
     updateMembershipById,
     deleteMembershipById,
     deleteMembershipsById,

backend/src/services/org/org-service.ts

@@ -528,15 +528,18 @@ export const orgServiceFactory = ({
   /*
    * Create organization
    * */
-  const createOrganization = async ({
+  const createOrganization = async (
+    {
       userId,
       userEmail,
       orgName
     }: {
-    userId: string;
+      userId?: string;
       orgName: string;
       userEmail?: string | null;
-  }) => {
+    },
+    trx?: Knex
+  ) => {
     const { privateKey, publicKey } = await crypto.encryption().asymmetric().generateKeyPair();
     const key = crypto.randomBytes(32).toString("base64");
     const {
@@ -555,12 +558,14 @@ export const orgServiceFactory = ({
     } = crypto.encryption().symmetric().encryptWithRootEncryptionKey(key);
 
     const customerId = await licenseService.generateOrgCustomerId(orgName, userEmail);
-    const organization = await orgDAL.transaction(async (tx) => {
+
+    const createOrg = async (tx: Knex) => {
       // akhilmhdh: for now this is auto created. in future we can input from user and for previous users just modifiy
       const org = await orgDAL.create(
         { name: orgName, customerId, slug: slugify(`${orgName}-${alphaNumericNanoId(4)}`) },
         tx
       );
+      if (userId) {
         await orgDAL.createMembership(
           {
             userId,
@@ -571,6 +576,7 @@ export const orgServiceFactory = ({
           },
           tx
         );
+      }
       await orgBotDAL.create(
         {
           name: org.name,
@@ -590,7 +596,9 @@ export const orgServiceFactory = ({
         tx
       );
       return org;
-    });
+    };
+
+    const organization = await (trx ? createOrg(trx) : orgDAL.transaction(createOrg));
 
     await licenseService.updateSubscriptionOrgMemberCount(organization.id);
     return organization;

backend/src/services/secret-sync/hc-vault/hc-vault-sync-fns.ts

@@ -1,9 +1,13 @@
 import { isAxiosError } from "axios";
 
-import { request } from "@app/lib/config/request";
+import { TGatewayServiceFactory } from "@app/ee/services/gateway/gateway-service";
 import { removeTrailingSlash } from "@app/lib/fn";
-import { blockLocalAndPrivateIpAddresses } from "@app/lib/validator";
-import { getHCVaultAccessToken, getHCVaultInstanceUrl } from "@app/services/app-connection/hc-vault";
+import {
+  getHCVaultAccessToken,
+  getHCVaultInstanceUrl,
+  requestWithHCVaultGateway,
+  THCVaultConnection
+} from "@app/services/app-connection/hc-vault";
 import {
   THCVaultListVariables,
   THCVaultListVariablesResponse,
@@ -14,19 +18,20 @@ import { SecretSyncError } from "@app/services/secret-sync/secret-sync-errors";
 import { matchesSchema } from "@app/services/secret-sync/secret-sync-fns";
 import { TSecretMap } from "@app/services/secret-sync/secret-sync-types";
 
-const listHCVaultVariables = async ({ instanceUrl, namespace, mount, accessToken, path }: THCVaultListVariables) => {
-  await blockLocalAndPrivateIpAddresses(instanceUrl);
-
+const listHCVaultVariables = async (
+  { instanceUrl, namespace, mount, accessToken, path }: THCVaultListVariables,
+  connection: THCVaultConnection,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
   try {
-    const { data } = await request.get<THCVaultListVariablesResponse>(
-      `${instanceUrl}/v1/${removeTrailingSlash(mount)}/data/${path}`,
-      {
+    const { data } = await requestWithHCVaultGateway<THCVaultListVariablesResponse>(connection, gatewayService, {
+      url: `${instanceUrl}/v1/${removeTrailingSlash(mount)}/data/${path}`,
+      method: "GET",
       headers: {
         "X-Vault-Token": accessToken,
         ...(namespace ? { "X-Vault-Namespace": namespace } : {})
       }
-      }
-    );
+    });
 
     return data.data.data;
   } catch (error: unknown) {
@@ -39,33 +44,29 @@ const listHCVaultVariables = async ({ instanceUrl, namespace, mount, accessToken
 };
 
 // Hashicorp Vault updates all variables in one batch. This is to respect their versioning
-const updateHCVaultVariables = async ({
-  path,
-  instanceUrl,
-  namespace,
-  accessToken,
-  mount,
-  data
-}: TPostHCVaultVariable) => {
-  await blockLocalAndPrivateIpAddresses(instanceUrl);
-
-  return request.post(
-    `${instanceUrl}/v1/${removeTrailingSlash(mount)}/data/${path}`,
-    {
-      data
-    },
-    {
+const updateHCVaultVariables = async (
+  { path, instanceUrl, namespace, accessToken, mount, data }: TPostHCVaultVariable,
+  connection: THCVaultConnection,
+  gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+) => {
+  return requestWithHCVaultGateway(connection, gatewayService, {
+    url: `${instanceUrl}/v1/${removeTrailingSlash(mount)}/data/${path}`,
+    method: "POST",
     headers: {
       "X-Vault-Token": accessToken,
       ...(namespace ? { "X-Vault-Namespace": namespace } : {}),
       "Content-Type": "application/json"
-      }
-    }
-  );
+    },
+    data: { data }
+  });
 };
 
 export const HCVaultSyncFns = {
-  syncSecrets: async (secretSync: THCVaultSyncWithCredentials, secretMap: TSecretMap) => {
+  syncSecrets: async (
+    secretSync: THCVaultSyncWithCredentials,
+    secretMap: TSecretMap,
+    gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+  ) => {
     const {
       connection,
       environment,
@@ -74,16 +75,20 @@ export const HCVaultSyncFns = {
     } = secretSync;
 
     const { namespace } = connection.credentials;
-    const accessToken = await getHCVaultAccessToken(connection);
+    const accessToken = await getHCVaultAccessToken(connection, gatewayService);
     const instanceUrl = await getHCVaultInstanceUrl(connection);
 
-    const variables = await listHCVaultVariables({
+    const variables = await listHCVaultVariables(
+      {
         instanceUrl,
         accessToken,
         namespace,
         mount,
         path
-    });
+      },
+      connection,
+      gatewayService
+    );
     let tainted = false;
 
     for (const entry of Object.entries(secretMap)) {
@@ -110,24 +115,36 @@ export const HCVaultSyncFns = {
     if (!tainted) return;
 
     try {
-      await updateHCVaultVariables({ accessToken, instanceUrl, namespace, mount, path, data: variables });
+      await updateHCVaultVariables(
+        { accessToken, instanceUrl, namespace, mount, path, data: variables },
+        connection,
+        gatewayService
+      );
     } catch (error) {
       throw new SecretSyncError({
         error
       });
     }
   },
-  removeSecrets: async (secretSync: THCVaultSyncWithCredentials, secretMap: TSecretMap) => {
+  removeSecrets: async (
+    secretSync: THCVaultSyncWithCredentials,
+    secretMap: TSecretMap,
+    gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+  ) => {
     const {
       connection,
       destinationConfig: { mount, path }
     } = secretSync;
 
     const { namespace } = connection.credentials;
-    const accessToken = await getHCVaultAccessToken(connection);
+    const accessToken = await getHCVaultAccessToken(connection, gatewayService);
     const instanceUrl = await getHCVaultInstanceUrl(connection);
 
-    const variables = await listHCVaultVariables({ instanceUrl, namespace, accessToken, mount, path });
+    const variables = await listHCVaultVariables(
+      { instanceUrl, namespace, accessToken, mount, path },
+      connection,
+      gatewayService
+    );
 
     for await (const [key] of Object.entries(variables)) {
       if (key in secretMap) {
@@ -136,30 +153,41 @@ export const HCVaultSyncFns = {
     }
 
     try {
-      await updateHCVaultVariables({ accessToken, instanceUrl, namespace, mount, path, data: variables });
+      await updateHCVaultVariables(
+        { accessToken, instanceUrl, namespace, mount, path, data: variables },
+        connection,
+        gatewayService
+      );
     } catch (error) {
       throw new SecretSyncError({
         error
       });
     }
   },
-  getSecrets: async (secretSync: THCVaultSyncWithCredentials) => {
+  getSecrets: async (
+    secretSync: THCVaultSyncWithCredentials,
+    gatewayService: Pick<TGatewayServiceFactory, "fnGetGatewayClientTlsByGatewayId">
+  ) => {
     const {
       connection,
       destinationConfig: { mount, path }
     } = secretSync;
 
     const { namespace } = connection.credentials;
-    const accessToken = await getHCVaultAccessToken(connection);
+    const accessToken = await getHCVaultAccessToken(connection, gatewayService);
     const instanceUrl = await getHCVaultInstanceUrl(connection);
 
-    const variables = await listHCVaultVariables({
+    const variables = await listHCVaultVariables(
+      {
         instanceUrl,
         namespace,
         accessToken,
         mount,
         path
-    });
+      },
+      connection,
+      gatewayService
+    );
 
     return Object.fromEntries(Object.entries(variables).map(([key, value]) => [key, { value }]));
   }

backend/src/services/secret-sync/secret-sync-fns.ts

@@ -244,7 +244,7 @@ export const SecretSyncFns = {
       case SecretSync.Windmill:
         return WindmillSyncFns.syncSecrets(secretSync, schemaSecretMap);
       case SecretSync.HCVault:
-        return HCVaultSyncFns.syncSecrets(secretSync, schemaSecretMap);
+        return HCVaultSyncFns.syncSecrets(secretSync, schemaSecretMap, gatewayService);
       case SecretSync.TeamCity:
         return TeamCitySyncFns.syncSecrets(secretSync, schemaSecretMap);
       case SecretSync.OCIVault:
@@ -283,7 +283,7 @@ export const SecretSyncFns = {
   },
   getSecrets: async (
     secretSync: TSecretSyncWithCredentials,
-    { kmsService, appConnectionDAL }: TSyncSecretDeps
+    { kmsService, appConnectionDAL, gatewayService }: TSyncSecretDeps
   ): Promise<TSecretMap> => {
     let secretMap: TSecretMap;
     switch (secretSync.destination) {
@@ -341,7 +341,7 @@ export const SecretSyncFns = {
         secretMap = await WindmillSyncFns.getSecrets(secretSync);
         break;
       case SecretSync.HCVault:
-        secretMap = await HCVaultSyncFns.getSecrets(secretSync);
+        secretMap = await HCVaultSyncFns.getSecrets(secretSync, gatewayService);
         break;
       case SecretSync.TeamCity:
         secretMap = await TeamCitySyncFns.getSecrets(secretSync);
@@ -451,7 +451,7 @@ export const SecretSyncFns = {
       case SecretSync.Windmill:
         return WindmillSyncFns.removeSecrets(secretSync, schemaSecretMap);
       case SecretSync.HCVault:
-        return HCVaultSyncFns.removeSecrets(secretSync, schemaSecretMap);
+        return HCVaultSyncFns.removeSecrets(secretSync, schemaSecretMap, gatewayService);
       case SecretSync.TeamCity:
         return TeamCitySyncFns.removeSecrets(secretSync, schemaSecretMap);
       case SecretSync.OCIVault:

backend/src/services/smtp/emails/OrganizationAssignmentTemplate.tsx

@@ -0,0 +1,69 @@
+import { Heading, Section, Text } from "@react-email/components";
+import React from "react";
+
+import { BaseButton } from "./BaseButton";
+import { BaseEmailWrapper, BaseEmailWrapperProps } from "./BaseEmailWrapper";
+import { BaseLink } from "./BaseLink";
+
+interface OrganizationAssignmentTemplateProps extends Omit<BaseEmailWrapperProps, "preview" | "title"> {
+  inviterFirstName?: string;
+  inviterUsername?: string;
+  organizationName: string;
+  callback_url: string;
+}
+
+export const OrganizationAssignmentTemplate = ({
+  organizationName,
+  inviterFirstName,
+  inviterUsername,
+  callback_url,
+  siteUrl
+}: OrganizationAssignmentTemplateProps) => {
+  return (
+    <BaseEmailWrapper
+      title="New Organization"
+      preview="You've been added to a new organization on Infisical."
+      siteUrl={siteUrl}
+    >
+      <Heading className="text-black text-[18px] leading-[28px] text-center font-normal p-0 mx-0">
+        You've been added to the organization
+        <br />
+        <strong>{organizationName}</strong> on <strong>Infisical</strong>
+      </Heading>
+      <Section className="px-[24px] mb-[28px] mt-[36px] pt-[12px] pb-[8px] border text-center border-solid border-gray-200 rounded-md bg-gray-50">
+        <Text className="text-black text-[14px] leading-[24px]">
+          {inviterFirstName && inviterUsername ? (
+            <>
+              <strong>{inviterFirstName}</strong> (
+              <BaseLink href={`mailto:${inviterUsername}`}>{inviterUsername}</BaseLink>) has added you as an
+              organization admin to <strong>{organizationName}</strong>.
+            </>
+          ) : (
+            <>
+              An instance admin has added you as an organization admin to <strong>{organizationName}</strong>.
+            </>
+          )}
+        </Text>
+      </Section>
+      <Section className="text-center">
+        <BaseButton href={callback_url}>View Dashboard</BaseButton>
+      </Section>
+      <Section className="mt-[24px] bg-gray-50 pt-[2px] pb-[16px] border border-solid border-gray-200 px-[24px] rounded-md text-gray-800">
+        <Text className="mb-[0px]">
+          <strong>About Infisical:</strong> Infisical is an all-in-one platform to securely manage application secrets,
+          certificates, SSH keys, and configurations across your team and infrastructure.
+        </Text>
+      </Section>
+    </BaseEmailWrapper>
+  );
+};
+
+export default OrganizationAssignmentTemplate;
+
+OrganizationAssignmentTemplate.PreviewProps = {
+  organizationName: "Example Organization",
+  inviterFirstName: "Jane",
+  inviterUsername: "[email protected]",
+  siteUrl: "https://infisical.com",
+  callback_url: "https://app.infisical.com"
+} as OrganizationAssignmentTemplateProps;

backend/src/services/smtp/emails/index.ts

@@ -9,6 +9,7 @@ export * from "./IntegrationSyncFailedTemplate";
 export * from "./NewDeviceLoginTemplate";
 export * from "./OrgAdminBreakglassAccessTemplate";
 export * from "./OrgAdminProjectGrantAccessTemplate";
+export * from "./OrganizationAssignmentTemplate";
 export * from "./OrganizationInvitationTemplate";
 export * from "./PasswordResetTemplate";
 export * from "./PasswordSetupTemplate";

backend/src/services/smtp/smtp-service.ts

@@ -18,6 +18,7 @@ import {
   NewDeviceLoginTemplate,
   OrgAdminBreakglassAccessTemplate,
   OrgAdminProjectGrantAccessTemplate,
+  OrganizationAssignmentTemplate,
   OrganizationInvitationTemplate,
   PasswordResetTemplate,
   PasswordSetupTemplate,
@@ -61,6 +62,7 @@ export enum SmtpTemplates {
   // HistoricalSecretList = "historicalSecretLeakIncident", not used anymore?
   NewDeviceJoin = "newDevice",
   OrgInvite = "organizationInvitation",
+  OrgAssignment = "organizationAssignment",
   ResetPassword = "passwordReset",
   SetupPassword = "passwordSetup",
   SecretLeakIncident = "secretLeakIncident",
@@ -94,6 +96,7 @@ export enum SmtpHost {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const EmailTemplateMap: Record<SmtpTemplates, React.FC<any>> = {
   [SmtpTemplates.OrgInvite]: OrganizationInvitationTemplate,
+  [SmtpTemplates.OrgAssignment]: OrganizationAssignmentTemplate,
   [SmtpTemplates.NewDeviceJoin]: NewDeviceLoginTemplate,
   [SmtpTemplates.SignupEmailVerification]: SignupEmailVerificationTemplate,
   [SmtpTemplates.EmailMfa]: EmailMfaTemplate,

backend/src/services/super-admin/super-admin-service.ts

@@ -1,6 +1,13 @@
 import { CronJob } from "cron";
 
-import { IdentityAuthMethod, OrgMembershipRole, TSuperAdmin, TSuperAdminUpdate } from "@app/db/schemas";
+import {
+  IdentityAuthMethod,
+  OrgMembershipRole,
+  OrgMembershipStatus,
+  TSuperAdmin,
+  TSuperAdminUpdate,
+  TUsers
+} from "@app/db/schemas";
 import { TLicenseServiceFactory } from "@app/ee/services/license/license-service";
 import { PgSqlLock, TKeyStoreFactory } from "@app/keystore/keystore";
 import {
@@ -13,7 +20,12 @@ import {
 import { crypto } from "@app/lib/crypto/cryptography";
 import { BadRequestError, NotFoundError } from "@app/lib/errors";
 import { logger } from "@app/lib/logger";
+import { OrgServiceActor } from "@app/lib/types";
+import { isDisposableEmail } from "@app/lib/validator";
+import { TAuthTokenServiceFactory } from "@app/services/auth-token/auth-token-service";
+import { TokenType } from "@app/services/auth-token/auth-token-types";
 import { TIdentityDALFactory } from "@app/services/identity/identity-dal";
+import { SmtpTemplates, TSmtpService } from "@app/services/smtp/smtp-service";
 
 import { TAuthLoginFactory } from "../auth/auth-login-service";
 import { ActorType, AuthMethod, AuthTokenType } from "../auth/auth-type";
@@ -43,7 +55,9 @@ import {
   TAdminGetUsersDTO,
   TAdminIntegrationConfig,
   TAdminSignUpDTO,
-  TGetOrganizationsDTO
+  TCreateOrganizationDTO,
+  TGetOrganizationsDTO,
+  TResendOrgInviteDTO
 } from "./super-admin-types";
 
 type TSuperAdminServiceFactoryDep = {
@@ -59,11 +73,13 @@ type TSuperAdminServiceFactoryDep = {
   authService: Pick<TAuthLoginFactory, "generateUserTokens">;
   kmsService: Pick<TKmsServiceFactory, "encryptWithRootKey" | "decryptWithRootKey" | "updateEncryptionStrategy">;
   kmsRootConfigDAL: TKmsRootConfigDALFactory;
-  orgService: Pick<TOrgServiceFactory, "createOrganization">;
+  orgService: Pick<TOrgServiceFactory, "createOrganization" | "inviteUserToOrganization">;
   keyStore: Pick<TKeyStoreFactory, "getItem" | "setItemWithExpiry" | "deleteItem" | "deleteItems">;
-  licenseService: Pick<TLicenseServiceFactory, "onPremFeatures">;
+  licenseService: Pick<TLicenseServiceFactory, "onPremFeatures" | "updateSubscriptionOrgMemberCount">;
   microsoftTeamsService: Pick<TMicrosoftTeamsServiceFactory, "initializeTeamsBot">;
   invalidateCacheQueue: TInvalidateCacheQueueFactory;
+  smtpService: Pick<TSmtpService, "sendMail">;
+  tokenService: TAuthTokenServiceFactory;
 };
 
 export type TSuperAdminServiceFactory = ReturnType<typeof superAdminServiceFactory>;
@@ -123,7 +139,9 @@ export const superAdminServiceFactory = ({
   identityTokenAuthDAL,
   identityOrgMembershipDAL,
   microsoftTeamsService,
-  invalidateCacheQueue
+  invalidateCacheQueue,
+  smtpService,
+  tokenService
 }: TSuperAdminServiceFactoryDep) => {
   const initServerCfg = async () => {
     // TODO(akhilmhdh): bad  pattern time less change this later to me itself
@@ -732,6 +750,159 @@ export const superAdminServiceFactory = ({
     return organizations;
   };
 
+  const createOrganization = async (
+    { name, inviteAdminEmails: emails }: TCreateOrganizationDTO,
+    actor: OrgServiceActor
+  ) => {
+    const appCfg = getConfig();
+
+    const inviteAdminEmails = [...new Set(emails)];
+
+    if (!appCfg.isDevelopmentMode && appCfg.isCloud)
+      throw new BadRequestError({ message: "This endpoint is not supported for cloud instances" });
+
+    const serverAdmin = await userDAL.findById(actor.id);
+    const plan = licenseService.onPremFeatures;
+
+    const isEmailInvalid = await isDisposableEmail(inviteAdminEmails);
+    if (isEmailInvalid) {
+      throw new BadRequestError({
+        message: "Disposable emails are not allowed",
+        name: "InviteUser"
+      });
+    }
+
+    const { organization, users: usersToEmail } = await orgDAL.transaction(async (tx) => {
+      const org = await orgService.createOrganization(
+        {
+          orgName: name,
+          userEmail: serverAdmin?.email ?? serverAdmin?.username // identities can be server admins so we can't require this
+        },
+        tx
+      );
+
+      const users: Pick<TUsers, "id" | "firstName" | "lastName" | "email" | "username" | "isAccepted">[] = [];
+
+      for await (const inviteeEmail of inviteAdminEmails) {
+        const usersByUsername = await userDAL.findUserByUsername(inviteeEmail, tx);
+        let inviteeUser =
+          usersByUsername?.length > 1
+            ? usersByUsername.find((el) => el.username === inviteeEmail)
+            : usersByUsername?.[0];
+
+        // if the user doesn't exist we create the user with the email
+        if (!inviteeUser) {
+          // TODO(carlos): will be removed once the function receives usernames instead of emails
+          const usersByEmail = await userDAL.findUserByEmail(inviteeEmail, tx);
+          if (usersByEmail?.length === 1) {
+            [inviteeUser] = usersByEmail;
+          } else {
+            inviteeUser = await userDAL.create(
+              {
+                isAccepted: false,
+                email: inviteeEmail,
+                username: inviteeEmail,
+                authMethods: [AuthMethod.EMAIL],
+                isGhost: false
+              },
+              tx
+            );
+          }
+        }
+
+        const inviteeUserId = inviteeUser?.id;
+        const existingEncryptionKey = await userDAL.findUserEncKeyByUserId(inviteeUserId, tx);
+
+        // when user is missing the encrytion keys
+        // this could happen either if user doesn't exist or user didn't find step 3 of generating the encryption keys of srp
+        // So what we do is we generate a random secure password and then encrypt it with a random pub-private key
+        // Then when user sign in (as login is not possible as isAccepted is false) we rencrypt the private key with the user password
+        if (!inviteeUser || (inviteeUser && !inviteeUser?.isAccepted && !existingEncryptionKey)) {
+          await userDAL.createUserEncryption(
+            {
+              userId: inviteeUserId,
+              encryptionVersion: 2
+            },
+            tx
+          );
+        }
+
+        if (plan?.slug !== "enterprise" && plan?.identityLimit && plan.identitiesUsed >= plan.identityLimit) {
+          // limit imposed on number of identities allowed / number of identities used exceeds the number of identities allowed
+          throw new BadRequestError({
+            name: "InviteUser",
+            message: "Failed to invite member due to member limit reached. Upgrade plan to invite more members."
+          });
+        }
+
+        await orgDAL.createMembership(
+          {
+            userId: inviteeUser.id,
+            inviteEmail: inviteeEmail,
+            orgId: org.id,
+            role: OrgMembershipRole.Admin,
+            status: inviteeUser.isAccepted ? OrgMembershipStatus.Accepted : OrgMembershipStatus.Invited,
+            isActive: true
+          },
+          tx
+        );
+
+        users.push(inviteeUser);
+      }
+
+      return { organization: org, users };
+    });
+
+    await licenseService.updateSubscriptionOrgMemberCount(organization.id);
+
+    await Promise.allSettled(
+      usersToEmail.map(async (user) => {
+        if (!user.email) return;
+
+        if (user.isAccepted) {
+          return smtpService.sendMail({
+            template: SmtpTemplates.OrgAssignment,
+            subjectLine: "You've been added to an Infisical organization",
+            recipients: [user.email],
+            substitutions: {
+              inviterFirstName: serverAdmin?.firstName,
+              inviterUsername: serverAdmin?.email,
+              organizationName: organization.name,
+              email: user.email,
+              organizationId: organization.id,
+              callback_url: `${appCfg.SITE_URL}/login?org_id=${organization.id}`
+            }
+          });
+        }
+
+        // new user, send regular invite
+
+        const token = await tokenService.createTokenForUser({
+          type: TokenType.TOKEN_EMAIL_ORG_INVITATION,
+          userId: user.id,
+          orgId: organization.id
+        });
+
+        return smtpService.sendMail({
+          template: SmtpTemplates.OrgInvite,
+          subjectLine: "Infisical organization invitation",
+          recipients: [user.email],
+          substitutions: {
+            inviterFirstName: serverAdmin?.firstName,
+            inviterUsername: serverAdmin?.email,
+            organizationName: organization.name,
+            email: user.email,
+            organizationId: organization.id,
+            token,
+            callback_url: `${appCfg.SITE_URL}/signupinvite`
+          }
+        });
+      })
+    );
+
+    return organization;
+  };
+
   const deleteOrganization = async (organizationId: string) => {
     const organization = await orgDAL.deleteById(organizationId);
     return organization;
@@ -763,6 +934,86 @@ export const superAdminServiceFactory = ({
     return organizationMembership;
   };
 
+  const joinOrganization = async (orgId: string, actor: OrgServiceActor) => {
+    const serverAdmin = await userDAL.findById(actor.id);
+
+    if (!serverAdmin) {
+      throw new NotFoundError({ message: "Could not find server admin user" });
+    }
+
+    const org = await orgDAL.findById(orgId);
+
+    if (!org) {
+      throw new NotFoundError({ message: `Could not organization with ID "${orgId}"` });
+    }
+
+    const existingOrgMembership = await orgMembershipDAL.findOne({ userId: serverAdmin.id, orgId });
+
+    if (existingOrgMembership) {
+      throw new BadRequestError({ message: `You are already a part of the organization with ID ${orgId}` });
+    }
+
+    const orgMembership = await orgDAL.createMembership({
+      userId: serverAdmin.id,
+      orgId: org.id,
+      role: OrgMembershipRole.Admin,
+      status: OrgMembershipStatus.Accepted,
+      isActive: true
+    });
+
+    return orgMembership;
+  };
+
+  const resendOrgInvite = async ({ organizationId, membershipId }: TResendOrgInviteDTO, actor: OrgServiceActor) => {
+    const orgMembership = await orgMembershipDAL.findOne({ id: membershipId, orgId: organizationId });
+
+    if (!orgMembership) {
+      throw new NotFoundError({ name: "Organization Membership", message: "Organization membership not found" });
+    }
+
+    if (orgMembership.status === OrgMembershipStatus.Accepted) {
+      throw new BadRequestError({
+        message: "This user has already accepted their invitation."
+      });
+    }
+
+    if (!orgMembership.userId) {
+      throw new NotFoundError({ message: "Cannot find user associated with Org Membership." });
+    }
+
+    if (!orgMembership.inviteEmail) {
+      throw new BadRequestError({ message: "No invite email associated with user." });
+    }
+
+    const org = await orgDAL.findOrgById(orgMembership.orgId);
+
+    const appCfg = getConfig();
+    const serverAdmin = await userDAL.findById(actor.id);
+
+    const token = await tokenService.createTokenForUser({
+      type: TokenType.TOKEN_EMAIL_ORG_INVITATION,
+      userId: orgMembership.userId,
+      orgId: orgMembership.orgId
+    });
+
+    await smtpService.sendMail({
+      template: SmtpTemplates.OrgInvite,
+      subjectLine: "Infisical organization invitation",
+      recipients: [orgMembership.inviteEmail],
+      substitutions: {
+        inviterFirstName: serverAdmin?.firstName,
+        inviterUsername: serverAdmin?.email,
+        organizationName: org?.name,
+        email: orgMembership.inviteEmail,
+        organizationId: orgMembership.orgId,
+        token,
+        callback_url: `${appCfg.SITE_URL}/signupinvite`
+      }
+    });
+
+    return orgMembership;
+  };
+
   const getIdentities = async ({ offset, limit, searchTerm }: TAdminGetIdentitiesDTO) => {
     const identities = await identityDAL.getIdentitiesByFilter({
       limit,
@@ -901,6 +1152,9 @@ export const superAdminServiceFactory = ({
     initializeEnvConfigSync,
     getEnvOverrides,
     getEnvOverridesOrganized,
-    deleteUsers
+    deleteUsers,
+    createOrganization,
+    joinOrganization,
+    resendOrgInvite
   };
 };

backend/src/services/super-admin/super-admin-types.ts

@@ -34,6 +34,16 @@ export type TGetOrganizationsDTO = {
   searchTerm: string;
 };
 
+export type TCreateOrganizationDTO = {
+  name: string;
+  inviteAdminEmails: string[];
+};
+
+export type TResendOrgInviteDTO = {
+  organizationId: string;
+  membershipId: string;
+};
+
 export enum LoginMethod {
   EMAIL = "email",
   GOOGLE = "google",

docs/.eslintrc.js

@@ -0,0 +1,40 @@
+module.exports = {
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  extends: [
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:react/jsx-runtime',
+  ],
+  parser: '@babel/eslint-parser',
+  parserOptions: {
+    ecmaVersion: 2021,
+    sourceType: 'module',
+    ecmaFeatures: {
+      jsx: true,
+    },
+    requireConfigFile: false,
+    babelOptions: {
+      presets: ['@babel/preset-react'],
+    },
+  },
+  plugins: ['react'],
+  rules: {
+    'react/jsx-uses-react': 'error',
+    'react/jsx-uses-vars': 'error',
+  },
+  settings: {
+    react: {
+      version: 'detect',
+    },
+  },
+  ignorePatterns: [
+    'node_modules/',
+    'dist/',
+    'build/',
+    '*.config.js',
+  ],
+};

docs/docs.json

@@ -98,6 +98,7 @@
               {
                 "group": "App Connections",
                 "pages": [
+                  "integrations/app-connections",
                   "integrations/app-connections/overview",
                   {
                     "group": "Connections",
@@ -184,6 +185,7 @@
               {
                 "group": "User Authentication",
                 "pages": [
+                  "integrations/user-authentication",
                   "documentation/platform/auth-methods/email-password",
                   {
                     "group": "SSO",
@@ -243,6 +245,7 @@
               {
                 "group": "Machine Identities",
                 "pages": [
+                  "integrations/machine-authentication",
                   "documentation/platform/identities/alicloud-auth",
                   "documentation/platform/identities/aws-auth",
                   "documentation/platform/identities/azure-auth",
@@ -417,6 +420,7 @@
                   {
                     "group": "Secret Rotation",
                     "pages": [
+                      "integrations/secret-rotations",
                       "documentation/platform/secret-rotation/overview",
                       "documentation/platform/secret-rotation/auth0-client-secret",
                       "documentation/platform/secret-rotation/aws-iam-user-secret",
@@ -432,6 +436,7 @@
                   {
                     "group": "Dynamic Secrets",
                     "pages": [
+                      "integrations/dynamic-secrets",
                       "documentation/platform/dynamic-secrets/overview",
                       "documentation/platform/dynamic-secrets/aws-elasticache",
                       "documentation/platform/dynamic-secrets/aws-iam",
@@ -502,6 +507,7 @@
               {
                 "group": "Secret Syncs",
                 "pages": [
+                  "integrations/secret-syncs",
                   "integrations/secret-syncs/overview",
                   {
                     "group": "Syncs",
@@ -607,6 +613,7 @@
               {
                 "group": "Framework Integrations",
                 "pages": [
+                  "integrations/framework-integrations",
                   "integrations/frameworks/spring-boot-maven",
                   "integrations/frameworks/react",
                   "integrations/frameworks/vue",
@@ -2448,6 +2455,7 @@
               "sdks/languages/cpp",
               "sdks/languages/rust",
               "sdks/languages/go",
+              "sdks/languages/php",
               "sdks/languages/ruby"
             ]
           }

docs/documentation/platform/github-org-sync.mdx

@@ -45,6 +45,64 @@ Once configured, the GitHub Organization Synchronization feature functions as fo
 
 When a user logs in via the GitHub OAuth flow and selects the configured organization, the system will then automatically synchronize the teams they are a part of in GitHub with corresponding groups in Infisical.
 
+## Manual Team Sync
+
+You can manually synchronize GitHub teams for all organization members who have previously logged in with GitHub. This bulk sync operation updates team memberships without requiring users to log in again.
+
+<Steps>
+    <Step title="Generate a GitHub Access Token">
+        To perform manual syncs, you'll need to create a GitHub Personal Access Token with the appropriate permissions. GitHub offers two types of tokens:
+
+        <Tabs>
+            <Tab title="Classic Token">
+                1. Go to [GitHub Settings → Personal Access Tokens → Tokens (classic)](https://github.com/settings/tokens)
+                2. Click **Generate new token** → **Generate new token (classic)**
+                3. Give your token a descriptive name (e.g., "Infisical GitHub Sync")
+                4. Set an appropriate expiration date
+                5. Select the **read:org** scope - Required to read organization team information
+                6. Click **Generate token**
+                7. Copy the token immediately (you won't be able to see it again)
+
+                ![Classic Token Creation](../../images/platform/external-syncs/github-classic-token.png)
+            </Tab>
+            <Tab title="Fine-grained Token">
+                1. Go to [GitHub Settings → Personal Access Tokens → Fine-grained tokens](https://github.com/settings/personal-access-tokens/new)
+                2. Click **Generate new token**
+                3. Give your token a descriptive name (e.g., "Infisical GitHub Sync")
+                4. Set an appropriate expiration date
+                5. Select your organization under **Resource owner**
+                6. Under **Organization permissions**, set **Members** to **Read**
+                7. Click **Generate token**
+                8. Copy the token immediately (you won't be able to see it again)
+
+                ![Fine-grained Token Creation](../../images/platform/external-syncs/github-fine-grained-token.png)
+            </Tab>
+        </Tabs>
+    </Step>
+    
+    <Step title="Configure the Token in Infisical">
+        1. Navigate to the **Single Sign-On (SSO)** page and select the **Provisioning** tab.
+        2. Click the **Configure** button next to your GitHub Organization configuration.
+        3. In the configuration modal, you'll find an optional **GitHub Access Token** field.
+        4. Paste the token you generated in the previous step.
+        5. Click **Update** to save the configuration.
+
+        ![Token Configuration Modal](../../images/platform/external-syncs/github-token-config-modal.png)
+    </Step>
+
+    <Step title="Perform Manual Sync">
+        Once you have configured the GitHub access token:
+
+        1. Navigate to the **Single Sign-On (SSO)** page and select the **Provisioning** tab.
+        2. You'll see a **Sync Now** section with a button to trigger the manual sync.
+        3. Click **Sync Now** to synchronize GitHub teams for all organization members.
+
+        ![Manual Sync Button](../../images/platform/external-syncs/github-manual-sync-button.png)
+
+        The sync operation will process all organization members who have previously logged in with GitHub and update their team memberships accordingly.
+    </Step>
+</Steps>
+
 ## Troubleshooting
 
 <Accordion title="Please check if your organization has approved the Infisical OAuth application.">

docs/images/sdks/languages/php.svg

@@ -0,0 +1,96 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg height="383.5975" id="svg3430" version="1.1" viewBox="0 0 711.20123 383.5975" width="711.20123" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg">
+  <title id="title3510">Official PHP Logo</title>
+  <metadata id="metadata3436">
+    <rdf:RDF>
+      <cc:Work rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
+        <dc:title>Official PHP Logo</dc:title>
+        <dc:creator>
+          <cc:Agent>
+            <dc:title>Colin Viebrock</dc:title>
+          </cc:Agent>
+        </dc:creator>
+        <dc:description/>
+        <dc:contributor>
+          <cc:Agent>
+            <dc:title/>
+          </cc:Agent>
+        </dc:contributor>
+        <cc:license rdf:resource="http://creativecommons.org/licenses/by-sa/4.0/"/>
+        <dc:rights>
+          <cc:Agent>
+            <dc:title>Copyright Colin Viebrock 1997 - All rights reserved.</dc:title>
+          </cc:Agent>
+        </dc:rights>
+        <dc:date>1997</dc:date>
+      </cc:Work>
+      <cc:License rdf:about="http://creativecommons.org/licenses/by-sa/4.0/">
+        <cc:permits rdf:resource="http://creativecommons.org/ns#Reproduction"/>
+        <cc:permits rdf:resource="http://creativecommons.org/ns#Distribution"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#Notice"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#Attribution"/>
+        <cc:permits rdf:resource="http://creativecommons.org/ns#DerivativeWorks"/>
+        <cc:requires rdf:resource="http://creativecommons.org/ns#ShareAlike"/>
+      </cc:License>
+    </rdf:RDF>
+  </metadata>
+  <defs id="defs3434">
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3444">
+      <path d="M 11.52,162 C 11.52,81.677 135.307,16.561 288,16.561 l 0,0 c 152.693,0 276.481,65.116 276.481,145.439 l 0,0 c 0,80.322 -123.788,145.439 -276.481,145.439 l 0,0 C 135.307,307.439 11.52,242.322 11.52,162" id="path3446"/>
+    </clipPath>
+    <radialGradient cx="0" cy="0" fx="0" fy="0" gradientTransform="matrix(363.05789,0,0,-363.05789,177.52002,256.30713)" gradientUnits="userSpaceOnUse" id="radialGradient3452" r="1" spreadMethod="pad">
+      <stop id="stop3454" offset="0" style="stop-opacity:1;stop-color:#aeb2d5"/>
+      <stop id="stop3456" offset="0.3" style="stop-opacity:1;stop-color:#aeb2d5"/>
+      <stop id="stop3458" offset="0.75" style="stop-opacity:1;stop-color:#484c89"/>
+      <stop id="stop3460" offset="1" style="stop-opacity:1;stop-color:#484c89"/>
+    </radialGradient>
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3468">
+      <path d="M 0,324 576,324 576,0 0,0 0,324 Z" id="path3470"/>
+    </clipPath>
+    <clipPath clipPathUnits="userSpaceOnUse" id="clipPath3480">
+      <path d="M 0,324 576,324 576,0 0,0 0,324 Z" id="path3482"/>
+    </clipPath>
+  </defs>
+  <g id="g3438" transform="matrix(1.25,0,0,-1.25,-4.4,394.29875)">
+    <g id="g3440">
+      <g clip-path="url(#clipPath3444)" id="g3442">
+        <g id="g3448">
+          <g id="g3450">
+            <path d="M 11.52,162 C 11.52,81.677 135.307,16.561 288,16.561 l 0,0 c 152.693,0 276.481,65.116 276.481,145.439 l 0,0 c 0,80.322 -123.788,145.439 -276.481,145.439 l 0,0 C 135.307,307.439 11.52,242.322 11.52,162" id="path3462" style="fill:url(#radialGradient3452);stroke:none"/>
+          </g>
+        </g>
+      </g>
+    </g>
+    <g id="g3464">
+      <g clip-path="url(#clipPath3468)" id="g3466">
+        <g id="g3472" transform="translate(288,27.3594)">
+          <path d="M 0,0 C 146.729,0 265.68,60.281 265.68,134.641 265.68,209 146.729,269.282 0,269.282 -146.729,269.282 -265.68,209 -265.68,134.641 -265.68,60.281 -146.729,0 0,0" id="path3474" style="fill:#777bb3;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+      </g>
+    </g>
+    <g id="g3476">
+      <g clip-path="url(#clipPath3480)" id="g3478">
+        <g id="g3484" transform="translate(161.7344,145.3066)">
+          <path d="m 0,0 c 12.065,0 21.072,2.225 26.771,6.611 5.638,4.341 9.532,11.862 11.573,22.353 1.903,9.806 1.178,16.653 -2.154,20.348 C 32.783,53.086 25.417,55 14.297,55 L -4.984,55 -15.673,0 0,0 Z m -63.063,-67.75 c -0.895,0 -1.745,0.4 -2.314,1.092 -0.57,0.691 -0.801,1.601 -0.63,2.48 L -37.679,81.573 C -37.405,82.982 -36.17,84 -34.734,84 L 26.32,84 C 45.508,84 59.79,78.79 68.767,68.513 77.792,58.182 80.579,43.741 77.05,25.592 75.614,18.198 73.144,11.331 69.709,5.183 66.27,-0.972 61.725,-6.667 56.198,-11.747 49.582,-17.939 42.094,-22.429 33.962,-25.071 25.959,-27.678 15.681,-29 3.414,-29 l -24.722,0 -7.06,-36.322 c -0.274,-1.41 -1.508,-2.428 -2.944,-2.428 l -31.751,0 z" id="path3486" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3488" transform="translate(159.2236,197.3071)">
+          <path d="m 0,0 16.808,0 c 13.421,0 18.083,-2.945 19.667,-4.7 2.628,-2.914 3.124,-9.058 1.435,-17.767 C 36.012,-32.217 32.494,-39.13 27.452,-43.012 22.29,-46.986 13.898,-49 2.511,-49 L -9.523,-49 0,0 Z m 28.831,35 -61.055,0 c -2.872,0 -5.341,-2.036 -5.889,-4.855 l -28.328,-145.751 c -0.342,-1.759 0.12,-3.578 1.259,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.75,0 c 2.873,0 5.342,2.036 5.89,4.855 l 6.588,33.895 22.249,0 c 12.582,0 23.174,1.372 31.479,4.077 8.541,2.775 16.399,7.48 23.354,13.984 5.752,5.292 10.49,11.232 14.08,17.657 3.591,6.427 6.171,13.594 7.668,21.302 3.715,19.104 0.697,34.402 -8.969,45.466 C 63.965,29.444 48.923,35 28.831,35 m -45.633,-90 19.313,0 c 12.801,0 22.336,2.411 28.601,7.234 6.266,4.824 10.492,12.875 12.688,24.157 2.101,10.832 1.144,18.476 -2.871,22.929 C 36.909,3.773 28.87,6 16.808,6 L -4.946,6 -16.802,-55 M 28.831,29 C 47.198,29 60.597,24.18 69.019,14.539 77.44,4.898 79.976,-8.559 76.616,-25.836 75.233,-32.953 72.894,-39.46 69.601,-45.355 66.304,-51.254 61.999,-56.648 56.679,-61.539 50.339,-67.472 43.296,-71.7 35.546,-74.218 27.796,-76.743 17.925,-78 5.925,-78 l -27.196,0 -7.531,-38.75 -31.75,0 28.328,145.75 61.055,0" id="path3490" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3492" transform="translate(311.583,116.3066)">
+          <path d="m 0,0 c -0.896,0 -1.745,0.4 -2.314,1.092 -0.571,0.691 -0.802,1.6 -0.631,2.48 L 9.586,68.061 C 10.778,74.194 10.484,78.596 8.759,80.456 7.703,81.593 4.531,83.5 -4.848,83.5 L -27.55,83.5 -43.305,2.428 C -43.579,1.018 -44.814,0 -46.25,0 l -31.5,0 c -0.896,0 -1.745,0.4 -2.315,1.092 -0.57,0.691 -0.801,1.601 -0.63,2.48 l 28.328,145.751 c 0.274,1.409 1.509,2.427 2.945,2.427 l 31.5,0 c 0.896,0 1.745,-0.4 2.315,-1.091 0.57,-0.692 0.801,-1.601 0.63,-2.481 L -21.813,113 2.609,113 c 18.605,0 31.221,-3.28 38.569,-10.028 7.49,-6.884 9.827,-17.891 6.947,-32.719 L 34.945,2.428 C 34.671,1.018 33.437,0 32,0 L 0,0 Z" id="path3494" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3496" transform="translate(293.6611,271.0571)">
+          <path d="m 0,0 -31.5,0 c -2.873,0 -5.342,-2.036 -5.89,-4.855 l -28.328,-145.751 c -0.342,-1.759 0.12,-3.578 1.26,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.5,0 c 2.872,0 5.342,2.036 5.89,4.855 l 15.283,78.645 20.229,0 c 9.363,0 11.328,-2 11.407,-2.086 0.568,-0.611 1.315,-3.441 0.082,-9.781 l -12.531,-64.489 c -0.342,-1.759 0.12,-3.578 1.26,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 32,0 c 2.872,0 5.342,2.036 5.89,4.855 l 13.179,67.825 c 3.093,15.921 0.447,27.864 -7.861,35.5 -7.928,7.281 -21.208,10.82 -40.599,10.82 l -20.784,0 6.143,31.605 C 6.231,-5.386 5.77,-3.566 4.63,-2.184 3.49,-0.801 1.792,0 0,0 m 0,-6 -7.531,-38.75 28.062,0 c 17.657,0 29.836,-3.082 36.539,-9.238 6.703,-6.16 8.711,-16.141 6.032,-29.938 l -13.18,-67.824 -32,0 12.531,64.488 c 1.426,7.336 0.902,12.34 -1.574,15.008 -2.477,2.668 -7.746,4.004 -15.805,4.004 l -25.176,0 -16.226,-83.5 -31.5,0 L -31.5,-6 0,-6" id="path3498" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3500" transform="translate(409.5498,145.3066)">
+          <path d="m 0,0 c 12.065,0 21.072,2.225 26.771,6.611 5.638,4.34 9.532,11.861 11.574,22.353 1.903,9.806 1.178,16.653 -2.155,20.348 C 32.783,53.086 25.417,55 14.297,55 L -4.984,55 -15.673,0 0,0 Z m -63.062,-67.75 c -0.895,0 -1.745,0.4 -2.314,1.092 -0.57,0.691 -0.802,1.601 -0.631,2.48 L -37.679,81.573 C -37.404,82.982 -36.17,84 -34.733,84 L 26.32,84 C 45.509,84 59.79,78.79 68.768,68.513 77.793,58.183 80.579,43.742 77.051,25.592 75.613,18.198 73.144,11.331 69.709,5.183 66.27,-0.972 61.725,-6.667 56.198,-11.747 49.582,-17.939 42.094,-22.429 33.962,-25.071 25.959,-27.678 15.681,-29 3.414,-29 l -24.723,0 -7.057,-36.322 c -0.275,-1.41 -1.509,-2.428 -2.946,-2.428 l -31.75,0 z" id="path3502" style="fill:#000000;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+        <g id="g3504" transform="translate(407.0391,197.3071)">
+          <path d="M 0,0 16.808,0 C 30.229,0 34.891,-2.945 36.475,-4.7 39.104,-7.614 39.6,-13.758 37.91,-22.466 36.012,-32.217 32.493,-39.13 27.452,-43.012 22.29,-46.986 13.898,-49 2.511,-49 L -9.522,-49 0,0 Z m 28.831,35 -61.054,0 c -2.872,0 -5.341,-2.036 -5.889,-4.855 L -66.44,-115.606 c -0.342,-1.759 0.12,-3.578 1.259,-4.961 1.14,-1.383 2.838,-2.183 4.63,-2.183 l 31.75,0 c 2.872,0 5.342,2.036 5.89,4.855 l 6.587,33.895 22.249,0 c 12.582,0 23.174,1.372 31.479,4.077 8.541,2.775 16.401,7.481 23.356,13.986 5.752,5.291 10.488,11.23 14.078,17.655 3.591,6.427 6.171,13.594 7.668,21.302 3.715,19.105 0.697,34.403 -8.969,45.467 C 63.965,29.444 48.924,35 28.831,35 m -45.632,-90 19.312,0 c 12.801,0 22.336,2.411 28.601,7.234 6.267,4.824 10.492,12.875 12.688,24.157 2.102,10.832 1.145,18.476 -2.871,22.929 C 36.909,3.773 28.87,6 16.808,6 L -4.946,6 -16.801,-55 M 28.831,29 C 47.198,29 60.597,24.18 69.019,14.539 77.441,4.898 79.976,-8.559 76.616,-25.836 75.233,-32.953 72.894,-39.46 69.601,-45.355 66.304,-51.254 61.999,-56.648 56.679,-61.539 50.339,-67.472 43.296,-71.7 35.546,-74.218 27.796,-76.743 17.925,-78 5.925,-78 l -27.196,0 -7.53,-38.75 -31.75,0 28.328,145.75 61.054,0" id="path3506" style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"/>
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>

docs/integrations/app-connections.mdx

@@ -0,0 +1,8 @@
+---
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available app connections for Infisical."
+---
+
+import { AppConnectionsBrowser } from "/snippets/AppConnectionsBrowser.jsx";
+
+<AppConnectionsBrowser />

docs/integrations/app-connections/hashicorp-vault.mdx

@@ -149,6 +149,7 @@ Infisical supports two methods for connecting to Hashicorp Vault.
                     <Tab title="App Role">
                         - **Name**: The name of the connection being created. Must be slug-friendly.
                         - **Description**: An optional description to provide details about this connection.
+                        - **Gateway (optional):** The gateway connected to your private network. All requests made to your Vault instance will be made through the configured gateway.
                         - **Instance URL**: The URL of your Hashicorp Vault instance.
                         - **Namespace (optional)**: The namespace within your vault. Self-hosted and enterprise clusters may not use namespaces.
                         - **Role ID**: The Role ID generated in the steps above.
@@ -157,6 +158,7 @@ Infisical supports two methods for connecting to Hashicorp Vault.
                     <Tab title="Access Token">
                         - **Name**: The name of the connection being created. Must be slug-friendly.
                         - **Description**: An optional description to provide details about this connection.
+                        - **Gateway (optional):** The gateway connected to your private network. All requests made to your Vault instance will be made through the configured gateway.
                         - **Instance URL**: The URL of your Hashicorp Vault instance.
                         - **Namespace (optional)**: The namespace within your vault. Self-hosted and enterprise clusters may not use namespaces.
                         - **Access Token**: The Access Token generated in the steps above.

docs/integrations/dynamic-secrets.mdx

@@ -0,0 +1,9 @@
+---
+title: "Dynamic Secrets"
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available dynamic secrets for Infisical."
+---
+
+import { DynamicSecretsBrowser } from "/snippets/DynamicSecretsBrowser.jsx";
+
+<DynamicSecretsBrowser />

docs/integrations/framework-integrations.mdx

@@ -0,0 +1,9 @@
+---
+title: "Framework Integrations"
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available framework integrations for Infisical."
+---
+
+import { FrameworkIntegrationsBrowser } from "/snippets/FrameworkIntegrationsBrowser.jsx";
+
+<FrameworkIntegrationsBrowser />

docs/integrations/machine-authentication.mdx

@@ -0,0 +1,9 @@
+---
+title: "Machine Authentication"
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available machine authentication methods for Infisical."
+---
+
+import { MachineAuthenticationBrowser } from "/snippets/MachineAuthenticationBrowser.jsx";
+
+<MachineAuthenticationBrowser />

docs/integrations/secret-rotations.mdx

@@ -0,0 +1,8 @@
+---
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available secret rotations for Infisical."
+---
+
+import { RotationsBrowser } from "/snippets/RotationsBrowser.jsx";
+
+<RotationsBrowser />

docs/integrations/secret-syncs.mdx

@@ -0,0 +1,8 @@
+---
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available secret syncs for Infisical."
+---
+
+import { SecretSyncsBrowser } from "/snippets/SecretSyncsBrowser.jsx";
+
+<SecretSyncsBrowser />

docs/integrations/user-authentication.mdx

@@ -0,0 +1,9 @@
+---
+title: "User Authentication"
+sidebarTitle: "Explore Options"
+description: "Browse and search through all available user authentication methods for Infisical."
+---
+
+import { UserAuthenticationBrowser } from "/snippets/UserAuthenticationBrowser.jsx";
+
+<UserAuthenticationBrowser />

docs/sdks/languages/php.mdx

@@ -0,0 +1,204 @@
+---
+title: "Infisical PHP SDK"
+sidebarTitle: "PHP"
+icon: "/images/sdks/languages/php.svg"
+---
+
+If you're working with PHP, the official Infisical PHP SDK package is the easiest way to fetch and work with secrets for your application.
+
+## Installation
+
+```bash
+composer require infisical/php-sdk
+```
+
+## Getting Started
+
+```php
+<?php
+
+use Infisical\SDK\InfisicalSDK;
+
+$sdk = new InfisicalSDK('https://app.infisical.com');
+
+// Authenticate with Infisical
+$response = $sdk->auth()->universalAuth()->login(
+    "your-machine-identity-client-id",
+    "your-machine-identity-client-secret"
+);
+
+// List secrets
+$params = new \Infisical\SDK\Models\ListSecretsParameters(
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id"
+);
+
+$secrets = $sdk->secrets()->list($params);
+echo "Fetched secrets: " . count($secrets) . "\n";
+```
+
+## Core Methods
+
+The SDK methods are organized into the following high-level categories:
+
+1. `auth`: Handles authentication methods.
+2. `secrets`: Manages CRUD operations for secrets.
+
+### `Auth`
+
+The `auth` component provides methods for authentication:
+
+#### Universal Auth
+
+**Authenticating**
+```php
+$response = $sdk->auth()->universal_auth()->login(
+    "your-machine-identity-client-id",
+    "your-machine-identity-client-secret"
+);
+```
+
+**Parameters:**
+- `clientId` (string): The client ID of your Machine Identity.
+- `clientSecret` (string): The client secret of your Machine Identity.
+
+<Warning>
+  We do not recommend hardcoding your [Machine Identity Tokens](/documentation/platform/identities/overview). Setting them as environment variables would be best.
+</Warning>
+
+### `Secrets`
+
+This sub-class handles operations related to secrets:
+
+#### List Secrets
+
+```php
+use Infisical\SDK\Models\ListSecretsParameters;
+
+$params = new ListSecretsParameters(
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id",
+    tagSlugs: ["tag1", "tag2"], // Optional
+    recursive: true, // Optional
+    expandSecretReferences: true, // Optional
+    attachToProcessEnv: false, // Optional
+    skipUniqueValidation: false // Optional
+);
+
+$secrets = $sdk->secrets()->list($params);
+```
+
+**Parameters:**
+- `environment` (string): The environment in which to list secrets (e.g., "dev").
+- `projectId` (string): The ID of your project.
+- `secretPath` (string, optional): The path to the secrets.
+- `tagSlugs` (array, optional): Tags to filter secrets.
+- `recursive` (bool, optional): Whether to list secrets recursively.
+- `expandSecretReferences` (bool, optional): Whether to expand secret references.
+- `attachToProcessEnv` (bool, optional): Whether to attach secrets to process environment variables.
+- `skipUniqueValidation` (bool, optional): Whether to skip unique validation.
+
+**Returns:**
+- `Secret[]`: An array of secret objects.
+
+#### Create Secret
+
+```php
+use Infisical\SDK\Models\CreateSecretParameters;
+
+$params = new CreateSecretParameters(
+    secretKey: "SECRET_NAME",
+    secretValue: "SECRET_VALUE",
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id"
+);
+
+$createdSecret = $sdk->secrets()->create($params);
+```
+
+**Parameters:**
+- `secretKey` (string): The name of the secret to create.
+- `secretValue` (string): The value of the secret.
+- `environment` (string): The environment in which to create the secret.
+- `projectId` (string): The ID of your project.
+- `secretPath` (string, optional): The path to the secret.
+
+**Returns:**
+- `Secret`: The created secret object.
+
+#### Get Secret
+
+```php
+use Infisical\SDK\Models\GetSecretParameters;
+
+$params = new GetSecretParameters(
+    secretKey: "SECRET_NAME",
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id"
+);
+
+$secret = $sdk->secrets()->get($params);
+```
+
+**Parameters:**
+- `secretKey` (string): The name of the secret to retrieve.
+- `environment` (string): The environment in which to retrieve the secret.
+- `projectId` (string): The ID of your project.
+- `secretPath` (string, optional): The path to the secret.
+
+**Returns:**
+- `Secret`: The retrieved secret object.
+
+#### Update Secret
+
+```php
+use Infisical\SDK\Models\UpdateSecretParameters;
+
+$params = new UpdateSecretParameters(
+    secretKey: "SECRET_NAME",
+    newSecretValue: "UPDATED_SECRET_VALUE",
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id"
+);
+
+$updatedSecret = $sdk->secrets()->update($params);
+```
+
+**Parameters:**
+- `secretKey` (string): The name of the secret to update.
+- `newSecretValue` (string): The new value of the secret.
+- `environment` (string): The environment in which to update the secret.
+- `projectId` (string): The ID of your project.
+- `secretPath` (string, optional): The path to the secret.
+
+**Returns:**
+- `Secret`: The updated secret object.
+
+#### Delete Secret
+
+```php
+use Infisical\SDK\Models\DeleteSecretParameters;
+
+$params = new DeleteSecretParameters(
+    secretKey: "SECRET_NAME",
+    environment: "dev",
+    secretPath: "/",
+    projectId: "your-project-id"
+);
+
+$deletedSecret = $sdk->secrets()->delete($params);
+```
+
+**Parameters:**
+- `secretKey` (string): The name of the secret to delete.
+- `environment` (string): The environment in which to delete the secret.
+- `projectId` (string): The ID of your project.
+- `secretPath` (string, optional): The path to the secret.
+
+**Returns:**
+- `Secret`: The deleted secret object.

docs/sdks/overview.mdx

@@ -32,6 +32,9 @@ From local development to production, Infisical SDKs provide the easiest way for
     </Card>
      <Card href="/sdks/languages/go" title="Go" icon="/images/sdks/languages/go.svg">
       Manage secrets for your Go application on demand
+    </Card>
+      <Card href="/sdks/languages/php" title="PHP" icon="/images/sdks/languages/php.svg">
+      Manage secrets for your PHP application on demand
     </Card>
     <Card href="/sdks/languages/ruby" title="Ruby" icon="/images/sdks/languages/ruby.svg">
       Manage secrets for your Ruby application on demand

docs/snippets/AppConnectionsBrowser.jsx

@@ -0,0 +1,155 @@
+import React, { useState, useMemo } from 'react';
+
+export const AppConnectionsBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'Cloud Providers', 'Databases', 'CI/CD', 'Monitoring', 'Directory Services', 'Identity & Auth', 'Data Analytics', 'Hosting', 'DevOps Tools', 'Security'];
+
+  const connections = [
+    {"name": "AWS", "slug": "aws", "path": "/integrations/app-connections/aws", "description": "Learn how to connect your AWS applications to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Azure Key Vault", "slug": "azure-key-vault", "path": "/integrations/app-connections/azure-key-vault", "description": "Learn how to connect your Azure Key Vault to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Azure App Configuration", "slug": "azure-app-configuration", "path": "/integrations/app-connections/azure-app-configuration", "description": "Learn how to connect your Azure App Configuration to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Azure Client Secrets", "slug": "azure-client-secrets", "path": "/integrations/app-connections/azure-client-secrets", "description": "Learn how to connect your Azure Client Secrets to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Azure DevOps", "slug": "azure-devops", "path": "/integrations/app-connections/azure-devops", "description": "Learn how to connect your Azure DevOps to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "Azure ADCS", "slug": "azure-adcs", "path": "/integrations/app-connections/azure-adcs", "description": "Learn how to connect your Azure ADCS to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "GCP", "slug": "gcp", "path": "/integrations/app-connections/gcp", "description": "Learn how to connect your GCP applications to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "HashiCorp Vault", "slug": "hashicorp-vault", "path": "/integrations/app-connections/hashicorp-vault", "description": "Learn how to connect your HashiCorp Vault to pull secrets from Infisical.", "category": "Security"},
+    {"name": "1Password", "slug": "1password", "path": "/integrations/app-connections/1password", "description": "Learn how to connect your 1Password to pull secrets from Infisical.", "category": "Security"},
+    {"name": "Vercel", "slug": "vercel", "path": "/integrations/app-connections/vercel", "description": "Learn how to connect your Vercel application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Netlify", "slug": "netlify", "path": "/integrations/app-connections/netlify", "description": "Learn how to connect your Netlify application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Railway", "slug": "railway", "path": "/integrations/app-connections/railway", "description": "Learn how to connect your Railway application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Fly.io", "slug": "flyio", "path": "/integrations/app-connections/flyio", "description": "Learn how to connect your Fly.io application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Render", "slug": "render", "path": "/integrations/app-connections/render", "description": "Learn how to connect your Render application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Heroku", "slug": "heroku", "path": "/integrations/app-connections/heroku", "description": "Learn how to connect your Heroku application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "DigitalOcean", "slug": "digital-ocean", "path": "/integrations/app-connections/digital-ocean", "description": "Learn how to connect your DigitalOcean application to pull secrets from Infisical.", "category": "Hosting"},
+    {"name": "Supabase", "slug": "supabase", "path": "/integrations/app-connections/supabase", "description": "Learn how to connect your Supabase application to pull secrets from Infisical.", "category": "Databases"},
+    {"name": "Checkly", "slug": "checkly", "path": "/integrations/app-connections/checkly", "description": "Learn how to connect your Checkly application to pull secrets from Infisical.", "category": "Monitoring"},
+    {"name": "GitHub", "slug": "github", "path": "/integrations/app-connections/github", "description": "Learn how to connect your GitHub application to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "GitHub Radar", "slug": "github-radar", "path": "/integrations/app-connections/github-radar", "description": "Learn how to connect your GitHub Radar to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "GitLab", "slug": "gitlab", "path": "/integrations/app-connections/gitlab", "description": "Learn how to connect your GitLab application to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "TeamCity", "slug": "teamcity", "path": "/integrations/app-connections/teamcity", "description": "Learn how to connect your TeamCity to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "Bitbucket", "slug": "bitbucket", "path": "/integrations/app-connections/bitbucket", "description": "Learn how to connect your Bitbucket to pull secrets from Infisical.", "category": "CI/CD"},
+    {"name": "Terraform Cloud", "slug": "terraform-cloud", "path": "/integrations/app-connections/terraform-cloud", "description": "Learn how to connect your Terraform Cloud to pull secrets from Infisical.", "category": "DevOps Tools"},
+    {"name": "Cloudflare", "slug": "cloudflare", "path": "/integrations/app-connections/cloudflare", "description": "Learn how to connect your Cloudflare application to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Databricks", "slug": "databricks", "path": "/integrations/app-connections/databricks", "description": "Learn how to connect your Databricks to pull secrets from Infisical.", "category": "Data Analytics"},
+    {"name": "Windmill", "slug": "windmill", "path": "/integrations/app-connections/windmill", "description": "Learn how to connect your Windmill to pull secrets from Infisical.", "category": "DevOps Tools"},
+    {"name": "Camunda", "slug": "camunda", "path": "/integrations/app-connections/camunda", "description": "Learn how to connect your Camunda to pull secrets from Infisical.", "category": "DevOps Tools"},
+    {"name": "Humanitec", "slug": "humanitec", "path": "/integrations/app-connections/humanitec", "description": "Learn how to connect your Humanitec to pull secrets from Infisical.", "category": "DevOps Tools"},
+    {"name": "OCI", "slug": "oci", "path": "/integrations/app-connections/oci", "description": "Learn how to connect your OCI applications to pull secrets from Infisical.", "category": "Cloud Providers"},
+    {"name": "Zabbix", "slug": "zabbix", "path": "/integrations/app-connections/zabbix", "description": "Learn how to connect your Zabbix to pull secrets from Infisical.", "category": "Monitoring"},
+    {"name": "MySQL", "slug": "mysql", "path": "/integrations/app-connections/mysql", "description": "Learn how to connect your MySQL database to pull secrets from Infisical.", "category": "Databases"},
+    {"name": "PostgreSQL", "slug": "postgres", "path": "/integrations/app-connections/postgres", "description": "Learn how to connect your PostgreSQL database to pull secrets from Infisical.", "category": "Databases"},
+    {"name": "Microsoft SQL Server", "slug": "mssql", "path": "/integrations/app-connections/mssql", "description": "Learn how to connect your SQL Server database to pull secrets from Infisical.", "category": "Databases"},
+    {"name": "Oracle Database", "slug": "oracledb", "path": "/integrations/app-connections/oracledb", "description": "Learn how to connect your Oracle database to pull secrets from Infisical.", "category": "Databases"},
+    {"name": "LDAP", "slug": "ldap", "path": "/integrations/app-connections/ldap", "description": "Learn how to connect your LDAP to pull secrets from Infisical.", "category": "Directory Services"},
+    {"name": "Auth0", "slug": "auth0", "path": "/integrations/app-connections/auth0", "description": "Learn how to connect your Auth0 to pull secrets from Infisical.", "category": "Identity & Auth"},
+    {"name": "Okta", "slug": "okta", "path": "/integrations/app-connections/okta", "description": "Learn how to connect your Okta to pull secrets from Infisical.", "category": "Identity & Auth"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredConnections = useMemo(() => {
+    let filtered = connections;
+    
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(connection => connection.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(connection =>
+        connection.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        connection.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        connection.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search app connections..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredConnections.length} app connection{filteredConnections.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Connections List */}
+      {filteredConnections.length > 0 ? (
+        <div className="space-y-4">
+          {filteredConnections.map((connection, index) => (
+            <a
+              key={connection.slug}
+              href={connection.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {connection.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {connection.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {connection.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No app connections found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/DynamicSecretsBrowser.jsx

@@ -0,0 +1,140 @@
+import React, { useState, useMemo } from 'react';
+
+export const DynamicSecretsBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'Databases', 'Cloud Providers', 'Message Queues', 'Caches', 'Directory Services', 'CI/CD', 'Container Orchestration', 'Authentication'];
+
+  const dynamicSecrets = [
+    {"name": "AWS IAM", "slug": "aws-iam", "path": "/documentation/platform/dynamic-secrets/aws-iam", "description": "Learn how to generate dynamic AWS IAM credentials on-demand.", "category": "Cloud Providers"},
+    {"name": "AWS ElastiCache", "slug": "aws-elasticache", "path": "/documentation/platform/dynamic-secrets/aws-elasticache", "description": "Learn how to generate dynamic AWS ElastiCache credentials on-demand.", "category": "Caches"},
+    {"name": "Azure Entra ID", "slug": "azure-entra-id", "path": "/documentation/platform/dynamic-secrets/azure-entra-id", "description": "Learn how to generate dynamic Azure Entra ID credentials on-demand.", "category": "Cloud Providers"},
+    {"name": "GCP IAM", "slug": "gcp-iam", "path": "/documentation/platform/dynamic-secrets/gcp-iam", "description": "Learn how to generate dynamic GCP IAM credentials on-demand.", "category": "Cloud Providers"},
+    {"name": "Cassandra", "slug": "cassandra", "path": "/documentation/platform/dynamic-secrets/cassandra", "description": "Learn how to generate dynamic Cassandra database credentials on-demand.", "category": "Databases"},
+    {"name": "Couchbase", "slug": "couchbase", "path": "/documentation/platform/dynamic-secrets/couchbase", "description": "Learn how to generate dynamic Couchbase database credentials on-demand.", "category": "Databases"},
+    {"name": "MongoDB", "slug": "mongodb", "path": "/documentation/platform/dynamic-secrets/mongo-db", "description": "Learn how to generate dynamic MongoDB database credentials on-demand.", "category": "Databases"},
+    {"name": "MongoDB Atlas", "slug": "mongodb-atlas", "path": "/documentation/platform/dynamic-secrets/mongo-atlas", "description": "Learn how to generate dynamic MongoDB Atlas database credentials on-demand.", "category": "Databases"},
+    {"name": "MySQL", "slug": "mysql", "path": "/documentation/platform/dynamic-secrets/mysql", "description": "Learn how to generate dynamic MySQL database credentials on-demand.", "category": "Databases"},
+    {"name": "PostgreSQL", "slug": "postgresql", "path": "/documentation/platform/dynamic-secrets/postgresql", "description": "Learn how to generate dynamic PostgreSQL database credentials on-demand.", "category": "Databases"},
+    {"name": "Microsoft SQL Server", "slug": "mssql", "path": "/documentation/platform/dynamic-secrets/mssql", "description": "Learn how to generate dynamic Microsoft SQL Server credentials on-demand.", "category": "Databases"},
+    {"name": "Oracle Database", "slug": "oracle", "path": "/documentation/platform/dynamic-secrets/oracle", "description": "Learn how to generate dynamic Oracle Database credentials on-demand.", "category": "Databases"},
+    {"name": "SAP ASE", "slug": "sap-ase", "path": "/documentation/platform/dynamic-secrets/sap-ase", "description": "Learn how to generate dynamic SAP ASE database credentials on-demand.", "category": "Databases"},
+    {"name": "SAP HANA", "slug": "sap-hana", "path": "/documentation/platform/dynamic-secrets/sap-hana", "description": "Learn how to generate dynamic SAP HANA database credentials on-demand.", "category": "Databases"},
+    {"name": "Snowflake", "slug": "snowflake", "path": "/documentation/platform/dynamic-secrets/snowflake", "description": "Learn how to generate dynamic Snowflake database credentials on-demand.", "category": "Databases"},
+    {"name": "Vertica", "slug": "vertica", "path": "/documentation/platform/dynamic-secrets/vertica", "description": "Learn how to generate dynamic Vertica database credentials on-demand.", "category": "Databases"},
+    {"name": "Redis", "slug": "redis", "path": "/documentation/platform/dynamic-secrets/redis", "description": "Learn how to generate dynamic Redis credentials on-demand.", "category": "Caches"},
+    {"name": "ElasticSearch", "slug": "elasticsearch", "path": "/documentation/platform/dynamic-secrets/elastic-search", "description": "Learn how to generate dynamic ElasticSearch credentials on-demand.", "category": "Databases"},
+    {"name": "RabbitMQ", "slug": "rabbitmq", "path": "/documentation/platform/dynamic-secrets/rabbit-mq", "description": "Learn how to generate dynamic RabbitMQ credentials on-demand.", "category": "Message Queues"},
+    {"name": "LDAP", "slug": "ldap", "path": "/documentation/platform/dynamic-secrets/ldap", "description": "Learn how to generate dynamic LDAP credentials on-demand.", "category": "Directory Services"},
+    {"name": "GitHub", "slug": "github", "path": "/documentation/platform/dynamic-secrets/github", "description": "Learn how to generate dynamic GitHub credentials on-demand.", "category": "CI/CD"},
+    {"name": "Kubernetes", "slug": "kubernetes", "path": "/documentation/platform/dynamic-secrets/kubernetes", "description": "Learn how to generate dynamic Kubernetes credentials on-demand.", "category": "Container Orchestration"},
+    {"name": "TOTP", "slug": "totp", "path": "/documentation/platform/dynamic-secrets/totp", "description": "Learn how to generate dynamic TOTP codes on-demand.", "category": "Authentication"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredDynamicSecrets = useMemo(() => {
+    let filtered = dynamicSecrets;
+
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(secret => secret.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(secret =>
+        secret.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        secret.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        secret.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search dynamic secrets..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredDynamicSecrets.length} dynamic secret{filteredDynamicSecrets.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Dynamic Secrets List */}
+      {filteredDynamicSecrets.length > 0 ? (
+        <div className="space-y-4">
+          {filteredDynamicSecrets.map((secret, index) => (
+            <a
+              key={secret.slug}
+              href={secret.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {secret.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {secret.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {secret.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No dynamic secrets found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/FrameworkIntegrationsBrowser.jsx

@@ -0,0 +1,101 @@
+import React, { useState, useMemo } from 'react';
+
+export const FrameworkIntegrationsBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+
+  const integrations = [
+    {"name": "React", "slug": "react", "path": "/integrations/frameworks/react", "description": "Learn how to integrate Infisical with React applications for secure secret management.", "category": "Web Frameworks"},
+    {"name": "Next.js", "slug": "nextjs", "path": "/integrations/frameworks/nextjs", "description": "Learn how to integrate Infisical with Next.js applications.", "category": "Web Frameworks"},
+    {"name": "Vue", "slug": "vuejs", "path": "/integrations/frameworks/vue", "description": "Learn how to integrate Infisical with Vue.js applications.", "category": "Web Frameworks"},
+    {"name": "Nuxt", "slug": "nuxtjs", "path": "/integrations/frameworks/nuxt", "description": "Learn how to integrate Infisical with Nuxt.js applications.", "category": "Web Frameworks"},
+    {"name": "SvelteKit", "slug": "sveltekit", "path": "/integrations/frameworks/sveltekit", "description": "Learn how to integrate Infisical with SvelteKit applications.", "category": "Web Frameworks"},
+    {"name": "Express, Fastify, Koa", "slug": "express", "path": "/integrations/frameworks/express", "description": "Learn how to integrate Infisical with Express.js backend applications.", "category": "Web Frameworks"},
+    {"name": "NestJS", "slug": "nestjs", "path": "/integrations/frameworks/nestjs", "description": "Learn how to integrate Infisical with NestJS applications.", "category": "Web Frameworks"},
+    {"name": "Django", "slug": "django", "path": "/integrations/frameworks/django", "description": "Learn how to integrate Infisical with Django applications.", "category": "Web Frameworks"},
+    {"name": "Flask", "slug": "flask", "path": "/integrations/frameworks/flask", "description": "Learn how to integrate Infisical with Flask applications.", "category": "Web Frameworks"},
+    {"name": "Ruby on Rails", "slug": "rails", "path": "/integrations/frameworks/rails", "description": "Learn how to integrate Infisical with Ruby on Rails applications.", "category": "Web Frameworks"},
+    {"name": "Spring Boot", "slug": "spring-boot-maven", "path": "/integrations/frameworks/spring-boot-maven", "description": "Learn how to integrate Infisical with Spring Boot applications.", "category": "Web Frameworks"},
+    {"name": "Laravel", "slug": "laravel", "path": "/integrations/frameworks/laravel", "description": "Learn how to integrate Infisical with Laravel applications.", "category": "Web Frameworks"},
+    {"name": ".NET", "slug": "dotnet", "path": "/integrations/frameworks/dotnet", "description": "Learn how to integrate Infisical with .NET applications.", "category": "Web Frameworks"},
+    {"name": "Fiber", "slug": "fiber", "path": "/integrations/frameworks/fiber", "description": "Learn how to integrate Infisical with Fiber (Go) framework.", "category": "Web Frameworks"},
+    {"name": "Gatsby", "slug": "gatsby", "path": "/integrations/frameworks/gatsby", "description": "Learn how to integrate Infisical with Gatsby applications.", "category": "Web Frameworks"},
+    {"name": "Remix", "slug": "remix", "path": "/integrations/frameworks/remix", "description": "Learn how to integrate Infisical with Remix applications.", "category": "Web Frameworks"},
+    {"name": "Vite", "slug": "vite", "path": "/integrations/frameworks/vite", "description": "Learn how to integrate Infisical with Vite applications.", "category": "Web Frameworks"},
+    {"name": "AB Initio", "slug": "ab-initio", "path": "/integrations/frameworks/ab-initio", "description": "Learn how to integrate Infisical with AB Initio applications.", "category": "Web Frameworks"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredIntegrations = useMemo(() => {
+    if (searchTerm) {
+      return integrations.filter(integration =>
+        integration.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        integration.description.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+    return integrations;
+  }, [searchTerm]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search framework integrations..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredIntegrations.length} framework integration{filteredIntegrations.length !== 1 ? 's' : ''} found
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Integrations List */}
+      {filteredIntegrations.length > 0 ? (
+        <div className="space-y-4">
+          {filteredIntegrations.map((integration, index) => (
+            <a
+              key={integration.slug}
+              href={integration.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {integration.name}
+                  </h3>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {integration.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No framework integrations found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/MachineAuthenticationBrowser.jsx

@@ -0,0 +1,136 @@
+import React, { useState, useMemo } from 'react';
+
+export const MachineAuthenticationBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'Token-based', 'Cloud Provider', 'Kubernetes', 'Certificate-based', 'Directory-based'];
+
+  const authMethods = [
+    {"name": "Universal Auth", "slug": "universal-auth", "path": "/documentation/platform/identities/universal-auth", "description": "Learn how to authenticate machines using Universal Auth tokens with client ID and secret.", "category": "Token-based"},
+    {"name": "Token Auth", "slug": "token-auth", "path": "/documentation/platform/identities/token-auth", "description": "Learn how to authenticate machines using long-lived access tokens.", "category": "Token-based"},
+    {"name": "JWT Auth", "slug": "jwt-auth", "path": "/documentation/platform/identities/jwt-auth", "description": "Learn how to authenticate machines using JSON Web Tokens (JWT).", "category": "Token-based"},
+    {"name": "AWS Auth", "slug": "aws-iam-auth", "path": "/documentation/platform/identities/aws-auth", "description": "Learn how to authenticate AWS services and resources using IAM roles.", "category": "Cloud Provider"},
+    {"name": "Azure Auth", "slug": "azure-auth", "path": "/documentation/platform/identities/azure-auth", "description": "Learn how to authenticate Azure services using managed identities.", "category": "Cloud Provider"},
+    {"name": "GCP Auth", "slug": "gcp-auth", "path": "/documentation/platform/identities/gcp-auth", "description": "Learn how to authenticate GCP services using service accounts.", "category": "Cloud Provider"},
+    {"name": "Alibaba Cloud Auth", "slug": "alicloud-auth", "path": "/documentation/platform/identities/alicloud-auth", "description": "Learn how to authenticate Alibaba Cloud services using RAM roles.", "category": "Cloud Provider"},
+    {"name": "OCI Auth", "slug": "oci-auth", "path": "/documentation/platform/identities/oci-auth", "description": "Learn how to authenticate Oracle Cloud Infrastructure services.", "category": "Cloud Provider"},
+    {"name": "Kubernetes Auth", "slug": "kubernetes-auth", "path": "/documentation/platform/identities/kubernetes-auth", "description": "Learn how to authenticate Kubernetes workloads using service account tokens.", "category": "Kubernetes"},
+    {"name": "OIDC Auth", "slug": "oidc-auth-general", "path": "/documentation/platform/identities/oidc-auth/general", "description": "Learn how to authenticate machines using OpenID Connect (OIDC) providers.", "category": "Token-based"},
+    {"name": "OIDC Auth for GitHub Actions", "slug": "oidc-auth-github", "path": "/documentation/platform/identities/oidc-auth/github", "description": "Learn how to authenticate GitHub Actions using OIDC.", "category": "Token-based"},
+    {"name": "OIDC Auth for GitLab CI/CD", "slug": "oidc-auth-gitlab", "path": "/documentation/platform/identities/oidc-auth/gitlab", "description": "Learn how to authenticate GitLab CI/CD using OIDC.", "category": "Token-based"},
+    {"name": "OIDC Auth for Azure", "slug": "oidc-auth-azure", "path": "/documentation/platform/identities/oidc-auth/azure", "description": "Learn how to authenticate Azure services using OIDC.", "category": "Token-based"},
+    {"name": "OIDC Auth for CircleCI", "slug": "oidc-auth-circleci", "path": "/documentation/platform/identities/oidc-auth/circleci", "description": "Learn how to authenticate CircleCI workflows using OIDC.", "category": "Token-based"},
+    {"name": "OIDC Auth for Terraform Cloud", "slug": "oidc-auth-terraform", "path": "/documentation/platform/identities/oidc-auth/terraform-cloud", "description": "Learn how to authenticate Terraform Cloud using OIDC.", "category": "Token-based"},
+    {"name": "OIDC Auth for SPIRE", "slug": "oidc-auth-spire", "path": "/documentation/platform/identities/oidc-auth/spire", "description": "Learn how to authenticate workloads using SPIFFE/SPIRE OIDC.", "category": "Token-based"},
+    {"name": "TLS Certificate Auth", "slug": "tls-cert-auth", "path": "/documentation/platform/identities/tls-cert-auth", "description": "Learn how to authenticate machines using TLS client certificates.", "category": "Certificate-based"},
+    {"name": "LDAP Auth", "slug": "ldap-auth-general", "path": "/documentation/platform/identities/ldap-auth/general", "description": "Learn how to authenticate machines using LDAP credentials.", "category": "Directory-based"},
+    {"name": "LDAP Auth for JumpCloud", "slug": "ldap-auth-jumpcloud", "path": "/documentation/platform/identities/ldap-auth/jumpcloud", "description": "Learn how to authenticate machines using JumpCloud LDAP.", "category": "Directory-based"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredAuthMethods = useMemo(() => {
+    let filtered = authMethods;
+
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(method => method.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(method =>
+        method.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        method.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        method.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search machine authentication methods..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredAuthMethods.length} authentication method{filteredAuthMethods.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Authentication Methods List */}
+      {filteredAuthMethods.length > 0 ? (
+        <div className="space-y-4">
+          {filteredAuthMethods.map((method, index) => (
+            <a
+              key={method.slug}
+              href={method.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {method.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {method.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {method.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No authentication methods found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/RotationsBrowser.jsx

@@ -0,0 +1,126 @@
+import React, { useState, useMemo } from 'react';
+
+export const RotationsBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'Databases', 'Identity & Auth', 'Cloud Providers'];
+
+  const rotations = [
+    {"name": "AWS IAM User", "slug": "aws-iam-user", "path": "/documentation/platform/secret-rotation/aws-iam-user-secret", "description": "Learn how to automatically rotate AWS IAM user access keys.", "category": "Cloud Providers"},
+    {"name": "Azure Client Secret", "slug": "azure-client-secret", "path": "/documentation/platform/secret-rotation/azure-client-secret", "description": "Learn how to automatically rotate Azure client secrets.", "category": "Cloud Providers"},
+    {"name": "Auth0 Client Secret", "slug": "auth0-client-secret", "path": "/documentation/platform/secret-rotation/auth0-client-secret", "description": "Learn how to automatically rotate Auth0 client secrets.", "category": "Identity & Auth"},
+    {"name": "Okta Client Secret", "slug": "okta-client-secret", "path": "/documentation/platform/secret-rotation/okta-client-secret", "description": "Learn how to automatically rotate Okta client secrets.", "category": "Identity & Auth"},
+    {"name": "LDAP Password", "slug": "ldap-password", "path": "/documentation/platform/secret-rotation/ldap-password", "description": "Learn how to automatically rotate LDAP user passwords.", "category": "Identity & Auth"},
+    {"name": "MySQL", "slug": "mysql-credentials", "path": "/documentation/platform/secret-rotation/mysql-credentials", "description": "Learn how to automatically rotate MySQL database credentials.", "category": "Databases"},
+    {"name": "PostgreSQL", "slug": "postgres-credentials", "path": "/documentation/platform/secret-rotation/postgres-credentials", "description": "Learn how to automatically rotate PostgreSQL database credentials.", "category": "Databases"},
+    {"name": "Microsoft SQL Server", "slug": "mssql-credentials", "path": "/documentation/platform/secret-rotation/mssql-credentials", "description": "Learn how to automatically rotate Microsoft SQL Server credentials.", "category": "Databases"},
+    {"name": "Oracle Database", "slug": "oracledb-credentials", "path": "/documentation/platform/secret-rotation/oracledb-credentials", "description": "Learn how to automatically rotate Oracle Database credentials.", "category": "Databases"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredRotations = useMemo(() => {
+    let filtered = rotations;
+
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(rotation => rotation.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(rotation =>
+        rotation.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        rotation.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        rotation.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search secret rotations..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredRotations.length} secret rotation{filteredRotations.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Rotations List */}
+      {filteredRotations.length > 0 ? (
+        <div className="space-y-4">
+          {filteredRotations.map((rotation, index) => (
+            <a
+              key={rotation.slug}
+              href={rotation.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {rotation.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {rotation.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {rotation.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No secret rotations found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/SecretSyncsBrowser.jsx

@@ -0,0 +1,147 @@
+import React, { useState, useMemo } from 'react';
+
+export const SecretSyncsBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'Cloud Providers', 'Databases', 'CI/CD', 'Monitoring', 'Data Analytics', 'Hosting', 'DevOps Tools', 'Security'];
+
+  const syncs = [
+    {"name": "AWS Parameter Store", "slug": "aws-parameter-store", "path": "/integrations/secret-syncs/aws-parameter-store", "description": "Learn how to sync secrets from Infisical to AWS Parameter Store.", "category": "Cloud Providers"},
+    {"name": "AWS Secrets Manager", "slug": "aws-secrets-manager", "path": "/integrations/secret-syncs/aws-secrets-manager", "description": "Learn how to sync secrets from Infisical to AWS Secrets Manager.", "category": "Cloud Providers"},
+    {"name": "Azure Key Vault", "slug": "azure-key-vault", "path": "/integrations/secret-syncs/azure-key-vault", "description": "Learn how to sync secrets from Infisical to Azure Key Vault.", "category": "Cloud Providers"},
+    {"name": "Azure App Configuration", "slug": "azure-app-configuration", "path": "/integrations/secret-syncs/azure-app-configuration", "description": "Learn how to sync secrets from Infisical to Azure App Configuration.", "category": "Cloud Providers"},
+    {"name": "Azure DevOps", "slug": "azure-devops", "path": "/integrations/secret-syncs/azure-devops", "description": "Learn how to sync secrets from Infisical to Azure DevOps.", "category": "CI/CD"},
+    {"name": "GCP Secret Manager", "slug": "gcp-secret-manager", "path": "/integrations/secret-syncs/gcp-secret-manager", "description": "Learn how to sync secrets from Infisical to GCP Secret Manager.", "category": "Cloud Providers"},
+    {"name": "HashiCorp Vault", "slug": "hashicorp-vault", "path": "/integrations/secret-syncs/hashicorp-vault", "description": "Learn how to sync secrets from Infisical to HashiCorp Vault.", "category": "Security"},
+    {"name": "1Password", "slug": "1password", "path": "/integrations/secret-syncs/1password", "description": "Learn how to sync secrets from Infisical to 1Password.", "category": "Security"},
+    {"name": "Vercel", "slug": "vercel", "path": "/integrations/secret-syncs/vercel", "description": "Learn how to sync secrets from Infisical to Vercel.", "category": "Hosting"},
+    {"name": "Netlify", "slug": "netlify", "path": "/integrations/secret-syncs/netlify", "description": "Learn how to sync secrets from Infisical to Netlify.", "category": "Hosting"},
+    {"name": "Railway", "slug": "railway", "path": "/integrations/secret-syncs/railway", "description": "Learn how to sync secrets from Infisical to Railway.", "category": "Hosting"},
+    {"name": "Fly.io", "slug": "flyio", "path": "/integrations/secret-syncs/flyio", "description": "Learn how to sync secrets from Infisical to Fly.io.", "category": "Hosting"},
+    {"name": "Render", "slug": "render", "path": "/integrations/secret-syncs/render", "description": "Learn how to sync secrets from Infisical to Render.", "category": "Hosting"},
+    {"name": "Heroku", "slug": "heroku", "path": "/integrations/secret-syncs/heroku", "description": "Learn how to sync secrets from Infisical to Heroku.", "category": "Hosting"},
+    {"name": "DigitalOcean App Platform", "slug": "digital-ocean-app-platform", "path": "/integrations/secret-syncs/digital-ocean-app-platform", "description": "Learn how to sync secrets from Infisical to DigitalOcean App Platform.", "category": "Hosting"},
+    {"name": "Supabase", "slug": "supabase", "path": "/integrations/secret-syncs/supabase", "description": "Learn how to sync secrets from Infisical to Supabase.", "category": "Databases"},
+    {"name": "Checkly", "slug": "checkly", "path": "/integrations/secret-syncs/checkly", "description": "Learn how to sync secrets from Infisical to Checkly.", "category": "Monitoring"},
+    {"name": "GitHub", "slug": "github", "path": "/integrations/secret-syncs/github", "description": "Learn how to sync secrets from Infisical to GitHub.", "category": "CI/CD"},
+    {"name": "GitLab", "slug": "gitlab", "path": "/integrations/secret-syncs/gitlab", "description": "Learn how to sync secrets from Infisical to GitLab.", "category": "CI/CD"},
+    {"name": "TeamCity", "slug": "teamcity", "path": "/integrations/secret-syncs/teamcity", "description": "Learn how to sync secrets from Infisical to TeamCity.", "category": "CI/CD"},
+    {"name": "Bitbucket", "slug": "bitbucket", "path": "/integrations/secret-syncs/bitbucket", "description": "Learn how to sync secrets from Infisical to Bitbucket.", "category": "CI/CD"},
+    {"name": "Terraform Cloud", "slug": "terraform-cloud", "path": "/integrations/secret-syncs/terraform-cloud", "description": "Learn how to sync secrets from Infisical to Terraform Cloud.", "category": "DevOps Tools"},
+    {"name": "Cloudflare Pages", "slug": "cloudflare-pages", "path": "/integrations/secret-syncs/cloudflare-pages", "description": "Learn how to sync secrets from Infisical to Cloudflare Pages.", "category": "Hosting"},
+    {"name": "Cloudflare Workers", "slug": "cloudflare-workers", "path": "/integrations/secret-syncs/cloudflare-workers", "description": "Learn how to sync secrets from Infisical to Cloudflare Workers.", "category": "Cloud Providers"},
+    {"name": "Databricks", "slug": "databricks", "path": "/integrations/secret-syncs/databricks", "description": "Learn how to sync secrets from Infisical to Databricks.", "category": "Data Analytics"},
+    {"name": "Windmill", "slug": "windmill", "path": "/integrations/secret-syncs/windmill", "description": "Learn how to sync secrets from Infisical to Windmill.", "category": "DevOps Tools"},
+    {"name": "Camunda", "slug": "camunda", "path": "/integrations/secret-syncs/camunda", "description": "Learn how to sync secrets from Infisical to Camunda.", "category": "DevOps Tools"},
+    {"name": "Humanitec", "slug": "humanitec", "path": "/integrations/secret-syncs/humanitec", "description": "Learn how to sync secrets from Infisical to Humanitec.", "category": "DevOps Tools"},
+    {"name": "OCI Vault", "slug": "oci-vault", "path": "/integrations/secret-syncs/oci-vault", "description": "Learn how to sync secrets from Infisical to OCI Vault.", "category": "Cloud Providers"},
+    {"name": "Zabbix", "slug": "zabbix", "path": "/integrations/secret-syncs/zabbix", "description": "Learn how to sync secrets from Infisical to Zabbix.", "category": "Monitoring"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredSyncs = useMemo(() => {
+    let filtered = syncs;
+
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(sync => sync.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(sync =>
+        sync.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        sync.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        sync.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search secret syncs..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredSyncs.length} secret sync{filteredSyncs.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Secret Syncs List */}
+      {filteredSyncs.length > 0 ? (
+        <div className="space-y-4">
+          {filteredSyncs.map((sync, index) => (
+            <a
+              key={sync.slug}
+              href={sync.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {sync.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {sync.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {sync.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No secret syncs found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

docs/snippets/UserAuthenticationBrowser.jsx

@@ -0,0 +1,135 @@
+import React, { useState, useMemo } from 'react';
+
+export const UserAuthenticationBrowser = () => {
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedCategory, setSelectedCategory] = useState('All');
+
+  const categories = ['All', 'SSO', 'LDAP', 'SCIM', 'General'];
+
+  const authMethods = [
+    {"name": "Auth0 OIDC", "slug": "auth0-oidc-sso", "path": "/documentation/platform/sso/auth0-oidc", "description": "Learn how to configure Auth0 OIDC SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Auth0 SAML", "slug": "auth0-saml-sso", "path": "/documentation/platform/sso/auth0-saml", "description": "Learn how to configure Auth0 SAML SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Entra ID / Azure AD SAML", "slug": "azure-ad-sso", "path": "/documentation/platform/sso/azure", "description": "Learn how to configure Azure Active Directory (Entra ID) SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Google", "slug": "google-sso", "path": "/documentation/platform/sso/google", "description": "Learn how to configure Google SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Google SAML", "slug": "google-saml-sso", "path": "/documentation/platform/sso/google-saml", "description": "Learn how to configure Google SAML SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "GitHub", "slug": "github-sso", "path": "/documentation/platform/sso/github", "description": "Learn how to configure GitHub SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "GitLab", "slug": "gitlab-sso", "path": "/documentation/platform/sso/gitlab", "description": "Learn how to configure GitLab SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "JumpCloud", "slug": "jumpcloud-sso", "path": "/documentation/platform/sso/jumpcloud", "description": "Learn how to configure JumpCloud SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Keycloak OIDC", "slug": "keycloak-oidc-sso", "path": "/documentation/platform/sso/keycloak-oidc/overview", "description": "Learn how to configure Keycloak OIDC SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Keycloak SAML", "slug": "keycloak-saml-sso", "path": "/documentation/platform/sso/keycloak-saml", "description": "Learn how to configure Keycloak SAML SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Okta", "slug": "okta-oidc-sso", "path": "/documentation/platform/sso/okta", "description": "Learn how to configure Okta OIDC SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "Okta SAML", "slug": "okta-saml-sso", "path": "/documentation/platform/sso/okta-saml", "description": "Learn how to configure Okta SAML SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "OneLogin SAML", "slug": "onelogin-saml-sso", "path": "/documentation/platform/sso/onelogin-saml", "description": "Learn how to configure OneLogin SAML SSO for user authentication in Infisical.", "category": "SSO"},
+    {"name": "General OIDC", "slug": "general-oidc-sso", "path": "/documentation/platform/sso/general-oidc", "description": "Learn how to configure generic OIDC providers for SSO in Infisical.", "category": "SSO"},
+    {"name": "General SAML 2.0", "slug": "general-saml-sso", "path": "/documentation/platform/sso/general-saml", "description": "Learn how to configure generic SAML 2.0 providers for SSO in Infisical.", "category": "SSO"},
+    {"name": "LDAP", "slug": "ldap", "path": "/documentation/platform/ldap/overview", "description": "Learn how to configure LDAP authentication for user login in Infisical.", "category": "LDAP"},
+    {"name": "SCIM", "slug": "scim", "path": "/documentation/platform/scim/overview", "description": "Learn how to configure SCIM provisioning for automated user management in Infisical.", "category": "SCIM"},
+    {"name": "Email/Password", "slug": "email-password", "path": "/documentation/getting-started/introduction", "description": "Learn how to use standard email and password authentication in Infisical.", "category": "General"}
+  ].sort(function(a, b) {
+      return a.name.toLowerCase().localeCompare(b.name.toLowerCase());
+  });
+
+  const filteredAuthMethods = useMemo(() => {
+    let filtered = authMethods;
+    
+    if (selectedCategory !== 'All') {
+      filtered = filtered.filter(method => method.category === selectedCategory);
+    }
+
+    if (searchTerm) {
+      filtered = filtered.filter(method =>
+        method.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        method.description.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        method.category.toLowerCase().includes(searchTerm.toLowerCase())
+      );
+    }
+
+    return filtered;
+  }, [searchTerm, selectedCategory]);
+
+  return (
+    <div className="max-w-none">
+      {/* Search Bar */}
+      <div className="mb-6">
+        <div className="relative w-full">
+          <div className="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
+            <svg className="h-4 w-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+            </svg>
+          </div>
+          <input
+            type="text"
+            placeholder="Search user authentication methods..."
+            className="block w-full pl-9 pr-3 py-2 text-sm border border-gray-300 rounded-lg placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:border-yellow-500 bg-white shadow-sm"
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+          />
+        </div>
+      </div>
+
+      {/* Category Filter */}
+      <div className="mb-6">
+        <div className="flex flex-wrap gap-2">
+          {categories.map(category => (
+            <button
+              key={category}
+              onClick={() => setSelectedCategory(category)}
+              className={`px-3 py-1.5 text-sm font-medium rounded-lg transition-colors shadow-sm ${
+                selectedCategory === category
+                  ? 'bg-yellow-100 text-yellow-700 border border-yellow-200'
+                  : 'bg-white text-gray-700 border border-gray-200 hover:bg-yellow-50 hover:border-yellow-200'
+              }`}
+            >
+              {category}
+            </button>
+          ))}
+        </div>
+      </div>
+
+      {/* Results Count */}
+      <div className="mb-4">
+        <p className="text-sm text-gray-600">
+          {filteredAuthMethods.length} user authentication method{filteredAuthMethods.length !== 1 ? 's' : ''} found
+          {selectedCategory !== 'All' && ` in ${selectedCategory}`}
+          {searchTerm && ` for "${searchTerm}"`}
+        </p>
+      </div>
+
+      {/* Authentication Methods List */}
+      {filteredAuthMethods.length > 0 ? (
+        <div className="space-y-4">
+          {filteredAuthMethods.map((method, index) => (
+            <a
+              key={method.slug}
+              href={method.path}
+              className="group block px-4 py-3 border border-gray-200 rounded-xl hover:border-yellow-200 hover:bg-yellow-50/50 hover:shadow-sm transition-all duration-200 bg-white shadow-sm"
+            >
+              <div className="w-full">
+                <div className="flex items-center justify-between mb-0.5">
+                  <h3 className="text-base font-medium text-gray-900 leading-none m-0">
+                    {method.name}
+                  </h3>
+                  <span className="ml-3 inline-flex items-center px-3 py-1 rounded-full text-xs font-medium bg-yellow-100 text-yellow-700 flex-shrink-0">
+                    {method.category}
+                  </span>
+                </div>
+                <p className="text-sm text-gray-600 leading-relaxed">
+                  {method.description}
+                </p>
+              </div>
+            </a>
+          ))}
+        </div>
+      ) : (
+        <div className="text-center py-8">
+          <div className="flex flex-col items-center space-y-2">
+            <p className="text-gray-500">No user authentication methods found matching your criteria</p>
+            {searchTerm && (
+              <p className="text-gray-400 text-sm">Try adjusting your search terms or filters</p>
+            )}
+          </div>
+        </div>
+      )}
+    </div>
+  );
+};

frontend/src/components/v2/CreatableSelect/CreatableSelect.tsx

@@ -60,7 +60,8 @@ export const CreatableSelect = <T,>({
             isSelected && "text-mineshaft-200",
             "px-3 py-2 text-xs hover:cursor-pointer"
           ),
-        noOptionsMessage: () => "text-mineshaft-400 p-2 rounded-md"
+        noOptionsMessage: () => "text-mineshaft-400 p-2 rounded-md",
+        loadingMessage: () => "text-mineshaft-400 p-2 rounded-md"
       }}
       {...props}
     />

frontend/src/components/v2/FilterableSelect/FilterableSelect.tsx

@@ -91,7 +91,7 @@ export const FilterableSelect = <T,>({
           ),
         placeholder: () =>
           `${isMulti ? "py-[0.22rem]" : "leading-7"} text-mineshaft-400 text-sm pl-1`,
-        input: () => "pl-1",
+        input: () => `pl-1 ${isMulti ? "py-[0.22rem]" : ""}`,
         valueContainer: () =>
           `px-1 max-h-[8.2rem] ${
             isMulti ? "!overflow-y-auto thin-scrollbar py-1" : "py-[0.1rem]"
@@ -114,7 +114,8 @@ export const FilterableSelect = <T,>({
             isSelected && "text-mineshaft-200",
             "rounded px-3 py-2 text-xs hover:cursor-pointer"
           ),
-        noOptionsMessage: () => "text-mineshaft-400 p-2 rounded-md"
+        noOptionsMessage: () => "text-mineshaft-400 p-2 rounded-md",
+        loadingMessage: () => "text-mineshaft-400 p-2 rounded-md"
       }}
       {...props}
     />

frontend/src/context/OrgPermissionContext/types.ts

@@ -52,6 +52,7 @@ export enum OrgPermissionSubjects {
   Gateway = "gateway",
   SecretShare = "secret-share",
   GithubOrgSync = "github-org-sync",
+  GithubOrgSyncManual = "github-org-sync-manual",
   MachineIdentityAuthTemplate = "machine-identity-auth-template"
 }
 
@@ -115,6 +116,7 @@ export type OrgPermissionSet =
   | [OrgPermissionActions, OrgPermissionSubjects.IncidentAccount]
   | [OrgPermissionActions, OrgPermissionSubjects.Scim]
   | [OrgPermissionActions, OrgPermissionSubjects.GithubOrgSync]
+  | [OrgPermissionActions, OrgPermissionSubjects.GithubOrgSyncManual]
   | [OrgPermissionActions, OrgPermissionSubjects.Sso]
   | [OrgPermissionActions, OrgPermissionSubjects.Ldap]
   | [OrgPermissionGroupActions, OrgPermissionSubjects.Groups]

frontend/src/hooks/api/admin/mutation.ts

@@ -1,6 +1,7 @@
 import { useMutation, useQueryClient } from "@tanstack/react-query";
 
 import { apiRequest } from "@app/config/request";
+import { Organization } from "@app/hooks/api/organization/types";
 
 import { organizationKeys } from "../organization/queries";
 import { User } from "../users/types";
@@ -8,7 +9,9 @@ import { adminQueryKeys, adminStandaloneKeys } from "./queries";
 import {
   RootKeyEncryptionStrategy,
   TCreateAdminUserDTO,
+  TCreateOrganizationDTO,
   TInvalidateCacheDTO,
+  TResendOrgInviteDTO,
   TServerConfig,
   TUpdateServerConfigDTO,
   TUsageReportResponse
@@ -195,6 +198,50 @@ export const useInvalidateCache = () => {
   });
 };
 
+export const useServerAdminCreateOrganization = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (opt: TCreateOrganizationDTO) => {
+      const { data } = await apiRequest.post<{ organization: Organization }>(
+        "/api/v1/admin/organization-management/organizations",
+        opt
+      );
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: adminQueryKeys.getOrganizations() });
+    }
+  });
+};
+
+export const useServerAdminResendOrgInvite = () => {
+  return useMutation({
+    mutationFn: async ({ organizationId, membershipId }: TResendOrgInviteDTO) => {
+      await apiRequest.post(
+        `/api/v1/admin/organization-management/organizations/${organizationId}/memberships/${membershipId}/resend-invite`
+      );
+    }
+  });
+};
+
+export const useServerAdminAccessOrg = () => {
+  const queryClient = useQueryClient();
+
+  return useMutation({
+    mutationFn: async (orgId: string) => {
+      const { data } = await apiRequest.post(
+        `/api/v1/admin/organization-management/organizations/${orgId}/access`
+      );
+      return data;
+    },
+    onSuccess: () => {
+      queryClient.invalidateQueries({ queryKey: organizationKeys.getUserOrganizations });
+      queryClient.invalidateQueries({ queryKey: adminQueryKeys.getOrganizations() });
+    }
+  });
+};
+
 export const useGenerateUsageReport = () => {
   return useMutation<TUsageReportResponse, object, void>({
     mutationFn: async () => {

frontend/src/hooks/api/admin/queries.ts

@@ -1,4 +1,11 @@
-import { useInfiniteQuery, useQuery, UseQueryOptions } from "@tanstack/react-query";
+import {
+  DefaultError,
+  InfiniteData,
+  UndefinedInitialDataInfiniteOptions,
+  useInfiniteQuery,
+  useQuery,
+  UseQueryOptions
+} from "@tanstack/react-query";
 
 import { apiRequest } from "@app/config/request";
 import { Identity } from "@app/hooks/api/identities/types";
@@ -25,8 +32,8 @@ export const adminStandaloneKeys = {
 export const adminQueryKeys = {
   serverConfig: () => ["server-config"] as const,
   getUsers: (filters: AdminGetUsersFilters) => [adminStandaloneKeys.getUsers, { filters }] as const,
-  getOrganizations: (filters: AdminGetOrganizationsFilters) =>
-    [adminStandaloneKeys.getOrganizations, { filters }] as const,
+  getOrganizations: (filters?: AdminGetOrganizationsFilters) =>
+    [adminStandaloneKeys.getOrganizations, ...(filters ? [{ filters }] : [])] as const,
   getIdentities: (filters: AdminGetIdentitiesFilters) =>
     [adminStandaloneKeys.getIdentities, { filters }] as const,
   getAdminSlackConfig: () => ["admin-slack-config"] as const,
@@ -83,7 +90,18 @@ export const useGetServerConfig = ({
     enabled: options?.enabled ?? true
   });
 
-export const useAdminGetUsers = (filters: AdminGetUsersFilters) => {
+export const useAdminGetUsers = (
+  filters: AdminGetUsersFilters,
+  options?: Partial<
+    UndefinedInitialDataInfiniteOptions<
+      User[],
+      DefaultError,
+      InfiniteData<User[]>,
+      ReturnType<typeof adminQueryKeys.getUsers>,
+      number
+    >
+  >
+) => {
   return useInfiniteQuery({
     initialPageParam: 0,
     queryKey: adminQueryKeys.getUsers(filters),
@@ -101,7 +119,8 @@ export const useAdminGetUsers = (filters: AdminGetUsersFilters) => {
       return data.users;
     },
     getNextPageParam: (lastPage, pages) =>
-      lastPage.length !== 0 ? pages.length * filters.limit : undefined
+      lastPage.length !== 0 ? pages.length * filters.limit : undefined,
+    ...options
   });
 };
 

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

@@ -1,3 +1,5 @@
+import { OrgMembershipStatus } from "@app/hooks/api/organization/types";
+
 import { Organization } from "../types";
 
 export enum LoginMethod {
@@ -20,6 +22,7 @@ export type OrganizationWithProjects = Organization & {
       lastName: string | null;
     };
     membershipId: string;
+    status: OrgMembershipStatus;
     role: string;
     roleId: string | null;
   }[];
@@ -149,3 +152,13 @@ export type TUsageReportResponse = {
   csvContent: string;
   signature: string;
 };
+
+export type TCreateOrganizationDTO = {
+  name: string;
+  inviteAdminEmails: string[];
+};
+
+export type TResendOrgInviteDTO = {
+  organizationId: string;
+  membershipId: string;
+};

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

@@ -1,6 +1,7 @@
 export {
   useCreateGithubSyncOrgConfig,
   useDeleteGithubSyncOrgConfig,
+  useSyncAllGithubTeams,
   useUpdateGithubSyncOrgConfig
 } from "./mutations";
 export { githubOrgSyncConfigQueryKeys } from "./queries";

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

@@ -40,3 +40,19 @@ export const useDeleteGithubSyncOrgConfig = () => {
     }
   });
 };
+
+export const useSyncAllGithubTeams = () => {
+  return useMutation({
+    mutationFn: async (): Promise<{
+      totalUsers: number;
+      errors: string[];
+      createdTeams: string[];
+      updatedTeams: string[];
+      removedMemberships: number;
+      syncDuration: number;
+    }> => {
+      const response = await apiRequest.post("/api/v1/github-org-sync-config/sync-all-teams");
+      return response.data;
+    }
+  });
+};

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

@@ -1 +1,2 @@
 export * from "./mutations";
+export * from "./queries";

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

@@ -0,0 +1,20 @@
+import { apiRequest } from "@app/config/request";
+import { useQuery } from "@tanstack/react-query";
+import { ExternalMigrationProviders } from "./types";
+
+const externalMigrationQueryKeys = {
+  customMigrationAvailable: (provider: ExternalMigrationProviders) => [
+    "custom-migration-available",
+    provider
+  ]
+};
+
+export const useHasCustomMigrationAvailable = (provider: ExternalMigrationProviders) => {
+  return useQuery({
+    queryKey: externalMigrationQueryKeys.customMigrationAvailable(provider),
+    queryFn: () =>
+      apiRequest.get<{ enabled: boolean }>(
+        `/api/v3/external-migration/custom-migration-enabled/${provider}`
+      )
+  });
+};

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

@@ -0,0 +1,4 @@
+export enum ExternalMigrationProviders {
+  Vault = "vault",
+  EnvKey = "env-key"
+}

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

@@ -159,3 +159,8 @@ export enum OrgIdentityOrderBy {
   Name = "name",
   Role = "role"
 }
+
+export enum OrgMembershipStatus {
+  Invited = "invited",
+  Accepted = "accepted"
+}

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

@@ -19,10 +19,10 @@ export type User = {
   createdAt: Date;
   updatedAt: Date;
   username: string;
-  email?: string;
+  email?: string | null;
   superAdmin: boolean;
-  firstName?: string;
-  lastName?: string;
+  firstName?: string | null;
+  lastName?: string | null;
   authProvider?: AuthMethod;
   authMethods: AuthMethod[];
   isMfaEnabled: boolean;

frontend/src/layouts/AdminLayout/AdminLayout.tsx

@@ -1,11 +1,15 @@
 import { useTranslation } from "react-i18next";
 import { faMobile } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Outlet, useRouterState } from "@tanstack/react-router";
+import { Outlet } from "@tanstack/react-router";
 
 import { Banner } from "@app/components/page-frames/Banner";
-import { BreadcrumbContainer, TBreadcrumbFormat } from "@app/components/v2";
-import { useServerConfig } from "@app/context";
+import { useServerConfig, useSubscription } from "@app/context";
+import { useFetchServerStatus } from "@app/hooks/api";
+import { AuditLogBanner } from "@app/layouts/OrganizationLayout/components/AuditLogBanner";
+import { Navbar } from "@app/layouts/OrganizationLayout/components/NavBar";
+import { RedisBanner } from "@app/layouts/OrganizationLayout/components/RedisBanner";
+import { SmtpBanner } from "@app/layouts/OrganizationLayout/components/SmtpBanner";
 
 import { InsecureConnectionBanner } from "../OrganizationLayout/components/InsecureConnectionBanner";
 import { AdminSidebar } from "./Sidebar";
@@ -13,26 +17,27 @@ import { AdminSidebar } from "./Sidebar";
 export const AdminLayout = () => {
   const { t } = useTranslation();
   const { config } = useServerConfig();
-
-  const matches = useRouterState({ select: (s) => s.matches.at(-1)?.context });
-
-  const breadcrumbs = matches && "breadcrumbs" in matches ? matches.breadcrumbs : undefined;
+  const { data: serverDetails, isLoading } = useFetchServerStatus();
+  const { subscription } = useSubscription();
 
   const containerHeight = config.pageFrameContent ? "h-[94vh]" : "h-screen";
 
   return (
     <>
       <Banner />
-      <div className={`dark hidden ${containerHeight} w-full flex-col overflow-x-hidden md:flex`}>
+      <div
+        className={`dark hidden ${containerHeight} w-full flex-col overflow-x-hidden bg-bunker-800 transition-all md:flex`}
+      >
+        <Navbar />
+        {!isLoading && !serverDetails?.redisConfigured && <RedisBanner />}
+        {!isLoading && !serverDetails?.emailConfigured && <SmtpBanner />}
+        {!isLoading && subscription.auditLogs && <AuditLogBanner />}
         {!window.isSecureContext && <InsecureConnectionBanner />}
         <div className="flex flex-grow flex-col overflow-y-hidden md:flex-row">
           <AdminSidebar />
-          <main className="flex-1 overflow-y-auto overflow-x-hidden bg-bunker-800 px-4 pb-4 dark:[color-scheme:dark]">
-            {breadcrumbs ? (
-              <BreadcrumbContainer breadcrumbs={breadcrumbs as TBreadcrumbFormat[]} />
-            ) : null}
+          <div className="flex-1 overflow-y-auto overflow-x-hidden bg-bunker-800 px-4 pb-4 pt-8 dark:[color-scheme:dark]">
             <Outlet />
-          </main>
+          </div>
         </div>
       </div>
       <div className="z-[200] flex h-screen w-screen flex-col items-center justify-center bg-bunker-800 md:hidden">

frontend/src/layouts/AdminLayout/Sidebar.tsx

@@ -1,57 +1,62 @@
-import { faChevronLeft } from "@fortawesome/free-solid-svg-icons";
+import { faCheckCircle } from "@fortawesome/free-regular-svg-icons";
+import {
+  faBuilding,
+  faChevronLeft,
+  faCog,
+  faDatabase,
+  faKey,
+  faLock,
+  faPlug,
+  faUserTie
+} from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Link, useMatchRoute } from "@tanstack/react-router";
 
-import { Lottie, Menu, MenuGroup, MenuItem } from "@app/components/v2";
+import { Menu, MenuGroup, MenuItem } from "@app/components/v2";
 
 const generalTabs = [
   {
     label: "General",
-    icon: "settings-cog",
+    icon: faCog,
     link: "/admin/"
   },
   {
     label: "Encryption",
-    icon: "lock-closed",
+    icon: faLock,
     link: "/admin/encryption"
   },
   {
     label: "Authentication",
-    icon: "check",
+    icon: faCheckCircle,
     link: "/admin/authentication"
   },
   {
     label: "Integrations",
-    icon: "sliding-carousel",
+    icon: faPlug,
     link: "/admin/integrations"
   },
   {
     label: "Caching",
-    icon: "note",
+    icon: faDatabase,
     link: "/admin/caching"
   },
   {
     label: "Environment Variables",
-    icon: "unlock",
+    icon: faKey,
     link: "/admin/environment"
   }
 ];
 
-const resourceTabs = [
+const othersTabs = [
   {
-    label: "Organizations",
-    icon: "groups",
-    link: "/admin/resources/organizations"
+    label: "Access Controls",
+    icon: faUserTie,
+    link: "/admin/access-management"
   },
   {
-    label: "User Identities",
-    icon: "user",
-    link: "/admin/resources/user-identities"
-  },
-  {
-    label: "Machine Identities",
-    icon: "wrench",
-    link: "/admin/resources/machine-identities"
+    label: "Resource Overview",
+    icon: faBuilding,
+    link: "/admin/resources/overview"
   }
 ];
 
@@ -61,6 +66,44 @@ export const AdminSidebar = () => {
   return (
     <aside className="dark w-full border-r border-mineshaft-600 bg-gradient-to-tr from-mineshaft-700 via-mineshaft-800 to-mineshaft-900 md:w-60">
       <nav className="items-between flex h-full flex-col justify-between overflow-y-auto dark:[color-scheme:dark]">
+        <div className="flex-1">
+          <Menu>
+            <MenuGroup title="Configuration">
+              {generalTabs.map((tab) => {
+                const isActive = matchRoute({ to: tab.link, fuzzy: false });
+                return (
+                  <Link key={tab.link} to={tab.link}>
+                    <MenuItem isSelected={Boolean(isActive)}>
+                      <div className="mx-1 flex gap-2">
+                        <div className="w-6">
+                          <FontAwesomeIcon icon={tab.icon} />
+                        </div>
+                        {tab.label}
+                      </div>
+                    </MenuItem>
+                  </Link>
+                );
+              })}
+            </MenuGroup>
+            <MenuGroup title="Others">
+              {othersTabs.map((tab) => {
+                const isActive = matchRoute({ to: tab.link, fuzzy: false });
+                return (
+                  <Link key={tab.link} to={tab.link}>
+                    <MenuItem isSelected={Boolean(isActive)}>
+                      <div className="mx-1 flex gap-2">
+                        <div className="w-6">
+                          <FontAwesomeIcon icon={tab.icon} />
+                        </div>
+                        {tab.label}
+                      </div>
+                    </MenuItem>
+                  </Link>
+                );
+              })}
+            </MenuGroup>
+          </Menu>
+        </div>
         <Menu>
           <Link to="/organization/projects">
             <MenuItem
@@ -73,50 +116,10 @@ export const AdminSidebar = () => {
                 />
               }
             >
-              Back to organization
+              Back to Organization
             </MenuItem>
           </Link>
         </Menu>
-        <div className="flex-grow">
-          <Menu>
-            <MenuGroup title="General">
-              {generalTabs.map((tab) => {
-                const isActive = matchRoute({ to: tab.link, fuzzy: false });
-                return (
-                  <Link key={tab.link} to={tab.link}>
-                    <MenuItem
-                      className="relative flex items-center gap-2 overflow-hidden rounded-none"
-                      leftIcon={
-                        <Lottie className="inline-block h-6 w-6 shrink-0" icon={tab.icon} />
-                      }
-                      isSelected={Boolean(isActive)}
-                    >
-                      {tab.label}
-                    </MenuItem>
-                  </Link>
-                );
-              })}
-            </MenuGroup>
-            <MenuGroup title="Resources">
-              {resourceTabs.map((tab) => {
-                const isActive = matchRoute({ to: tab.link, fuzzy: false });
-                return (
-                  <Link key={tab.link} to={tab.link}>
-                    <MenuItem
-                      className="relative flex items-center gap-2 overflow-hidden rounded-none"
-                      leftIcon={
-                        <Lottie className="inline-block h-6 w-6 shrink-0" icon={tab.icon} />
-                      }
-                      isSelected={Boolean(isActive)}
-                    >
-                      {tab.label}
-                    </MenuItem>
-                  </Link>
-                );
-              })}
-            </MenuGroup>
-          </Menu>
-        </div>
       </nav>
     </aside>
   );

frontend/src/layouts/OrganizationLayout/components/NavBar/Navbar.tsx

@@ -10,13 +10,14 @@ import {
   faEnvelope,
   faInfo,
   faInfoCircle,
+  faServer,
   faSignOut,
   faUser,
   faUsers
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useQueryClient } from "@tanstack/react-query";
-import { Link, useNavigate, useRouter, useRouterState } from "@tanstack/react-router";
+import { Link, useLocation, useNavigate, useRouter, useRouterState } from "@tanstack/react-router";
 
 import { Mfa } from "@app/components/auth/Mfa";
 import { createNotification } from "@app/components/notifications";
@@ -117,7 +118,7 @@ export const Navbar = () => {
   const [shouldShowMfa, toggleShowMfa] = useToggle(false);
   const router = useRouter();
   const queryClient = useQueryClient();
-
+  const location = useLocation();
   const matches = useRouterState({ select: (s) => s.matches.at(-1)?.context });
   const breadcrumbs = matches && "breadcrumbs" in matches ? matches.breadcrumbs : undefined;
 
@@ -179,6 +180,8 @@ export const Navbar = () => {
     );
   }
 
+  const isServerAdminPanel = location.pathname.startsWith("/admin");
+
   return (
     <div className="z-10 flex min-h-12 items-center border-b border-mineshaft-600 bg-mineshaft-800 px-4">
       <div>
@@ -187,6 +190,25 @@ export const Navbar = () => {
         </Link>
       </div>
       <p className="pl-1 pr-3 text-lg text-mineshaft-400/70">/</p>
+      {isServerAdminPanel ? (
+        <>
+          <Link
+            to="/admin"
+            className="group flex cursor-pointer items-center gap-2 text-sm text-white transition-all duration-100 hover:text-primary"
+          >
+            <div>
+              <FontAwesomeIcon icon={faServer} className="text-xs text-bunker-300" />
+            </div>
+            <div className="whitespace-nowrap">Server Console</div>
+          </Link>
+          <p className="pl-3 pr-3 text-lg text-mineshaft-400/70">/</p>
+          {breadcrumbs ? (
+            // scott: remove /admin as we show server console above
+            <BreadcrumbContainer breadcrumbs={breadcrumbs.slice(1) as TBreadcrumbFormat[]} />
+          ) : null}
+        </>
+      ) : (
+        <>
           <div className="flex items-center">
             <DropdownMenu modal={false}>
               <Link to="/organization/projects">
@@ -277,6 +299,8 @@ export const Navbar = () => {
           {breadcrumbs ? (
             <BreadcrumbContainer breadcrumbs={breadcrumbs as TBreadcrumbFormat[]} />
           ) : null}
+        </>
+      )}
       <div className="flex-grow" />
       <DropdownMenu modal={false}>
         <DropdownMenuTrigger>

frontend/src/layouts/OrganizationLayout/components/OrgAlertBanner/OrgAlertBanner.tsx

@@ -27,11 +27,11 @@ export const OrgAlertBanner = ({ text, link }: Props) => {
             target="_blank"
             className="group flex items-center"
           >
-            <span className="cursor-pointer pl-1 text-yellow-500 underline underline-offset-2 duration-100 group-hover:text-mineshaft-100 group-hover:decoration-mineshaft-100">
+            <span className="cursor-pointer pl-1 underline underline-offset-2 duration-100 group-hover:text-mineshaft-100 group-hover:decoration-mineshaft-100">
               here
             </span>
             <FontAwesomeIcon
-              className="ml-0.5 mt-0.5 text-yellow group-hover:text-mineshaft-100"
+              className="ml-1 mt-[0.12rem] group-hover:text-mineshaft-100"
               icon={faArrowUpRightFromSquare}
               size="xs"
             />

frontend/src/pages/admin/AccessManagementPage/AccessManagementPage.tsx

@@ -3,23 +3,23 @@ import { useTranslation } from "react-i18next";
 
 import { PageHeader } from "@app/components/v2";
 
-import { OrganizationsTable } from "./components";
+import { ServerAdminsTable } from "./components";
 
-export const OrganizationResourcesPage = () => {
+export const AccessManagementPage = () => {
   const { t } = useTranslation();
 
   return (
     <div className="h-full bg-bunker-800">
       <Helmet>
-        <title>{t("common.head-title", { title: "Admin" })}</title>
+        <title>{t("common.head-title", { title: "Access Control" })}</title>
       </Helmet>
       <div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
         <div className="mx-auto mb-6 w-full max-w-7xl">
           <PageHeader
-            title="Organizations"
-            description="Manage all organizations within your Infisical instance."
+            title="Access Control"
+            description="Manage server admins within your Infisical instance."
           />
-          <OrganizationsTable />
+          <ServerAdminsTable />
         </div>
       </div>
     </div>

frontend/src/pages/admin/AccessManagementPage/components/AddServerAdminModal.tsx

@@ -0,0 +1,141 @@
+import { useMemo, useState } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+
+import { createNotification } from "@app/components/notifications";
+import { Button, FilterableSelect, FormControl, Modal, ModalContent } from "@app/components/v2";
+import { useDebounce } from "@app/hooks";
+import { useAdminGetUsers, useAdminGrantServerAdminAccess } from "@app/hooks/api";
+import { User } from "@app/hooks/api/users/types";
+
+type Props = {
+  isOpen: boolean;
+  onOpenChange: (isOpen: boolean) => void;
+};
+
+type ContentProps = {
+  onClose: () => void;
+};
+
+const getUserLabel = (user: Pick<User, "email" | "firstName" | "lastName" | "username" | "id">) => {
+  const { firstName, lastName, username, email } = user;
+
+  const name = `${firstName ?? ""} ${lastName ?? ""}`.trim();
+  const userEmail = email || username;
+
+  if (!name) return userEmail;
+
+  return `${name}${userEmail ? ` (${userEmail})` : ""}`;
+};
+
+const AddServerAdminSchema = z.object({
+  user: z.object({
+    id: z.string(),
+    firstName: z.string().nullish(),
+    lastName: z.string().nullish(),
+    email: z.string().nullish(),
+    username: z.string()
+  })
+});
+
+type FormData = z.infer<typeof AddServerAdminSchema>;
+
+const Content = ({ onClose }: ContentProps) => {
+  const grantAdmin = useAdminGrantServerAdminAccess();
+
+  const {
+    handleSubmit,
+    control,
+    formState: { isSubmitting }
+  } = useForm<FormData>({
+    resolver: zodResolver(AddServerAdminSchema)
+  });
+
+  const [searchUserFilter, setSearchUserFilter] = useState("");
+  const [debouncedSearchTerm, setDebouncedSearchTerm] = useDebounce(searchUserFilter, 500);
+
+  const { data, isFetching } = useAdminGetUsers(
+    {
+      limit: 20,
+      searchTerm: debouncedSearchTerm,
+      adminsOnly: false
+    },
+    {
+      placeholderData: (prev) => prev
+    }
+  );
+
+  const users = useMemo(() => data?.pages.flat().filter((user) => !user.superAdmin) ?? [], [data]);
+
+  const onSubmit = async ({ user }: FormData) => {
+    try {
+      await grantAdmin.mutateAsync(user.id);
+
+      createNotification({
+        type: "success",
+        text: "Successfully granted server admin status"
+      });
+      onClose();
+    } catch {
+      createNotification({
+        text: "Failed to grant server admin status",
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)}>
+      <Controller
+        render={({ field, fieldState: { error } }) => (
+          <FormControl isError={Boolean(error)} errorText={error?.message} label="User">
+            <FilterableSelect
+              isLoading={searchUserFilter !== debouncedSearchTerm || isFetching}
+              className="w-full"
+              placeholder="Search users..."
+              options={users}
+              getOptionLabel={(user) => getUserLabel(user)}
+              getOptionValue={(user) => user.id}
+              value={field.value}
+              onChange={field.onChange}
+              onInputChange={(value) => {
+                setSearchUserFilter(value);
+                if (!value) setDebouncedSearchTerm("");
+              }}
+            />
+          </FormControl>
+        )}
+        control={control}
+        name="user"
+      />
+      <div className="flex w-full gap-4 pt-4">
+        <Button
+          type="submit"
+          isLoading={isSubmitting}
+          isDisabled={isSubmitting}
+          colorSchema="secondary"
+        >
+          Grant
+        </Button>
+        <Button onClick={() => onClose()} variant="plain" colorSchema="secondary">
+          Cancel
+        </Button>
+      </div>
+    </form>
+  );
+};
+
+export const AddServerAdminModal = ({ isOpen, onOpenChange }: Props) => {
+  return (
+    <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
+      <ModalContent
+        bodyClassName="overflow-visible"
+        title="Grant Server Admin"
+        subTitle="Grant server admin status to a user"
+      >
+        <Content onClose={() => onOpenChange(false)} />
+      </ModalContent>
+    </Modal>
+  );
+};

frontend/src/pages/admin/AccessManagementPage/components/ServerAdminsTable.tsx

@@ -0,0 +1,476 @@
+import { Dispatch, SetStateAction, useState } from "react";
+import {
+  faEllipsisV,
+  faMagnifyingGlass,
+  faPlus,
+  faShieldHalved,
+  faTrash,
+  faUsers,
+  faUserXmark,
+  faWarning,
+  faXmark
+} from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { InfiniteData } from "@tanstack/react-query";
+import { twMerge } from "tailwind-merge";
+
+import { UpgradePlanModal } from "@app/components/license/UpgradePlanModal";
+import { createNotification } from "@app/components/notifications";
+import {
+  Badge,
+  Button,
+  Checkbox,
+  DeleteActionModal,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+  EmptyState,
+  IconButton,
+  Input,
+  Table,
+  TableContainer,
+  TableSkeleton,
+  TBody,
+  Td,
+  Th,
+  THead,
+  Tooltip,
+  Tr
+} from "@app/components/v2";
+import { useSubscription, useUser } from "@app/context";
+import { useDebounce, usePopUp } from "@app/hooks";
+import {
+  useAdminBulkDeleteUsers,
+  useAdminDeleteUser,
+  useAdminGetUsers,
+  useRemoveUserServerAdminAccess
+} from "@app/hooks/api";
+import { User } from "@app/hooks/api/users/types";
+import { UsePopUpState } from "@app/hooks/usePopUp";
+import { AddServerAdminModal } from "@app/pages/admin/AccessManagementPage/components/AddServerAdminModal";
+
+const removeServerAdminUpgradePlanMessage = "Removing Server Admin permissions from user";
+
+const ServerAdminsPanelTable = ({
+  handlePopUpOpen,
+  users: usersPages,
+  isPending,
+  searchUserFilter,
+  setSearchUserFilter,
+  isFetchingNextPage,
+  fetchNextPage,
+  hasNextPage,
+  selectedUsers,
+  setSelectedUsers
+}: {
+  handlePopUpOpen: (
+    popUpName: keyof UsePopUpState<
+      ["removeUser", "upgradePlan", "addServerAdmin", "removeServerAdmin"]
+    >,
+    data?: {
+      username: string;
+      id: string;
+      message?: string;
+    }
+  ) => void;
+  isPending: boolean;
+  users: InfiniteData<User[], unknown> | undefined;
+  searchUserFilter: string;
+  setSearchUserFilter: (filter: string) => void;
+  selectedUsers: User[];
+  setSelectedUsers: Dispatch<SetStateAction<User[]>>;
+  isFetchingNextPage: boolean;
+  fetchNextPage: () => void;
+  hasNextPage: boolean;
+}) => {
+  const { subscription } = useSubscription();
+
+  const users = usersPages?.pages.flat();
+
+  const isEmpty = !isPending && !users?.length;
+
+  const selectedUserIds = selectedUsers.map((user) => user.id);
+
+  const isPageSelected = users?.length
+    ? users.every((user) => selectedUserIds.includes(user.id))
+    : false;
+
+  // eslint-disable-next-line no-nested-ternary
+  const isPageIndeterminate = isPageSelected
+    ? false
+    : users?.length
+      ? users?.some((user) => selectedUserIds.includes(user.id))
+      : false;
+
+  return (
+    <>
+      <div className="flex items-center gap-x-2">
+        <Input
+          value={searchUserFilter}
+          onChange={(e) => setSearchUserFilter(e.target.value)}
+          leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
+          placeholder="Search admins..."
+          className="flex-1"
+        />
+        <Button
+          colorSchema="secondary"
+          leftIcon={<FontAwesomeIcon icon={faPlus} />}
+          onClick={() => handlePopUpOpen("addServerAdmin")}
+        >
+          Add Admin
+        </Button>
+      </div>
+      <div className="mt-4">
+        <TableContainer>
+          <Table>
+            <THead>
+              <Tr>
+                <Th className="w-5">
+                  <Checkbox
+                    id="member-page-select"
+                    isChecked={isPageSelected || isPageIndeterminate}
+                    isIndeterminate={isPageIndeterminate}
+                    onCheckedChange={() => {
+                      if (isPageSelected) {
+                        setSelectedUsers((prev) =>
+                          prev.filter((u) => !users?.find((user) => user.id === u.id))
+                        );
+                      } else {
+                        setSelectedUsers((prev) => [
+                          ...prev,
+                          ...(users?.filter((u) => !prev.find((user) => user.id === u.id)) ?? [])
+                        ]);
+                      }
+                    }}
+                  />
+                </Th>
+                <Th className="w-5/12">Name</Th>
+                <Th className="w-1/2">Username</Th>
+                <Th className="w-2/12" />
+              </Tr>
+            </THead>
+            <TBody>
+              {isPending && <TableSkeleton columns={4} innerKey="users" />}
+              {!isPending &&
+                users?.map((user) => {
+                  const { username, email, firstName, lastName, id } = user;
+                  const name = firstName || lastName ? `${firstName} ${lastName}` : null;
+
+                  const isSelected = selectedUserIds.includes(id);
+                  return (
+                    <Tr key={`user-${id}`} className="w-full">
+                      <Td>
+                        <Checkbox
+                          id={`select-user-${id}`}
+                          isChecked={isSelected}
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            setSelectedUsers((prev) =>
+                              isSelected ? prev.filter((u) => u.id !== id) : [...prev, user]
+                            );
+                          }}
+                        />
+                      </Td>
+                      <Td className="w-5/12 max-w-0">
+                        <p className="truncate">
+                          {name ?? <span className="text-mineshaft-400">Not Set</span>}
+                        </p>
+                      </Td>
+                      <Td className="w-5/12 max-w-0">
+                        <p className="truncate">{username || email}</p>
+                      </Td>
+                      <Td>
+                        <div className="flex justify-end">
+                          <DropdownMenu>
+                            <DropdownMenuTrigger asChild>
+                              <IconButton
+                                ariaLabel="Options"
+                                colorSchema="secondary"
+                                className="w-6"
+                                variant="plain"
+                              >
+                                <FontAwesomeIcon icon={faEllipsisV} />
+                              </IconButton>
+                            </DropdownMenuTrigger>
+                            <DropdownMenuContent sideOffset={2} align="end">
+                              <DropdownMenuItem
+                                onClick={(e) => {
+                                  e.stopPropagation();
+                                  handlePopUpOpen("removeUser", { username, id });
+                                }}
+                                icon={<FontAwesomeIcon icon={faUserXmark} />}
+                              >
+                                Remove User
+                              </DropdownMenuItem>
+                              <DropdownMenuItem
+                                icon={
+                                  <div className="relative">
+                                    <FontAwesomeIcon icon={faShieldHalved} />
+                                    <FontAwesomeIcon
+                                      className="absolute -bottom-[0.01rem] -right-1"
+                                      size="2xs"
+                                      icon={faXmark}
+                                    />
+                                  </div>
+                                }
+                                onClick={(e) => {
+                                  e.stopPropagation();
+                                  if (!subscription?.instanceUserManagement) {
+                                    handlePopUpOpen("upgradePlan", {
+                                      username,
+                                      id,
+                                      message: removeServerAdminUpgradePlanMessage
+                                    });
+                                    return;
+                                  }
+                                  handlePopUpOpen("removeServerAdmin", { username, id });
+                                }}
+                              >
+                                Remove Server Admin
+                              </DropdownMenuItem>
+                            </DropdownMenuContent>
+                          </DropdownMenu>
+                        </div>
+                      </Td>
+                    </Tr>
+                  );
+                })}
+            </TBody>
+          </Table>
+          {!isPending && isEmpty && <EmptyState title="No users found" icon={faUsers} />}
+        </TableContainer>
+        {!isEmpty && (
+          <Button
+            className="mt-4 py-3 text-sm"
+            isFullWidth
+            variant="outline_bg"
+            isLoading={isFetchingNextPage}
+            isDisabled={isFetchingNextPage || !hasNextPage}
+            onClick={() => fetchNextPage()}
+          >
+            {hasNextPage ? "Load More" : "End of List"}
+          </Button>
+        )}
+      </div>
+    </>
+  );
+};
+
+export const ServerAdminsTable = () => {
+  const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
+    "removeUser",
+    "upgradePlan",
+    "addServerAdmin",
+    "removeServerAdmin",
+    "removeUsers"
+  ] as const);
+
+  const {
+    user: { id: userId }
+  } = useUser();
+
+  const { mutateAsync: deleteUser } = useAdminDeleteUser();
+  const { mutateAsync: deleteUsers } = useAdminBulkDeleteUsers();
+  const { mutateAsync: removeAdminAccess } = useRemoveUserServerAdminAccess();
+
+  const [selectedUsers, setSelectedUsers] = useState<User[]>([]);
+  const [searchUserFilter, setSearchUserFilter] = useState("");
+  const [debouncedSearchTerm] = useDebounce(searchUserFilter, 500);
+
+  const {
+    data: users,
+    isPending,
+    isFetchingNextPage,
+    hasNextPage,
+    fetchNextPage
+  } = useAdminGetUsers({
+    limit: 20,
+    searchTerm: debouncedSearchTerm,
+    adminsOnly: true
+  });
+
+  const handleRemoveUser = async () => {
+    const { id } = popUp?.removeUser?.data as { id: string; username: string };
+
+    try {
+      await deleteUser(id);
+      createNotification({
+        type: "success",
+        text: "Successfully deleted user"
+      });
+    } catch {
+      createNotification({
+        type: "error",
+        text: "Error deleting user"
+      });
+    }
+
+    handlePopUpClose("removeUser");
+  };
+
+  const handleRemoveServerAdminAccess = async () => {
+    const { id } = popUp?.removeServerAdmin?.data as { id: string; username: string };
+
+    try {
+      await removeAdminAccess(id);
+      createNotification({
+        type: "success",
+        text: "Successfully removed server admin access from user"
+      });
+    } catch {
+      createNotification({
+        type: "error",
+        text: "Error removing server admin access from user"
+      });
+    }
+
+    handlePopUpClose("removeServerAdmin");
+  };
+
+  const handleRemoveUsers = async () => {
+    try {
+      await deleteUsers(selectedUsers.map((user) => user.id));
+
+      createNotification({
+        text: "Successfully removed users",
+        type: "success"
+      });
+
+      setSelectedUsers([]);
+      handlePopUpClose("removeUsers");
+    } catch {
+      createNotification({
+        text: "Failed to remove users",
+        type: "error"
+      });
+    }
+  };
+
+  return (
+    <>
+      <div
+        className={twMerge(
+          "h-0 flex-shrink-0 overflow-hidden transition-all",
+          selectedUsers.length > 0 && "h-16"
+        )}
+      >
+        <div className="flex items-center rounded-md border border-mineshaft-600 bg-mineshaft-800 px-4 py-2 text-bunker-300">
+          <div className="mr-2 text-sm">{selectedUsers.length} Selected</div>
+          <button
+            type="button"
+            className="mr-auto text-xs text-mineshaft-400 underline-offset-2 hover:text-mineshaft-200 hover:underline"
+            onClick={() => setSelectedUsers([])}
+          >
+            Unselect All
+          </button>
+          <Button
+            variant="outline_bg"
+            colorSchema="danger"
+            leftIcon={<FontAwesomeIcon icon={faTrash} />}
+            className="ml-2"
+            onClick={() => {
+              if (!selectedUsers?.length) return;
+
+              handlePopUpOpen("removeUsers");
+            }}
+            size="xs"
+          >
+            Delete
+          </Button>
+        </div>
+      </div>
+      <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
+        <ServerAdminsPanelTable
+          handlePopUpOpen={handlePopUpOpen}
+          users={users}
+          selectedUsers={selectedUsers}
+          setSelectedUsers={setSelectedUsers}
+          searchUserFilter={searchUserFilter}
+          setSearchUserFilter={setSearchUserFilter}
+          isPending={isPending}
+          isFetchingNextPage={isFetchingNextPage}
+          hasNextPage={hasNextPage}
+          fetchNextPage={fetchNextPage}
+        />
+        <DeleteActionModal
+          isOpen={popUp.removeUser.isOpen}
+          deleteKey="remove"
+          title={`Are you sure you want to delete User with username ${
+            (popUp?.removeUser?.data as { id: string; username: string })?.username || ""
+          }?`}
+          onChange={(isOpen) => handlePopUpToggle("removeUser", isOpen)}
+          onDeleteApproved={handleRemoveUser}
+        />
+        <DeleteActionModal
+          isOpen={popUp.removeServerAdmin.isOpen}
+          title={`Are you sure you want to remove Server Admin permissions from ${
+            (popUp?.removeServerAdmin?.data as { id: string; username: string })?.username || ""
+          }?`}
+          subTitle=""
+          onChange={(isOpen) => handlePopUpToggle("removeServerAdmin", isOpen)}
+          deleteKey="confirm"
+          onDeleteApproved={handleRemoveServerAdminAccess}
+          buttonText="Remove Access"
+        />
+        <AddServerAdminModal
+          isOpen={popUp.addServerAdmin.isOpen}
+          onOpenChange={(isOpen) => handlePopUpToggle("addServerAdmin", isOpen)}
+        />
+        <UpgradePlanModal
+          isOpen={popUp.upgradePlan.isOpen}
+          onOpenChange={(isOpen) => handlePopUpToggle("upgradePlan", isOpen)}
+          text={`${popUp?.upgradePlan?.data?.message} is only available on Infisical's Pro plan and above.`}
+        />
+        <DeleteActionModal
+          isOpen={popUp.removeUsers.isOpen}
+          title="Are you sure you want to delete the following users?"
+          onChange={(isOpen) => handlePopUpToggle("removeUsers", isOpen)}
+          deleteKey="confirm"
+          onDeleteApproved={() => handleRemoveUsers()}
+          buttonText="Remove"
+        >
+          <div className="mt-4 text-sm text-mineshaft-400">
+            The following users will be deleted:
+          </div>
+          <div className="mt-2 max-h-[20rem] overflow-y-auto rounded border border-mineshaft-600 bg-red/10 p-4 pl-8 text-sm text-red-200">
+            <ul className="list-disc">
+              {selectedUsers?.map((user) => {
+                const email = user.email ?? user.username;
+                return (
+                  <li key={user.id}>
+                    <div className="flex items-center">
+                      <p>
+                        {user.firstName || user.lastName ? (
+                          <>
+                            {`${`${user.firstName} ${user.lastName}`.trim()} `}(
+                            <span className="break-all">{email}</span>)
+                          </>
+                        ) : (
+                          <span className="break-all">{email}</span>
+                        )}{" "}
+                      </p>
+                      {userId === user.id && (
+                        <Tooltip content="Are you sure you want to remove yourself from this instance?">
+                          <div className="inline-block">
+                            <Badge
+                              variant="primary"
+                              className="ml-1 mt-[0.05rem] inline-flex w-min items-center gap-1.5 whitespace-nowrap"
+                            >
+                              <FontAwesomeIcon icon={faWarning} />
+                              <span>Deleting Yourself</span>
+                            </Badge>
+                          </div>
+                        </Tooltip>
+                      )}
+                    </div>
+                  </li>
+                );
+              })}
+            </ul>
+          </div>
+        </DeleteActionModal>
+      </div>
+    </>
+  );
+};

frontend/src/pages/admin/AccessManagementPage/components/index.tsx

@@ -0,0 +1 @@
+export * from "./ServerAdminsTable";

frontend/src/pages/admin/AccessManagementPage/route.tsx

@@ -1,11 +1,11 @@
 import { createFileRoute, linkOptions } from "@tanstack/react-router";
 
-import { UserIdentitiesResourcesPage } from "./UserIdentitiesResourcesPage";
+import { AccessManagementPage } from "./AccessManagementPage";
 
 export const Route = createFileRoute(
-  "/_authenticate/_inject-org-details/admin/_admin-layout/resources/user-identities"
+  "/_authenticate/_inject-org-details/admin/_admin-layout/access-management"
 )({
-  component: UserIdentitiesResourcesPage,
+  component: AccessManagementPage,
   beforeLoad: async () => {
     return {
       breadcrumbs: [
@@ -14,9 +14,9 @@ export const Route = createFileRoute(
           link: linkOptions({ to: "/admin" })
         },
         {
-          label: "User Identities",
+          label: "Access Control",
           link: linkOptions({
-            to: "/admin/resources/user-identities"
+            to: "/admin/access-management"
           })
         }
       ]

frontend/src/pages/admin/GeneralPage/components/GeneralPageForm.tsx

@@ -103,7 +103,7 @@ export const GeneralPageForm = () => {
 
   return (
     <form
-      className="space-y-8 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
+      className="space-y-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4"
       onSubmit={handleSubmit(onFormSubmit)}
     >
       <div className="flex flex-col justify-start">

frontend/src/pages/admin/MachineIdentitiesResourcesPage/MachineIdentitiesResourcesPage.tsx

@@ -1,27 +0,0 @@
-import { Helmet } from "react-helmet";
-import { useTranslation } from "react-i18next";
-
-import { PageHeader } from "@app/components/v2";
-
-import { MachineIdentitiesTable } from "./components";
-
-export const MachineIdentitiesResourcesPage = () => {
-  const { t } = useTranslation();
-
-  return (
-    <div className="h-full bg-bunker-800">
-      <Helmet>
-        <title>{t("common.head-title", { title: "Admin" })}</title>
-      </Helmet>
-      <div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
-        <div className="mx-auto mb-6 w-full max-w-7xl">
-          <PageHeader
-            title="Machine Identities"
-            description="Manage all machine identities within your Infisical instance."
-          />
-          <MachineIdentitiesTable />
-        </div>
-      </div>
-    </div>
-  );
-};

frontend/src/pages/admin/MachineIdentitiesResourcesPage/components/index.tsx

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

frontend/src/pages/admin/MachineIdentitiesResourcesPage/route.tsx

@@ -1,25 +0,0 @@
-import { createFileRoute, linkOptions } from "@tanstack/react-router";
-
-import { MachineIdentitiesResourcesPage } from "./MachineIdentitiesResourcesPage";
-
-export const Route = createFileRoute(
-  "/_authenticate/_inject-org-details/admin/_admin-layout/resources/machine-identities"
-)({
-  component: MachineIdentitiesResourcesPage,
-  beforeLoad: async () => {
-    return {
-      breadcrumbs: [
-        {
-          label: "Admin",
-          link: linkOptions({ to: "/admin" })
-        },
-        {
-          label: "Machine Identities",
-          link: linkOptions({
-            to: "/admin/resources/machine-identities"
-          })
-        }
-      ]
-    };
-  }
-});

frontend/src/pages/admin/OrganizationResourcesPage/components/OrganizationsTable.tsx

@@ -1,396 +0,0 @@
-import { useState } from "react";
-import {
-  faBuilding,
-  faCircleQuestion,
-  faEllipsis,
-  faMagnifyingGlass
-} from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-
-import { createNotification } from "@app/components/notifications";
-import {
-  Badge,
-  Button,
-  DeleteActionModal,
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-  EmptyState,
-  Input,
-  Modal,
-  ModalContent,
-  Table,
-  TableContainer,
-  TableSkeleton,
-  TBody,
-  Td,
-  Th,
-  THead,
-  Tooltip,
-  Tr
-} from "@app/components/v2";
-import { useDebounce, usePopUp } from "@app/hooks";
-import {
-  useAdminDeleteOrganization,
-  useAdminDeleteOrganizationMembership,
-  useAdminDeleteUser,
-  useAdminGetOrganizations
-} from "@app/hooks/api";
-import { OrganizationWithProjects } from "@app/hooks/api/admin/types";
-import { UsePopUpState } from "@app/hooks/usePopUp";
-
-const ViewMembersModalContent = ({
-  popUp,
-  handlePopUpOpen
-}: {
-  popUp: UsePopUpState<["viewMembers"]>;
-  handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<["deleteOrganizationMembership", "deleteUser"]>,
-    data?: {
-      username?: string;
-      membershipId?: string;
-      userId?: string;
-      orgName?: string;
-      orgId?: string;
-      organization?: OrganizationWithProjects;
-    }
-  ) => void;
-}) => {
-  const organization = popUp.viewMembers?.data?.organization as OrganizationWithProjects;
-
-  return (
-    <div className="space-y-2">
-      {organization?.members?.map((member) => (
-        <div className="flex items-center justify-between gap-2 rounded-md bg-mineshaft-700 px-4 py-2">
-          <div>
-            <div className="flex items-center gap-2">
-              <p className="text-xs text-mineshaft-100">
-                <div>
-                  {member.user.firstName ? (
-                    <div>
-                      {member.user.firstName} {member.user.lastName}
-                    </div>
-                  ) : (
-                    <p className="text-mineshaft-400">Not set</p>
-                  )}
-                </div>
-                <div className="flex gap-2 opacity-80">
-                  <div>{member.user.username || member.user.email}</div>
-                  <Badge variant="primary">
-                    <div className="flex items-center gap-1">
-                      <span className="capitalize">{member.role.replace("-", " ")}</span>
-                      {Boolean(member.roleId) && (
-                        <Tooltip content="This member has a custom role assigned.">
-                          <FontAwesomeIcon icon={faCircleQuestion} className="text-xs" />
-                        </Tooltip>
-                      )}
-                    </div>
-                  </Badge>
-                </div>
-              </p>
-            </div>
-          </div>
-          <div>
-            <DropdownMenu>
-              <DropdownMenuTrigger asChild>
-                <FontAwesomeIcon
-                  icon={faEllipsis}
-                  className="cursor-pointer text-sm text-mineshaft-400 transition-all hover:text-primary-500"
-                />
-              </DropdownMenuTrigger>
-              <DropdownMenuContent align="start" className="p-1">
-                <DropdownMenuItem
-                  onClick={() =>
-                    handlePopUpOpen("deleteOrganizationMembership", {
-                      membershipId: member.membershipId,
-                      orgId: organization.id,
-                      username: member.user.username,
-                      orgName: organization.name
-                    })
-                  }
-                >
-                  Remove From Organization
-                </DropdownMenuItem>
-                <DropdownMenuItem
-                  onClick={() => handlePopUpOpen("deleteUser", { userId: member.user.id })}
-                >
-                  Delete User
-                </DropdownMenuItem>
-              </DropdownMenuContent>
-            </DropdownMenu>
-          </div>
-        </div>
-      ))}
-    </div>
-  );
-};
-
-const ViewMembersModal = ({
-  isOpen,
-  onOpenChange,
-  popUp,
-  handlePopUpOpen
-}: {
-  isOpen: boolean;
-  onOpenChange: (isOpen: boolean) => void;
-  popUp: UsePopUpState<["viewMembers", "deleteOrganizationMembership", "deleteUser"]>;
-  handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<["deleteOrganizationMembership", "deleteUser"]>
-  ) => void;
-}) => {
-  return (
-    <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
-      <ModalContent
-        onOpenAutoFocus={(event) => {
-          event.preventDefault();
-        }}
-        title="Organization Members"
-        subTitle="View the members of the organization."
-      >
-        <ViewMembersModalContent popUp={popUp} handlePopUpOpen={handlePopUpOpen} />
-      </ModalContent>
-    </Modal>
-  );
-};
-
-const OrganizationsPanelTable = ({
-  popUp,
-  handlePopUpOpen,
-  handlePopUpToggle
-}: {
-  popUp: UsePopUpState<
-    ["deleteOrganization", "viewMembers", "deleteOrganizationMembership", "deleteUser"]
-  >;
-  handlePopUpOpen: (
-    popUpName: keyof UsePopUpState<
-      ["deleteOrganization", "viewMembers", "deleteOrganizationMembership", "deleteUser"]
-    >,
-    data?: {
-      orgName?: string;
-      orgId?: string;
-      message?: string;
-      organization?: OrganizationWithProjects;
-    }
-  ) => void;
-  handlePopUpToggle: (
-    popUpName: keyof UsePopUpState<["deleteOrganization", "viewMembers"]>,
-    isOpen?: boolean
-  ) => void;
-}) => {
-  const [searchOrganizationsFilter, setSearchOrganizationsFilter] = useState("");
-  const [debouncedSearchTerm] = useDebounce(searchOrganizationsFilter, 500);
-
-  const { data, isPending, isFetchingNextPage, hasNextPage, fetchNextPage } =
-    useAdminGetOrganizations({
-      limit: 20,
-      searchTerm: debouncedSearchTerm
-    });
-
-  const isEmpty = !isPending && !data?.pages?.[0].length;
-
-  return (
-    <>
-      <div className="flex gap-2">
-        <Input
-          value={searchOrganizationsFilter}
-          onChange={(e) => setSearchOrganizationsFilter(e.target.value)}
-          leftIcon={<FontAwesomeIcon icon={faMagnifyingGlass} />}
-          placeholder="Search organizations..."
-          className="flex-1"
-        />
-      </div>
-      <div className="mt-4">
-        <TableContainer>
-          <Table>
-            <THead>
-              <Tr>
-                <Th className="w-5/12">Name</Th>
-                <Th className="w-5/12">Members</Th>
-                <Th className="w-5/12">Projects</Th>
-                <Th className="w-5" />
-              </Tr>
-            </THead>
-            <TBody>
-              {isPending && <TableSkeleton columns={4} innerKey="organizations" />}
-              {!isPending &&
-                data?.pages?.map((orgs) =>
-                  orgs.map((org) => {
-                    return (
-                      <Tr key={`org-${org.id}`} className="w-full">
-                        <Td className="w-5/12">
-                          {org.name ? (
-                            org.name
-                          ) : (
-                            <span className="text-mineshaft-400">Not set</span>
-                          )}
-                        </Td>
-                        <Td className="w-5/12">
-                          {org.members.length} {org.members.length === 1 ? "member" : "members"}
-                          <Button
-                            variant="outline_bg"
-                            size="xs"
-                            className="ml-2"
-                            onClick={() => handlePopUpOpen("viewMembers", { organization: org })}
-                          >
-                            View Members
-                          </Button>
-                        </Td>
-                        <Td className="w-5/12">
-                          {org.projects.length} {org.projects.length === 1 ? "project" : "projects"}
-                        </Td>
-                        <Td>
-                          <div className="flex justify-end">
-                            <DropdownMenu>
-                              <DropdownMenuTrigger asChild className="rounded-lg">
-                                <div className="hover:text-primary-400 data-[state=open]:text-primary-400">
-                                  <FontAwesomeIcon size="sm" icon={faEllipsis} />
-                                </div>
-                              </DropdownMenuTrigger>
-                              <DropdownMenuContent align="start" className="p-1">
-                                <DropdownMenuItem
-                                  onClick={(e) => {
-                                    e.stopPropagation();
-                                    handlePopUpOpen("deleteOrganization", {
-                                      orgId: org.id,
-                                      orgName: org.name
-                                    });
-                                  }}
-                                >
-                                  Delete Organization
-                                </DropdownMenuItem>
-                              </DropdownMenuContent>
-                            </DropdownMenu>
-                          </div>
-                        </Td>
-                      </Tr>
-                    );
-                  })
-                )}
-            </TBody>
-          </Table>
-          {!isPending && isEmpty && <EmptyState title="No organizations found" icon={faBuilding} />}
-        </TableContainer>
-        {!isEmpty && (
-          <Button
-            className="mt-4 py-3 text-sm"
-            isFullWidth
-            variant="outline_bg"
-            isLoading={isFetchingNextPage}
-            isDisabled={isFetchingNextPage || !hasNextPage}
-            onClick={() => fetchNextPage()}
-          >
-            {hasNextPage ? "Load More" : "End of list"}
-          </Button>
-        )}
-      </div>
-      <ViewMembersModal
-        popUp={popUp}
-        handlePopUpOpen={handlePopUpOpen}
-        isOpen={popUp.viewMembers.isOpen}
-        onOpenChange={(isOpen) => handlePopUpToggle("viewMembers", isOpen)}
-      />
-    </>
-  );
-};
-
-export const OrganizationsTable = () => {
-  const { handlePopUpToggle, popUp, handlePopUpOpen, handlePopUpClose } = usePopUp([
-    "deleteOrganization",
-    "deleteOrganizationMembership",
-    "deleteUser",
-    "viewMembers"
-  ] as const);
-
-  const { mutateAsync: deleteOrganization } = useAdminDeleteOrganization();
-  const { mutateAsync: deleteOrganizationMembership } = useAdminDeleteOrganizationMembership();
-  const { mutateAsync: deleteUser } = useAdminDeleteUser();
-
-  const handleDeleteOrganization = async () => {
-    const { orgId } = popUp?.deleteOrganization?.data as { orgId: string };
-
-    await deleteOrganization(orgId);
-    createNotification({
-      type: "success",
-      text: "Successfully deleted organization"
-    });
-
-    handlePopUpClose("deleteOrganization");
-  };
-
-  const handleDeleteOrganizationMembership = async () => {
-    const { orgId, membershipId } = popUp?.deleteOrganizationMembership?.data as {
-      orgId: string;
-      membershipId: string;
-    };
-
-    if (!orgId || !membershipId) {
-      return;
-    }
-
-    await deleteOrganizationMembership({ organizationId: orgId, membershipId });
-    createNotification({
-      type: "success",
-      text: "Successfully removed user from organization"
-    });
-
-    handlePopUpClose("viewMembers");
-    handlePopUpClose("deleteOrganizationMembership");
-  };
-
-  const handleDeleteUser = async () => {
-    const { userId } = popUp?.deleteUser?.data as { userId: string };
-
-    if (!userId) {
-      return;
-    }
-
-    await deleteUser(userId);
-    createNotification({
-      type: "success",
-      text: "Successfully deleted user"
-    });
-
-    handlePopUpClose("viewMembers");
-    handlePopUpClose("deleteUser");
-  };
-
-  return (
-    <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
-      <OrganizationsPanelTable
-        popUp={popUp}
-        handlePopUpOpen={handlePopUpOpen}
-        handlePopUpToggle={handlePopUpToggle}
-      />
-      <DeleteActionModal
-        isOpen={popUp.deleteOrganization.isOpen}
-        deleteKey="delete"
-        title={`Are you sure you want to delete organization ${
-          (popUp?.deleteOrganization?.data as { orgName: string })?.orgName || ""
-        }?`}
-        onChange={(isOpen) => handlePopUpToggle("deleteOrganization", isOpen)}
-        onDeleteApproved={handleDeleteOrganization}
-      />
-      <DeleteActionModal
-        isOpen={popUp.deleteOrganizationMembership.isOpen}
-        deleteKey="delete"
-        title={`Are you sure you want to remove ${
-          (popUp?.deleteOrganizationMembership?.data as { username: string })?.username || ""
-        } from organization ${
-          (popUp?.deleteOrganizationMembership?.data as { orgName: string })?.orgName || ""
-        }?`}
-        onChange={(isOpen) => handlePopUpToggle("deleteOrganizationMembership", isOpen)}
-        onDeleteApproved={handleDeleteOrganizationMembership}
-      />
-      <DeleteActionModal
-        isOpen={popUp.deleteUser.isOpen}
-        deleteKey="delete"
-        title={`Are you sure you want to delete user ${
-          (popUp?.deleteUser?.data as { username: string })?.username || ""
-        }?`}
-        onChange={(isOpen) => handlePopUpToggle("deleteUser", isOpen)}
-        onDeleteApproved={handleDeleteUser}
-      />
-    </div>
-  );
-};

frontend/src/pages/admin/OrganizationResourcesPage/components/index.tsx

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

frontend/src/pages/admin/ResourceOverviewPage/ResourceOverviewPage.tsx

@@ -0,0 +1,42 @@
+import { Helmet } from "react-helmet";
+import { useTranslation } from "react-i18next";
+
+import { PageHeader, Tab, TabList, TabPanel, Tabs } from "@app/components/v2";
+
+import { MachineIdentitiesTable, OrganizationsTable, UserIdentitiesTable } from "./components";
+
+export const ResourceOverviewPage = () => {
+  const { t } = useTranslation();
+
+  return (
+    <div className="h-full bg-bunker-800">
+      <Helmet>
+        <title>{t("common.head-title", { title: "Resource Overview" })}</title>
+      </Helmet>
+      <div className="container mx-auto flex flex-col justify-between bg-bunker-800 text-white">
+        <div className="mx-auto mb-6 w-full max-w-7xl">
+          <PageHeader
+            title="Resource Overview"
+            description="Manage resources within your Infisical instance."
+          />
+          <Tabs defaultValue="tab-organizations">
+            <TabList>
+              <Tab value="tab-organizations">Organizations</Tab>
+              <Tab value="tab-users">Users</Tab>
+              <Tab value="tab-identities">Identities</Tab>
+            </TabList>
+            <TabPanel value="tab-organizations">
+              <OrganizationsTable />
+            </TabPanel>
+            <TabPanel value="tab-users">
+              <UserIdentitiesTable />
+            </TabPanel>
+            <TabPanel value="tab-identities">
+              <MachineIdentitiesTable />
+            </TabPanel>
+          </Tabs>
+        </div>
+      </div>
+    </div>
+  );
+};

frontend/src/pages/admin/ResourceOverviewPage/components/AddOrganizationModal.tsx

@@ -0,0 +1,203 @@
+import { useMemo, useState } from "react";
+import { Controller, useFieldArray, useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+
+import { createNotification } from "@app/components/notifications";
+import { Button, FormControl, Input, Modal, ModalContent } from "@app/components/v2";
+import { CreatableSelect } from "@app/components/v2/CreatableSelect";
+import { useDebounce } from "@app/hooks";
+import { useAdminGetUsers, useServerAdminCreateOrganization } from "@app/hooks/api";
+import { User } from "@app/hooks/api/users/types";
+import { GenericResourceNameSchema } from "@app/lib/schemas";
+
+type Props = {
+  isOpen: boolean;
+  onOpenChange: (isOpen: boolean) => void;
+};
+
+type ContentProps = {
+  onClose: () => void;
+};
+
+type Invitee = Pick<User, "email" | "firstName" | "lastName" | "username" | "id">;
+type NewOption = { label: string; value: string };
+
+const getUserLabel = (user: Invitee | NewOption) => {
+  if (Object.prototype.hasOwnProperty.call(user, "value")) {
+    return (user as NewOption).label;
+  }
+
+  const { firstName, lastName, username, email } = user as Invitee;
+
+  const name = `${firstName ?? ""} ${lastName ?? ""}`.trim();
+  const userEmail = email || username;
+
+  if (!name) return userEmail;
+
+  return `${name}${userEmail ? ` (${userEmail})` : ""}`;
+};
+
+const AddOrgSchema = z.object({
+  name: GenericResourceNameSchema.nonempty("Organization name required"),
+  invitees: z
+    .object({
+      id: z.string(),
+      firstName: z.string().nullish(),
+      lastName: z.string().nullish(),
+      email: z.string().nullish(),
+      username: z.string().nullish()
+    })
+    .array()
+    .min(1, "At least one admin is required")
+});
+
+type FormData = z.infer<typeof AddOrgSchema>;
+
+const Content = ({ onClose }: ContentProps) => {
+  const createOrg = useServerAdminCreateOrganization();
+
+  const {
+    handleSubmit,
+    control,
+    formState: { isSubmitting }
+  } = useForm({
+    defaultValues: {
+      name: "",
+      invitees: []
+    },
+    resolver: zodResolver(AddOrgSchema)
+  });
+
+  const [searchUserFilter, setSearchUserFilter] = useState("");
+  const [debouncedSearchTerm, setDebouncedSearchTerm] = useDebounce(searchUserFilter, 500);
+
+  const { data, isFetching } = useAdminGetUsers(
+    {
+      limit: 20,
+      searchTerm: debouncedSearchTerm,
+      adminsOnly: false
+    },
+    {
+      placeholderData: (prev) => prev
+    }
+  );
+
+  const users = useMemo(() => data?.pages.flat() ?? [], [data]);
+
+  const onSubmit = async ({ name, invitees }: FormData) => {
+    try {
+      await createOrg.mutateAsync({
+        name,
+        inviteAdminEmails: invitees
+          .filter((user) => Boolean(user.email))
+          .map((user) => user.email) as string[]
+      });
+
+      createNotification({
+        type: "success",
+        text: "Successfully created organization"
+      });
+      onClose();
+    } catch {
+      createNotification({
+        text: "Failed to create organization",
+        type: "error"
+      });
+    }
+  };
+
+  const { append } = useFieldArray<FormData>({ control, name: "invitees" });
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)}>
+      <Controller
+        render={({ field: { value, onChange }, fieldState: { error } }) => (
+          <FormControl isError={Boolean(error)} errorText={error?.message} label="Name">
+            <Input autoFocus value={value} onChange={onChange} placeholder="My Organization" />
+          </FormControl>
+        )}
+        control={control}
+        name="name"
+      />
+      <Controller
+        render={({ field, fieldState: { error } }) => (
+          <FormControl
+            isError={Boolean(error)}
+            errorText={error?.message}
+            label="Assign Organization Admins"
+          >
+            <CreatableSelect
+              /* eslint-disable-next-line react/no-unstable-nested-components */
+              noOptionsMessage={() => (
+                <p>Invite new users to this organization by typing out their email address.</p>
+              )}
+              onCreateOption={(inputValue) =>
+                append({ id: `${inputValue}_${Math.random()}`, email: inputValue })
+              }
+              formatCreateLabel={(inputValue) => `Invite "${inputValue}"`}
+              isValidNewOption={(input) =>
+                Boolean(input) &&
+                z.string().email().safeParse(input).success &&
+                !users
+                  ?.flatMap((user) => {
+                    const emails: string[] = [];
+
+                    if (user.email) {
+                      emails.push(user.email);
+                    }
+
+                    if (user.username) {
+                      emails.push(user.username);
+                    }
+
+                    return emails;
+                  })
+                  .includes(input)
+              }
+              isLoading={searchUserFilter !== debouncedSearchTerm || isFetching}
+              className="w-full"
+              placeholder="Search users or invite new ones..."
+              isMulti
+              name="members"
+              options={users}
+              getOptionLabel={(user) => getUserLabel(user)}
+              getOptionValue={(user) => user.id}
+              value={field.value}
+              onChange={field.onChange}
+              onInputChange={(value) => {
+                setSearchUserFilter(value);
+                if (!value) setDebouncedSearchTerm("");
+              }}
+            />
+          </FormControl>
+        )}
+        control={control}
+        name="invitees"
+      />
+      <div className="flex w-full gap-4 pt-4">
+        <Button
+          type="submit"
+          isLoading={isSubmitting}
+          isDisabled={isSubmitting}
+          colorSchema="secondary"
+        >
+          Add Organization
+        </Button>
+        <Button onClick={() => onClose()} variant="plain" colorSchema="secondary">
+          Cancel
+        </Button>
+      </div>
+    </form>
+  );
+};
+
+export const AddOrganizationModal = ({ isOpen, onOpenChange }: Props) => {
+  return (
+    <Modal isOpen={isOpen} onOpenChange={onOpenChange}>
+      <ModalContent bodyClassName="overflow-visible" title="Add Organization">
+        <Content onClose={() => onOpenChange(false)} />
+      </ModalContent>
+    </Modal>
+  );
+};

frontend/src/pages/admin/ResourceOverviewPage/components/MachineIdentitiesTable.tsx

@@ -2,8 +2,8 @@ import { useState } from "react";
 import {
   faEllipsisV,
   faMagnifyingGlass,
-  faServer,
   faShieldHalved,
+  faWrench,
   faXmark
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
@@ -136,7 +136,7 @@ const IdentityPanelTable = ({
                 )}
             </TBody>
           </Table>
-          {!isPending && isEmpty && <EmptyState title="No identities found" icon={faServer} />}
+          {!isPending && isEmpty && <EmptyState title="No identities found" icon={faWrench} />}
         </TableContainer>
         {!isEmpty && (
           <Button
@@ -183,6 +183,12 @@ export const MachineIdentitiesTable = () => {
 
   return (
     <div className="mb-6 rounded-lg border border-mineshaft-600 bg-mineshaft-900 p-4">
+      <div className="mb-4 flex items-center justify-between">
+        <div>
+          <p className="text-xl font-semibold text-mineshaft-100">Machine Identities</p>
+          <p className="text-sm text-bunker-300">Manage machine identities across your instance.</p>
+        </div>
+      </div>
       <IdentityPanelTable handlePopUpOpen={handlePopUpOpen} />
       <DeleteActionModal
         isOpen={popUp.removeServerAdmin.isOpen}