I see the count of passed / cancelled / failed builds, as exported by the Jenkins API

[robmoore-i]

• [x] In the React frontend, I fetch the data from the Flask backend
• [x] Fetch the data from Jenkins in the backend
• [x] Serve the fetched Jenkins data from Flask
• [x] Render the data in the UI

[robmoore-i]

Example of having swappable dependencies

Things you can google:

• Liskov substitution (SOLID principles)
• Dependency injection

function MyComponent => {
  let jenkinsAdaptor = new JenkinsAdaptor()

  render() {
    let myData = jenkinsAdaptor.getTestCounts()
    <TestCountsChart data={myData}>...</TestCountsChart>
  }
}

class JenkinsAdaptor {

  // Returns a JSON object
  getTestCounts() {
    // In the real implementation, I make a HTTP call to the backend
    // But! I'm just testing. So I'll return some constant data.
    return {
      "successes": 5,
      "failures": 3,
      "cancelled": 1,
      "count": 9,
      "avgTimeSeconds": 10,
    }
  }
}