disable aditional docker image fields for pre-defined containers

content/pages/publishAlgo.json

@@ -40,6 +40,7 @@
         "name": "image",
         "label": "Image URL",
         "placeholder": "e.g. node or https://hub.docker.com/_/node",
+        "disabled": true,
         "help": "Provide the name of a docker image or the full url if you have it hosted in a 3rd party repo",
         "required": false
       },
@@ -48,6 +49,7 @@
         "label": "Version",
         "placeholder": "e.g. 10",
         "help": "Provide the version for your image.",
+        "disabled": true,
         "required": false
       },
       {
@@ -55,6 +57,7 @@
         "label": "Entrypoint",
         "placeholder": "e.g. python $ALGO",
         "help": "Provide the entrypoint for your algorithm.",
+        "disabled": true,
         "required": false
       },
       {

src/@types/Form.d.ts

@@ -5,6 +5,7 @@ export interface FormFieldProps {
   options?: string[]
   sortOptions?: boolean
   required?: boolean
+  disabled?: boolean
   help?: string
   placeholder?: string
   pattern?: string

src/components/pages/Publish/FormAlgoPublish.tsx

@@ -33,10 +33,17 @@ export default function FormPublish({
     // setSubmitting(false)
   }, [setErrors, setTouched])
 
+  function setDisableFlag(flag: boolean) {
+    content.data.forEach((field) => {
+      if (field.disabled !== null) field.disabled = flag
+    })
+  }
+
   function handleImageSelectChange(imageSelected: string) {
     switch (imageSelected) {
       case 'node:pre-defined': {
         setFieldValue('dockerImage', imageSelected)
+        setDisableFlag(true)
         setFieldValue('image', 'node')
         setFieldValue('version', '10')
         setFieldValue('entrypoint', 'node $ALGO')
@@ -44,6 +51,7 @@ export default function FormPublish({
       }
       case 'python:pre-defined': {
         setFieldValue('dockerImage', imageSelected)
+        setDisableFlag(true)
         setFieldValue('image', 'oceanprotocol/algo_dockers')
         setFieldValue('version', 'python-panda')
         setFieldValue('entrypoint', 'python $ALGO')
@@ -51,6 +59,7 @@ export default function FormPublish({
       }
       default: {
         setFieldValue('dockerImage', imageSelected)
+        setDisableFlag(false)
         setFieldValue('image', '')
         setFieldValue('version', '')
         setFieldValue('entrypoint', '')
@@ -65,7 +74,6 @@ export default function FormPublish({
     e: ChangeEvent<HTMLInputElement>,
     field: FormFieldProps
   ) {
-    console.log(field)
     const value =
       field.type === 'checkbox' ? !JSON.parse(e.target.value) : e.target.value
     if (field.name === 'dockerImage') {
@@ -93,6 +101,7 @@ export default function FormPublish({
         <Field
           key={field.name}
           {...field}
+          disabled={field.disabled}
           component={Input}
           onChange={(e: ChangeEvent<HTMLInputElement>) =>
             handleFieldChange(e, field)

src/pages/publish.tsx

@@ -34,6 +34,7 @@ export const contentQuery = graphql`
                 help
                 type
                 required
+                disabled
                 sortOptions
                 options
               }
@@ -61,6 +62,7 @@ export const contentQuery = graphql`
                 help
                 type
                 required
+                disabled
                 sortOptions
                 options
               }