Time Tracking Dashboard using React

Community feedback

• 

  Alejandro25A•220

  @Alejandro25ARPosted over 2 years ago

  Hi @tylermaksymiw. You can use an object to avoid the if, so you will have a much more scalable and clear code. series as follows:

  const convertTimeframe = {
    Daily: 'Yesterday',
    Weekly: 'Last week',
    Monthly: 'Last month'
  }
  let returnValue = convertTimeframe[props.timeframe];
  

  And that would be all, I hope it helps you. Great job, keep practicing.

  Marked as helpful

  2

  ---

  

  Tyler•330

  @tylermaksPosted over 2 years ago

  @Alejandro25AR Thank you, this is really helpful! I updated my code with a nested ternary operator (see comment above). That said, I really like how this solution is scaleable and will implement it in my next challenge.

  Thanks again! -Tyler

  0
• 

  David•8,000

  @DavidMorgadePosted over 2 years ago

  Hello man congrats on finishing the challenge!

  You can also use a ternary operator instead of nested if.

  const convertTimeFrame = () => {
        const timeFrame = props.timeframe === 'Daily' ? 'Yesterday' : props.timeframe === 'Weekly' ? 'Last week' : 'Last month';
       return timeFrame;
  }
  

  Other thing that you could do is to destructure your props in the tracker component, to get something like this:

  function Tracker({timeframe, title, current}) {
    /* Your component */
  }
  

  I would also recommend you to divide your App in more components, maybe in this project is not that necessary but it can be a good practice for the future!

  Hope my feedback helped you!

  Marked as helpful

  1

  ---

  

  Tyler•330

  @tylermaksPosted over 2 years ago

  @DavidMorgade Thank you for the feedback, I really appreciate it! I updated the if statement with a ternary operator - great to know that I can nest multiple criteria like that.

  const convertTimeFrame = props.timeframe === 'Daily' ? 'Yesterday' : props.timeframe === 'Weekly' ? 'Last week' : 'Last month';
  

  Also thank you for the comment about using more components. I was unsure how big/small a component should be, so moving forward I'll definitely keep this in mind.

  Thanks again! -Tyler

  0