Again it's outstanding what you achieve in such a short amount of time. It works really well
Some review hints for improvement:
- Choosing a duration number: you always get all units up the millisenconds shown. I think it would make sense to take the smallest unit from baseline and target and depict only up to one unit less than that.
- Choosing a duration number: set the baseline value above the target value, then the small line on the left side of the baseline number is still dark blue although it should be light blue as well.
- We need to style the progress bar a bit better. For me it's hard to recognize that this is actually a progress bar. Let's create a ticket for Franz.
- Choosing a duration number: putting the report on a dashboard and making the report smaller will cause the number to overflow the progress bar. Maybe we should depict a ... if the text does not fit completely.
- It could be nice to see the procentage of target value that has been reached. However, I don't know how to depict that. Should we create a ticket for that?
- Number.js: I would extract the line typeof min === 'object' to a function called isDurationValue to make it a bit more transparent what the comparison is for.
- NumberTargetValueModal.js: Again I would replace every comparison typeof foo === 'object' replace with a function called isDurationValue.
- NumberTargetValueModal.js: I know you gonna hate me for this remark, but: I think it would make sense to use Higher Order Components here - one duration component and one frequency component. Then we can get rid of all the if else statements in general. But maybe it doesn't work as I imagine it. Let's discuss this.