update: webhooks

This commit is contained in:
anik-ghosh-au7 2022-07-17 16:03:07 +05:30
parent df17ea8f40
commit 3b925bb072
2 changed files with 38 additions and 0 deletions

View File

@ -28,10 +28,12 @@ import {
WebhookInputDataFields, WebhookInputDataFields,
WebhookInputHeaderFields, WebhookInputHeaderFields,
UpdateWebhookModalViews, UpdateWebhookModalViews,
webhookVerifiedStatus,
} from '../constants'; } from '../constants';
import { capitalizeFirstLetter, validateURI } from '../utils'; import { capitalizeFirstLetter, validateURI } from '../utils';
import { AddWebhook, EditWebhook } from '../graphql/mutation'; import { AddWebhook, EditWebhook } from '../graphql/mutation';
import { rest } from 'lodash'; import { rest } from 'lodash';
import { BiCheckCircle, BiError, BiErrorCircle } from 'react-icons/bi';
interface headersDataType { interface headersDataType {
[WebhookInputHeaderFields.KEY]: string; [WebhookInputHeaderFields.KEY]: string;
@ -100,12 +102,16 @@ const UpdateWebhookModal = ({
const toast = useToast(); const toast = useToast();
const { isOpen, onOpen, onClose } = useDisclosure(); const { isOpen, onOpen, onClose } = useDisclosure();
const [loading, setLoading] = useState<boolean>(false); const [loading, setLoading] = useState<boolean>(false);
const [verifyingEndpoint, setVerifyingEndpoint] = useState<boolean>(false);
const [webhook, setWebhook] = useState<webhookDataType>({ const [webhook, setWebhook] = useState<webhookDataType>({
...initWebhookData, ...initWebhookData,
}); });
const [validator, setValidator] = useState<validatorDataType>({ const [validator, setValidator] = useState<validatorDataType>({
...initWebhookValidatorData, ...initWebhookValidatorData,
}); });
const [verifiedStatus, setVerifiedStatus] = useState<webhookVerifiedStatus>(
webhookVerifiedStatus.PENDING
);
const inputChangehandler = ( const inputChangehandler = (
inputType: string, inputType: string,
value: any, value: any,
@ -201,6 +207,7 @@ const UpdateWebhookModal = ({
const validateData = () => { const validateData = () => {
return ( return (
!loading && !loading &&
!verifyingEndpoint &&
webhook[WebhookInputDataFields.EVENT_NAME].length > 0 && webhook[WebhookInputDataFields.EVENT_NAME].length > 0 &&
webhook[WebhookInputDataFields.ENDPOINT].length > 0 && webhook[WebhookInputDataFields.ENDPOINT].length > 0 &&
validator[WebhookInputDataFields.ENDPOINT] && validator[WebhookInputDataFields.ENDPOINT] &&
@ -515,6 +522,31 @@ const UpdateWebhookModal = ({
</Flex> </Flex>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>
<Button
colorScheme={
verifiedStatus === webhookVerifiedStatus.VERIFIED
? 'green'
: verifiedStatus === webhookVerifiedStatus.PENDING
? 'yellow'
: 'red'
}
variant="outline"
onClick={saveData}
isLoading={verifyingEndpoint}
isDisabled={!validateData()}
marginRight="5"
leftIcon={
verifiedStatus === webhookVerifiedStatus.VERIFIED ? (
<BiCheckCircle />
) : verifiedStatus === webhookVerifiedStatus.PENDING ? (
<BiErrorCircle />
) : (
<BiError />
)
}
>
Test Endpoint
</Button>
<Button <Button
colorScheme="blue" colorScheme="blue"
variant="solid" variant="solid"

View File

@ -182,3 +182,9 @@ export const webhookEventNames = {
USER_ACCESS_ENABLED: 'user.access_enabled', USER_ACCESS_ENABLED: 'user.access_enabled',
USER_ACCESS_REVOKED: 'user.access_revoked', USER_ACCESS_REVOKED: 'user.access_revoked',
}; };
export enum webhookVerifiedStatus {
VERIFIED = 'verified',
NOT_VERIFIED = 'not_verified',
PENDING = 'verification_pending',
}