Skip to content

Commit 3c4c128

Browse files
lakhansamanilakhansamani
committed
2 parents 003cec4 + 3e48815 commit 3c4c128

File tree

6 files changed

+305
-69
lines changed

6 files changed

+305
-69
lines changed

‎dashboard/src/components/GenerateKeysModal.tsx‎

Lines changed: 222 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,222 @@
1+
import React from 'react';
2+
import {
3+
Button,
4+
Center,
5+
Flex,
6+
Modal,
7+
ModalBody,
8+
ModalCloseButton,
9+
ModalContent,
10+
ModalFooter,
11+
ModalHeader,
12+
ModalOverlay,
13+
useDisclosure,
14+
Text,
15+
useToast,
16+
Input,
17+
} from '@chakra-ui/react';
18+
import { useClient } from 'urql';
19+
import { FaSave } from 'react-icons/fa';
20+
import {
21+
ECDSAEncryptionType,
22+
HMACEncryptionType,
23+
RSAEncryptionType,
24+
SelectInputType,
25+
TextAreaInputType,
26+
} from '../constants';
27+
import InputField from './InputField';
28+
import { GenerateKeys, UpdateEnvVariables } from '../graphql/mutation';
29+
30+
interface propTypes {
31+
jwtType: string;
32+
getData: Function;
33+
}
34+
35+
interface stateVarTypes {
36+
JWT_TYPE: string;
37+
JWT_SECRET: string;
38+
JWT_PRIVATE_KEY: string;
39+
JWT_PUBLIC_KEY: string;
40+
}
41+
42+
const initState: stateVarTypes = {
43+
JWT_TYPE: '',
44+
JWT_SECRET: '',
45+
JWT_PRIVATE_KEY: '',
46+
JWT_PUBLIC_KEY: '',
47+
};
48+
49+
const GenerateKeysModal = ({ jwtType, getData }: propTypes) => {
50+
const client = useClient();
51+
const toast = useToast();
52+
const { isOpen, onOpen, onClose } = useDisclosure();
53+
const [stateVariables, setStateVariables] = React.useState<stateVarTypes>({
54+
...initState,
55+
});
56+
React.useEffect(() => {
57+
if (isOpen) {
58+
setStateVariables({ ...initState, JWT_TYPE: jwtType });
59+
}
60+
}, [isOpen]);
61+
const fetchKeys = async () => {
62+
const res = await client
63+
.mutation(GenerateKeys, { params: { type: stateVariables.JWT_TYPE } })
64+
.toPromise();
65+
if (res?.error) {
66+
toast({
67+
title: 'Error occurred generating jwt keys',
68+
isClosable: true,
69+
status: 'error',
70+
position: 'bottom-right',
71+
});
72+
closeHandler();
73+
} else {
74+
setStateVariables({
75+
...stateVariables,
76+
JWT_SECRET: res?.data?._generate_jwt_keys?.secret || '',
77+
JWT_PRIVATE_KEY: res?.data?._generate_jwt_keys?.private_key || '',
78+
JWT_PUBLIC_KEY: res?.data?._generate_jwt_keys?.public_key || '',
79+
});
80+
}
81+
};
82+
React.useEffect(() => {
83+
if (isOpen && stateVariables.JWT_TYPE) {
84+
fetchKeys();
85+
}
86+
}, [stateVariables.JWT_TYPE]);
87+
const saveHandler = async () => {
88+
const res = await client
89+
.mutation(UpdateEnvVariables, { params: { ...stateVariables } })
90+
.toPromise();
91+
92+
if (res.error) {
93+
toast({
94+
title: 'Error occurred setting jwt keys',
95+
isClosable: true,
96+
status: 'error',
97+
position: 'bottom-right',
98+
});
99+
100+
return;
101+
}
102+
toast({
103+
title: 'JWT keys updated successfully',
104+
isClosable: true,
105+
status: 'success',
106+
position: 'bottom-right',
107+
});
108+
closeHandler();
109+
};
110+
111+
const closeHandler = () => {
112+
setStateVariables({ ...initState });
113+
onClose();
114+
getData();
115+
};
116+
return (
117+
<>
118+
<Button
119+
colorScheme="blue"
120+
h="1.75rem"
121+
size="sm"
122+
variant="ghost"
123+
onClick={onOpen}
124+
>
125+
Generate new keys
126+
</Button>
127+
<Modal isOpen={isOpen} onClose={onClose}>
128+
<ModalOverlay />
129+
<ModalContent>
130+
<ModalHeader>New JWT keys</ModalHeader>
131+
<ModalCloseButton />
132+
<ModalBody>
133+
<Flex>
134+
<Flex w="30%" justifyContent="start" alignItems="center">
135+
<Text fontSize="sm">JWT Type:</Text>
136+
</Flex>
137+
<InputField
138+
variables={stateVariables}
139+
setVariables={setStateVariables}
140+
inputType={SelectInputType.JWT_TYPE}
141+
value={SelectInputType.JWT_TYPE}
142+
options={{
143+
...HMACEncryptionType,
144+
...RSAEncryptionType,
145+
...ECDSAEncryptionType,
146+
}}
147+
/>
148+
</Flex>
149+
{Object.values(HMACEncryptionType).includes(
150+
stateVariables.JWT_TYPE
151+
) ? (
152+
<Flex marginTop="8">
153+
<Flex w="23%" justifyContent="start" alignItems="center">
154+
<Text fontSize="sm">JWT Secret</Text>
155+
</Flex>
156+
<Center w="77%">
157+
<Input
158+
size="sm"
159+
value={stateVariables.JWT_SECRET}
160+
onChange={(event: any) =>
161+
setStateVariables({
162+
...stateVariables,
163+
JWT_SECRET: event.target.value,
164+
})
165+
}
166+
/>
167+
</Center>
168+
</Flex>
169+
) : (
170+
<>
171+
<Flex marginTop="8">
172+
<Flex w="23%" justifyContent="start" alignItems="center">
173+
<Text fontSize="sm">Public Key</Text>
174+
</Flex>
175+
<Center w="77%">
176+
<InputField
177+
variables={stateVariables}
178+
setVariables={setStateVariables}
179+
inputType={TextAreaInputType.JWT_PUBLIC_KEY}
180+
placeholder="Add public key here"
181+
minH="25vh"
182+
/>
183+
</Center>
184+
</Flex>
185+
<Flex marginTop="8">
186+
<Flex w="23%" justifyContent="start" alignItems="center">
187+
<Text fontSize="sm">Private Key</Text>
188+
</Flex>
189+
<Center w="77%">
190+
<InputField
191+
variables={stateVariables}
192+
setVariables={setStateVariables}
193+
inputType={TextAreaInputType.JWT_PRIVATE_KEY}
194+
placeholder="Add private key here"
195+
minH="25vh"
196+
/>
197+
</Center>
198+
</Flex>
199+
</>
200+
)}
201+
</ModalBody>
202+
203+
<ModalFooter>
204+
<Button
205+
leftIcon={<FaSave />}
206+
colorScheme="blue"
207+
variant="solid"
208+
onClick={saveHandler}
209+
isDisabled={false}
210+
>
211+
<Center h="100%" pt="5%">
212+
Apply
213+
</Center>
214+
</Button>
215+
</ModalFooter>
216+
</ModalContent>
217+
</Modal>
218+
</>
219+
);
220+
};
221+
222+
export default GenerateKeysModal;

‎dashboard/src/components/InviteMembersModal.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,6 @@ import {
2626
import { useClient } from 'urql';
2727
import { FaUserPlus, FaMinusCircle, FaPlus, FaUpload } from 'react-icons/fa';
2828
import { useDropzone } from 'react-dropzone';
29-
import { escape } from 'lodash';
3029
import { validateEmail, validateURI } from '../utils';
3130
import { InviteMembers } from '../graphql/mutation';
3231
import { ArrayInputOperations } from '../constants';

‎dashboard/src/constants.ts‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,3 +89,40 @@ export const ECDSAEncryptionType = {
8989
ES384: 'ES384',
9090
ES512: 'ES512',
9191
};
92+
93+
export interface envVarTypes {
94+
GOOGLE_CLIENT_ID: string;
95+
GOOGLE_CLIENT_SECRET: string;
96+
GITHUB_CLIENT_ID: string;
97+
GITHUB_CLIENT_SECRET: string;
98+
FACEBOOK_CLIENT_ID: string;
99+
FACEBOOK_CLIENT_SECRET: string;
100+
ROLES: [string] | [];
101+
DEFAULT_ROLES: [string] | [];
102+
PROTECTED_ROLES: [string] | [];
103+
JWT_TYPE: string;
104+
JWT_SECRET: string;
105+
JWT_ROLE_CLAIM: string;
106+
JWT_PRIVATE_KEY: string;
107+
JWT_PUBLIC_KEY: string;
108+
REDIS_URL: string;
109+
SMTP_HOST: string;
110+
SMTP_PORT: string;
111+
SMTP_USERNAME: string;
112+
SMTP_PASSWORD: string;
113+
SENDER_EMAIL: string;
114+
ALLOWED_ORIGINS: [string] | [];
115+
ORGANIZATION_NAME: string;
116+
ORGANIZATION_LOGO: string;
117+
CUSTOM_ACCESS_TOKEN_SCRIPT: string;
118+
ADMIN_SECRET: string;
119+
DISABLE_LOGIN_PAGE: boolean;
120+
DISABLE_MAGIC_LINK_LOGIN: boolean;
121+
DISABLE_EMAIL_VERIFICATION: boolean;
122+
DISABLE_BASIC_AUTHENTICATION: boolean;
123+
DISABLE_SIGN_UP: boolean;
124+
OLD_ADMIN_SECRET: string;
125+
DATABASE_NAME: string;
126+
DATABASE_TYPE: string;
127+
DATABASE_URL: string;
128+
}

‎dashboard/src/graphql/mutation/index.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,3 +69,13 @@ export const EnableAccess = `
6969
}
7070
}
7171
`;
72+
73+
export const GenerateKeys = `
74+
mutation generateKeys($params: GenerateJWTKeysInput!) {
75+
_generate_jwt_keys(params: $params) {
76+
secret
77+
public_key
78+
private_key
79+
}
80+
}
81+
`;

0 commit comments

Comments
 (0)