We've used the library from: https://github.com/RollaProject/solidity-datetime

Let's use this https://www.npmjs.com/package/@quant-finance/solidity-datetime. Make sure that we use the exact version: 2.2.0. We don't want to upgrade to 2.2.1 etc. if this untrusted quant-finance pushes an update. This could be done by setting the version as "2.2.0". More information here: https://maxleiter.com/blog/pin-dependencies

When this update is done, we would be removing the source files from the repository and importing the libraries as we do with openzeppelin libraries.

The button on https://www.rainbowkit.com/ works flawlessly on wrong networks.

This doc is about how to support chains: https://www.rainbowkit.com/docs/custom-chains

However, last night, in some cases the button was going invisible when connecting to wrong networks. There were no logs in the console. The behavior was like the following:

• On Ethereum, everything is fine
• Switch to an unsupported network on MetaMask
• The Connect Wallet button goes invisible
• Switch back to Ethereum
• The Connect Wallet button comes back

In case the network is not supported, the Connect Wallet button must turn to a red Wrong Network button.

I remember in one case where the button was invisible and then turned visible. And in another case the issue was resolved when I restarted the frontend server (yarn dev). These suggest me that the issue is about an external API rate limiting the frontend.

Afterwards the app stopped loading for me, which suggests that even more.

I think there is an issue with another part of the code (Most likely the Greeting contract's pooling logic) that enters into a loop, sending hundreds of requests in a fraction of a second and gets the app rate limited immediately on wrong networks.

The problem is probably in the SetGreeting and/or GetGreeting components.

We can take notes from Hypercerts' implementation: https://github.com/Network-Goods/hypercerts-protocol/blob/main/contracts

I suggest having a RegenBingoMetadata library with these external functions:

generateContractURI
function generateContractURI() external view returns (string memory)

generateTokenURI
function generateTokenURI(uint256 tokenId, uint256[9][3] numbers, bool[9][3] covered) external view virtual returns (string memory)

On wrong networks, instead of seeing the wallet address and balance, there must be a switch network button.

Mint button can be disabled after the minting period ends.

It's the time to integrate Chainlink VRF.

The documentations are available on:

• https://docs.chain.link/vrf/v2/direct-funding/examples/get-a-random-number/
• https://docs.chain.link/vrf/v2/security/

Here's the example contract getting randomness from Chainlink docs: https://remix.ethereum.org/#url=https://docs.chain.link/samples/VRF/VRFv2DirectFundingConsumer.sol

I suggest asking for the random number once in the startDrawPeriod function and recording a seed for the following reasons:

• The number draws will be faster. As VRF flows will require 2+ blocks for every number + the cooldown.
• The code will be simpler.
• We will know how much LINK to use.

If we agree on this, we'd only need to modify startDrawPeriod() and add fulfillRandomWords(...). fulfillRandomWords(...) could store the random word as a variable. And then we could use that variable and nonces in drawNumber() only by changing the variables we put into the hash functions.

Design considerations:

• The contract must be resilient to Chainlink VRF failing to call the fulfillRandomWords function.
• The contract must not change its random number once it is set. Otherwise, advanced players can change the number to increase their chances of winning.

@daggerhashimoto you should review this issue.

In case there is more than 5 seconds until a new button can be drawn:

• Show the cooldown timer.
• Disable the button.
  Else:
• The current behavior.

I think we can have a 5 seconds buffer as it takes a couple of seconds to interact with MetaMask and then wait for the tx to be included in a block.

So I tried the app on my mobile through my local network. Connect wallet button displays RainbowKit modal, Metamask button redirects to the Metamask app, but, there is no connection approval etc. When I turned back to the App, there was an error related to "WalletConnect" (wtf?). Forgot to take screenshots. Details will be added.

Phone details:
iPhone 14
iOS 16.2

There should be a single environment variables file and that should be .env at root.

1. Remove the seed column
2. Rename "Timestamp" column to "Time"
3. Rename "Tx Hash" to "Transaction"
4. Hide Transaction in small views
5. Fix #8 for the Time column
6. Fix #9 for the Transaction column

Building routes and pages for "cards" and "cards/[id]"

This commit introduced custom colors to the project: 52d68a8

Tailwind has plethora of colors and we should use them: https://tailwindcss.com/docs/customizing-colors

The primary reason for using Tailwind is not to maintain css and to be able to understand class names. Read https://tailwindcss.com/docs/utility-first for more details.

I've added the function for multiple mints. We should add it to the frontend as well. However, we better design the UX first.

There can be 90 lucky numbers so they will not look good in the same page with bingo cards. We should seperate them.

Getting the minted cards metada from the contract

Instead of the empty card, let's show the latest minted card on the landing page.

@hantuzun After I pulled the latest version of main branch I've started to getting this error

Calculate required LINK amount for each randomness request according to chainlink docs.

When the user switches to the correct network, the app must react by loading the state. This must happen in all the pages.

The screen recording below is only for the lucky numbers page:

Uploading Screen Recording 2023-01-17 at 15.14.19.mov…

The button is waiting for the second toast, staying disabled more than necessary.

We decided to use primes larger than 2^128 in the contract. Here are 15 such primes in order generated by bigprimes.org:

345748237736302043954346415468961719667
346898908343340269085095797543225285067
349436888172124469953802313936204793639
350775825975224662536471623247112070683
351826028875514156289400300739130052693
352412280970268348994551642119472945107
352481965297794116322788845643729736229
359319764875976259388138010914940262119
359319764875976259388138010914940262119
364474025646518244225535015089205405063
365535512377247765880241266596284033459
366207651054021111846380872598610590333
370011511959930685076007398472051834473
375675342105268259527879793250735537607
385276465729037003106999007892189232991

They are all larger than 2^128:

340282366920938463463374607431768211456

Let's use them in the code and let's use the same primes for all layouts.

The collision case is the following:

(seed % prime1) % 10 = (seed % prime2) % 10

(seed % prime1)*a + x = (seed % prime2)*b + x where x < 10

(seed % prime1)*a = (seed % prime2)*b

Example collisions are found with the following case:

seed = prime1*prime2*c + d

seed must be larger than the largest prime in the list above. This must be assured with an assert call.

Having primes larger than 2^128 would make it impossible to come up with uint256 seeds However, collisions would still be found randomly.

If collisions are not there:
seed = prime1*a + x = prime2*b + y and x % 10 != y % 10

The draw numbers must work on hardhat deployments with the mock.

I haven't figured out how we should be doing this. There could be a backend job that responds on randomWords queries on hardhat networks. The best approach would be to look for examples.

The text below is hardcoded now:

Donating 0.05 ETH · Gitcoin Alpha Round · 0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2 · January 31, 2023

Generate the text from the following parameters:

• donationAmount (wei as uint)
• donationName (string)
• donationAddress (address)
• drawTimestamp (timestamp as uint)

Donating should be changed to Donated when the game ends.

First, these parameters should be added to the constructor. Deployment scripts must be updated as well. Then, these parameters must be passed to RegenBingoMetadata and finally to RegenBingoSVG.

Oytun wrote on #93:

If a user draw numbers continuously, another user is always seeing the loading spinner on My-Cards page since it re-fetchs the list depending on event.

Suggestion: We can trigger the re-fetch for a certain amount of time instead of for every event, OR we can add a manual refresh button.

IMO: We better keep track of cards and their numbers & only refresh them.

Let's sort the my-cards table and be efficient while doing so.

Here's my proposal:

• Keep a map state from numbers to tokenIds.
• Every tokenId is in 15 maps.
• For each drawn number, refresh the images and numbersCount of cards including the number.
• Sort accordingly.

For sorting, we can keep array of cards state. The array could be updated if cards change or their image/numbersCount are updated.

How to replicate:

1. Switch to an unsupported network on MetaMask.
2. Refresh https://regen.bingo/

What I see:
Two "Switch to Goerli" toasts.

What is expected.
One toast.

Inspect the cause of the issue. Do not just bandaid this behavior. We better have a single component dealing with this problem, not one.

There should be a test that mints an NFT and checks for the text in the rolling string. The test could mint an NFT, decode it, and look for such a substring in the SVG code: Donating 0.05 ETH · The Gitcoin Alpha Round · 0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2 · January 31, 2023 23:59 UTC

Tests for the failing RegenBingo.ts scenario must be fixed.

This article seems to be a good one for testing Chainlink VRF with the required mock: https://dev.to/abhikbanerjee99/testing-your-chainlink-vrf-powered-smart-contract-m3i

While drawing the very first number, drawn numbers table is not updated immediately. But If there is at least one number drawn, DrawNumber succesfully updates the table. We should look onto that.

We can listen the events for drawnNumbers but when the user refresh the page or opens the page after numbers are drawn we have to get the numbers directly from the contract. In this case we will not able to show the transaction hash or timestamp.

AFAIK.

When the game is ended, all the pages must reflect the state.

In the landing page; there could be information on the card that has won the game and the transaction.

The countdown displays states as 1 Seconds, 1 Minutes, etc. These should be fixed.

my-cards page doesn't list cards on page refresh, but it works after clicking the page's tab from another page.

When I've 11 cards, https://regen.bingo/my-cards takes a couple of seconds to load. It should load immidiately.

If you have account A with 3 cards and account B with 0 cards.

If you've connected account A and seeing 3 cards, when you connect account B you still see these 3 cards.

We should use react-toastify's "promise" toasts for created transactions. Disabling the button after approval is not looking nice to my eyes.

Instead of "05/01/2021, 03:00:00 PM", we should show when these are drawn like "1 second ago".

You can use Intl.RelativeTimeFormat.

Given a transaction hash like 0x9d4509c900053df30cb352ed3a6b17b1c61621b8ce99b497c790acaa62e28e9a display it as 0x9d45....8e9a and when clicked, open https://etherscan.io/tx/0x9d4509c900053df30cb352ed3a6b17b1c61621b8ce99b497c790acaa62e28e9a in a new tab.

All of the tests are failing, fix the tests.

The countdown doesn't work and on the landing page we always see the "lucky numbers can be drawn" text.