Skip to content

Commit

Permalink
doc(solive-core): update default environment to shanghai
Browse files Browse the repository at this point in the history
  • Loading branch information
chongqiangchen committed May 14, 2023
1 parent 06968a8 commit a612638
Show file tree
Hide file tree
Showing 2 changed files with 88 additions and 82 deletions.
5 changes: 5 additions & 0 deletions .changeset/late-foxes-learn.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"solive-core": patch
---

update default environment to Shanghai
165 changes: 83 additions & 82 deletions packages/core/src/components/DeployAndCall/Deploy.tsx
Original file line number Diff line number Diff line change
@@ -1,30 +1,32 @@
import {useForm} from "react-hook-form";
import {Hardfork} from "@ethereumjs/common";
import {useEffect, useMemo, useRef, useState} from "react";
import VmProvider from "solive-provider";
import {ArrowPathIcon} from "@heroicons/react/24/outline";
import {
useEffect, useMemo, useRef, useState,
} from 'react';

import {FormProvider} from "../HookForm";
import RHFInput from "../HookForm/RHFInput";
import RHFSelect from "../HookForm/RHFSelect";
import Button from "../Button";
import {useEditor} from "../../editor/contexts/editorContext";
import Copy from "../Copy";
import deploy from "../../editor/utils/deploy";
import {useDeployed} from "../../editor/contexts/deployedContext";
import {useConsole} from "../../editor/contexts/consoleContext";
import {useRelayNetwork} from "../../editor/contexts/relayNetworkContext";
import { useForm } from 'react-hook-form';
import { Hardfork } from '@ethereumjs/common';
import VmProvider from 'solive-provider';
import { ArrowPathIcon } from '@heroicons/react/24/outline';

import AbiInput from "./AbiInput";
import {getAccountOptions} from "./accounts";
import { FormProvider } from '../HookForm';
import RHFInput from '../HookForm/RHFInput';
import RHFSelect from '../HookForm/RHFSelect';
import Button from '../Button';
import { useEditor } from '../../editor/contexts/editorContext';
import Copy from '../Copy';
import deploy from '../../editor/utils/deploy';
import { useDeployed } from '../../editor/contexts/deployedContext';
import { useConsole } from '../../editor/contexts/consoleContext';
import { useRelayNetwork } from '../../editor/contexts/relayNetworkContext';

import AbiInput from './AbiInput';
import { getAccountOptions } from './accounts';

const ENVIRONMENT_OPTIONS = [
{label: 'London', value: Hardfork.London},
{label: 'Berlin', value: Hardfork.Berlin},
{label: 'shanghai', value: Hardfork.Shanghai},
{label: 'merge', value: Hardfork.Merge},
]
{ label: 'London', value: Hardfork.London },
{ label: 'Berlin', value: Hardfork.Berlin },
{ label: 'Shanghai', value: Hardfork.Shanghai },
{ label: 'merge', value: Hardfork.Merge },
];

const DEFAULT_ACCOUNT = '0x5B38Da6a701c568545dCfcB03FcB875f56beddC4';
const DEFAULT_GAS_LIMIT = 3000000;
Expand All @@ -33,11 +35,11 @@ const DEFAULT_VALUE = 0;
const resolveConstructor = (abi: any = []) => {
const constructor = abi.filter((item: any) => item.type === 'constructor')[0];
return constructor ? constructor.inputs : [];
}
};

const useCompile = () => {
const {state, actions, id} = useEditor();
const {addConsole} = useConsole();
const { state, actions, id } = useEditor();
const { addConsole } = useConsole();
const models = state.models || [];
const modelIndex = state.modelIndex || 0;
const curModel = models[modelIndex];
Expand All @@ -61,40 +63,38 @@ const useCompile = () => {

setError(false);
setCompiledContracts(compileResult.output.contracts[curModel?.filename]);
setCompiledOptions(Object.keys(compileResult.output.contracts[curModel?.filename]).map((key: string) => {
return {
label: key,
value: key,
}
}));
setCompiledOptions(Object.keys(compileResult.output.contracts[curModel?.filename]).map((key: string) => ({
label: key,
value: key,
})));
} catch (e: any) {
console.log(e);
setError(true);
addConsole([{
type: "error",
type: 'error',
message: e.message,
}]);
}
setLoading(false);
}
};

const resetAll = () => {
setCompiledContracts([]);
setCompiledOptions([]);
}
};

return {
compile,
compiledContracts,
compiledOptions,
loading,
error,
}
}
};
};

const useDeploy = () => {
const {addConsole} = useConsole();
const {addCompiledContract} = useDeployed();
const { addConsole } = useConsole();
const { addCompiledContract } = useDeployed();
const [loading, setLoading] = useState(false);

const startDeploy = async (
Expand All @@ -104,7 +104,7 @@ const useDeploy = () => {
params: any,
signerAddress: string,
callOptions: { gasLimit: number; value: number },
provider: VmProvider
provider: VmProvider,
) => {
try {
setLoading(true);
Expand All @@ -113,88 +113,89 @@ const useDeploy = () => {
}
const signer = await provider.provider.getSigner(signerAddress);
const [contract, tx] = await deploy(abi, bytecode, signer, callOptions, Object.values(params || {}));
console.log(contract, contract.address);
addCompiledContract({
name,
address: contract.address,
abi: abi,
abi,
signerAddress,
});
addConsole([
{
type: "success",
message: JSON.stringify(tx)
}
])
type: 'success',
message: JSON.stringify(tx),
},
]);
addConsole([
{
type: "success",
message: name + " - Contract deployment succeeded: " + contract.address
}
])
type: 'success',
message: `${name} - Contract deployment succeeded: ${contract.address}`,
},
]);
} catch (e: any) {
console.log(e);
addConsole([
{
type: "error",
type: 'error',
message: e.message,
}
])
},
]);
}
setLoading(false);
}
};

return {
startDeploy,
loading,
}
}
};
};

// Hardfork
const Deploy = () => {
const {compile, loading: compileLoading, error, compiledContracts, compiledOptions} = useCompile();
const {startDeploy, loading: deployLoading} = useDeploy();
const {setSelectedNetwork, providerRef} = useRelayNetwork();
function Deploy() {
const {
compile, loading: compileLoading, error, compiledContracts, compiledOptions,
} = useCompile();
const { startDeploy, loading: deployLoading } = useDeploy();
const { setSelectedNetwork, providerRef } = useRelayNetwork();

const [accounts, setAccounts] = useState<string[]>([]);
const [accountOptions, setAccountOptions] = useState<{ label: string; value: string }[]>([]);

const methods = useForm({
defaultValues: {
environment: Hardfork.London,
environment: Hardfork.Shanghai,
account: DEFAULT_ACCOUNT,
gasLimit: DEFAULT_GAS_LIMIT,
value: DEFAULT_VALUE,
contract: ''
}
contract: '',
},
});

useEffect(()=>{
if(compiledOptions.length > 0){
useEffect(() => {
if (compiledOptions.length > 0) {
methods.setValue('contract', compiledOptions[0]?.value);
}
}, [compiledOptions]);

const {watch, setValue} = methods;
const { watch, setValue } = methods;
const environment = watch('environment');
const selectAccount = watch('account');
const selectedContract = watch('contract');
const selectedContractDeployParams = useMemo(() => {
if (!selectedContract || selectedContract === '') {
return []
return [];
}
return resolveConstructor(compiledContracts[selectedContract]?.abi);
}, [selectedContract, compiledContracts]);
const abiInputRef = useRef<{ getValues: () => any; watch: (v: string) => any; }>();
const abiInputRef = useRef<{ getValues:() => any; watch: (v: string) => any; }>();

const updateAccountOptions = async (accounts: string[]) => {
try {
const options = await getAccountOptions(accounts, providerRef.current);
setAccountOptions(options);
} catch (e) {
console.log(e)
console.log(e);
}
}
};

const handleDeploy = async () => {
const abi = selectedContract ? compiledContracts[selectedContract]?.abi : undefined;
Expand All @@ -209,16 +210,16 @@ const Deploy = () => {
bytecode,
deployParams,
selectAccount,
{value, gasLimit},
providerRef.current
{ value, gasLimit },
providerRef.current,
);
updateAccountOptions(accounts);
}
};

const handleCompile = () => {
setValue('contract', '');
compile();
}
};

useEffect(() => {
if (environment) {
Expand All @@ -229,40 +230,40 @@ const Deploy = () => {
setAccounts(accounts);
await updateAccountOptions(accounts);
});
})
});
}
}, [environment]);

return (
<div className="h-full w-full flex flex-col overflow-auto pb-2">
<FormProvider methods={methods}>
<RHFSelect name="environment" label="Environment" options={ENVIRONMENT_OPTIONS}/>
<RHFSelect name="environment" label="Environment" options={ENVIRONMENT_OPTIONS} />
<RHFSelect
name="account"
label="Account"
options={accountOptions}
widget={(
<div className="flex items-center gap-1">
<ArrowPathIcon className="w-3 h-3" onClick={() => updateAccountOptions(accounts)}/>
<Copy text={selectAccount}/>
<ArrowPathIcon className="w-3 h-3" onClick={() => updateAccountOptions(accounts)} />
<Copy text={selectAccount} />
</div>
)}
/>
<div className="flex justify-between gap-3">
<RHFInput name="gasLimit" label="Gas Limit"/>
<RHFInput name="value" label="Value"/>
<RHFInput name="gasLimit" label="Gas Limit" />
<RHFInput name="value" label="Value" />
</div>
<RHFSelect name="contract" label="Contract" options={compiledOptions}/>
<RHFSelect name="contract" label="Contract" options={compiledOptions} />
</FormProvider>
{selectedContractDeployParams.length > 0 && (
<AbiInput ref={abiInputRef} inputs={selectedContractDeployParams}/>
<AbiInput ref={abiInputRef} inputs={selectedContractDeployParams} />
)}
<div className="flex justify-end gap-2 mb-2">
<Button type="default" loading={compileLoading} onClick={handleCompile}>Compile</Button>
<Button type="primary" loading={deployLoading} onClick={handleDeploy}>Deploy</Button>
</div>
</div>
)
);
}

export default Deploy;

0 comments on commit a612638

Please sign in to comment.