adrianhajdin / project_crowdfunding

With a stunning design, connected to the blockchain, metamask pairing, interaction with smart contracts, sending Ethereum through the blockchain network, and writing solidity code.
https://jsmastery.pro
680 stars 372 forks source link

[BugFix - getDonators and donateToCampaign give errors #40] #51

Closed krishnaacharyaa closed 1 year ago

krishnaacharyaa commented 1 year ago

In the latest release contract.call() has changed the parameters to accept array instead of single param.

The API for interacting with smart contracts via the thirdweb React & TypeScript SDKs has been updated in favor of explicitly defining function arguments and (optionally) call overrides.

Using the contract.call function in the TypeScript SDK now looks like the following:

const owner = "0x...";
const operator = "0x...";
const overrides = { gasPrice: 800000 };
const res = await contract.call("approve", [owner, operator], overrides);

Note that the arguments to the contract function are now passed in as an array as the second parameter to contract.call, and the overrides are passed optionally as the last parameter.

Also refer official docs

const data = await contract.call(
"myFunctionName", // Name of your function as it is on the smart contract
// Arguments to your function, in the same order they are on your smart contract
[
"arg1", // e.g. Argument 1
"arg2", // e.g. Argument 2
],
);
sandipmaurya2611 commented 10 months ago

I got this type of error please give me a solution for that :- this 1st bug lockdown-run.js:17 Lockdown failed: TypeError: At intrinsics.Object.groupBy expected boolean not function at isAllowedPropertyValue (lockdown-install.js:1:53384) at isAllowedProperty (lockdown-install.js:1:53807) at visitProperties (lockdown-install.js:1:55095) at isAllowedPropertyValue (lockdown-install.js:1:53041) at isAllowedProperty (lockdown-install.js:1:53807) at visitProperties (lockdown-install.js:1:55095) at lockdown-install.js:1:55523 at repairIntrinsics (lockdown-install.js:1:144597) at lockdown-install.js:1:145462 at lockdown-run.js:4:3

And this is Second:-

rror: Could not fetch bytecode for contract at 0xC8B8c3D9e8AFFC1C545602e01a7DC9071a086f3b on chain 1, double check that the address and chainId are correct. at fetchContractMetadataFromAddress (contract-publisher-6a419060.browser.esm.js:4868:11)

I am unable to create campaigns... Please give me a solution ..

Error

gurjeetsinghvirdee commented 10 months ago

@sandipmaurya2611 Ignore the 1st one

For Second BUG

You can fix that issue by doing some changes on main.jsx

File Path

client/src/main.jsx

First run this command on your client directory

npm install @thirdweb-dev/chains

Then import it just as I did, Replace desiredChainId with activeChain, & remove the ChainID It will solves your issue

import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter as Router } from 'react-router-dom';
import { ChainId, ThirdwebProvider } from '@thirdweb-dev/react';
import { Sepolia } from "@thirdweb-dev/chains";

import { StateContextProvider } from './context';
import App from './App.jsx';
import './index.css';

const root = ReactDOM.createRoot(document.getElementById('root'));

// root.render(
//     <ThirdwebProvider desiredChainId={ChainId.Sepolia}>  // before your code looks like this
//         <Router>
//             <StateContextProvider>
//                 <App />
//             </StateContextProvider>
//         </Router>
//     </ThirdwebProvider>
// )

root.render(
    <ThirdwebProvider activeChain={Sepolia}>  // Now you have to write this
        <Router>
            <StateContextProvider>
                <App />
            </StateContextProvider>
        </Router>
    </ThirdwebProvider>
)
sandipmaurya2611 commented 10 months ago

Thank You for helping me... but there is still some error in that , There is error in index.js as please give me some ideas to solve that:-

mutation.ts:261 Error: Function "createCampaign" requires 6 arguments, but 0 were provided. Expected function signature: contract.call("createCampaign", [_owner: string, _title: string, _description: string, _target: BigNumberish, _deadline: BigNumberish, _image: string]): Promise at ContractWrapper.call (contract-publisher-6a419060.browser.esm.js:8549:13) at SmartContract.call (contract-publisher-6a419060.browser.esm.js:20309:33) at Object.mutationFn (useTransactions-45c61f7c.browser.esm.js:2884:21) at Object.fn (mutation.ts:179:31) at run (retryer.ts:147:31) at createRetryer (retryer.ts:204:5) at executeMutation (mutation.ts:174:22) at Mutation.execute (mutation.ts:216:26) at async publishCampaign (index.jsx:18:26) at async CreateCampaign.jsx:33:17

contract call failure Error: Function "createCampaign" requires 6 arguments, but 0 were provided. Expected function signature: contract.call("createCampaign", [_owner: string, _title: string, _description: string, _target: BigNumberish, _deadline: BigNumberish, _image: string]): Promise at ContractWrapper.call (contract-publisher-6a419060.browser.esm.js:8549:13) at SmartContract.call (contract-publisher-6a419060.browser.esm.js:20309:33) at Object.mutationFn (useTransactions-45c61f7c.browser.esm.js:2884:21) at Object.fn (mutation.ts:179:31) at run (retryer.ts:147:31) at createRetryer (retryer.ts:204:5) at executeMutation (mutation.ts:174:22) at Mutation.execute (mutation.ts:216:26) at async publishCampaign (index.jsx:18:26) at async CreateCampaign.jsx:33:17

On Fri, Oct 6, 2023 at 3:38 AM Gurjeet Singh Virdee < @.***> wrote:

@sandipmaurya2611 https://github.com/sandipmaurya2611 Ignore the 1st one

For Second BUG

You can fix that issue by doing some changes on main.jsx File Path

client/src/main.jsx

First run this command on your client directory

npm install @thirdweb-dev/chains

Then import it just as I did, Replace desiredChainId with activeChain, & remove the ChainID It will solves your issue

import React from 'react';import ReactDOM from 'react-dom/client';import { BrowserRouter as Router } from 'react-router-dom';import { ChainId, ThirdwebProvider } from @./react';import { Sepolia } from @./chains"; import { StateContextProvider } from './context';import App from './App.jsx';import './index.css'; const root = ReactDOM.createRoot(document.getElementById('root')); // root.render(// // before your code looks like this// // // // // // // ) root.render(

// Now you have to write this ) — Reply to this email directly, view it on GitHub , or unsubscribe . You are receiving this because you were mentioned.Message ID: ***@***.***>
sandipmaurya2611 commented 10 months ago

Thank You For Solving My error There is another error arising... Please Give Me a Solution for that... mutation.ts:261 TypeError: Cannot read properties of undefined (reading 'length') at toUtf8Bytes (utf8.ts:210:29) at StringCoder.encode (string.ts:19:37) at array.ts:62:19 at Array.forEach () at pack (array.ts:54:12) at TupleCoder.encode (tuple.ts:54:16) at AbiCoder.encode (abi-coder.ts:111:15) at Interface._encodeParams (interface.ts:323:31) at Interface.encodeFunctionData (interface.ts:378:18) at ContractWrapper.formatError (contract-publisher-6a419060.browser.esm.js:8668:46) execute @ mutation.ts:261 await in execute (async) mutate @ mutationObserver.ts:136 publishCampaign @ index.jsx:14 (anonymous) @ CreateCampaign.jsx:33 img.onload @ index.js:20 load (async) checkIfImage @ index.js:20 handleSubmit @ CreateCampaign.jsx:30 callCallback2 @ react-dom.development.js:4164 invokeGuardedCallbackDev @ react-dom.development.js:4213 invokeGuardedCallback @ react-dom.development.js:4277 invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:4291 executeDispatch @ react-dom.development.js:9041 processDispatchQueueItemsInOrder @ react-dom.development.js:9073 processDispatchQueue @ react-dom.development.js:9086 dispatchEventsForPlugins @ react-dom.development.js:9097 (anonymous) @ react-dom.development.js:9288 batchedUpdates$1 @ react-dom.development.js:26140 batchedUpdates @ react-dom.development.js:3991 dispatchEventForPluginEventSystem @ react-dom.development.js:9287 dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay @ react-dom.development.js:6465 dispatchEvent @ react-dom.development.js:6457 dispatchDiscreteEvent @ react-dom.development.js:6430

index.jsx:27 contract call failure TypeError: Cannot read properties of undefined (reading 'length') at toUtf8Bytes (utf8.ts:210:29) at StringCoder.encode (string.ts:19:37) at array.ts:62:19 at Array.forEach () at pack (array.ts:54:12) at TupleCoder.encode (tuple.ts:54:16) at AbiCoder.encode (abi-coder.ts:111:15) at Interface._encodeParams (interface.ts:323:31) at Interface.encodeFunctionData (interface.ts:378:18) at ContractWrapper.formatError (contract-publisher-6a419060.browser.esm.js:8668:46)

On Fri, Oct 6, 2023 at 3:38 AM Gurjeet Singh Virdee < @.***> wrote:

@sandipmaurya2611 https://github.com/sandipmaurya2611 Ignore the 1st one

For Second BUG

You can fix that issue by doing some changes on main.jsx File Path

client/src/main.jsx

First run this command on your client directory

npm install @thirdweb-dev/chains

Then import it just as I did, Replace desiredChainId with activeChain, & remove the ChainID It will solves your issue

import React from 'react';import ReactDOM from 'react-dom/client';import { BrowserRouter as Router } from 'react-router-dom';import { ChainId, ThirdwebProvider } from @./react';import { Sepolia } from @./chains"; import { StateContextProvider } from './context';import App from './App.jsx';import './index.css'; const root = ReactDOM.createRoot(document.getElementById('root')); // root.render(// // before your code looks like this// // // // // // // ) root.render(

// Now you have to write this ) — Reply to this email directly, view it on GitHub , or unsubscribe . You are receiving this because you were mentioned.Message ID: ***@***.***>
gurjeetsinghvirdee commented 10 months ago

@sandipmaurya2611

Some errors are irrelevant focus on that create issue on your code like createCampaign one

You can solve this bug just by adding {args:[]} inside the publishCampaign

File Path

client/src/context/index.js
// Here we are connecting web3 with the client 

import React, { useContext, createContext } from 'react';
import { useAddress, useContract, useMetamask, useContractWrite } from '@thirdweb-dev/react';
import { ethers } from "ethers";

const StateContext = createContext();

export const StateContextProvider = ({ children }) => {
    const { contract } = useContract('0x7045fe828a26e4B24B46A6902998C5F73aeF7144');
    const { mutateAsync: createCampaign } = useContractWrite(contract, 'createCampaign')

    const address = useAddress();
    const connect = useMetamask();

    const publishCampaign = async (form) => {
        try {
            const data = await createCampaign({args: [
                    address, // owner
                    form.title, // title
                    form.description, // description
                    form.target,
                    new Date(form.deadline).getTime(), // deadline
                    form.image // image
            ]});

            console.log("contract call success", data)
        } catch (error) {
            console.log("contract call failure", error)
        }
    }

    return (
        <StateContext.Provider
            value={{
                address,
                contract,
                connect,
                createCampaign: publishCampaign,
            }}
        >
            {children}
        </StateContext.Provider>
    )
}

export const useStateContext = () => useContext(StateContext);
sandipmaurya2611 commented 10 months ago

Thanks for the tip! This is My Code :- File Path

client/src/context/index.js

import React, { useContext, createContext } from 'react'; import { useAddress, useContract, useMetamask, useContractWrite } from @./react'; import { ethers } from 'ethers'; import { EditionMetadataWithOwnerOutputSchema } from @./sdk'; const StateContext = createContext(); export const StateContextProvider = ({ children }) => { const { contract } = useContract('0xC8B8c3D9e8AFFC1C545602e01a7DC9071a086f3b'); const { mutateAsync: createCampaign } = useContractWrite(contract, 'createCampaign'); const address = useAddress(); const connect = useMetamask();

const publishCampaign = async (form) => { try { const data = await createCampaign({args: [ address, // owner form.title, // title form.description, // description form.target, new Date(form.deadline).getTime(), // deadline, form.image,

        ]});
    console.log("contract call success", data)
} catch (error) {
  console.log("contract call failure", error)
}

} const getCampaigns = async () => { const campaigns = await contract.call('getCampaigns'); const parsedCampaings = campaigns.map((campaign, i) => ({ owner: campaign.owner, title: campaign.title, description: campaign.description, target: ethers.utils.formatEther(campaign.target.toString()), deadline: campaign.deadline.toNumber(), amountCollected: ethers.utils.formatEther(campaign.amountCollected.toString()), image: campaign.image, pId: i })); return parsedCampaings; } const getUserCampaigns = async () => { const allCampaigns = await getCampaigns(); const filteredCampaigns = allCampaigns.filter((campaign) => campaign.owner === address); return filteredCampaigns; } const donate = async (pId, amount) => { const data = await contract.call('donateToCampaign', [pId], { value: ethers.utils.parseEther(amount)}); return data; } const getDonations = async (pId) => { const donations = await contract.call('getDonators', [pId]); const numberOfDonations = donations[0].length; const parsedDonations = []; for(let i = 0; i < numberOfDonations; i++) { parsedDonations.push({ donator: donations[0][i], donation: ethers.utils.formatEther(donations[1][i].toString()) }) } return parsedDonations; } return ( <StateContext.Provider value={{ address, contract, connect, createCampaign: publishCampaign, getCampaigns, getUserCampaigns, donate, getDonations }}

{children} </StateContext.Provider> ) } export const useStateContext = () => useContext(StateContext);

I get Error :-

TypeError: Cannot read properties of undefined (reading 'length') at toUtf8Bytes (utf8.ts:210:29) at StringCoder.encode (string.ts:19:37) at array.ts:62:19 at Array.forEach () at pack (array.ts:54:12) at TupleCoder.encode (tuple.ts:54:16) at AbiCoder.encode (abi-coder.ts:111:15) at Interface._encodeParams (interface.ts:323:31) at Interface.encodeFunctionData (interface.ts:378:18) at ContractWrapper.formatError (contract-publisher-6a419060.browser.esm.js:8668:46) execute @ mutation.ts:261


index.jsx:25 contract call failure TypeError: Cannot read properties of undefined (reading 'length') at toUtf8Bytes (utf8.ts:210:29) at StringCoder.encode (string.ts:19:37) at array.ts:62:19 at Array.forEach () at pack (array.ts:54:12) at TupleCoder.encode (tuple.ts:54:16) at AbiCoder.encode (abi-coder.ts:111:15) at Interface._encodeParams (interface.ts:323:31) at Interface.encodeFunctionData (interface.ts:378:18) at ContractWrapper.formatError (contract-publisher-6a419060.browser.esm.js:8668:46)

On Fri, Oct 6, 2023 at 9:34 PM Gurjeet Singh Virdee < @.***> wrote:

@sandipmaurya2611 https://github.com/sandipmaurya2611

Some errors are irrelevant focus on that create issue on your code like createCampaign one You can solve this bug just by adding {args:[]} inside the publishCampaign File Path

client/src/context/index.js

// Here we are connecting web3 with the client import React, { useContext, createContext } from 'react';import { useAddress, useContract, useMetamask, useContractWrite } from @.***/react';import { ethers } from "ethers"; const StateContext = createContext(); export const StateContextProvider = ({ children }) => { const { contract } = useContract('0x7045fe828a26e4B24B46A6902998C5F73aeF7144'); const { mutateAsync: createCampaign } = useContractWrite(contract, 'createCampaign')

const address = useAddress();
const connect = useMetamask();

const publishCampaign = async (form) => {
    try {
        const data = await createCampaign({args: [
                address, // owner
                form.title, // title
                form.description, // description
                form.target,
                new Date(form.deadline).getTime(), // deadline
                form.image // image
        ]});

        console.log("contract call success", data)
    } catch (error) {
        console.log("contract call failure", error)
    }
}

return (
    <StateContext.Provider
        value={{
            address,
            contract,
            connect,
            createCampaign: publishCampaign,
        }}
    >
        {children}
    </StateContext.Provider>
)}

export const useStateContext = () => useContext(StateContext);

— Reply to this email directly, view it on GitHub https://github.com/adrianhajdin/project_crowdfunding/pull/51#issuecomment-1750999101, or unsubscribe https://github.com/notifications/unsubscribe-auth/AQMGQVEQNDD2WEJQZLYP4Q3X6ATYDAVCNFSM6AAAAAAYRWR3JKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTONJQHE4TSMJQGE . You are receiving this because you were mentioned.Message ID: @.***>

gurjeetsinghvirdee commented 10 months ago

@sandipmaurya2611 You forgot to add this >

image

Like this

sandipmaurya2611 commented 10 months ago

I Put but still it does not work..

gurjeetsinghvirdee commented 10 months ago

I Put but still it does not work..

Then maybe you spelled some word wrong check in campaigndetails