I can see the end is neigh we did were given a one week extension due to the fact that the scope of the project was a bit bigger than the alotted time allowed. This week I implemented the chunked progress tracker and fixed some small bugs that we ran into with the link login.

https://github.com/Lambda-School-Labs/labs10-cleaner-tool/pull/43 https://github.com/Lambda-School-Labs/labs10-cleaner-tool/pull/52 https://github.com/Lambda-School-Labs/labs10-cleaner-tool/pull/58

I'm going to go into detail on the cunked progress pull which would be pull 58. I did some fun stuff with this one on the frontend stuff I really tried hard to make my components very independent. Basically the way it work is that it takes in a before, during, and after checklist. It then runs the checklists through these two functions to generate a percentage complete.

Once I had done that I ran it through a sorting function to ensure that the completed tasks come first in the list. The way the function works is a tiny bit convoluted since I was trying to avoid mutations. Basically I created a reducer (Not sure if that's what it is but it's the closest concept I could think of) that I pass to the sort array method the way this works is that in sort if you pass it a function it moves and item before or after another item based on whether that items returns -1 or 1 since the completion status is represented by a 1 or 0 this was as simple as checking for less than or greater than.

And here's the meat of the component. So there are a couple interesting things going on here. First off on line 1. That little bit of math took me much longer than I would like to admit it also didn't help that prettier kept removing my parenthesis which kept screwing up my order of operations.

Basically the way that the component works is that it maps over the before and during list creating an li for each task item. Those items are then styled based on whether they are complete or not.

Just to give you some context here is what the styled component looks like. Basically it takes in the props and then either colors the chunk as light blue and if it's incomplete it adds opacity that was a fun little thing to figure out and I quite like the effect.