explore/ui/contractVerification/methods/ContractVerificationSolidityFoundry.tsx

import React from 'react';
import { useFormContext } from 'react-hook-form';

import type { FormFields } from '../types';

import config from 'configs/app';
import { Link } from 'toolkit/next/link';

import ContractVerificationFormCodeSnippet from '../ContractVerificationFormCodeSnippet';
import ContractVerificationFormRow from '../ContractVerificationFormRow';
import ContractVerificationMethod from '../ContractVerificationMethod';

const ContractVerificationSolidityFoundry = () => {
  const { watch } = useFormContext<FormFields>();
  const address = watch('address');
  const generalApiEndpoint = config.apis.general ?
    `${ config.apis.general.endpoint }${ config.apis.general.basePath ?? '' }` : '';

  const codeSnippet = `forge verify-contract \\
  --rpc-url ${ config.chain.rpcUrls[0] || (generalApiEndpoint ? `${ generalApiEndpoint }/api/eth-rpc` : '') } \\
  --verifier explorer \\
  --verifier-url '${ generalApiEndpoint ? `${ generalApiEndpoint }/api/` : '' }' \\
  ${ address || '<address>' } \\
  [contractFile]:[contractName]`;

  return (
    <ContractVerificationMethod title="Contract verification via Foundry">
      <ContractVerificationFormRow>
        <div className="flex flex-col">
          <ContractVerificationFormCodeSnippet code={ codeSnippet }/>
        </div>
        <div className="whitespace-pre-wrap">
          <span>Full tutorial about contract verification via Foundry is available </span>
          <Link href="https://docs.lux.network/devs/verification/foundry-verification" external>
            here
          </Link>
        </div>
      </ContractVerificationFormRow>
    </ContractVerificationMethod>
  );
};

export default React.memo(ContractVerificationSolidityFoundry);