feat: added change in user invitation mail for suborg and updated list operation for sub org

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

@@ -93,10 +93,10 @@ export const subOrgServiceFactory = ({
     await permissionService.getOrgPermission({
       actorId: permissionActor.id,
       actor: permissionActor.type,
-      orgId: permissionActor.parentOrgId,
+      orgId: permissionActor.rootOrgId,
       actorOrgId: permissionActor.rootOrgId,
       actorAuthMethod: permissionActor.authMethod,
-      scope: OrganizationActionScope.ParentOrganization
+      scope: OrganizationActionScope.Any
     });
 
     const organizations = await orgDAL.listSubOrganizations({

backend/src/services/membership-user/org/org-membership-user-factory.ts

@@ -84,6 +84,7 @@ export const newOrgMembershipUserFactory = ({
         message: "Failed to invite user due to org-level auth enforced for organization"
       });
     }
+
     if (org.rootOrgId) {
       const rootOrgMembership = await membershipUserDAL.find({
         scope: AccessScope.Organization,
@@ -120,7 +121,18 @@ export const newOrgMembershipUserFactory = ({
 
     const signUpTokens: { email: string; link: string }[] = [];
     const orgDetails = await orgDAL.findById(dto.permission.orgId);
-
+    if (orgDetails.rootOrgId) {
+      const emails = newUsers.map((el) => el.email).filter(Boolean);
+      await smtpService.sendMail({
+        template: SmtpTemplates.SubOrgInvite,
+        subjectLine: "Infisical sub-organization invitation",
+        recipients: emails as string[],
+        substitutions: {
+          subOrganizationName: orgDetails.slug,
+          callback_url: `${appCfg.SITE_URL}/organization/projects?${orgDetails.slug}`
+        }
+      });
+    } else {
       await Promise.allSettled(
         newUsers.map(async (el) => {
           const token = await tokenService.createTokenForUser({
@@ -154,6 +166,7 @@ export const newOrgMembershipUserFactory = ({
           }
         })
       );
+    }
 
     return { signUpTokens };
   };

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

@@ -346,7 +346,7 @@ export const orgServiceFactory = ({
       orgId,
       actorAuthMethod,
       actorOrgId,
-      scope: OrganizationActionScope.Any
+      scope: OrganizationActionScope.ParentOrganization
     });
 
     if (!hasRole(OrgMembershipRole.Admin)) {
@@ -418,7 +418,7 @@ export const orgServiceFactory = ({
       orgId,
       actorAuthMethod,
       actorOrgId,
-      scope: OrganizationActionScope.Any
+      scope: OrganizationActionScope.ParentOrganization
     });
     ForbiddenError.from(permission).throwUnlessCan(OrgPermissionActions.Edit, OrgPermissionSubjects.Settings);
 
@@ -878,7 +878,7 @@ export const orgServiceFactory = ({
       orgId,
       actorAuthMethod,
       actorOrgId,
-      scope: OrganizationActionScope.Any
+      scope: OrganizationActionScope.ParentOrganization
     });
 
     ForbiddenError.from(permission).throwUnlessCan(OrgPermissionActions.Create, OrgPermissionSubjects.Member);
@@ -1172,7 +1172,7 @@ export const orgServiceFactory = ({
       orgId,
       actorAuthMethod,
       actorOrgId,
-      scope: OrganizationActionScope.Any
+      scope: OrganizationActionScope.ParentOrganization
     });
     ForbiddenError.from(permission).throwUnlessCan(OrgPermissionActions.Create, OrgPermissionSubjects.IncidentAccount);
     const doesIncidentContactExist = await incidentContactDAL.findOne(orgId, { email });
@@ -1200,7 +1200,7 @@ export const orgServiceFactory = ({
       orgId,
       actorAuthMethod,
       actorOrgId,
-      scope: OrganizationActionScope.Any
+      scope: OrganizationActionScope.ParentOrganization
     });
     ForbiddenError.from(permission).throwUnlessCan(OrgPermissionActions.Delete, OrgPermissionSubjects.IncidentAccount);
 

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

@@ -0,0 +1,50 @@
+import { Heading, Section, Text } from "@react-email/components";
+import React from "react";
+
+import { BaseButton } from "./BaseButton";
+import { BaseEmailWrapper, BaseEmailWrapperProps } from "./BaseEmailWrapper";
+
+interface SubOrganizationInvitationTemplateProps extends Omit<BaseEmailWrapperProps, "preview" | "title"> {
+  callback_url: string;
+  subOrganizationName: string;
+}
+
+export const SubOrganizationInvitationTemplate = ({
+  callback_url,
+  subOrganizationName,
+  siteUrl
+}: SubOrganizationInvitationTemplateProps) => {
+  return (
+    <BaseEmailWrapper
+      title="Sub-Organization Invitation"
+      preview="You've been invited to join a suborganization on Infisical."
+      siteUrl={siteUrl}
+    >
+      <Heading className="text-black text-[18px] leading-[28px] text-center font-normal p-0 mx-0">
+        You've been invited to join a suborganization on Infisical
+      </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]">
+          You've been invited to join the suborganization <strong>{subOrganizationName}</strong>.
+        </Text>
+      </Section>
+      <Section className="text-center">
+        <BaseButton href={callback_url}>Join Suborganization</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 SubOrganizationInvitationTemplate;
+
+SubOrganizationInvitationTemplate.PreviewProps = {
+  subOrganizationName: "Example Project",
+  siteUrl: "https://infisical.com",
+  callback_url: "https://app.infisical.com"
+} as SubOrganizationInvitationTemplateProps;

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

@@ -32,3 +32,4 @@ export * from "./SecretSyncFailedTemplate";
 export * from "./ServiceTokenExpiryNoticeTemplate";
 export * from "./SignupEmailVerificationTemplate";
 export * from "./UnlockAccountTemplate";
+export * from "./SubOrganizationInvitationTemplate";

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

@@ -40,7 +40,8 @@ import {
   SecretSyncFailedTemplate,
   ServiceTokenExpiryNoticeTemplate,
   SignupEmailVerificationTemplate,
-  UnlockAccountTemplate
+  UnlockAccountTemplate,
+  SubOrganizationInvitationTemplate
 } from "./emails";
 
 export type TSmtpConfig = SMTPTransport.Options;
@@ -65,6 +66,7 @@ export enum SmtpTemplates {
   // HistoricalSecretList = "historicalSecretLeakIncident", not used anymore?
   NewDeviceJoin = "newDevice",
   OrgInvite = "organizationInvitation",
+  SubOrgInvite = "subOrganizationInvitation",
   OrgAssignment = "organizationAssignment",
   OAuthPasswordReset = "oAuthPasswordReset",
   ResetPassword = "passwordReset",
@@ -102,6 +104,7 @@ export enum SmtpHost {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const EmailTemplateMap: Record<SmtpTemplates, React.FC<any>> = {
   [SmtpTemplates.OrgInvite]: OrganizationInvitationTemplate,
+  [SmtpTemplates.SubOrgInvite]: SubOrganizationInvitationTemplate,
   [SmtpTemplates.OrgAssignment]: OrganizationAssignmentTemplate,
   [SmtpTemplates.NewDeviceJoin]: NewDeviceLoginTemplate,
   [SmtpTemplates.SignupEmailVerification]: SignupEmailVerificationTemplate,

frontend/src/context/OrganizationContext/OrganizationContext.tsx

@@ -2,6 +2,7 @@ import { useSuspenseQuery } from "@tanstack/react-query";
 import { useRouteContext, useSearch } from "@tanstack/react-router";
 
 import { fetchOrganizationById, organizationKeys } from "@app/hooks/api/organization/queries";
+import { useMemo } from "react";
 
 export const useOrganization = () => {
   const organizationId = useRouteContext({
@@ -20,7 +21,8 @@ export const useOrganization = () => {
     staleTime: Infinity
   });
 
-  return {
+  const org = useMemo(
+    () => ({
       currentOrg: {
         ...currentOrg,
         id: currentOrg?.subOrganization?.id || currentOrg?.id,
@@ -28,5 +30,9 @@ export const useOrganization = () => {
       },
       isSubOrganization: Boolean(currentOrg.subOrganization),
       isRootOrganization: !currentOrg.subOrganization
-  };
+    }),
+    [currentOrg]
+  );
+
+  return org;
 };

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

@@ -131,14 +131,14 @@ export const INFISICAL_SUPPORT_OPTIONS = [
 export const Navbar = () => {
   const { user } = useUser();
   const { subscription } = useSubscription();
-  const { currentOrg, isSubOrganization } = useOrganization();
+  const { currentOrg } = useOrganization();
 
   const [showAdminsModal, setShowAdminsModal] = useState(false);
   const [showSubOrgForm, setShowSubOrgForm] = useState(false);
   const [showCardDeclinedModal, setShowCardDeclinedModal] = useState(false);
   const { data: subOrganizations = [] } = useQuery({
     ...subOrganizationsQuery.list({ limit: 500 }),
-    enabled: Boolean(subscription.subOrganization) && !isSubOrganization
+    enabled: Boolean(subscription.subOrganization)
   });
 
   useEffect(() => {

frontend/src/pages/organization/SettingsPage/components/OrgNameChangeSection/OrgNameChangeSection.tsx

@@ -41,7 +41,6 @@ export const OrgNameChangeSection = (): JSX.Element => {
   const [isFormInitialized, setIsFormInitialized] = useState(false);
 
   useEffect(() => {
-    if (currentOrg) {
     reset({
       name: currentOrg.name,
       slug: currentOrg.slug,
@@ -54,8 +53,7 @@ export const OrgNameChangeSection = (): JSX.Element => {
         })
     });
     setIsFormInitialized(true);
-    }
+  }, [roles]);
-  }, [currentOrg, roles]);
 
   const onFormSubmit = async ({ name, slug, defaultMembershipRole }: FormData) => {
     try {

frontend/src/pages/organization/SettingsPage/components/OrgProductSelectSection/OrgProductSelectSection.tsx

@@ -50,7 +50,7 @@ export const OrgProductSelectSection = () => {
         }));
       }
     });
-  }, [currentOrg]);
+  }, [currentOrg?.id]);
 
   const onProductToggle = async (value: boolean, key: string) => {
     setIsLoading(true);