diff --git a/packages/core-components/src/layout/SignInPage/customProvider.tsx b/packages/core-components/src/layout/SignInPage/customProvider.tsx index e11ad93540..98753ad444 100644 --- a/packages/core-components/src/layout/SignInPage/customProvider.tsx +++ b/packages/core-components/src/layout/SignInPage/customProvider.tsx @@ -15,7 +15,7 @@ */ import React from 'react'; -import { useForm } from 'react-hook-form'; +import { useForm, UseFormRegisterReturn } from 'react-hook-form'; import { Typography, Button, @@ -48,6 +48,13 @@ type Data = { idToken?: string; }; +const asInputRef = (renderResult: UseFormRegisterReturn) => { + const { ref, ...rest } = renderResult; + return { + inputRef: ref, + ...rest, + }; +}; const Component: ProviderComponent = ({ onResult }) => { const classes = useFormStyles(); const { register, handleSubmit, formState } = useForm({ @@ -78,7 +85,7 @@ const Component: ProviderComponent = ({ onResult }) => {
{ - !token || - ID_TOKEN_REGEX.test(token) || - 'Token is not a valid OpenID Connect JWT Token', - })} + {...asInputRef( + register('idToken', { + required: false, + validate: token => + !token || + ID_TOKEN_REGEX.test(token) || + 'Token is not a valid OpenID Connect JWT Token', + }), + )} label="ID Token (optional)" margin="normal" autoComplete="off"