kylestrout / gator.sol Goto Github PK

Save the users code when they change/leave the page and have a reset button for resetting back to default code.
Probably can do this with local storage and should double check if they actually want to reset the code.

Should display the correct value

Need component built for content pages for reusability.
Which will need individual code editor component/interactive container, content, and run and submit similar to edugator/what we have in figma.

"React scripts 5" breaks some stuff with web3.js

find out of if there is a way for us to still use react scripts 5 with web3.js because our code editor needs it.

https://stackoverflow.com/questions/70472965/web3-issue-react-application-not-compiling

In the interaction panel, if you display a long string, it will go off the screen.

Should truncate long strings and have a copy icon to copy whole value.

We can still deploy the contract if the compilation has errors. Do we want to keep the deploy button enabled at all times since it doesn't really matter @jdriscoll98 ? I think you mentioned changing that.

From jack in #13

I like the idea for having the section interaction component. Making this to remind myself later.

fixed this but still have issue below

If the user clicks the "Connect to Wallet" button and doesn't have Metamask installed, they should be alerted that it's not installed and be directed to the Metamask install page.

Here's some useful documentation for that:
https://docs.metamask.io/guide/create-dapp.html#basic-action-part-1

Right now we only have one text field for constructor arguments. If there's many arguments, then it's hard for the user to see all the different ones they need to add in the text field. Would be better if we had a drop down or expanded area for the arguments.

The app crashes sometimes (not everytime I'm not sure why) when compiling fails at line 250 in index.js of the interaction panel.

The error is something like can't slice properties of undefined

I tried doing this for like 10 mins and it kept coming out weird but I'm pretty tired so will try again tomorrow.

The result when using the interaction panel should have a space between "Result:" and the value

Currently we have yarn.lock file and a package-lock.json. Those are both package managers but we should only have one. I prefer to use npm over yarn because of familiarity, does anyone have a preference?

I was adding content for mappings and the result of people is supposed to show all data from the person object at id 2. Which should be name: "Henry" and age: "25" but it only showed the name

Right now the side nav only links to the landing page and course home. Will need to popout and link to course content similar to edugator. Probably need to use accordion component. Also needs to the logo at the top where the "Logo" text is.

We may want to consider creating a provider for this, or some other type of state management. Currently the workflow goes

compile -> call onCompile -> pass compiler data down to output panel
deploy -> call onDeploy -> pass deploy data down to output panel

At the moment, when the user changes pages, the output panel gets reset but the compilerData doesn't ( as mentioned in #30 ) so that means the code editor has a different state than the output panel.

Before things get trickier, we may want to consider refactoring the state management. No action needed we should just look into it when we get a chance.

On branch interaction-panel from #41

Is this intended or just a bug? Seems a bit weird to me.

1. Button is pink and should be blue in dark mode
2. Argument field text should be lighter in dark mode
3. Requires arguments in the text field when the constructor doesn't have arguments

If the user rejects deploying the smart contract through Metamask, we need a way to handle the corresponding error.

Error:

Can spam click buttons when waiting for a response... Idk we probably dont want that

How do we want to provide test ether to the user?

I think creating a smart contract, filling with like 10-20 ETH using the faucet and then sending users 0.1 test ETH for free ( our app can store the private keys to the wallet and sign the transaction when the user requests ETH and also keep track of which addresses have received a payout so that people can't spam the contract ).

Any other ideas?

We can style/reorganize the compiler output to be easier on the eyes. Could use a list of accordions similar to transaction history or something else.

What do you guys think? @jdriscoll98 @CWilson123 @colinnaehr

I'm pretty garbage at styling with css so I noticed the theme switch isn't in the spot I want it to be (far right) on my main monitor but it is on my second monitor where I was initially setting it up. Any help with this would be appreciated.

Our theme in Theme.js isn't applying to the side nav and also there is a weird scroll option at the bottom of the sidenav.

On branch interaction-panel from #41

Ran into this issue after deploying two contracts at once in the solidity advanced page (storage/helloworld) then switching to the solidity basics page and deploying helloworld. The history is empty after switching pages and recompiling but after new deployment shows all deployments. I don't think deploying two contracts at once makes a difference I just think its a bug in the code editor/transactionhistory files.

For some reason values are getting displayed like this. Should not be a comma separated list and just the value.
The console I think displays the value so this should be an easy fix.