Devlog 10

I have now finished the skeleton UI for the summary tab.

I originally ran into some issues because I had tried to make one table with one map and just change the data for it, but that went horribly wrong because it made the code so janky and I had to write a ton of spaghetti code for it. In the end, I decided to switch to this system instead, where there are 3 completely separate tables for each tab, that get rendered in conditionally.

{currentTab == 0 ? (
    <Tab1
        sorted={sorted}
        sortBy={sortBy}
        setSortBy={setSortBy}
        setSortDown={setSortDown}
        sortDown={sortDown}
        selected={selected}
    />
) : currentTab == 1 ? (
    <Tab2 teamsBelow={teamsBelow} />
) : (
    <Tab3 teamsAbove={teamsAbove} />
)}

This way allowed me to have more freedom and more organization with the code.

I also originally ran into an issue with my rendering system for picks. When a team would set their pick order, originally to preserve the order they had in mind, the site would check all teams in the picks array, and if they were below, they would render them in. This caused an issue where if a team changed ranks through a competition, the teams below would change, and some might not render, which caused a problem in that the indexes for the reordering were off, and it would reorder the ones at the top that were not visible to the user. In the end I fixed this by simply filtering out and deleting the ones that were no longer a valid pick.

updateSummary({
    picks: [
        ...summary.picks.filter((pick) => below.includes(pick)),
        ...below.filter((team) => !summary.picks.includes(team)),
    ],
});

My goals now are to get a start on the backend part so that the main structure of the site can be complete.

The tasks that would be left after that are:

• Polishing the summary page UI
• Making the mobile UI for the summary page
• Adding the new setting to set user’s team number by default so they don’t have to constantly set it from the tab
• Landing page improvements