From bda24a3cd5d01859107e98da8299d782f7b1b67d Mon Sep 17 00:00:00 2001 From: Noah Paige <69586985+noah-paige@users.noreply.github.com> Date: Wed, 20 Dec 2023 11:57:10 -0500 Subject: [PATCH] Fix Disappearing Env Value Reqest Access Modal (#919) ### Feature or Bugfix - Bugfix ### Detail - When requesting access environment dropdown value sometimes disappears and becomes blank - Believed root cause is that `environmentOptions` needs to finish loading before the request access modal allows users to select an environment so that the selection does not disappear ### Relates - https://github.com/awslabs/aws-dataall/issues/916 ### Security Please answer the questions below briefly where applicable, or write `N/A`. Based on [OWASP 10](https://owasp.org/Top10/en/). - Does this PR introduce or modify any input fields or queries - this includes fetching data from storage outside the application (e.g. a database, an S3 bucket)? - Is the input sanitized? - What precautions are you taking before deserializing the data you consume? - Is injection prevented by parametrizing queries? - Have you ensured no `eval` or similar functions are used? - Does this PR introduce any functionality or component that requires authorization? - How have you ensured it respects the existing AuthN/AuthZ mechanisms? - Are you logging failed auth attempts? - Are you using or adding any cryptographic features? - Do you use a standard proven implementations? - Are the used keys controlled by the customer? Where are they stored? - Are you introducing any new policies/roles/users? - Have you used the least-privilege principle? How? By submitting this pull request, I confirm that my contribution is made under the terms of the Apache 2.0 license. --- .../Catalog/components/RequestAccessModal.js | 44 +++++++++++-------- 1 file changed, 26 insertions(+), 18 deletions(-) diff --git a/frontend/src/modules/Catalog/components/RequestAccessModal.js b/frontend/src/modules/Catalog/components/RequestAccessModal.js index 70d20f14e..3dda9cb98 100644 --- a/frontend/src/modules/Catalog/components/RequestAccessModal.js +++ b/frontend/src/modules/Catalog/components/RequestAccessModal.js @@ -35,29 +35,37 @@ export const RequestAccessModal = (props) => { const client = useClient(); const [environmentOptions, setEnvironmentOptions] = useState([]); const [loadingGroups, setLoadingGroups] = useState(false); + const [loadingEnvs, setLoadingEnvs] = useState(false); const [groupOptions, setGroupOptions] = useState([]); const [loadingRoles, setLoadingRoles] = useState(false); const [roleOptions, setRoleOptions] = useState([]); const fetchEnvironments = useCallback(async () => { - const response = await client.query( - listValidEnvironments({ - filter: Defaults.selectListFilter - }) - ); - if (!response.errors) { - setEnvironmentOptions( - response.data.listValidEnvironments.nodes.map((e) => ({ - ...e, - value: e.environmentUri, - label: e.label - })) + setLoadingEnvs(true); + try { + const response = await client.query( + listValidEnvironments({ + filter: Defaults.selectListFilter + }) ); - } else { - dispatch({ type: SET_ERROR, error: response.errors[0].message }); - } - if (stopLoader) { - stopLoader(); + if (!response.errors) { + setEnvironmentOptions( + response.data.listValidEnvironments.nodes.map((e) => ({ + ...e, + value: e.environmentUri, + label: e.label + })) + ); + } else { + dispatch({ type: SET_ERROR, error: response.errors[0].message }); + } + } catch (e) { + dispatch({ type: SET_ERROR, error: e.message }); + } finally { + if (stopLoader) { + stopLoader(); + } + setLoadingEnvs(false); } }, [client, dispatch, stopLoader]); @@ -210,7 +218,7 @@ export const RequestAccessModal = (props) => { } } - if (!hit) { + if (!hit || loadingEnvs) { return null; }