diff --git a/striker-ui/components/ManageManifest/RunManifestInputGroup.tsx b/striker-ui/components/ManageManifest/RunManifestInputGroup.tsx index 69296dc9..618ef6ff 100644 --- a/striker-ui/components/ManageManifest/RunManifestInputGroup.tsx +++ b/striker-ui/components/ManageManifest/RunManifestInputGroup.tsx @@ -1,11 +1,11 @@ import { styled } from '@mui/material'; -import { ReactElement, useMemo } from 'react'; +import { ReactElement, useMemo, useRef } from 'react'; import INPUT_TYPES from '../../lib/consts/INPUT_TYPES'; import FlexBox from '../FlexBox'; import Grid from '../Grid'; -import InputWithRef from '../InputWithRef'; +import InputWithRef, { InputForwardedRefContent } from '../InputWithRef'; import OutlinedInputWithLabel from '../OutlinedInputWithLabel'; import SelectWithLabel from '../SelectWithLabel'; import { buildPeacefulStringTestBatch } from '../../lib/test_input'; @@ -42,6 +42,8 @@ const RunManifestInputGroup = ({ knownUpses = {}, previous: { domain: anDomain, hostConfig = {}, networkConfig = {} } = {}, }: RunManifestInputGroupProps): ReactElement => { + const passwordRef = useRef>({}); + const { hosts: initHostList = {} } = hostConfig; const { dnsCsv, @@ -272,6 +274,45 @@ const RunManifestInputGroup = ({ [hostListEntries, knownUpsListEntries], ); + const confirmPasswordProps = useMemo(() => { + const inputTestBatch = buildPeacefulStringTestBatch( + INPUT_LABEL_RM_AN_CONFIRM_PASSWORD, + () => { + setMessage(INPUT_ID_RM_AN_CONFIRM_PASSWORD); + }, + { + onFinishBatch: buildFinishInputTestBatchFunction( + INPUT_ID_RM_AN_CONFIRM_PASSWORD, + ), + }, + (message) => { + setMessage(INPUT_ID_RM_AN_CONFIRM_PASSWORD, { children: message }); + }, + ); + + const onFirstRender = buildInputFirstRenderFunction( + INPUT_ID_RM_AN_CONFIRM_PASSWORD, + ); + + inputTestBatch.tests.push({ + onFailure: () => { + setMessage(INPUT_ID_RM_AN_CONFIRM_PASSWORD, { + children: <>Confirm password must match password., + }); + }, + test: ({ value }) => passwordRef.current.getValue?.call(null) === value, + }); + + return { + inputTestBatch, + onFirstRender, + }; + }, [ + buildFinishInputTestBatchFunction, + buildInputFirstRenderFunction, + setMessage, + ]); + return ( ({ onFirstRender={buildInputFirstRenderFunction( INPUT_ID_RM_AN_PASSWORD, )} + ref={passwordRef} required /> ), @@ -352,6 +394,7 @@ const RunManifestInputGroup = ({ /> } required + {...confirmPasswordProps} /> ), },