responsive time tracking dashboard using sass

Community feedback

• 

  Paradox•330

  @TarestaPosted about 1 month ago

  Hello, great job there. The only thing that I can suggest for json is that maybe we can try to reduce some redundancy that exists in your javascript code. Instead of calling the fetch function for every button click, we can create a use the dailyReport function to handle the data that is displayed and maybe call that whenever the button is clicked. Here is a bit of an idea.

  function dailyReport(timeframe) {
    fetch(url)
      .then(response => response.json())
      .then(data => {
        current.forEach((element, index) => {
          const timeData = data[index].timeframes[timeframe];
          if (timeData) { // Check if data exists
            element.innerHTML = timeData.current + 'hrs';
            prev[index].innerHTML = getPreviousLabel(timeframe) + timeData.previous + 'hrs';
          } else {
            console.error(`Data not found for timeframe: ${timeframe} and index: ${index}`);
            element.innerHTML = "Data Not Available";
            prev[index].innerHTML = "";
          }
        });
      })
      .catch(error => {
        // ... (error handling as before)
      });
  }
  daily.addEventListener('click', () => dailyReport('daily'));
  monthly.addEventListener('click', () => dailyReport('monthly'));
  weekly.addEventListener('click', () => dailyReport('weekly'));
  
  window.addEventListener('load', () => dailyReport('weekly'));
  

  Otherwise, it was all god. Job well done!

  0