optimisations, code and constructor args fields

ui/contractVerification/fields/ContractVerificationFieldCode.tsx

+import { FormControl, GridItem, Link, Textarea } from '@chakra-ui/react';
+import React from 'react';
+import type { ControllerRenderProps, Control } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import type { FormFields } from '../types';
+
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+interface Props {
+  control: Control<FormFields>;
+}
+
+const ContractVerificationFieldCode = ({ control }: Props) => {
+  const renderControl = React.useCallback(({ field }: {field: ControllerRenderProps<FormFields, 'code'>}) => {
+    return (
+      <FormControl variant="floating" id={ field.name } isRequired size={{ base: 'md', lg: 'lg' }}>
+        <Textarea
+          { ...field }
+          required
+          maxLength={ 255 }
+        />
+        <InputPlaceholder text="Contract code"/>
+      </FormControl>
+    );
+  }, []);
+
+  return (
+    <>
+      <GridItem>
+        <Controller
+          name="code"
+          control={ control }
+          render={ renderControl }
+          rules={{ required: true }}
+        />
+      </GridItem>
+      <GridItem fontSize="sm">
+        <span>We recommend using flattened code. This is necessary if your code utilizes a library or inherits dependencies. Use the </span>
+        <Link href="https://github.com/poanetwork/solidity-flattener" target="_blank">POA solidity flattener</Link>
+        <span> or the </span>
+        <Link href="https://www.npmjs.com/package/truffle-flattener" target="_blank">Truffle flattener</Link>
+      </GridItem>
+    </>
+  );
+};
+
+export default React.memo(ContractVerificationFieldCode);

ui/contractVerification/fields/ContractVerificationFieldIsConstArgs.tsx

+import { GridItem } from '@chakra-ui/react';
+import React from 'react';
+import type { ControllerRenderProps, Control } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import type { FormFields } from '../types';
+
+import CheckboxInput from 'ui/shared/CheckboxInput';
+
+interface Props {
+  control: Control<FormFields>;
+}
+
+const ContractVerificationFieldIsConstArgs = ({ control }: Props) => {
+  const renderControl = React.useCallback(({ field }: {field: ControllerRenderProps<FormFields, 'constructor_args'>}) => (
+    <CheckboxInput<FormFields, 'constructor_args'> text="Try to fetch constructor arguments automatically" field={ field }/>
+  ), []);
+
+  return (
+    <>
+      <GridItem>
+        <Controller
+          name="constructor_args"
+          control={ control }
+          render={ renderControl }
+        />
+      </GridItem>
+      <GridItem/>
+    </>
+  );
+};
+
+export default React.memo(ContractVerificationFieldIsConstArgs);

ui/contractVerification/fields/ContractVerificationFieldOptimization.tsx

+import { FormControl, GridItem, Input } from '@chakra-ui/react';
+import React from 'react';
+import type { ControllerRenderProps, Control } from 'react-hook-form';
+import { Controller } from 'react-hook-form';
+
+import type { FormFields } from '../types';
+
+import CheckboxInput from 'ui/shared/CheckboxInput';
+import InputPlaceholder from 'ui/shared/InputPlaceholder';
+
+interface Props {
+  control: Control<FormFields>;
+}
+
+const ContractVerificationFieldOptimization = ({ control }: Props) => {
+  const [ isEnabled, setIsEnabled ] = React.useState(false);
+
+  const handleCheckboxChange = React.useCallback(() => {
+    setIsEnabled(prev => !prev);
+  }, []);
+
+  const renderCheckboxControl = React.useCallback(({ field }: {field: ControllerRenderProps<FormFields, 'is_optimization_enabled'>}) => (
+    <CheckboxInput<FormFields, 'is_optimization_enabled'> text="Optimization enabled" field={ field } onChange={ handleCheckboxChange }/>
+  ), [ handleCheckboxChange ]);
+
+  const renderInputControl = React.useCallback(({ field }: {field: ControllerRenderProps<FormFields, 'optimization_runs'>}) => {
+    return (
+      <FormControl variant="floating" id={ field.name } size={{ base: 'md', lg: 'lg' }}>
+        <Input
+          { ...field }
+          required
+          maxLength={ 255 }
+        />
+        <InputPlaceholder text="Optimization runs"/>
+      </FormControl>
+    );
+  }, []);
+
+  return (
+    <>
+      <GridItem>
+        <Controller
+          name="is_optimization_enabled"
+          control={ control }
+          render={ renderCheckboxControl }
+        />
+      </GridItem>
+      <GridItem/>
+      { isEnabled && (
+        <>
+          <GridItem>
+            <Controller
+              name="optimization_runs"
+              control={ control }
+              render={ renderInputControl }
+            />
+          </GridItem>
+          <GridItem/>
+        </>
+      ) }
+    </>
+  );
+};
+
+export default React.memo(ContractVerificationFieldOptimization);

ui/contractVerification/methods/ContractVerificationFlattenSourceCode.tsx

@@ -5,9 +5,12 @@ import type { FormFields } from '../types';
 
 import ContractVerificationMethod from '../ContractVerificationMethod';
 import ContractVerificationEvmVersion from '../fields/ContractVerificationEvmVersion';
+import ContractVerificationFieldCode from '../fields/ContractVerificationFieldCode';
 import ContractVerificationFieldCompiler from '../fields/ContractVerificationFieldCompiler';
+import ContractVerificationFieldIsConstArgs from '../fields/ContractVerificationFieldIsConstArgs';
 import ContractVerificationFieldIsYul from '../fields/ContractVerificationFieldIsYul';
 import ContractVerificationFieldName from '../fields/ContractVerificationFieldName';
+import ContractVerificationFieldOptimization from '../fields/ContractVerificationFieldOptimization';
 
 interface Props {
   control: Control<FormFields>;
@@ -20,6 +23,9 @@ const ContractVerificationFlattenSourceCode = ({ control }: Props) => {
       <ContractVerificationFieldName control={ control }/>
       <ContractVerificationFieldCompiler control={ control }/>
       <ContractVerificationEvmVersion control={ control }/>
+      <ContractVerificationFieldOptimization control={ control }/>
+      <ContractVerificationFieldCode control={ control }/>
+      <ContractVerificationFieldIsConstArgs control={ control }/>
     </ContractVerificationMethod>
   );
 };

ui/contractVerification/types.ts

@@ -6,6 +6,10 @@ export interface FormFieldsFlattenSourceCode {
   name: string;
   compiler: string;
   evm_version: string;
+  is_optimization_enabled: boolean;
+  optimization_runs: string;
+  code: string;
+  constructor_args: boolean;
 }
 
 export interface FormFieldsStandardInput {

ui/shared/CheckboxInput.tsx

@@ -7,17 +7,25 @@ import type { ControllerRenderProps, FieldValues, Path } from 'react-hook-form';
 type Props<TInputs extends FieldValues, TInputName extends Path<TInputs>> = {
   field: ControllerRenderProps<TInputs, TInputName>;
   text: string;
+  onChange?: () => void;
 }
 
 export default function CheckboxInput<Inputs extends FieldValues, Name extends Path<Inputs>>(
   {
     field,
     text,
+    onChange,
   }: Props<Inputs, Name>) {
+
+  const handleChange: typeof field.onChange = React.useCallback((...args) => {
+    field.onChange(...args);
+    onChange?.();
+  }, [ field, onChange ]);
+
   return (
     <Checkbox
       isChecked={ field.value }
-      onChange={ field.onChange }
+      onChange={ handleChange }
       ref={ field.ref }
       colorScheme="blue"
       size="lg"