Add API status to the new dashboard

[Kevan-Y]

Issue This PR Addresses

Fixes #2418

Type of Change

• Bugfix: Change which fixes an issue
• New Feature: Change which adds functionality
• Documentation Update: Change which improves documentation
• UI: Change which improves UI

Description

• Add API route to get all health information
• Update dashboard to display the status information
• Add function to fetch and display to dashboard

rec.mp4

Checklist

• Quality: This PR builds and passes our npm test and works locally
• Tests: This PR includes thorough tests or an explanation of why it does not
• Screenshots: This PR includes screenshots or GIFs of the changes made or an explanation of why it does not (if applicable)
• Documentation: This PR includes updated/added documentation to user exposed functionality or configuration variables are added/changed or an explanation of why it does not(if applicable)

[gitpod-io]

[humphd]

On GitPod I get:

It's doing:

The problem is in:

export default function getAllServicesStatus() {
  fetch('/status')

This may be a problem specific to GitPod's URL/port layout, but I suspect that this isn't quite right yet.

[Kevan-Y]

On GitPod I get:

It's doing:

The problem is in:

export default function getAllServicesStatus() {
  fetch('/status')

This may be a problem specific to GitPod's URL/port layout, but I suspect that this isn't quite right yet.

Notice in GitPods is not running the server which allows the API to fetch all status to work.
In src/api/status/src/server.js

service.router.get('/status', (req, res) => {
 check()
   .then((status) => {
     // This status response shouldn't be cached (we need current status info)
     res.set('Cache-Control', 'no-store, max-age=0');
     return res.json(status);
   })
   .catch((err) => res.status(500).json({ error: err.message }));
});

Could it also be this issue?

[humphd]

How is the status page showing up if it's not running? It gets hosted by that server.

[humphd]

cc @DukeManh for gitpod wisdom

[DukeManh]

It works on Gitpod when I run npm run dev from src/api/status.

I think the variable naming can be better

[HyperTHD]

Ignore the approval, misclick. Need to fix what I mentioned above

[Andrewnt219]

Nice enhancement, bonus for being responsive as well 🙌.

[humphd]

@Kevan-Y can you rebase to pick up the change to src/api/status/public/index.html?

[humphd]

I love this!

Can we only show the services for the current deployment (i.e., staging or production, but not both at once)? I think if you are looking at the status service on staging, we should show you staging only; same for prod.

[Kevan-Y]

I love this!

Can we only show the services for the current deployment (i.e., staging or production, but not both at once)? I think if you are looking at the status service on staging, we should show you staging only; same for prod.

That possible, I just looked at the env.local what API_HOST for?
Can we use this to check if it's production URL, or staging URL?

[humphd]

You should be able to use the URL the page is loaded on to figure it out, i.e., https://dev.api.telescope.cdot.systems/v1/status (staging) vs https://api.telescope.cdot.systems/v1/status (production). We can't access env vars in the dashboard.

[Kevan-Y]

You should be able to use the URL the page is loaded on to figure it out, i.e., https://dev.api.telescope.cdot.systems/v1/status (staging) vs https://api.telescope.cdot.systems/v1/status (production). We can't access env vars in the dashboard.

Using URL will work but not on Gitpot since they are using another URL.

[humphd]

When we fix #2553 we can do this server side.

[Kevan-Y]

Ok sure, I will leave it like that for now and when working on #2553 I will do it to show only staging/production

[humphd]

This is failing prettier

[HyperTHD]

How can I test this PR to make sure it works? The services seem to not be able to appear despite running. Tried on both gitpod and locally by pulling this PR @Kevan-Y

[Kevan-Y]

@HyperTHD , to run it, you will have to go to src\api\status and do a npm run dev

[Andrewnt219]

Well done👍.