[PM-4747] List members under each group when doing test sync (#507)

* Add user list under each group when doing test sync

* run prettier and lint, replace '@' with @

jslib/common/src/misc/utils.ts

@@ -3,7 +3,6 @@ import { I18nService } from "../abstractions/i18n.service";
 
 import * as tldjs from "tldjs";
 
-
 const nodeURL = typeof window === "undefined" ? require("url") : null;
 
 export class Utils {

src/app/tabs/dashboard.component.html

@@ -105,6 +105,11 @@
             <li *ngFor="let g of simGroups" title="{{ g.referenceId }}">
               <i class="bwi bwi-li bwi-sitemap"></i>
               {{ g.displayName }}
+              <ul class="small" *ngIf="g.users && g.users.length">
+                <li *ngFor="let u of g.users" title="{{ u.referenceId }}">
+                  {{ u.displayName }}
+                </li>
+              </ul>
             </li>
           </ul>
           <p *ngIf="!simGroups || !simGroups.length">{{ "noGroups" | i18n }}</p>

src/app/tabs/settings.component.html

@@ -419,7 +419,7 @@
               name="AdminUser"
               [(ngModel)]="gsuite.adminUser"
             />
-            <small class="text-muted form-text">{{ "ex" | i18n }} admin@company.com</small>
+            <small class="text-muted form-text">{{ "ex" | i18n }} admin&#64;company.com</small>
           </div>
           <div class="form-group">
             <label for="customerId">{{ "customerId" | i18n }}</label>
@@ -596,7 +596,7 @@
                 name="EmailSuffix"
                 [(ngModel)]="sync.emailSuffix"
               />
-              <small class="text-muted form-text">{{ "ex" | i18n }} @company.com</small>
+              <small class="text-muted form-text">{{ "ex" | i18n }} &#64;company.com</small>
             </div>
           </div>
         </div>
@@ -628,13 +628,13 @@
             <small
               class="text-muted form-text"
               *ngIf="directory === directoryType.AzureActiveDirectory"
-              >{{ "ex" | i18n }} exclude:joe@company.com</small
+              >{{ "ex" | i18n }} exclude:joe&#64;company.com</small
             >
             <small class="text-muted form-text" *ngIf="directory === directoryType.Okta"
-              >{{ "ex" | i18n }} exclude:joe@company.com | profile.firstName eq "John"</small
+              >{{ "ex" | i18n }} exclude:joe&#64;company.com | profile.firstName eq "John"</small
             >
             <small class="text-muted form-text" *ngIf="directory === directoryType.GSuite"
-              >{{ "ex" | i18n }} exclude:joe@company.com | orgName=Engineering</small
+              >{{ "ex" | i18n }} exclude:joe&#64;company.com | orgName=Engineering</small
             >
           </div>
           <div class="form-group" [hidden]="directory != directoryType.Ldap">

src/models/groupEntry.ts

@@ -1,9 +1,11 @@
 import { Entry } from "./entry";
+import { UserEntry } from "./userEntry";
 
 export class GroupEntry extends Entry {
   name: string;
   userMemberExternalIds = new Set<string>();
   groupMemberReferenceIds = new Set<string>();
+  users: UserEntry[] = [];
 
   get displayName(): string {
     if (this.name == null) {