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

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,13 +21,18 @@ export const useOrganization = () => {
     staleTime: Infinity
   });
 
-  return {
-    currentOrg: {
-      ...currentOrg,
-      id: currentOrg?.subOrganization?.id || currentOrg?.id,
-      parentOrgId: currentOrg.id
-    },
-    isSubOrganization: Boolean(currentOrg.subOrganization),
-    isRootOrganization: !currentOrg.subOrganization
-  };
+  const org = useMemo(
+    () => ({
+      currentOrg: {
+        ...currentOrg,
+        id: currentOrg?.subOrganization?.id || currentOrg?.id,
+        parentOrgId: currentOrg.id
+      },
+      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,21 +41,19 @@ export const OrgNameChangeSection = (): JSX.Element => {
   const [isFormInitialized, setIsFormInitialized] = useState(false);
 
   useEffect(() => {
-    if (currentOrg) {
-      reset({
-        name: currentOrg.name,
-        slug: currentOrg.slug,
-        ...(canReadOrgRoles &&
-          roles?.length && {
-            // will always be present, can't remove role if default
-            defaultMembershipRole: isCustomOrgRole(currentOrg.defaultMembershipRole)
-              ? roles?.find((role) => currentOrg.defaultMembershipRole === role.id)?.slug || ""
-              : currentOrg.defaultMembershipRole
-          })
-      });
-      setIsFormInitialized(true);
-    }
-  }, [currentOrg, roles]);
+    reset({
+      name: currentOrg.name,
+      slug: currentOrg.slug,
+      ...(canReadOrgRoles &&
+        roles?.length && {
+          // will always be present, can't remove role if default
+          defaultMembershipRole: isCustomOrgRole(currentOrg.defaultMembershipRole)
+            ? roles?.find((role) => currentOrg.defaultMembershipRole === role.id)?.slug || ""
+            : currentOrg.defaultMembershipRole
+        })
+    });
+    setIsFormInitialized(true);
+  }, [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);