diff --git a/src/clients/ClientDetails.tsx b/src/clients/ClientDetails.tsx index 2175324ce6..b9985c2252 100644 --- a/src/clients/ClientDetails.tsx +++ b/src/clients/ClientDetails.tsx @@ -59,8 +59,6 @@ import { AuthorizationScopes } from "./authorization/Scopes"; import { AuthorizationPolicies } from "./authorization/Policies"; import { AuthorizationPermissions } from "./authorization/Permissions"; import { AuthorizationEvaluate } from "./authorization/AuthorizationEvaluate"; -import type UserRepresentation from "@keycloak/keycloak-admin-client/lib/defs/userRepresentation"; -import type RoleRepresentation from "@keycloak/keycloak-admin-client/lib/defs/roleRepresentation"; import { routableTab, RoutableTabs, @@ -205,24 +203,6 @@ export default function ClientDetails() { }); const [client, setClient] = useState(); - const [clients, setClients] = useState([]); - const [clientRoles, setClientRoles] = useState([]); - const [users, setUsers] = useState([]); - - useFetch( - () => - Promise.all([ - adminClient.clients.find(), - adminClient.roles.find(), - adminClient.users.find(), - ]), - ([clients, roles, users]) => { - setClients(clients); - setClientRoles(roles); - setUsers(users); - }, - [] - ); const loader = async () => { const roles = await adminClient.clients.listRoles({ id: clientId }); @@ -543,13 +523,7 @@ export default function ClientDetails() { title={{t("evaluate")}} {...authenticationRoute("evaluate")} > - + { - applyToResource: boolean; alias: string; authScopes: string[]; context: { attributes: Record[]; }; resources: Record[]; + client: ClientRepresentation; + user: UserRepresentation; } export type AttributeType = { @@ -62,11 +62,8 @@ export type AttributeType = { }; type ClientSettingsProps = { - clients: ClientRepresentation[]; - clientName?: string; + client: ClientRepresentation; save: () => void; - users: UserRepresentation[]; - clientRoles: RoleRepresentation[]; }; export type AttributeForm = Omit< @@ -81,18 +78,12 @@ export type AttributeForm = Omit< type Props = ClientSettingsProps & EvaluationResultRepresentation; -export const AuthorizationEvaluate = ({ - clients, - clientRoles, - clientName, - users, -}: Props) => { +export const AuthorizationEvaluate = ({ client }: Props) => { const form = useFormContext(); const { control, reset, trigger } = form; const { t } = useTranslation("clients"); const adminClient = useAdminClient(); const realm = useRealm(); - const { clientId } = useParams<{ clientId: string }>(); const [clientsDropdownOpen, setClientsDropdownOpen] = useState(false); const [scopesDropdownOpen, setScopesDropdownOpen] = useState(false); @@ -103,8 +94,6 @@ export const AuthorizationEvaluate = ({ const [applyToResourceType, setApplyToResourceType] = useState(false); const [resources, setResources] = useState([]); const [scopes, setScopes] = useState([]); - const [selectedClient, setSelectedClient] = useState(); - const [selectedUser, setSelectedUser] = useState(); const [evaluateResults, setEvaluateResults] = useState< EvaluationResultRepresentation[] >([]); @@ -117,7 +106,7 @@ export const AuthorizationEvaluate = ({ const [key, setKey] = useState(0); const refresh = () => { - setKey(new Date().getTime()); + setKey(key + 1); }; const FilterType = { @@ -128,14 +117,33 @@ export const AuthorizationEvaluate = ({ const [filterType, setFilterType] = useState(FilterType.allResults); + const [clients, setClients] = useState([]); + const [clientRoles, setClientRoles] = useState([]); + const [users, setUsers] = useState([]); + + useFetch( + () => + Promise.all([ + adminClient.clients.find(), + adminClient.roles.find(), + adminClient.users.find(), + ]), + ([clients, roles, users]) => { + setClients(clients); + setClientRoles(roles); + setUsers(users); + }, + [] + ); + useFetch( async () => Promise.all([ adminClient.clients.listResources({ - id: clientId, + id: client.id!, }), adminClient.clients.listAllScopes({ - id: clientId, + id: client.id!, }), ]), ([resources, scopes]) => { @@ -153,8 +161,8 @@ export const AuthorizationEvaluate = ({ const keys = formValues.resources.map(({ key }) => key); const resEval: ResourceEvaluation = { roleIds: formValues.roleIds ?? [], - clientId: selectedClient ? selectedClient.id! : clientId, - userId: selectedUser?.id!, + clientId: formValues.client.id!, + userId: formValues.user.id!, resources: resources.filter((resource) => keys.includes(resource.name!)), entitlements: false, context: { @@ -167,7 +175,7 @@ export const AuthorizationEvaluate = ({ }; const evaluation = await adminClient.clients.evaluateResource( - { id: clientId!, realm: realm.realm }, + { id: client.id!, realm: realm.realm }, resEval ); @@ -357,29 +365,25 @@ export const AuthorizationEvaluate = ({ fieldId="client" > value.length > 0, - }} - defaultValue={clientName} + name="client" + defaultValue={client} control={control} render={({ onChange, value }) => (