Build backend data support for front end design

Problem/Motivation

Now that the designs are almost finalized, the data support for each component in the design needs to be setup and passed through to the front end.

User interface changes

Add a refresh timeout option onto status page configuration forms to allow expiring the cached values on the status page on a regular basis. This cached value should be a select list field as follows:

• Label
  • Historical Data Time Limit
• Values
  • Interval select
    • 7 days
    • 14 days
    • 30 days
    • 60 days
    • 120 days
• Description
  • Select how far back the system should show when displaying historical incident data.

Data model changes

Make the following data structure available to the front end for use when creating the markup for the status page.

{
  "header": {
    "title": "Status Page Title",
    "menu": [
      {
        "title": "Dashboard",
        "url": "path to status page"
      },
      {
        "title": "Issues",
        "url": "path to issues page"
      }
    ],
    "status": "Healthy", // Healthy, Experiencing an issue, or experiencing downtime.
    "last_checked": "Since {date}"
  },
  "content": {
    "timeline": {
      "title": "History",
      "timespan": "Past XX days/hours/etc", // Pulled from system monitor log truncation value.
      "statuses": {
        "outage": "Downtime",
        "issue": "Issue",
        "healthy": "Healthy"
      },
      "date_span": {
        "start": "start date",
        "end": "end date"
      },
      "events": [ // Only events that are non-healthy and part of montiors that are tracked by the status page
        {
          "title": "title of issue",
          "url": "link to issue page",
          "reported_date": "last reported date",
          "resolved_date": "next OK reported date after reported outage"
        },
        {
          "title": "title of issue",
          "url": "link to issue page",
          "reported_date": "last reported date",
          "resolved_date": "next OK reported date after reported outage"
        },
        {
          "title": "title of issue",
          "url": "link to issue page",
          "reported_date": "last reported date",
          "resolved_date": "next OK reported date after reported outage"
        }
      ]
    },
    "cards": [ // monitors tracked by the status page that are active.
      {
        "title": "monitor name",
        "image": "monitor icon",
        "status": "overall status of the monitor",
        "detail": {
          "description": "description",
          "tasks": [
            {
              "title": "task name",
              "status": "task status based on system monitor status"
            },
            {
              "title": "task name",
              "status": "task status based on system monitor status"
            }
          ]
        }
      },
      {
        "title": "monitor name",
        "image": "monitor icon",
        "status": "overall status of the monitor",
        "detail": {
          "description": "description",
          "tasks": [
            {
              "title": "task name",
              "status": "task status"
            },
            {
              "title": "task name",
              "status": "task status"
            }
          ]
        }
      }
    ],
    "history": {
      "title": "Issue History",
      "issues": [
        {
          "title": "title",
          "description": "description",
          "status": "Resolved",
          "date": "last updated date",
          "url": "link to issue page"
        },
        {
          "title": "title",
          "description": "description",
          "status": "Resolved",
          "date": "last updated date",
          "url": "link to issue page"
        }
      ],
      "url": "link to issue history page"
    }
  },
  "footer": {
    "logo": "path to logo",
    "menu": [
      {
        "title": "link title",
        "url": "path to link"
      },
      {
        "title": "link title",
        "url": "path to link"
      }
    ],
    "copyright": "copyright text" // Appended like so: "Copyright (c) {auto_year} {copyright}
  }
}