World Cup Draw UI (Instant)

each click generates a new draw of all groups

Challening parts

Writing the algorithm for the draw. Making sure teams get drawn from correct pots in correct order. And then making sure teams do not repeat. Also, I started with the UI and then went on to figure out the mechanism when I already had everything split into multiple components. Was hard on my brain visually to see what happens where. I ended up writing the algorithm from scratch in a seperate doc and then added the code into drawgenerator component once I verified my algorithm works.

Things I learned here

map within a map can be done as long as each map is wrapped in its own div