Skip to content

Commit

Permalink
Fix initial values
Browse files Browse the repository at this point in the history
  • Loading branch information
Daniel committed May 12, 2022
1 parent 0ca26c0 commit b6536b2
Showing 1 changed file with 128 additions and 118 deletions.
246 changes: 128 additions & 118 deletions src/components/Jam.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -200,81 +200,90 @@ export default function Jam() {
<p className="text-secondary mb-4">{t('scheduler.description_destination_addresses')}</p>
</>
)}
<Formik
initialValues={{ dest1: '', dest2: '', dest3: '' }}
validate={(values) => {
if (collaborativeOperationRunning) {
return {}
}

const errors = {}

const isValidAddress = (candidate) => {
return typeof candidate !== 'undefined' && candidate !== ''
}

if (!isValidAddress(values.dest1)) {
errors.dest1 = t('scheduler.error_invalid_destionation_address')
}
if (!isValidAddress(values.dest2)) {
errors.dest2 = t('scheduler.error_invalid_destionation_address')
}
if (!isValidAddress(values.dest3)) {
errors.dest3 = t('scheduler.error_invalid_destionation_address')
}

return errors
}}
onSubmit={async (values) => {
if (collaborativeOperationRunning) {
await stopSchedule()
} else {
await startSchedule(values)
}
}}
>
{({
values,
isSubmitting,
handleSubmit,
handleBlur,
handleChange,
setFieldValue,
validateForm,
isValid,
dirty,
touched,
errors,
}) => (
<>
<ValuesListener handler={validateForm} />
<rb.Form onSubmit={handleSubmit} noValidate>
{!collaborativeOperationRunning && (
<>
<rb.Form.Group className="mb-4" controlId="offertype">
<ToggleSwitch
label={t('scheduler.toggle_internal_destination_title')}
subtitle={t('scheduler.toggle_internal_destination_subtitle', { account: INTERNAL_DEST_ACCOUNT })}
initialValue={destinationIsExternal}
onToggle={async (isToggled) => {
setDestinationIsExternal(isToggled)

if (!isToggled) {
const newAddresses = getNewAddresses(3, INTERNAL_DEST_ACCOUNT)
setFieldValue('dest1', newAddresses[0], true)
setFieldValue('dest2', newAddresses[1], true)
setFieldValue('dest3', newAddresses[2], true)
} else {
setFieldValue('dest1', '', false)
setFieldValue('dest2', '', false)
setFieldValue('dest3', '', false)
}
}}
disabled={isSubmitting}
/>
</rb.Form.Group>
{/* Todo: Testing toggle is deactivated until https://github.com/JoinMarket-Org/joinmarket-clientserver/pull/1260 is merged. */}
{/*process.env.NODE_ENV === 'development' && (
{!walletInfo ? (
<rb.Placeholder as="div" animation="wave">
<rb.Placeholder xs={12} className={styles['input-loader']} />
</rb.Placeholder>
) : (
<Formik
initialValues={getNewAddresses(3, INTERNAL_DEST_ACCOUNT).reduce((obj, addr, index) => {
return { ...obj, [`dest${index + 1}`]: addr }
}, {})}
validate={(values) => {
if (collaborativeOperationRunning) {
return {}
}

const errors = {}

const isValidAddress = (candidate) => {
return typeof candidate !== 'undefined' && candidate !== ''
}

if (!isValidAddress(values.dest1)) {
errors.dest1 = t('scheduler.error_invalid_destionation_address')
}
if (!isValidAddress(values.dest2)) {
errors.dest2 = t('scheduler.error_invalid_destionation_address')
}
if (!isValidAddress(values.dest3)) {
errors.dest3 = t('scheduler.error_invalid_destionation_address')
}

return errors
}}
onSubmit={async (values) => {
if (collaborativeOperationRunning) {
await stopSchedule()
} else {
await startSchedule(values)
}
}}
>
{({
values,
isSubmitting,
handleSubmit,
handleBlur,
handleChange,
setFieldValue,
validateForm,
isValid,
dirty,
touched,
errors,
}) => (
<>
<ValuesListener handler={validateForm} />
<rb.Form onSubmit={handleSubmit} noValidate>
{!collaborativeOperationRunning && (
<>
<rb.Form.Group className="mb-4" controlId="offertype">
<ToggleSwitch
label={t('scheduler.toggle_internal_destination_title')}
subtitle={t('scheduler.toggle_internal_destination_subtitle', {
account: INTERNAL_DEST_ACCOUNT,
})}
initialValue={destinationIsExternal}
onToggle={async (isToggled) => {
setDestinationIsExternal(isToggled)

if (!isToggled) {
const newAddresses = getNewAddresses(3, INTERNAL_DEST_ACCOUNT)
setFieldValue('dest1', newAddresses[0], true)
setFieldValue('dest2', newAddresses[1], true)
setFieldValue('dest3', newAddresses[2], true)
} else {
setFieldValue('dest1', '', false)
setFieldValue('dest2', '', false)
setFieldValue('dest3', '', false)
}
}}
disabled={isSubmitting}
/>
</rb.Form.Group>
{/* Todo: Testing toggle is deactivated until https://github.com/JoinMarket-Org/joinmarket-clientserver/pull/1260 is merged. */}
{/*process.env.NODE_ENV === 'development' && (
<rb.Form.Group className="mb-4" controlId="offertype">
<ToggleSwitch
label={'Use insecure testing settings'}
Expand All @@ -287,49 +296,50 @@ export default function Jam() {
/>
</rb.Form.Group>
)*/}
</>
)}
{!collaborativeOperationRunning &&
destinationIsExternal &&
[1, 2, 3].map((i) => {
return (
<rb.Form.Group className="mb-4" key={i} controlId={`dest${i}`}>
<rb.Form.Label>{t('scheduler.label_destination_input', { destination: i })}</rb.Form.Label>
{!wallet || !walletInfo || isLoading ? (
<rb.Placeholder as="div" animation="wave">
<rb.Placeholder xs={12} className={styles['input-loader']} />
</rb.Placeholder>
) : (
<rb.Form.Control
name={`dest${i}`}
value={values[`dest${i}`]}
placeholder={t('scheduler.placeholder_destination_input')}
onChange={handleChange}
onBlur={handleBlur}
isInvalid={touched[`dest${i}`] && !!errors[`dest${i}`]}
className={`${styles.input} slashed-zeroes`}
/>
)}
</rb.Form.Group>
)
})}
{!collaborativeOperationRunning && (
<p className="text-secondary mb-4">{t('scheduler.description_fees')}</p>
)}
<rb.Button
className={styles.submit}
variant="dark"
type="submit"
disabled={!collaborativeOperationRunning && (isSubmitting || !isValid || !dirty)}
>
<div className="d-flex justify-content-center align-items-center">
{collaborativeOperationRunning ? t('scheduler.button_stop') : t('scheduler.button_start')}
</div>
</rb.Button>
</rb.Form>
</>
)}
</Formik>
</>
)}
{!collaborativeOperationRunning &&
destinationIsExternal &&
[1, 2, 3].map((i) => {
return (
<rb.Form.Group className="mb-4" key={i} controlId={`dest${i}`}>
<rb.Form.Label>{t('scheduler.label_destination_input', { destination: i })}</rb.Form.Label>
{!wallet || !walletInfo || isLoading ? (
<rb.Placeholder as="div" animation="wave">
<rb.Placeholder xs={12} className={styles['input-loader']} />
</rb.Placeholder>
) : (
<rb.Form.Control
name={`dest${i}`}
value={values[`dest${i}`]}
placeholder={t('scheduler.placeholder_destination_input')}
onChange={handleChange}
onBlur={handleBlur}
isInvalid={touched[`dest${i}`] && !!errors[`dest${i}`]}
className={`${styles.input} slashed-zeroes`}
/>
)}
</rb.Form.Group>
)
})}
{!collaborativeOperationRunning && (
<p className="text-secondary mb-4">{t('scheduler.description_fees')}</p>
)}
<rb.Button
className={styles.submit}
variant="dark"
type="submit"
disabled={!collaborativeOperationRunning && (isSubmitting || isLoading || !isValid)}
>
<div className="d-flex justify-content-center align-items-center">
{collaborativeOperationRunning ? t('scheduler.button_stop') : t('scheduler.button_start')}
</div>
</rb.Button>
</rb.Form>
</>
)}
</Formik>
)}
</>
)
}

0 comments on commit b6536b2

Please sign in to comment.