devstack/authorizer
4
0
Fork 0
Code Pull Requests Actions Activity

fix: generate new keys modal

Browse Source
This commit is contained in:
Lakhan Samani 2022-03-24 22:09:32 +05:30
parent 3c4c128931
commit f969495178
1 changed files with 93 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
dashboard/src/components/GenerateKeysModal.tsx
View File

@ -14,6 +14,7 @@ import {
Text,
useToast,
Input,
Spinner,
} from '@chakra-ui/react';
import { useClient } from 'urql';
import { FaSave } from 'react-icons/fa';
@ -53,12 +54,17 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
const [stateVariables, setStateVariables] = React.useState<stateVarTypes>({
...initState,
});
const [isLoading, setIsLoading] = React.useState(false);
React.useEffect(() => {
if (isOpen) {
setStateVariables({ ...initState, JWT_TYPE: jwtType });
}
}, [isOpen]);
const fetchKeys = async () => {
setIsLoading(true);
try {
const res = await client
.mutation(GenerateKeys, { params: { type: stateVariables.JWT_TYPE } })
.toPromise();
@ -78,12 +84,19 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
JWT_PUBLIC_KEY: res?.data?._generate_jwt_keys?.public_key || '',
});
}
} catch (error) {
console.log(error);
} finally {
setIsLoading(false);
}
};
React.useEffect(() => {
if (isOpen && stateVariables.JWT_TYPE) {
fetchKeys();
}
}, [stateVariables.JWT_TYPE]);
const saveHandler = async () => {
const res = await client
.mutation(UpdateEnvVariables, { params: { ...stateVariables } })
@ -110,9 +123,10 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
const closeHandler = () => {
setStateVariables({ ...initState });
onClose();
getData();
onClose();
};
return (
<>
<Button
@ -124,7 +138,7 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
>
Generate new keys
</Button>
<Modal isOpen={isOpen} onClose={onClose}>
<Modal isOpen={isOpen} onClose={closeHandler}>
<ModalOverlay />
<ModalContent>
<ModalHeader>New JWT keys</ModalHeader>
@ -146,6 +160,12 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
}}
/>
</Flex>
{isLoading ? (
<Center minH="25vh">
<Spinner />
</Center>
) : (
<>
{Object.values(HMACEncryptionType).includes(
stateVariables.JWT_TYPE
) ? (
@ -163,6 +183,7 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
JWT_SECRET: event.target.value,
})
}
readOnly
/>
</Center>
</Flex>
@ -179,6 +200,7 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
inputType={TextAreaInputType.JWT_PUBLIC_KEY}
placeholder="Add public key here"
minH="25vh"
readOnly
/>
</Center>
</Flex>
@ -193,11 +215,14 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
inputType={TextAreaInputType.JWT_PRIVATE_KEY}
placeholder="Add private key here"
minH="25vh"
readOnly
/>
</Center>
</Flex>
</>
)}
</>
)}
</ModalBody>
<ModalFooter>
@ -206,7 +231,7 @@ const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
colorScheme="blue"
variant="solid"
onClick={saveHandler}
isDisabled={false}
isDisabled={isLoading}
>
<Center h="100%" pt="5%">
Apply