Rendering build duration

[tpmai22]

Fixed #2542

• Delete animated-indication.css
• Delete duplicate result and duration column in builds.hbs
• Delete datetime-calculator.js and it usage
• Loading animation added
• Adding progress column and showing build progressing animation

Co-authored-by: Tengzhen tengzhenzhao@gmail.com

To test the feature locally, do the following:

• Change autodeploymentUrl in src\api\status\public\js\build-log\check-build-status.js

const autodeploymentUrl = (path) => `//dev.telescope.cdot.systems/deploy${path}`;  

• Allow all connectSrc in src\api\status\src\server.js

connectSrc: ["'self'", "*"]

To trigger a build manually trigger redeliver one of the build which merged to refs/heads/master

Issue This PR Addresses

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

Prefer to #2542

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]

This is going to need to change based on #2653, where I'm changing a bunch of the code around. You might want to rebase on that PR's branch and update your code to use what I have there already. Then when it lands, you can rebase on master.

[tpmai22]

@Andrewnt219 @humphd would you guys mind to take a look at datetime-calculator.js cause I did not see any usage of it even though I did refactor it

[Andrewnt219]

Don't worry about calculating the duration, it has already been done.

EDIT: This PR will be merged after #2653, so it's a good idea to accommodate changes from there.

[humphd]

You should rebase this to get the changes I just landed for caching build logs.

[Andrewnt219]

Can you provide screenshots or videos in the PR's description? These are helpful for reviewing and documenting PR changes.

[tpmai22]

@humphd Hitting the /deploy/status gives me 404. I think the autodeployment url for development is wrong. Here is my shared workspace, can you confirm it?
https://tpmai22-telescope-5ekqsq7bamt.ws-us27.gitpod.io/

[tpmai22]

404 on both production and dev.

On production

This might be the line of code which broke production

telescope/src/api/status/public/js/build-log/check-build-status.js

Line 5 in 92af23e

`//${window.location.hostname.replace('.api', '')}/deploy${path}`;

It might need to change to replace replace('.api', '') to replace('api.', '')

[humphd]

Yeah, that's not going to work in gitpod I guess? I'm not sure if the autodeployment server gets run in gitpod, it would have to be started manually, it's not in a container.

[tpmai22]

Any guidance to run it. I went into tools\autodeployment then pnpm start but it say something about secrect

[Andrewnt219]

So far, there's no way to locally start the autodeployment. In the previous PRs (see test description of #2582 for example), the workaround is pointing to the dev URL instead of the local.

So the only way to test it is to get everything ready and trigger the build manually (by Joshua or David). In your case, I believe the logic is doable to implement without checking the result all the time.

You said the build didn't work, can you elaborate more on what was not working?

• Did the build log (terminal) show any text about the current build?
• Did the build header show the latest commit info, duration, and status?

[tpmai22]

I did talk with David and I believe that was because of gitpod set up I will try to run it locally and see

[tpmai22]

I learn how to test it locally in #2582 and here is the result. Testing procedure provided in the PR description

Telescope.Build.log.-.Google.Chrome.2022-01-24.20-35-29.mp4

[Andrewnt219]

Awesome! Just one UI fix, what I meant was having the text next to the icon (to indicate what the icon means), not in a separate column.

I'd love to test this out locally as well, but the redeliver link in PR description is broken.

[tpmai22]

@Andrewnt219 you can go to setting\webhook and resend one of the build that merged to master

[Andrewnt219]

The settings is probably only available to OSD700 students. I can review them and someone else can test it.

[tpmai22]

@Andrewnt219 After talking on Slack with Andrew, we decide to delete the text part and keep only the loading animation in the build-header

[Andrewnt219]

Only a small typo left and it's good to go.

[Andrewnt219]

Awesome, thanks for picking up this PR.

Need someone from OSD700 to follow the PR's test plan and test this locally.

[tpmai22]

This will also close #2562 if it got approved