How to add a legend to Google Maps with AGM

Question

Since the arrival of AGM v3.0.0-beta of https://github.com/SebastianM/angular-google-maps/ ( a popular repo) I am quite confused how one could add a legend or MapControl (preferably a legend) using this lib.

So far I have tried to "extend" the base class of AgmMapControl but I don't know how to set the HTML or how to use this via Angular.

Here is my map:

<agm-map *ngIf="activitiesMapData.length > 0"
             [mapTypeId]="user && user.settings ? user.settings.mapSettings.mapType : 'roadmap'"
             (mapTypeIdChange)="changeMapType($event)"
             [gestureHandling]="'cooperative'"
             [scrollwheel]="null"
             [tilt]="45"
             [controlSize]="32"
             [disableDefaultUI]="true"
             [styles]="getStyles(theme)">

I would like to get help on how to create a simple HTML based / Angular based Legend using AGM and add to my map.

Like it's proposed here:

https://developers.google.com/maps/documentation/javascript/adding-a-legend