SF-3593 Show build executionData on project Serval admin page

[Nateowami]

This PR:

• Cleans up the lower portion of the Serval project admin page
• Adds warnings from Serval to the page
• Adds the raw Serval build to the page (so any properties added by Serval can be seen)
• Adds a JSON viewer component, and starts using it everywhere we render JSON

Here's what the warnings look like (you can only see them by hard-coding them; Serval hasn't shipped the warnings yet):

Here's what the bottom of the page ends up looking like, with detailed information moved into an accordion:

And here's a snippet of the JSON viewer:

...which also supports dark mode:

---

This change is 

[codecov]

Codecov Report

❌ Patch coverage is 53.70370% with 50 lines in your changes missing coverage. Please review.
✅ Project coverage is 82.20%. Comparing base (1f65cc9) to head (98302d4).
⚠️ Report is 1 commits behind head on master.

Files with missing lines	Patch %	Lines
...orge.Scripture/Controllers/MachineApiController.cs	0.00%	24 Missing ⚠️
...SIL.XForge.Scripture/Services/MachineApiService.cs	0.00%	18 Missing ⚠️
...slate/draft-generation/draft-generation.service.ts	0.00%	5 Missing ⚠️
.../serval-administration/serval-project.component.ts	0.00%	2 Missing ⚠️
...rc/app/shared/json-viewer/json-viewer.component.ts	98.30%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #3503      +/-   ##
==========================================
- Coverage   82.29%   82.20%   -0.09%     
==========================================
  Files         614      615       +1     
  Lines       36885    36986     +101     
  Branches     6046     6064      +18     
==========================================
+ Hits        30353    30403      +50     
- Misses       5635     5686      +51     
  Partials      897      897              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[pmachapman]

Looks good - just a comment on whether we need the new rawBuild endpoint or not.

@pmachapman reviewed 19 of 19 files at r1, all commit messages.
Reviewable status: all files reviewed, 1 unresolved discussion (waiting on @Nateowami)

---

src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation.service.ts line 142 at r1 (raw file):

      catchError(() => of(undefined))
    );
  }

I don't think you need this additional raw build API endpoint?

If you feed a build id directly into MachineApiController.GetBuildAsync() (i.e. translation/builds/id:${buildId}?pretranslate=true), then the build is returned directly from Serval.

You should be able to change this function to something like:

  getBuild(buildId: string): Observable<Object | undefined> {
    if (!this.onlineStatusService.isOnline) {
      return of(undefined);
    }
    return this.httpClient.get<Object>(`translation/builds/id:${buildId}?pretranslate=true`).pipe(
      map(res => res.data),
      catchError(() => of(undefined))
    );
  }

Code quote:

  getRawBuild(buildId: string): Observable<Object | undefined> {
    if (!this.onlineStatusService.isOnline) {
      return of(undefined);
    }
    return this.httpClient.get<Object>(`translation/rawBuilds/id:${buildId}?pretranslate=true`).pipe(
      map(res => res.data),
      catchError(() => of(undefined))
    );
  }

[pmachapman]

OK I see why you did the raw build endpoint. Just one comment about a better endpoint URL for it.

Reviewable status: all files reviewed, 1 unresolved discussion (waiting on @Nateowami)

---

src/SIL.XForge.Scripture/ClientApp/src/app/translate/draft-generation/draft-generation.service.ts line 142 at r1 (raw file):

Previously, pmachapman (Peter Chapman) wrote…

I don't think you need this additional raw build API endpoint?

If you feed a build id directly into MachineApiController.GetBuildAsync() (i.e. translation/builds/id:${buildId}?pretranslate=true), then the build is returned directly from Serval.

You should be able to change this function to something like:

  getBuild(buildId: string): Observable<Object | undefined> {
    if (!this.onlineStatusService.isOnline) {
      return of(undefined);
    }
    return this.httpClient.get<Object>(`translation/builds/id:${buildId}?pretranslate=true`).pipe(
      map(res => res.data),
      catchError(() => of(undefined))
    );
  }

Oh, I see now - you wanted to retrieve the build but not with the DTO modifications. I think I was thrown off by the raw builds moniker. Retracted!

---

src/SIL.XForge.Scripture/Models/MachineApi.cs line 13 at r1 (raw file):

    public const string StartBuild = "translation/builds";
    public const string GetBuild = "translation/builds/id:{sfProjectId}.{buildId?}";
    public const string GetRawBuild = "translation/rawBuilds/id:{sfProjectId}.{buildId}";

I think this might be clearer if the endpoint was named something like:

public const string GetRawBuild = "translation/builds/id:{sfProjectId}.{buildId}/raw";

Code quote:

public const string GetRawBuild = "translation/rawBuilds/id:{sfProjectId}.{buildId}";

[Nateowami]

Reviewable status: 17 of 19 files reviewed, 1 unresolved discussion (waiting on @pmachapman)

---

src/SIL.XForge.Scripture/Models/MachineApi.cs line 13 at r1 (raw file):

Previously, pmachapman (Peter Chapman) wrote…

I think this might be clearer if the endpoint was named something like:

public const string GetRawBuild = "translation/builds/id:{sfProjectId}.{buildId}/raw";

Done.

[pmachapman]

@pmachapman reviewed 2 of 2 files at r2, all commit messages.
Reviewable status: complete! all files reviewed, all discussions resolved (waiting on @Nateowami)