diff --git a/app/react/portainer/gitops/AuthFieldset/AuthFieldset.tsx b/app/react/portainer/gitops/AuthFieldset/AuthFieldset.tsx index d18b92583..88523986c 100644 --- a/app/react/portainer/gitops/AuthFieldset/AuthFieldset.tsx +++ b/app/react/portainer/gitops/AuthFieldset/AuthFieldset.tsx @@ -1,5 +1,6 @@ import { FormikErrors } from 'formik'; import { boolean, number, object, SchemaOf, string } from 'yup'; +import { useState } from 'react'; import { GitAuthModel } from '@/react/portainer/gitops/types'; import { useDebounce } from '@/react/hooks/useDebounce'; @@ -23,11 +24,12 @@ interface Props { } export function AuthFieldset({ - value, + value: initialValue, onChange, isAuthExplanationVisible, errors, }: Props) { + const [value, setValue] = useState(initialValue); // TODO: remove this state when form is not inside angularjs const [username, setUsername] = useDebounce( value.RepositoryUsername || '', (username) => handleChange({ RepositoryUsername: username }) @@ -139,6 +141,7 @@ export function AuthFieldset({ function handleChange(partialValue: Partial) { onChange(partialValue); + setValue((value) => ({ ...value, ...partialValue })); } } diff --git a/app/react/portainer/gitops/GitForm.tsx b/app/react/portainer/gitops/GitForm.tsx index 19c947206..b7c9d2e23 100644 --- a/app/react/portainer/gitops/GitForm.tsx +++ b/app/react/portainer/gitops/GitForm.tsx @@ -1,5 +1,6 @@ import { array, boolean, object, SchemaOf, string } from 'yup'; import { FormikErrors } from 'formik'; +import { useState } from 'react'; import { ComposePathField } from '@/react/portainer/gitops/ComposePathField'; import { RefField } from '@/react/portainer/gitops/RefField'; @@ -35,7 +36,7 @@ interface Props { } export function GitForm({ - value, + value: initialValue, onChange, environmentType = 'DOCKER', deployMethod = 'compose', @@ -48,6 +49,7 @@ export function GitForm({ webhookId, webhooksDocs, }: Props) { + const [value, setValue] = useState(initialValue); // TODO: remove this state when form is not inside angularjs return ( ) { onChange(partialValue); + setValue((value) => ({ ...value, ...partialValue })); } }