diff --git a/ui/src/app/certificate_requests/asideForm.tsx b/ui/src/app/certificate_requests/asideForm.tsx index 078f1c6..85e1791 100644 --- a/ui/src/app/certificate_requests/asideForm.tsx +++ b/ui/src/app/certificate_requests/asideForm.tsx @@ -8,15 +8,21 @@ import { AsideContext } from "../aside"; export default function CertificateRequestsAsidePanel(): JSX.Element { const asideContext = useContext(AsideContext) const [cookies, setCookie, removeCookie] = useCookies(['user_token']); + const [errorText, setErrorText] = useState("") const queryClient = useQueryClient() const mutation = useMutation(postCSR, { onSuccess: () => { + setErrorText("") asideContext.setIsOpen(false) queryClient.invalidateQueries('csrs') }, + onError: (e: Error) => { + setErrorText(e.message) + } }) const [CSRPEMString, setCSRPEMString] = useState("") const handleTextChange = (event: ChangeEvent) => { + setErrorText("") setCSRPEMString(event.target.value); } const handleFileChange = (event: ChangeEvent) => { @@ -53,7 +59,7 @@ export default function CertificateRequestsAsidePanel(): JSX.Element {
- mutation.mutate({ authToken: cookies.user_token, csr: CSRPEMString })} /> + mutation.mutate({ authToken: cookies.user_token, csr: CSRPEMString })} />
@@ -61,18 +67,28 @@ export default function CertificateRequestsAsidePanel(): JSX.Element { ) } -function SubmitCSR({ csrText, onClickFunc }: { csrText: string, onClickFunc: any }) { +function SubmitCSR({ csrText, errorText, onClickFunc }: { csrText: string, errorText: string, onClickFunc: any }) { let csrIsValid = false try { extractCSR(csrText.trim()) csrIsValid = true } catch { } - const validationComponent = csrText == "" ? <> : csrIsValid ?
Valid CSR
:
Invalid CSR
- const buttonComponent = csrIsValid ? : + const buttonComponent = csrIsValid ? ( + + ) : ( + ) return ( <> + {errorText != "" && +
+
+
Error
+

{errorText.split("error: ")}

+
+
+ } {validationComponent} {buttonComponent} diff --git a/ui/src/app/queries.ts b/ui/src/app/queries.ts index 7940ae1..bc82f1c 100644 --- a/ui/src/app/queries.ts +++ b/ui/src/app/queries.ts @@ -39,7 +39,8 @@ export async function postCSR(params: { authToken: string, csr: string }) { body: params.csr.trim() }) if (!response.ok) { - throw new Error(`${response.status}: ${HTTPStatus(response.status)}`) + const responseText = await response.text() + throw new Error(`${response.status}: ${HTTPStatus(response.status)}. ${responseText}`) } return response.json() }