mirror of
https://github.com/oceanprotocol/market.git
synced 2024-12-02 05:57:29 +01:00
remove onChange handlers on edit (#1555)
* remove onChange handler on edit compute * move empty DID list condition
This commit is contained in:
parent
d500c65d5d
commit
daf15a698f
@ -330,9 +330,13 @@ export async function createTrustedAlgorithmList(
|
|||||||
assetChainId: number,
|
assetChainId: number,
|
||||||
cancelToken: CancelToken
|
cancelToken: CancelToken
|
||||||
): Promise<PublisherTrustedAlgorithm[]> {
|
): Promise<PublisherTrustedAlgorithm[]> {
|
||||||
if (!selectedAlgorithms || selectedAlgorithms.length === 0) return []
|
|
||||||
const trustedAlgorithms: PublisherTrustedAlgorithm[] = []
|
const trustedAlgorithms: PublisherTrustedAlgorithm[] = []
|
||||||
|
|
||||||
|
// Condition to prevent app from hitting Aquarius with empty DID list
|
||||||
|
// when nothing is selected in the UI.
|
||||||
|
if (!selectedAlgorithms || selectedAlgorithms.length === 0)
|
||||||
|
return trustedAlgorithms
|
||||||
|
|
||||||
const selectedAssets = await retrieveDDOListByDIDs(
|
const selectedAssets = await retrieveDDOListByDIDs(
|
||||||
selectedAlgorithms,
|
selectedAlgorithms,
|
||||||
[assetChainId],
|
[assetChainId],
|
||||||
|
@ -12,13 +12,10 @@ export default function FormActions({
|
|||||||
handleClick?: () => void
|
handleClick?: () => void
|
||||||
}): ReactElement {
|
}): ReactElement {
|
||||||
const { isAssetNetwork, asset } = useAsset()
|
const { isAssetNetwork, asset } = useAsset()
|
||||||
const {
|
const { isValid }: FormikContextType<MetadataEditForm | ComputeEditForm> =
|
||||||
isValid,
|
useFormikContext()
|
||||||
touched
|
|
||||||
}: FormikContextType<MetadataEditForm | ComputeEditForm> = useFormikContext()
|
|
||||||
|
|
||||||
const isSubmitDisabled =
|
const isSubmitDisabled = !isValid || !isAssetNetwork
|
||||||
!isValid || !isAssetNetwork || Object.keys(touched).length === 0
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<footer className={styles.actions}>
|
<footer className={styles.actions}>
|
||||||
|
@ -1,12 +1,6 @@
|
|||||||
import React, {
|
import React, { ReactElement, useCallback, useEffect, useState } from 'react'
|
||||||
ChangeEvent,
|
|
||||||
ReactElement,
|
|
||||||
useCallback,
|
|
||||||
useEffect,
|
|
||||||
useState
|
|
||||||
} from 'react'
|
|
||||||
import { Field, Form, FormikContextType, useFormikContext } from 'formik'
|
import { Field, Form, FormikContextType, useFormikContext } from 'formik'
|
||||||
import Input, { InputProps } from '@shared/FormInput'
|
import Input from '@shared/FormInput'
|
||||||
import { AssetSelectionAsset } from '@shared/FormFields/AssetSelection'
|
import { AssetSelectionAsset } from '@shared/FormFields/AssetSelection'
|
||||||
import stylesIndex from './index.module.css'
|
import stylesIndex from './index.module.css'
|
||||||
import {
|
import {
|
||||||
@ -32,21 +26,6 @@ export default function FormEditComputeDataset(): ReactElement {
|
|||||||
|
|
||||||
const [allAlgorithms, setAllAlgorithms] = useState<AssetSelectionAsset[]>()
|
const [allAlgorithms, setAllAlgorithms] = useState<AssetSelectionAsset[]>()
|
||||||
|
|
||||||
const {
|
|
||||||
validateField,
|
|
||||||
setFieldValue,
|
|
||||||
setFieldTouched
|
|
||||||
}: FormikContextType<Partial<ComputeEditForm>> = useFormikContext()
|
|
||||||
|
|
||||||
// Manually handle change events instead of using `handleChange` from Formik.
|
|
||||||
// Workaround for default `validateOnChange` not kicking in unless user
|
|
||||||
// clicks outside of form field.
|
|
||||||
function handleFieldChange(e: ChangeEvent<HTMLInputElement>, name: string) {
|
|
||||||
validateField(name)
|
|
||||||
setFieldTouched(name, true)
|
|
||||||
setFieldValue(name, e.target.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
const getAlgorithmList = useCallback(
|
const getAlgorithmList = useCallback(
|
||||||
async (
|
async (
|
||||||
publisherTrustedAlgorithms: PublisherTrustedAlgorithm[]
|
publisherTrustedAlgorithms: PublisherTrustedAlgorithm[]
|
||||||
@ -98,9 +77,6 @@ export default function FormEditComputeDataset(): ReactElement {
|
|||||||
name="publisherTrustedAlgorithms"
|
name="publisherTrustedAlgorithms"
|
||||||
options={allAlgorithms}
|
options={allAlgorithms}
|
||||||
disabled={values.allowAllPublishedAlgorithms}
|
disabled={values.allowAllPublishedAlgorithms}
|
||||||
onChange={(e: ChangeEvent<HTMLInputElement>) =>
|
|
||||||
handleFieldChange(e, 'publisherTrustedAlgorithms')
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<Field
|
<Field
|
||||||
@ -111,9 +87,6 @@ export default function FormEditComputeDataset(): ReactElement {
|
|||||||
getFieldContent('allowAllPublishedAlgorithms', content.form.data)
|
getFieldContent('allowAllPublishedAlgorithms', content.form.data)
|
||||||
.options
|
.options
|
||||||
}
|
}
|
||||||
onChange={(e: ChangeEvent<HTMLInputElement>) =>
|
|
||||||
handleFieldChange(e, 'allowAllPublishedAlgorithms')
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<FormActions />
|
<FormActions />
|
||||||
|
@ -1,9 +1,8 @@
|
|||||||
import React, { ChangeEvent, ReactElement } from 'react'
|
import React, { ReactElement } from 'react'
|
||||||
import { Field, Form, FormikContextType, useFormikContext } from 'formik'
|
import { Field, Form } from 'formik'
|
||||||
import Input, { InputProps } from '@shared/FormInput'
|
import Input, { InputProps } from '@shared/FormInput'
|
||||||
import FormActions from './FormActions'
|
import FormActions from './FormActions'
|
||||||
import { useAsset } from '@context/Asset'
|
import { useAsset } from '@context/Asset'
|
||||||
import { MetadataEditForm } from './_types'
|
|
||||||
|
|
||||||
export function checkIfTimeoutInPredefinedValues(
|
export function checkIfTimeoutInPredefinedValues(
|
||||||
timeout: string,
|
timeout: string,
|
||||||
@ -25,23 +24,6 @@ export default function FormEditMetadata({
|
|||||||
isComputeDataset: boolean
|
isComputeDataset: boolean
|
||||||
}): ReactElement {
|
}): ReactElement {
|
||||||
const { oceanConfig } = useAsset()
|
const { oceanConfig } = useAsset()
|
||||||
const {
|
|
||||||
validateField,
|
|
||||||
setFieldValue,
|
|
||||||
setFieldTouched
|
|
||||||
}: FormikContextType<Partial<MetadataEditForm>> = useFormikContext()
|
|
||||||
|
|
||||||
// Manually handle change events instead of using `handleChange` from Formik.
|
|
||||||
// Workaround for default `validateOnChange` not kicking in unless user
|
|
||||||
// clicks outside of form field.
|
|
||||||
function handleFieldChange(
|
|
||||||
e: ChangeEvent<HTMLInputElement>,
|
|
||||||
field: InputProps
|
|
||||||
) {
|
|
||||||
validateField(field.name)
|
|
||||||
setFieldTouched(field.name, true)
|
|
||||||
setFieldValue(field.name, e.target.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
// This component is handled by Formik so it's not rendered like a "normal" react component,
|
// This component is handled by Formik so it's not rendered like a "normal" react component,
|
||||||
// so handleTimeoutCustomOption is called only once.
|
// so handleTimeoutCustomOption is called only once.
|
||||||
@ -74,9 +56,6 @@ export default function FormEditMetadata({
|
|||||||
{...field}
|
{...field}
|
||||||
component={Input}
|
component={Input}
|
||||||
prefix={field.name === 'price' && oceanConfig?.oceanTokenSymbol}
|
prefix={field.name === 'price' && oceanConfig?.oceanTokenSymbol}
|
||||||
onChange={(e: ChangeEvent<HTMLInputElement>) =>
|
|
||||||
handleFieldChange(e, field)
|
|
||||||
}
|
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
)}
|
)}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user