Skip to content

Commit 2fa0dff

Browse files
cryptalithcryptalith
committed
lmendoza/jun-2025-multiple-changes
1 parent 8672684 commit 2fa0dff

13 files changed

Lines changed: 201 additions & 60 deletions

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.0.0",
44
"scripts": {
55
"start-local": "npm run build-runtime-env && ng serve --disable-host-check --host 0.0.0.0",
6-
"start": "npm run build-runtime-env && ng serve --configuration=local-qa --host 0.0.0.0",
6+
"start": "npm run build-runtime-env && ng serve --configuration=local-qa --host 0.0.0.0 --verbose",
77
"start-sandbox": "ng serve --configuration=local-sandbox --host 0.0.0.0",
88
"start:en": "ng serve --configuration=local-qa-en --disable-host-check",
99
"start:ar": "ng serve --configuration=local-qa-ar --disable-host-check",

‎src/app/core/login-interstitials-manager/login-main-interstitials-manager.service.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,6 +36,11 @@ export class LoginMainInterstitialsManagerService {
3636
LoginDomainInterstitialManagerService: LoginDomainInterstitialManagerService,
3737
LoginAffiliationInterstitialManagerService: LoginAffiliationInterstitialManagerService
3838
) {
39+
// Delare here all the interstitial services.
40+
// This are the entry points to add new interstitials.
41+
// They should be added in the order they should be checked.
42+
// The first one that returns a component or a dialog subscription will be used.
43+
// The rest will be ignored.
3944
this.interstitialServices = [
4045
LoginDomainInterstitialManagerService,
4146
LoginAffiliationInterstitialManagerService,

‎src/app/core/observability-events/observability-events.service.ts‎

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
import { Inject, Injectable } from '@angular/core'
22
import { WINDOW } from 'src/app/cdk/window'
33

4-
export type JourneyType = 'orcid_registration' | 'orcid_update_emails'
4+
export type JourneyType =
5+
| 'orcid_registration'
6+
| 'orcid_update_emails'
7+
| 'orcid_with_notifications'
8+
| 'orcid_without_notifications'
59
@Injectable({
610
providedIn: 'root',
711
})
@@ -58,7 +62,7 @@ export class CustomEventService {
5862
eventName,
5963
elapsedTime,
6064
}
61-
if (typeof (this.window as any)?.addPageAction === 'function') {
65+
if (typeof (this.window as any).newrelic?.addPageAction === 'function') {
6266
;(this.window as any).newrelic.addPageAction(journeyType, eventAttributes)
6367
}
6468
// Send the custom event to New Relic
@@ -94,8 +98,8 @@ export class CustomEventService {
9498
}
9599

96100
// Send the final custom event to New Relic
97-
if (typeof (this.window as any)?.addPageAction === 'function') {
98-
;(this.window as any).addPageAction(journeyType, finalAttributes)
101+
if (typeof (this.window as any).newrelic?.addPageAction === 'function') {
102+
;(this.window as any).newrelic?.addPageAction(journeyType, finalAttributes)
99103
}
100104

101105
// Clean up the journey data

‎src/app/layout/header/header.component.scss‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -195,3 +195,7 @@ nav {
195195
app-search {
196196
overflow: hidden;
197197
}
198+
199+
app-user-menu {
200+
display: flex ;
201+
}

‎src/app/layout/layout.module.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import { BannerModule } from '../cdk/banner/banner.module'
2121
import { MaintenanceMessageComponent } from './maintenance-message/maintenance-message.component'
2222
import { MatDividerModule } from '@angular/material/divider'
2323
import { A11yLinkModule } from '../cdk/a11y-link/a11y-link.module'
24+
import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip'
2425

2526
@NgModule({
2627
imports: [
@@ -37,6 +38,7 @@ import { A11yLinkModule } from '../cdk/a11y-link/a11y-link.module'
3738
BannerModule,
3839
MatDividerModule,
3940
A11yLinkModule,
41+
MatTooltipModule,
4042
],
4143
declarations: [
4244
HeaderComponent,

‎src/app/layout/search/search.component.scss‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -131,4 +131,6 @@ button {
131131

132132
app-user-menu {
133133
overflow: hidden;
134+
// display: flex;
134135
}
136+

‎src/app/layout/user-menu/user-menu.component.html‎

Lines changed: 36 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,36 @@
2929
<ng-container i18n="@@header.signin">Sign in</ng-container
3030
>&nbsp;/&nbsp;<ng-container i18n="@@header.register">Register</ng-container>
3131
</button>
32+
<button
33+
mat-stroked-button
34+
class="user-menu-button"
35+
(click)="goto('inbox', 'fromHeaderButton')"
36+
[attr.aria-label]="labelInbox"
37+
id="cy-inbox-button"
38+
*ngIf="userInfo"
39+
[matTooltip]="
40+
inboxUnread > 0 ? notificationTooltipActive : notificationTooltip
41+
"
42+
[attr.aria-label]="
43+
inboxUnread > 0 ? notificationTooltipActive : notificationTooltip
44+
"
45+
>
46+
<mat-icon
47+
matBadgeSize="small"
48+
matBadgeColor="warn"
49+
class="material-icons-outlined"
50+
><img
51+
*ngIf="inboxUnread === 0"
52+
src="./assets/vectors/notification-button.svg"
53+
alt=""
54+
/>
55+
<img
56+
*ngIf="inboxUnread > 0"
57+
src="./assets/vectors/notification-button-active.svg"
58+
alt=""
59+
/>
60+
</mat-icon>
61+
</button>
3262
</section>
3363
<mat-menu #menu="matMenu" class="user-menu" id="cy-user-menu">
3464
<button
@@ -47,8 +77,11 @@
4777
</div>
4878
</div>
4979
</button>
50-
<button mat-menu-item (click)="goto('inbox')" id="cy-inbox">
51-
<mat-icon>inbox</mat-icon>
80+
<button mat-menu-item (click)="goto('inbox', 'fromMenuButton')" id="cy-inbox">
81+
<mat-icon *ngIf="inboxUnread === 0">inbox</mat-icon>
82+
<mat-icon *ngIf="inboxUnread > 0"
83+
><img src="./assets/vectors/notification-button-active.svg"
84+
/></mat-icon>
5285
<span i18n="@@workspace.notifications">Inbox</span>
5386
({{ inboxUnread }})
5487
</button>
@@ -133,3 +166,4 @@
133166
<span i18n="@@ngOrcid.logout">Logout</span>
134167
</button>
135168
</mat-menu>
169+
<!-- Beel for Inbox-->

‎src/app/layout/user-menu/user-menu.component.scss‎

Lines changed: 14 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
section {
2+
display: flex;
3+
flex-wrap: nowrap;
4+
}
5+
16
.main-button {
27
height: auto;
38
.main-button-container {
@@ -9,7 +14,7 @@
914
flex-wrap: nowrap;
1015
max-width: 248px;
1116
overflow: hidden;
12-
text-overflow: ellipsis;
17+
text-overflow: ellipsis;app-user-men
1318

1419
img {
1520
height: 36px;
@@ -37,7 +42,6 @@
3742
:host {
3843
.user-menu-button {
3944
max-width: 100%;
40-
padding: 0 32px;
4145
.columns-4 & {
4246
padding: 0;
4347
}
@@ -69,7 +73,14 @@
6973

7074
span.name-text-container {
7175
overflow: hidden;
72-
width: calc(100% - 59px);
76+
max-width: calc(102% - 55px);
7377
display: inline-block;
7478
text-overflow: ellipsis;
79+
width: fit-content;
7580
}
81+
82+
[mat-stroked-button] {
83+
min-width: 40px;
84+
padding: 0;
85+
margin: 0 16px;
86+
}

‎src/app/layout/user-menu/user-menu.component.ts‎

Lines changed: 21 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import { ApplicationRoutes } from 'src/app/constants'
99
import { TogglzService } from 'src/app/core/togglz/togglz.service'
1010
import { InboxService } from '../../core/inbox/inbox.service'
1111
import { first } from 'rxjs/operators'
12+
import { CustomEventService } from 'src/app/core/observability-events/observability-events.service'
1213

1314
@Component({
1415
selector: 'app-user-menu',
@@ -25,16 +26,21 @@ export class UserMenuComponent implements OnInit {
2526
platform: PlatformInfo
2627
labelSigninRegister = $localize`:@@layout.ariaLabelSigninRegister:Sign in to ORCID or register for your ORCID iD`
2728
labelUserMenu = $localize`:@@layout.ariaLabelUserMenu:User menu`
29+
labelInbox = $localize`:@@layout.ariaLabelInbox:Inbox`
30+
notificationTooltipActive = $localize`:@@layout.notificationTooltip:You have unread notifications`
31+
notificationTooltip = $localize`:@@layout.notificationTooltipInactive:Notifications inbox`
2832
isAccountDelegate: boolean
2933
inboxUnread = 0
34+
userJourney!: 'orcid_with_notifications' | 'orcid_without_notifications'
3035

3136
constructor(
3237
private _router: Router,
3338
private _userInfo: UserService,
3439
@Inject(WINDOW) private window: Window,
3540
_platform: PlatformInfoService,
3641
private _inboxService: InboxService,
37-
private _togglz: TogglzService
42+
private _togglz: TogglzService,
43+
private observabilityEventService: CustomEventService
3844
) {
3945
_userInfo.getUserSession().subscribe((data) => {
4046
if (data.loggedIn) {
@@ -56,15 +62,27 @@ export class UserMenuComponent implements OnInit {
5662
this._inboxService
5763
.retrieveUnreadCount()
5864
.pipe(first())
59-
.subscribe((inboxUnread) => (this.inboxUnread = inboxUnread))
65+
.subscribe((inboxUnread) => {
66+
;(this.userJourney =
67+
inboxUnread > 0
68+
? 'orcid_with_notifications'
69+
: 'orcid_without_notifications'),
70+
this.observabilityEventService.startJourney(
71+
this.userJourney,
72+
73+
{ inboxUnread }
74+
)
75+
this.inboxUnread = inboxUnread
76+
})
6077
}
6178

62-
goto(url) {
79+
goto(url, from?: string) {
6380
if (url === 'my-orcid') {
6481
this._router.navigate([ApplicationRoutes.myOrcid])
6582
} else if (url === 'signin') {
6683
this._router.navigate([ApplicationRoutes.signin])
6784
} else if (url === 'inbox') {
85+
this.observabilityEventService.recordEvent(this.userJourney, from)
6886
this._router.navigate([ApplicationRoutes.inbox])
6987
} else if (url === 'account') {
7088
this._router.navigate([ApplicationRoutes.account])

‎src/assets/vectors/notification-button-active.svg‎

Lines changed: 3 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)