I highly suspect that the issue here is that you have not deployed the contract. Check out the video around this marker.
how comment can be added to below every post … did anyone implemented comment component to give an advice ?
Hi Man, sorry for the late reply. I haven’t have the time to hang out here lately.
Since the first iteration of the post appears to have votes, and other two don’t I tend to think that most likely those post actually were created in the given categories.
I think you could go to your moralis dashboard and check the sync events of createdContent, createdPost to check what is the status of this content and post and whether it was created twice and in which categories.
2 Likes
Hi, Thanks for following-up.
To implement the comments feature you will need something like this:
Context:
The comments are actually like posts the only difference is that they have a parent post identified by the corresponding parent Id when they are created. So basically what you will need to create is a component similar to the feed component that is a child to each Post, and that toggles when someone clicks view comments (or something like that). And also a form to place a comment.
Steps:
- Change the behavior of the Posts component. https://github.com/ethereum-boilerplate/web3-social-network-boilerplate/blob/main/src/components/Feed/components/Posts.jsx.
** Instead of filtering only by category ID you will have to filter the categoryID equal categoryID and parentId equal to the wildcard that we are using to signal no parent ID (“0x91”).
** This will bring only original post of the category. - Create a comment button on each post to toggle a form to create a comment.
** The behavior of this will be similar to the AddPost component the difference is that instead of sending the post with the wildcard parentID of (“0x91”) you send the original post Id as the parent Id. - You create a component similar to the Feed component but that filters all post with parent Id equal to the parent Id of the original post.
It will require a bit of work, but I think though challenging you might find it rewarding to pull-it off.
2 Likes
tnx for reply i will work through it and try to get better at coding
Hello, I am having the same challenge.
I am interacting with the social media boilerplate. When I keep the decentradit.sol in the original folder, I cannot compile/deploy it. When I move it to the same folder as Migrations.sol I can. Is it suppose to stay where it was? If so how can I compile/deploy it?
Also, if I move it to the same folder as Migrations.sol I am able to compile. But am I supposed to do this? Also when it finally deploys in the same folder as Migrations.sol the screen looks like this
Similar to the issue the other person @fractalbounce was having.
Any insight on how to properly deploy?
Thanks template looks great cant wait to use it
Thanks for your question.
The deployment of the contract and the creation of the first categories as mentioned in the readme is intended to be a separate and previous step from running the Social Media Boilerplate. This was intentional, as mentioned in the video, in order to keep the project framework neutral with regards to Smart Contract development.
The Truffle folder was inherited from the original Ethereum boilerplate repo which this project inherits from. In the video it is mentioned that the deployment of the contracts is not included in the code. This is because people has very strong preferences on what Smart Contract development platform to use. Some people like hardhat, some truffle, I like brownie for example. For quick deployment of an already developed contract a lot of people would use Remix. I would recommend this since it allows to interact very easily with the functions of the deployed contract without a UI (which is needed to create the first categories)
To avoid pushing people to any specific stack only the source code of the contract was intended to be provided. However, since I forgot to delete the inherited truffle project, someone familiar would truffle could change the contract in the truffle project and modify the truffle scripts to deploy decentradit. This sounds like what you just did. Your screen looks like this because we are only missing to add categories at this point.
Following the readme steps:
-
Deploy smart contracts from this folder https://github.com/ethereum-boilerplate/web3-social-network-boilerplate/tree/main/smart%20contracts. - Pending. Add some categories through the addCategory function. For this you will need to interact with your contract manually. You can do this in any Smart Contract Framework of your choice.
- Pending. Set listeners in the Moralis Server to sync all your contracts events. Around this place in the video. 14:08
- Pending. Add your contract address in MoralisDappProvider.js contract address as the default value of the state.
.
That is basically it.
1 Like
Hey thanks for the update and reply. I did bring the smart contract for the app into the boilerplate contract folder, and then I did truffle migrate --reset to deploy and get the contract address. I inputted everything into Moralis Server sync. Seems to work.
I know it’s a noob question but how do I add Categories? The part you left out. As I am working through the tutorial video I’m also learning react as I set up this boiler plate, so it would be very helpful. Or some resources. Every process I am learning a lot as well. Thanks for making this.
1 Like
Hi Not at all,
Do you remember what network did you deploy the contract?
Process vary a bit between a local test network like ganache or an official testnet such as BSC test or Mumbai (Polygon).
I will assume that you deployed to an official testnet.
Go to remix: https://remix.ethereum.org/
Paste the source code in the Contract Editor,
Compile with the compiler.
In the run function section of remix.
- In environment select injected web3. Your metamask will pop-up. Approve and select the network in which you deployed your contract in your metamask. (Just as a precaution use a metamask account were you don’t have any real assets, your dev metamask and your actual asset wallet should be different as a best practice).
- In contract select the contract that you just compiled.
- In At Address paste the address of your deployed contract.
- If all the steps were correct you will see the functions of the contract avaiable for interaction in the remix interface, just under deployed contracts.
- you can just add your categories by triggering the addCategory input that you will see there.
Hi, thanks. This is what I have question about how do I add categories? Sorry I know it is a noob question. Thanks for this I am learning a lot.
though I am not sure at what point I add the categories. In the smart contract? In terminal in truffle? In App.jsx? That is where I am unsure.
The simplest way is through Remix, as pointed in my previous answer. If you are familiar how to do it in thruffle throug the terminal that is an option. App.jsx is the frontend, it uses moralis to interact with the contract which is covered in the video but for that you will need the categories.
Right. It would have been awesome if this was included in the tutorial, I am still working through figuring out how to do this on my own. Thanks for the tip though hopefully I will get it soon!.
Or if you have any other resources about how to interact with smart contracts this way please definitely share. Thanks again.
Also another question, when compiling/deploying my contracts I tend to encounter this warning. Would you be able to explain maybe why?
Compiling your contracts…
Compiling ./contracts/PartyApp.sol
Compilation warnings encountered:
project:/contracts/PartyApp.sol:131:13: Warning: Result of exponentiation has type uint8 and thus might overflow. Silence this warning by converting the literal to the expected type.
2**_reputationAdded <= _reputation
^-----------------^
Artifacts written to /Users/sexynerds/Desktop/Web3/EthBoiler/ethereum-boilerplate/Truffle/build/contracts
Compiled successfully using:
- solc: 0.5.16+commit.9c3226ce.Emscripten.clang
Network up to date.
truffle(ganache)>
Thanks,
hi again and tnx for Guide i did it with your help,
i have problem with encoding content and title to UTF-8 support for RTL langs, i used encodeUriComponent on btoa but it doesnt work… you have any idea about that? tnx in advance
Hi there,
Sorry for the late reply. As mentioned I don’t visit here everyday.
On this matter the warning is triggered by because uint8 only can hold 256 since we include 0 then the greatest number that can be held by that variable is 255. Since we didn’t create another variable to hold this result solidity will assign the result the value of uint8 (same as reputation added).
The compiler thinks it is very likely that an exponentiation will be greater to 255 in which case the value will overflow causing an error at runtime.
The way to fix this is to create another variable of the same type of reputation (uint80) to hold the result. This will hold as much as 2^80-1. Then we have to restrict the value of reputation added to be equal or less than 79. This will make the warning disappear I think. Good catch, I will try to push a fix when I have time.
This is not a very serious issue for you to follow the tutorial though.
Best Regards
Daniel
1 Like
how can i implement validateReputationChange you mentioned in video to change how the given reputation calculate? can you give a hint ty
That will be easy, Since the reputation validation is already implemented in the contract. You have to implemented in the client in the voting component. Changing to instead adding or taking out one unit of reputation, use the log2 of the reputation of the voter.
And one in the case the reputation of the voter is lesser or equal than 2.
1 Like
Thanks, I too have been hanging out elsewhere! Finally digging back into this project with my wingbird @cromewar, will spend some time here supporting and asking questions. Your workshop and boilerplate are awesome, really appreciate your hard work. Happy holidays & new year 