ssilvert · Sep 30, 2026 · Aug 13, 2026 · Aug 13, 2026 · Aug 13, 2026 · Aug 13, 2026
@@ -3958,6 +3958,7 @@ authorizationScope.Roles.map-role=Maps this role to a user or group
 usersResources=Users
 clientsResources=Clients
 groupsResources=Groups
+organizationsResources=Organizations
 resourceTypeHelpText=Specifies which {{resourceType}} are allowed by this permission. If left blank, it is the same as selecting all.
 evaluation=Evaluation
 addSubFlowTo=Add sub-flow to {{name}}
@@ -4219,6 +4220,13 @@ showOnLoginForUnlinkedMembers=Show on login page for unlinked members
 showOnLoginForUnlinkedMembersHelp=If enabled, this identity provider is shown to organization members even when they are already linked to another identity provider.
 theme.keycloak.v2.admin.description=Cleaner and more modern, v2 supports automatic light/dark mode switching. (Default for Admin)
 
+# FGAP Organization Select
+
+addOrganizations=Add organizations
+selectOrganization=Select organization
+selectOrganizations=Select organization
+requiredOrganizations=Please add at least one organization.
+
 # Roles
 role_admin=Admin
 role_realm-admin=Realm Admin

@@ -35,6 +35,7 @@ export const IdpDomainsTab = ({ alias }: IdpDomainsTabProps) => {
           const org = await adminClient.organizations.findOne({
             id: link.organizationId!,
           });
+          if (!org) return [];
           return (org.domains ?? [])
             .filter((d) => d.identityProviderAlias === alias)
             .map((d) => ({

@@ -53,6 +53,7 @@ export const IdpOrganizationsTab = ({
           const org = await adminClient.organizations.findOne({
             id: link.organizationId!,
           });
+          if (!org) return null;
           return {
             ...org,
             ...link,

@@ -63,7 +63,7 @@ const DomainModal = ({ orgId, domain, onClose }: DomainModalProps) => {
   const submitForm = async (data: OrganizationDomainRepresentation) => {
     try {
       const org = await adminClient.organizations.findOne({ id: orgId });
-      const domains = org.domains ?? [];
+      const domains = org?.domains ?? [];
       const payload = {
         verified: data.verified,
         autoRedirect: data.autoRedirect,
@@ -178,7 +178,7 @@ export const DomainsTab = () => {
 
   const loader = async () => {
     const org = await adminClient.organizations.findOne({ id: orgId! });
-    return org.domains ?? [];
+    return org?.domains ?? [];
   };
 
   const [toggleDeleteDialog, DeleteConfirm] = useConfirmDialog({
@@ -189,7 +189,7 @@ export const DomainsTab = () => {
     onConfirm: async () => {
       try {
         const org = await adminClient.organizations.findOne({ id: orgId! });
-        const domains = (org.domains ?? []).filter(
+        const domains = (org?.domains ?? []).filter(
           (d) => d.name !== selectedDomain?.name,
         );
         await adminClient.organizations.updateById(

@@ -1,25 +1,35 @@
 import OrganizationRepresentation from "@keycloak/keycloak-admin-client/lib/defs/organizationRepresentation";
 import UserRepresentation from "@keycloak/keycloak-admin-client/lib/defs/userRepresentation";
-import { KeycloakDataTable } from "@keycloak/keycloak-ui-shared";
+import {
+  KeycloakDataTable,
+  ListEmptyState,
+} from "@keycloak/keycloak-ui-shared";
 import { Button, Modal, ModalVariant } from "@patternfly/react-core";
 import { TableText } from "@patternfly/react-table";
-import { differenceBy } from "lodash-es";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useAdminClient } from "../admin-client";
 
 type OrganizationModalProps = {
-  isJoin?: boolean;
+  mode?: "join" | "send" | "add";
   existingOrgs: OrganizationRepresentation[];
   onAdd: (orgs: OrganizationRepresentation[]) => Promise<void>;
   onClose: () => void;
+  isRadio?: boolean;
+};
+
+const TITLES = {
+  join: "joinOrganization",
+  send: "sendInvitation",
+  add: "selectOrganization",
 };
 
 export const OrganizationModal = ({
-  isJoin = true,
+  mode = "join",
   existingOrgs,
   onAdd,
   onClose,
+  isRadio = false,
 }: OrganizationModalProps) => {
   const { adminClient } = useAdminClient();
   const { t } = useTranslation();
@@ -30,30 +40,36 @@ export const OrganizationModal = ({
     const params = {
       first,
       search,
-      max: max! + existingOrgs.length,
+      max: max!,
     };
 
     const orgs = await adminClient.organizations.find(params);
-    return differenceBy(orgs, existingOrgs, "id");
+
+    return orgs;
+  };
+
+  const isRowDisabled = (row?: OrganizationRepresentation) => {
+    return existingOrgs.some((org) => org.id === row?.id);
   };
 
   return (
     <Modal
       variant={ModalVariant.small}
-      title={isJoin ? t("joinOrganization") : t("sendInvitation")}
+      title={t(TITLES[mode])}
       isOpen
       >
       actions={[
         <Button
-          data-testid="join"
+          data-testid={mode === "add" ? "add" : "join"}
           key="confirm"
           variant="primary"
            () => {
             await onAdd(selectedRows);
             onClose();
           }}
+          isDisabled={selectedRows.length === 0}
         >
-          {isJoin ? t("join") : t("send")}
+          {t(mode)}
         </Button>,
         <Button
           data-testid="cancel"
@@ -72,6 +88,7 @@ export const OrganizationModal = ({
         searchPlaceholderKey="searchOrganization"
         canSelectAll
          => setSelectedRows([...rows])}
+        isRowDisabled={isRowDisabled}
         columns={[
           {
             name: "name",
@@ -84,6 +101,16 @@ export const OrganizationModal = ({
             ),
           },
         ]}
+        isRadio={isRadio}
+        emptyState={
+          <ListEmptyState
+            hasIcon={false}
+            message={t("emptyOrganizations")}
+            instructions={t("emptyOrganizationsInstructions")}
+          /> /* This component doesn't ever get rendered on the user join org screen if there are
+        no organizations so this doesn't actually change any functionality there.
+        Empty message when searching already handled within KeycloakDataTable. */
+        }
       />
     </Modal>
   );

@@ -42,6 +42,7 @@ interface EvaluateFormInputs
   groups: string[];
   users: string[];
   roles: string[];
+  organizations: string[];
   resourceType?: string;
 }
 
@@ -114,6 +115,8 @@ const PermissionEvaluateContent = ({ client }: Props) => {
           return getSingleValue(formValues.clients);
         case "Roles":
           return getSingleValue(formValues.roles);
+        case "Organizations":
+          return getSingleValue(formValues.organizations);
         default:
           return undefined;
       }

@@ -0,0 +1,169 @@
+import {
+  FormErrorText,
+  HelpItem,
+  useFetch,
+} from "@keycloak/keycloak-ui-shared";
+
+import { useTranslation } from "react-i18next";
+import { Button, FormGroup } from "@patternfly/react-core";
+import OrganizationRepresentation from "@keycloak/keycloak-admin-client/lib/defs/organizationRepresentation";
+import { useState } from "react";
+import { Controller, useFormContext } from "react-hook-form";
+import { Table, Tbody, Td, Th, Thead, Tr } from "@patternfly/react-table";
+import { MinusCircleIcon } from "@patternfly/react-icons";
+import { ComponentProps } from "../../components/dynamic/components";
+import { useAdminClient } from "../../admin-client";
+import { OrganizationModal } from "../../organizations/OrganizationModal";
+
+type OrganizationSelectProps = Omit<ComponentProps, "convertToName"> & {
+  variant?: "typeahead" | "typeaheadMulti";
+  isRequired?: boolean;
+  isRadio?: boolean;
+};
+
+const convertOrganizations = (
+  organizations: OrganizationRepresentation[],
+): string[] => organizations.map(({ id }) => id!);
+
+export const OrganizationSelect = ({
+  label,
+  helpText,
+  defaultValue,
+  isDisabled = false,
+  isRequired,
+  name,
+  variant = "typeaheadMulti",
+  isRadio = false,
+}: OrganizationSelectProps) => {
+  const { adminClient } = useAdminClient();
+  const { t } = useTranslation();
+  const {
+    control,
+    setValue,
+    getValues,
+    formState: { errors },
+  } = useFormContext();
+
+  const values: string[] = getValues(name!) || [];
+  const [open, setOpen] = useState(false);
+  const [organizations, setOrganizations] = useState<
+    OrganizationRepresentation[]
+  >([]);
+
+  useFetch(
+    () => {
+      if (values.length > 0) {
+        return Promise.all(
+          (values as string[]).map((id) =>
+            adminClient.organizations.findOne({ id }),
+          ),
+        );
+      }
+      return Promise.resolve([]);
+    },
+    (organizations) => {
+      setOrganizations(
+        organizations.filter((o) => o) as OrganizationRepresentation[],
+      );
+    },
+    [],
+  );
+
+  const selectOne = variant === "typeahead";
+
+  return (
+    <FormGroup
+      label={t(label!)}
+      labelIcon={
+        <HelpItem helpText={t(helpText!)} fieldLabelId="organizations" />
+      }
+      fieldId="organizations"
+      isRequired={isRequired}
+    >
+      <Controller
+        name={name!}
+        control={control}
+        defaultValue={defaultValue}
+        rules={{
+          validate: (value?: string[]) =>
+            !isRequired || (value && value.length > 0),
+        }}
+        render={({ field }) => (
+          <>
+            {open && (
+              <OrganizationModal
+                mode="add"
+                existingOrgs={organizations}
+                 => setOpen(false)}
+                 (orgs) => {
+                  // not actually async but onAdd is called assuming it is
+                  if (selectOne) {
+                    field.onChange(convertOrganizations(orgs));
+                    setOrganizations(orgs);
+                  } else {
+                    field.onChange([
+                      ...(field.value || []),
+                      ...convertOrganizations(orgs),
+                    ]);
+                    setOrganizations([...organizations, ...orgs]);
+                  }
+                  setOpen(false);
+                }}
+                isRadio={isRadio}
+              />
+            )}
+            <Button
+              data-testid="select-organization-button"
+              isDisabled={isDisabled}
+              variant="secondary"
+               => {
+                setOpen(true);
+              }}
+            >
+              {t("addOrganizations")}
+            </Button>
+          </>
+        )}
+      />
+      {organizations.length > 0 && (
+        <Table variant="compact">
+          <Thead>
+            <Tr>
+              <Th>{t("organizations")}</Th>
+              <Th aria-hidden="true" />
+            </Tr>
+          </Thead>
+          <Tbody>
+            {organizations.map((organization) => (
+              <Tr key={organization.id}>
+                <Td>{organization.name}</Td>
+                <Td>
+                  <Button
+                    variant="link"
+                    className="keycloak__client-authorization__policy-row-remove"
+                    icon={<MinusCircleIcon />}
+                     => {
+                      setValue(name!, [
+                        ...convertOrganizations(
+                          organizations.filter(
+                            ({ id }) => id !== organization.id,
+                          ),
+                        ),
+                      ]);
+                      setOrganizations([
+                        ...organizations.filter(
+                          ({ id }) => id !== organization.id,
+                        ),
+                      ]);
+                    }}
+                  />
+                </Td>
+              </Tr>
+            ))}
+          </Tbody>
+        </Table>
+      )}
+      {errors[name!] && <FormErrorText message={t("requiredOrganizations")} />}
+    </FormGroup>
+  );
+};
@@ -7,6 +7,7 @@ import { GroupSelect } from "./GroupSelect";
 import { UserSelect } from "../../components/users/UserSelect";
 import { RoleSelect } from "./RoleSelect";
 import { ClientSelectComponent } from "./ClientSelectComponent";
+import { OrganizationSelect } from "./OrganizationSelect";
 
 type ResourceTypeProps = {
   withEnforceAccessTo?: boolean;
@@ -20,6 +21,7 @@ export const COMPONENTS: {
   clients: ClientSelectComponent,
   groups: GroupSelect,
   roles: RoleSelect,
+  organizations: OrganizationSelect,
 } as const;
 
 export const isValidComponentType = (value: string) => value in COMPONENTS;

@@ -183,7 +183,7 @@ export const Organizations = ({ user }: OrganizationProps) => {
       )}
       {openOrganizationPicker && (
         <OrganizationModal
-          isJoin={shouldJoin}
+          mode={shouldJoin ? "join" : "send"}
           existingOrgs={userOrgs}
            => setOpenOrganizationPicker(false)}
            (orgs) => {