[SG-1030] [Defect] - Difference in Default Color (#4645)

* fix: use id in web

* fix: adjust logic for org name badge to use id

apps/web/src/app/layouts/navbar.component.html

@@ -47,7 +47,12 @@
           [bitMenuTriggerFor]="accountMenu"
           class="tw-border-0 tw-bg-transparent tw-text-alt2 tw-opacity-70 hover:tw-opacity-90"
         >
-          <dynamic-avatar [text]="name" size="xsmall" aria-hidden="true"></dynamic-avatar>
+          <dynamic-avatar
+            [text]="name"
+            [id]="userId"
+            size="xsmall"
+            aria-hidden="true"
+          ></dynamic-avatar>
           <i class="bwi bwi-caret-down bwi-sm" aria-hidden="true"></i>
         </button>
         <bit-menu class="dropdown-menu" #accountMenu>
@@ -57,7 +62,7 @@
               *ngIf="name"
               appStopProp
             >
-              <dynamic-avatar [text]="name" size="small"></dynamic-avatar>
+              <dynamic-avatar [text]="name" [id]="userId" size="small"></dynamic-avatar>
               <div class="tw-ml-2 tw-block tw-overflow-hidden tw-whitespace-nowrap">
                 <span>{{ "loggedInAs" | i18n }}</span>
                 <small class="tw-block tw-overflow-hidden tw-whitespace-nowrap tw-text-muted">{{

apps/web/src/app/settings/profile.component.html

@@ -33,7 +33,8 @@
     </div>
     <div class="col-6">
       <div class="mb-3">
-        <dynamic-avatar text="{{ profile | userName }}" [size]="'large'"> </dynamic-avatar>
+        <dynamic-avatar text="{{ profile | userName }}" [id]="profile.id" [size]="'large'">
+        </dynamic-avatar>
         <button
           type="button"
           class="btn btn-outline-secondary tw-ml-3.5"