πŸƒ jokedao contest smart contracts and an app for using them

  • By Sean McCaffery
  • Last update: Dec 21, 2022
  • Comments: 14

JokeDaoV2

Check out the live site at jokedao.io!

πŸ„β€β™‚οΈ Quick Start To Spin Up Locally

Prerequisites: Node (v16 LTS) plus Yarn and Git

clone/fork jokedao contests:

git clone https://github.com/seanmc9/JokeDaoV2Dev.git

install and start your πŸ‘·β€ Hardhat chain:

cd JokeDaoV2Dev
yarn install
yarn chain

in a second terminal window, start your πŸ“± frontend:

cd JokeDaoV2Dev
yarn start

in a third terminal window, πŸ›° deploy the contracts locally if you would like:

cd JokeDaoV2Dev
yarn deploy

Development Notes

  • yarn deploy will not only deploy to the local hardhat chain you are running, but upon a successful deploy it will copy the generated byte code into the react-app package so that the app can access it. Make sure to do this before committing any changes to the contract code to make sure that the byte code that the site is deploying is the same as what you have written in the hardhat package!

Github

https://github.com/seanmc9/JokeDaoV2Dev

Comments(14)

  • 1

    merge sprint ending 10/18/22

    sprint ending 10/18/22

    docs: add example link to bytecode deployment

    bugfix: only live update votes in the last hour of the voting period of a contest

    bugfix: remove all listeners after the voting period is over

    bugfix: get rid of providers bc should be able to do without being logged in

    feat: display lens profiles in proposals and votes

  • 2

    bugfix: only update votes live for hour before close

    Description

    In order to save RPC calls which are costing us a significant amount of money currently we will only update votes live for hour before voting closes on a contest.

    Using removeAllListeners() in ethers to turn off the monitoring once the voting period is over.

    TODO: How can I call useContract() like we do useContractEvents(), without a provider? (and note - even when I do use useProvider() and am connected it still errors saying that the provider is undefined, I think somewhere I'm not plugging into wagmi context correctly)

    Also we should use a timer for the time until the vote closes (if we are still in the voting period that is) instead of just an if statement to remove the listeners so we leave nothing to chance (currently implemented, if a user never reloaded their page after the voting period ended, the listeners would not be removed).

  • 3

    feat: 41 UI rewards module

    Description

    Enabling contests to automatically execute transactions depending on the result of a vote

    • feat: add rewards module to contest creation form
      • 3 rewards tiers options: no rewards, ERC20 rewards, chain native currency reward (note: the creator is able to send either ERC20 or chain native currency anyway)

    Screenshot_20221107_162547

    Screenshot_20221107_162603

    • feat: add deployment of rewards module to contest on-chain creation flow Screenshot_20221025_145435

    Screenshot_20221025_145510

    Screenshot_20221025_145544

    Screenshot_20221025_145701

    • feat: add rewards module page
    • feat: display rewards list per winning rank in rewards module page
    • feat: allow contest creator to fund rewards module with ERC20 and native currency tokens
    • feat: allow contest creator to withdraw ERC20 & native currency rewards from the rewards module
    • feat: allow users to send rewards once contest is finished

    Screenshot_20221115_164601 Screenshot_20221116_131612 Screenshot_20221107_175315 Screenshot_20221108_104735

    • feat: add 'check rewards module balance' modal

    Screenshot 2022-11-17 at 17-25-57 JokeDAO πŸƒ An open-source collaborative decision-making platform Screenshot 2022-11-17 at 17-26-03 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Video of rewards distribution and rewards module funding/withdrawals

    Type of changes

    • [x] New feature
    • [x] Breaking changes

    Env variables change

    • Add NEXT_PUBLIC_ALCHEMY_KEY to the .env

    Testing environment

  • 4

    feat: separate tokens and requirements for submissions and voting

    Description

    Clarity task: GEN-44

    Separate tokens and requirements for submissions and voting

    Contest creation Wizard form

    • Allow users to specify a different token to use for proposals
    • Add "Mint proposal token" dialog to contest creation form
    • Add an indication to use a token that implements the IERC20 interface for voting/submission tokens Screenshot_20220905_164859

    Contest page

    useContest hook

    • Add currentUserSubmitProposalTokensAmount to the store ; this value will hold the current user's current amount of the token required to submit a proposal
    • Add checkCurrentUserAmountOfProposalTokens() function to the hook ; this function calls getCurrentSubmissionTokenVotes and store the returned value in currentUserSubmitProposalTokensAmount
    • Add submitProposalToken, submitProposalTokenAddress and their update function to the store ; these values will hold the submission proposal tokens info (for legacy contests, it will store the voting token info)

    Sidebar, ListProposals, DialogModalSendProposal

    • In the "submit proposal" button, instead of using currentUserAvailableVotesAmount value to enable/disable the button, use currentUserSubmitProposalTokensAmount value instead

    Rules page

    • Separate Screenshot 2022-09-05 at 17-36-19 JokeDAO πŸƒ An open-source collaborative decision-making platform the "Token" section in two sections, "Voting token" and "Submit proposals token"

    Dialogs

    • Add error messages to all Dialogs (use the til now unused textError prop)

    Type of change

    • [x] New feature with breaking changes

    How Has This Been Tested

    Contest creation

    1. Go to create contest page

    2. Create a new token then click on "next" to fo to "set rules" step Screenshot 2022-08-22 at 16-27-28 JokeDAO πŸƒ An open-source collaborative decision-making platform

    3. In the form, in the submissions section, you should see a new fieldset with radio buttons:

      • Option 1 should display "Use the same token for both submitting proposals and voting". This option should be selected by default
      • Option 2 should display "Require separate submission token" + a text input that accepts an ethereum address + a "Mint new token" button

    Screenshot 2022-08-22 at 16-28-05 JokeDAO πŸƒ An open-source collaborative decision-making platform

    1. Click on "Mint new token"

    2. A dialog modal should appear with the create token form Screenshot 2022-08-22 at 16-28-42 JokeDAO πŸƒ An open-source collaborative decision-making platform

    3. Fill in the fields Screenshot 2022-08-22 at 16-28-42 JokeDAO πŸƒ An open-source collaborative decision-making platform

    4. Click on "Mint"

    5. The stepper should appear Screenshot 2022-08-22 at 16-28-55 JokeDAO πŸƒ An open-source collaborative decision-making platform

    6. Approve the transaction in your wallet

    7. When the transaction is successful, the form should be removed, and a button that says "Go back to contest creation" should appear Screenshot 2022-08-22 at 16-29-16 JokeDAO πŸƒ An open-source collaborative decision-making platform

    8. If the transaction failed, you should still see the form, and a "try again" button should appear.

    9. Back in the contest creation form ; "Require separate submission token" input should have the newly minted token address as its value Screenshot 2022-08-22 at 16-29-24 JokeDAO πŸƒ An open-source collaborative decision-making platform

    10. Add the rest of the rules

    11. Click on "Create contest". The modal with the steps should appear.

    12. Sign the transaction.

    13. If the transaction is successful, the link to the newlt created contest should appear

    14. Go to the newly created contest

    15. The contest and its data should be displayed

    For the following cases, switch to use an account that has no "proposal" token

    Case 1: no minimum amount of token required to submit a proposal

    1. The "Submit proposal" button should be visible and enabled

    Case 2: a minimum amount of token is required to submit a proposal

    1. The "Submit proposal" button should be visible and but disabled

    For the following cases, switch to use an account that has proposal tokens

    Case 3: a minimum amount of token is required to submit a proposal, but the current wallet doesn't have enough tokens

    1. The "Submit proposal" button should be visible and but disabled Screenshot_20220905_153902

    Case 4: a minimum amount of token is required to submit a proposal, the current wallet has enough tokens

    1. The "Submit proposal" button should be visible and enabled Screenshot_20220905_153759

    Legacy contests

    1. Legacy contests that an ABI that doesn't include the newest functions should display properly (checked contest: /polygon/0x3aCD536121141BDA3E8C0910E21802DA5Be3fCae

    Checklist

    • [x] I can mint a token
    • [x] I can create a contest
    • [x] I can display previous/upcoming/live contests index and my newly created contest is there
    • [x] I can display a newly created contest page
    • [x] I can display a legacy contest page (a contest which ABI doesn't include the new feature implemented here)
  • 5

    [BUG] Sometimes the webapp displays 'Application error: a client-side exception has occured' and no contest data is being displayed

    Describe the bug On a contest page , the webapp sometimes displays 'Application error: a client-side exception has occured`

    Reloading fixes the issue.

    It seemed to be linked to Infura/a RPC provider hitting a rate limit.

    Screenshots https://imgur.com/MNNEgyx

  • 6

    Bugfix 29/searching same address twice infinite loading

    Should fix #29

    Description

    After using the search bar on the View Contests page once, using it again will result in a page that never loads, forcing you to hard reload the page.

    Fixes infinite loading when user uses the same contest address in the search form of the contest page by preventing the search function from being called when the contest address in the url is the same as the contest address in the search bar.

    Type of change

    • [x] Bugfix (non-breaking)

    How Has This Been Tested?

    Scenario 1: wrong network

    1. Go to "View contests" page
    2. Type 0x3Aa9538c6aCD23526fF72f75A9b9160a275379C3 in the search bar.
    3. After seeing the loader, you should see an error message and a try again button
    4. Inputting the same address in the search bar and clicking on 'Search' should give you the same result as step 3
    5. Change network to 'Polygon'
    6. You should see the loader, and the contest data appearing after a few seconds
    7. Inputting the same address in the search bar and clicking on 'Search' should give you the same result as step 6

    Scenario 2: right network

    1. Go to "View contests" page
    2. Type 0x3Aa9538c6aCD23526fF72f75A9b9160a275379C3 in the search bar.
    3. The loader should appear
    4. The contest data appear after a few seconds
    5. Input the same address in the search bar
    6. The loader should appear
    7. The contest data appear after a few seconds
  • 7

    feat: display lens profile

    Description

    • feat: display Lens profile associated to proposal author/voter Ethereum address if it exists, its associated ENS if it exists, and fallback to the address otherwise ;

    Screenshot 2022-10-14 at 16-56-16 JokeDAO πŸƒ An open-source collaborative decision-making platform

    • refacto: useContest to remove fetchEns

    Important: add NEXT_PUBLIC_LENS_API_URL=https://api.lens.dev to your local .env

    Screenshots

    Before

    Screenshot 2022-10-14 at 16-33-30 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Screenshot 2022-10-14 at 16-34-26 JokeDAO πŸƒ An open-source collaborative decision-making platform

    After

    Screenshot 2022-10-14 at 16-41-35 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Screenshot 2022-10-14 at 16-41-18 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Type of change

    • [x] New feature (breaking change due to refactoring)
  • 8

    [BUG]

    Describe the bug A clear and concise description of what the bug is.

    To Reproduce Steps to reproduce the behavior:

    1. Go to 'vote'
    2. Click on 'cancel'
    3. Scroll down to '....'
    4. See error

    Expected behavior A clear and concise description of what you expected to happen.

    Screenshots no

    Desktop (please complete the following information):

    • OS: [mac]
    • Browser [ chrome, safari]
    • Version [every]
    • Wallet [MetaMask]

    Additional context Add any other context about the problem here.

  • 9

    [BUG] loading very long time

    Describe the bug

    A clear and concise description of what the bug is.

    To Reproduce Steps to reproduce the behavior:

    1. Go to '...'
    2. Click on '....'
    3. Scroll down to '....'
    4. See error

    Expected behavior A clear and concise description of what you expected to happen.

    Screenshots If applicable, add screenshots or a video (checkout Loom) to help explain your problem.

    Desktop (please complete the following information):

    • OS: [e.g. iOS]
    • Browser [e.g. chrome, safari]
    • Version [e.g. 22]
    • Wallet [e.g MetaMask]

    Smartphone (please complete the following information):

    • Device: [e.g. iPhone6]
    • OS: [e.g. iOS8.1]
    • Browser [e.g. stock browser, safari]
    • Version [e.g. 22]
    • Wallet [e.g Rainbow]

    Additional context Add any other context about the problem here.

    Bug loading very long time

  • 10

    [BUG] Cannot submit proposal in JokeDao.

    Additional context I would like to join contest "VOTE ON WHAT PROTOCOL, PLATFORM, OR DAPP YOU WANT TO SEE ON LAYER3 NEXT!" I have 200 $l3gvt But I cannot click submit blank for propose protocal as per attaced file. Capture

    Please check the problem and let me know. Thank you in advance.

  • 11

    feat: new UI for proposals list and proposals page

    Description

    • ListProposals
      • feat: add a "Read more" button to proposals that contain more than 280 characters ;

    Screenshot 2022-09-21 at 11-35-58 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Screenshot 2022-09-21 at 11-35-41 JokeDAO πŸƒ An open-source collaborative decision-making platform

    • feat: move "Delete proposal" button position

    Screenshot 2022-09-21 at 11-37-50 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Screenshot 2022-09-21 at 11-38-02 JokeDAO πŸƒ An open-source collaborative decision-making platform

    • feat: remove sidebar from proposal detailed page Screenshot 2022-09-21 at 11-36-17 JokeDAO πŸƒ An open-source collaborative decision-making platform

    Type of change

    • [x] New feature (no breaking change ; UX)
  • 12

    enhancement: using the full screen on desktop

    Is your feature request related to a problem? Please describe. Right now the vertical sidebar and main area for text are right on top of each other. This creates dead space at the side of the screen and a feeling of tightness in the center.

    Describe the solution you'd like We can design it like notion (or even twitter): the sidebar is all the way to the left of the window (potentially in a slightly different background color), and then the main text can be in the center of the remaining space. This will give a feeling of openness, and it would be good to use the same font and size as notion as well.

    image

    Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

    Additional context Add any other context or screenshots about the feature request here.

  • 13

    enhancement: font size of prompts

    Is your feature request related to a problem? Please describe. Right now the prompts are in bold, which looks great for short prompts but makes longer prompts harder to read. the font also seems slightly smaller than the font size for the proposals, so there's a slight visual disconnect.

    Describe the solution you'd like Let's remove the bold and then play with size--let's try having the prompt be the same size as the proposals.

    Describe alternatives you've considered If we're worried that the prompt won't stand out, we can play with putting it in a box, using some color, etc... I'm glad to play with designs in figma. But let's start there.

    Additional context Add any other context or screenshots about the feature request here.

  • 14

    enhancement: add horizontal lines to separate proposals in a contest

    Is your feature request related to a problem? Please describe. It can be a bit unclear to distinguish proposals from each other in contests since we just have a vertical bar distinguishing them, and each is a different size.

    Describe the solution you'd like As a temporary solution, we should try mimicking the twitter design for breaking up tweets with thin horizontal lines rather than a vertical line.

    Longer-term, we should see if we can implement the original designs from figma (https://www.figma.com/file/36Qylp4x6N4pK3wXpHCj5A/jokedao-big-f'in-file?node-id=0%3A1&t=JabEWQuNN16z8Mod-1), where "voting hasn't opened" is its own window that's always centered vertically for any given proposalβ€”showing exactly how long the proposal is without lines. Having this "voting window" be a self-contained element will be helpful later if we want to let people just type in the votes for each entry and then submit them all at the bottom of the screen.

    Describe alternatives you've considered A clear and concise description of any alternative solutions or features you've considered.

    Additional context Add any other context or screenshots about the feature request here.