World Cup Draw UI
(Gradual Groups First)
each click adds a new team in a group, group by group
Group A
Group B
Group C
Group D
Group E
Group F
Group G
Group H
Group I
Group J
Group K
Group L
Challening parts
Just like in the previous version, the algorithm. Needed to add some states to make it work smooth. Dealing with mutations, avoiding manipulating the original data (pots), but making copies instead every time.
Things I learned here
My code was calling drawOneTeam function twice and I could not find where. Turns out, it happens because my function modifies state inside setState(). Apparently the double calling only happens in dev mode. The rule is to never mutate anything inside a setState updater.