Merge branch 'main' into lmendoza/9313-qa-notification-email-address-…

…in-account-settings-doesnt-update-when-theres-a-change
ORCID · Jul 29, 2024 · 17da260 · 17da260
2 parents 38a1287 + c3679f7
commit 17da260
Show file tree

Hide file tree

Showing 19 changed files with 114 additions and 33 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,42 @@
+## v2.102.17 - 2024-07-25
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.16...v2.102.17)
+
+- [#2316](https://github.com/ORCID/orcid-angular/pull/2316): fix disabled email notification dropdown styling
+- [#2317](https://github.com/ORCID/orcid-angular/pull/2317): Thank you for registering warning should only show after registration
+
+## v2.102.16 - 2024-07-25
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.15...v2.102.16)
+
+- [#2314](https://github.com/ORCID/orcid-angular/pull/2314): Email modal aria tweaks
+
+## v2.102.15 - 2024-07-25
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.14...v2.102.15)
+
+- [#2315](https://github.com/ORCID/orcid-angular/pull/2315): fix email modal error message wrapping
+
+## v2.102.14 - 2024-07-24
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.13...v2.102.14)
+
+## v2.102.13 - 2024-07-24
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.12...v2.102.13)
+
+## v2.102.12 - 2024-07-24
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.11...v2.102.12)
+
+## v2.102.11 - 2024-07-24
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.10...v2.102.11)
+
+## v2.102.10 - 2024-07-24
+
+[Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.9...v2.102.10)
+
 ## v2.102.9 - 2024-07-24
 
 [Full Changelog](https://github.com/ORCID/orcid-angular/compare/v2.102.8...v2.102.9)

diff --git a/src/app/cdk/side-bar/modals/modal-email/modal-email.component.html b/src/app/cdk/side-bar/modals/modal-email/modal-email.component.html
@@ -79,20 +79,22 @@ <h2 class="orc-font-body-large" i18n="@@side-bar.emailAddressesUppercase">
               >
                 <input
                   matInput
+                  #emailInput
                   formControlName="email"
                   type="email"
                   appTrim
-                  [attr.aria-label]="ariaLabelPrimaryEmail"
+                  [attr.aria-label]="
+                    email.putCode.startsWith('new')
+                      ? ariaLabelNewEmailAddress
+                      : ariaLabelEmailAddress + ' ' + email.value
+                  "
                 />
               </mat-form-field>
               <div
                 *ngIf="showEmailAsVerified(email.putCode)"
                 class="verified-email"
               >
                 <strong tabindex="0" class="row orc-font-body-small">
-                  <span class="sr-only" i18n="@@side-bar.primaryEmail"
-                    >Primary email address</span
-                  >
                   {{ emailsForm.value[email.putCode].email }}</strong
                 >
                 <em
@@ -144,7 +146,10 @@ <h2 class="orc-font-body-large" i18n="@@side-bar.emailAddressesUppercase">
               >
             </button>
           </div>
-          <div class="row actions-wrapper">
+          <div
+            class="row actions-wrapper"
+            [ngClass]="{ 'actions-wrapper-mobile': isMobile }"
+          >
             <div
               class="actions-sub-wrapper"
               *ngIf="showNonVerifiedData(email.putCode)"
@@ -189,10 +194,11 @@ <h2 class="orc-font-body-large" i18n="@@side-bar.emailAddressesUppercase">
                 emailsForm.hasError('email', [email.putCode, 'email']) &&
                 emailsForm.get(email.putCode).get('email').touched
               "
-              i18n="@@side-bar.invalidEmailFormat"
+              i18n="@@side-bar.invalidEmailErrorMessage"
               class="orc-font-small-print"
             >
-              Invalid email format
+              Please enter a valid email address, for example
+              [email protected]
             </mat-error>
 
             <mat-error
@@ -245,22 +251,25 @@ <h2 class="orc-font-body-large" i18n="@@side-bar.emailAddressesUppercase">
           i18n="@@side-bar.yourOrcidAccountSettings"
           href="/account"
           target="_blank"
+          [attr.aria-label]="ariaOpenAccountSettings"
           rel="noopener noreferrer"
           >your ORCID account settings.</a
         >
       </p>
       <mat-form-field
         appearance="outline"
         class="mat-form-field-min select-notifications-email"
+        [ngClass]="{
+          'disabled-select-notifications-email': !hasVerifiedEmailAddress()
+        }"
       >
         <mat-select
           outline="black"
-          [aria-label]="ariaLabelSelect"
-          [attr.disabled]="!hasVerifiedEmailAddress()"
+          [aria-label]="
+            ariaLabelNotificationsAreSentToEmail + ' ' + primaryEmail?.value
+          "
           (selectionChange)="makePrimary($event.value)"
-          [ngClass]="{
-            'disabled-select-notifications-email': !hasVerifiedEmailAddress()
-          }"
+          [disabled]="!hasVerifiedEmailAddress()"
           placeholder=" {{ primaryEmail?.value }}"
           [(value)]="primaryEmail"
           class="orc-font-body-small"

diff --git a/src/app/cdk/side-bar/modals/modal-email/modal-email.component.scss b/src/app/cdk/side-bar/modals/modal-email/modal-email.component.scss
@@ -36,17 +36,21 @@ mat-form-field {
 }
 
 .actions-wrapper {
-  width: 51%;
+  width: 100%;
   margin-left: 48px;
+  margin-right: 255px;
   margin-top: 3px;
   line-height: 21px;
 }
 
+.actions-wrapper-mobile {
+  margin-right: 150px !important;
+}
+
 .actions-wrapper,
 .actions-sub-wrapper {
   display: flex;
   flex-wrap: nowrap;
-  flex-shrink: 0;
   justify-content: space-between;
 
   .actions-sub-wrapper {
@@ -111,12 +115,6 @@ mat-form-field {
   font-weight: bold;
 }
 
-.disabled-select-notifications-email {
-  ::ng-deep .mat-select-trigger {
-    cursor: default;
-  }
-}
-
 .add-more {
   margin-top: 16px;
   align-items: center;

diff --git a/src/app/cdk/side-bar/modals/modal-email/modal-email.component.scss-theme.scss b/src/app/cdk/side-bar/modals/modal-email/modal-email.component.scss-theme.scss
@@ -37,6 +37,10 @@
     color: rgba(0, 0, 0, 0.12);
   }
 
+  ::ng-deep .mat-select-placeholder {
+    color: black;
+  }
+
   .disabled-select-notifications-email {
     ::ng-deep .mat-select-placeholder {
       color: rgba(black, 0.6);

diff --git a/src/app/cdk/side-bar/modals/modal-email/modal-email.component.ts b/src/app/cdk/side-bar/modals/modal-email/modal-email.component.ts
@@ -46,11 +46,12 @@ export class ModalEmailComponent implements OnInit, OnDestroy {
   ariaLabelKnowledgeSupport = $localize`:@@side-bar.ariaLabelOrcidTermsSupport:ORCID support page (Opens in a new tab)`
   ariaLabelOrcidTermsOfUseLink = $localize`:@@side-bar.ariaLabelOrcidTermsOfUseLink:ORCID terms of use (Opens in a new tab)`
   ariaLabelSave = $localize`:@@side-bar.ariaLabelEmailSave:Save changes to Emails`
-  ariaLabelSelect = $localize`:@@side-bar.ariaLabelEmailSave:Select email to receive notifications`
+  ariaLabelNotificationsAreSentToEmail = $localize`:@@side-bar.notificationsAreSentToEmail:Notifications are sent to`
   ariaLabelCancel = $localize`:@@side-bar.ariaLabelEmailCancel:Cancel changes and close Emails`
   ariaLabelDelete = $localize`:@@side-bar.ariaLabelEmailDelete:Delete Email`
   ariaLabelClose = $localize`:@@side-bar.ariaLabelEmailClose:Close Emails`
-  ariaLabelPrimaryEmail = $localize`:@@side-bar.primaryEmail:Primary email address`
+  ariaLabelEmailAddress = $localize`:@@side-bar.emailAddress:Email address`
+  ariaLabelNewEmailAddress = $localize`:@@side-bar.newEmailAddress:New email address`
   ariaLabelOtherEmailAddresses = $localize`:@@side-bar.otherEmails:Other email addresses`
   ariaLabelVisibilityPrimaryEmailPublic = $localize`:@@side-bar.ariaLabelPrimaryEmailPublic:Set primary email visibility to Everyone`
   ariaLabelVisibilityPrimaryEmailTrustedParty = $localize`:@@side-bar.ariaLabelPrimaryEmailTrustedParties:Set primary email visibility to Trusted Parties`
@@ -61,6 +62,7 @@ export class ModalEmailComponent implements OnInit, OnDestroy {
   ariaLabelVisibilityEmailPublic = $localize`:@@side-bar.ariaLabelEmailPublic:Set email visibility to Everyone`
   ariaLabelVisibilityEmailTrustedParty = $localize`:@@side-bar.ariaLabelEmailTrustedParties:Set email visibility to Trusted Parties`
   ariaLabelVisibilityEmailPrivate = $localize`:@@side-bar.ariaLabelEmailPrivate:Set email visibility to Only Me`
+  ariaOpenAccountSettings = $localize`:@@side-bar.ariaOpenAccountSettings:Open your ORCID account settings`
   deleteTooltip = $localize`:@@side-bar.deleteTooltip:You can't delete the only email address in your account`
   visibilityTooltip = $localize`:@@side-bar.visibilityTooltip:Visibility set to Only me`
 

diff --git a/src/app/cdk/top-bar-verification-email/top-bar-verification-email.component.html b/src/app/cdk/top-bar-verification-email/top-bar-verification-email.component.html
@@ -1,5 +1,5 @@
 <div
-  *ngIf="primaryEmail || verifyEmailSend || emailVerified"
+  *ngIf="justRegistered || verifyEmailSend || emailVerified"
   role="alert"
   class="info"
   [ngClass]="{

diff --git a/src/app/cdk/top-bar-verification-email/top-bar-verification-email.component.ts b/src/app/cdk/top-bar-verification-email/top-bar-verification-email.component.ts
@@ -17,6 +17,7 @@ import { PlatformInfoService } from '../platform-info'
 export class TopBarVerificationEmailComponent implements OnInit, OnDestroy {
   $destroy: Subject<boolean> = new Subject<boolean>()
   @Input() emailVerified: boolean
+  @Input() justRegistered: boolean
   @Input() messageType: 'forCredentials' | 'forManualEditing' =
     'forManualEditing'
 

diff --git a/src/app/core/record-emails/record-emails.service.ts b/src/app/core/record-emails/record-emails.service.ts
@@ -211,14 +211,6 @@ export class RecordEmailsService {
     a: AssertionVisibilityString,
     b: AssertionVisibilityString
   ): number {
-    const dateA = Date.parse(
-      `${a.createdDate.year}-${a.createdDate.month}-${a.createdDate.day}`
-    )
-
-    const dateB = Date.parse(
-      `${b.createdDate.year}-${b.createdDate.month}-${b.createdDate.day}`
-    )
-
-    return dateA - dateB
+    return a.createdDate.timestamp - b.createdDate.timestamp
   }
 }
diff --git a/src/app/record/components/top-bar/top-bar.component.html b/src/app/record/components/top-bar/top-bar.component.html
@@ -9,6 +9,7 @@
 
 <app-top-bar-verification-email
   [emailVerified]="emailVerified"
+  [justRegistered]="justRegistered"
 ></app-top-bar-verification-email>
 
 <ng-container *ngIf="!isPublicRecord && !recordWithIssues">

diff --git a/src/app/types/common.endpoint.ts b/src/app/types/common.endpoint.ts
@@ -107,6 +107,16 @@ export interface MonthDayYearDate {
   getRequiredMessage?: any
 }
 
+export interface ExtendedDate {
+  errors?: any[]
+  day?: string
+  month?: string
+  year?: string
+  timestamp?: number
+  required?: boolean
+  getRequiredMessage?: any
+}
+
 export interface Value {
   errors?: any[] // TODO is this always empty?
   value: string

diff --git a/src/app/types/record.endpoint.ts b/src/app/types/record.endpoint.ts
@@ -1,6 +1,7 @@
 import {
   Address,
   Email,
+  ExtendedDate,
   Keyword,
   MonthDayYearDate,
   OtherName,
@@ -117,6 +118,7 @@ export interface Assertion extends AssertionBase {
 export interface AssertionVisibilityString extends AssertionBase {
   visibility?: VisibilityStrings
   action?: 'ADD' | 'UPDATE'
+  createdDate?: ExtendedDate
 }
 
 export interface GroupBase {

diff --git a/src/locale/properties/account/account.en.properties b/src/locale/properties/account/account.en.properties
@@ -213,4 +213,4 @@ account.privacypolicy=Privacy Policy
 account.setTheFrequency=Set the frequency for update notifications
 account.setTheFrequencyAdministrative=Set the frequency for administrative change notifications
 account.setTheFrequencyMember=Set the frequency for permission request notifications
-account.notificationEmailAddressFrequency=Notification email frequency
+account.notificationEmailAddressFrequency=Notification email frequency
diff --git a/src/locale/properties/account/account.lr.properties b/src/locale/properties/account/account.lr.properties
@@ -216,3 +216,4 @@ account.setTheFrequency=LR
 account.setTheFrequencyAdministrative=LR
 account.setTheFrequencyMember=LR
 =LR
+account.notificationEmailAddressFrequency=LR
diff --git a/src/locale/properties/account/account.rl.properties b/src/locale/properties/account/account.rl.properties
@@ -216,3 +216,4 @@ account.setTheFrequency=RL
 account.setTheFrequencyAdministrative=RL
 account.setTheFrequencyMember=RL
 =RL
+account.notificationEmailAddressFrequency=RL
diff --git a/src/locale/properties/account/account.xx.properties b/src/locale/properties/account/account.xx.properties
@@ -216,3 +216,4 @@ account.setTheFrequency=X
 account.setTheFrequencyAdministrative=X
 account.setTheFrequencyMember=X
 =X
+account.notificationEmailAddressFrequency=X
diff --git a/src/locale/properties/side-bar/side-bar.en.properties b/src/locale/properties/side-bar/side-bar.en.properties
@@ -7,11 +7,14 @@ side-bar.verifiedEmail=Verified email address
 side-bar.emailCanNotBeDuplicated=Email can not be duplicated
 side-bar.noOtherEmails=You haven’t added any other email addresses yet.
 side-bar.invalidEmailFormat=Invalid email format
+side-bar.invalidEmailErrorMessage=Please enter a valid email address, for example [email protected]
 side-bar.pleaseVerify=Please verify your primary email address!
 side-bar.pleaseVerifyWarning=Please verify your email addresses
 side-bar.verifyToAccessOrcidFeatures=To access all of ORCID’s editing features you must verify at least one email address. Until then you will only be able to manage
 side-bar.names=names
 side-bar.and=and
+side-bar.emailAddress=Email address
+side-bar.newEmailAddress=New email address
 side-bar.emailAddresses=email addresses
 side-bar.emailAddressesUppercase=Email addresses
 side-bar.inYourOrcidRecord=in your ORCID record.
@@ -92,3 +95,5 @@ side-bar.ariaLabelOtherEmailPrivate=Set other email visibility to Only Me
 side-bar.ariaLabelEmailPublic=Set email visibility to Everyone
 side-bar.ariaLabelEmailTrustedParties=Set email visibility to Trusted Parties
 side-bar.ariaLabelEmailPrivate=Set email visibility to Only Me
+side-bar.ariaOpenAccountSettings=Open your ORCID account settings
+side-bar.notificationsAreSentToEmail=Notifications are sent to
diff --git a/src/locale/properties/side-bar/side-bar.lr.properties b/src/locale/properties/side-bar/side-bar.lr.properties
@@ -92,3 +92,8 @@ side-bar.visibilityTooltip=LR
 side-bar.ariaLabelEmailPublic=LR
 side-bar.ariaLabelEmailTrustedParties=LR
 side-bar.ariaLabelEmailPrivate=LR
+side-bar.invalidEmailErrorMessage=LR
+side-bar.emailAddress=LR
+side-bar.newEmailAddress=LR
+side-bar.ariaOpenAccountSettings=LR
+side-bar.notificationsAreSentToEmail=LR
diff --git a/src/locale/properties/side-bar/side-bar.rl.properties b/src/locale/properties/side-bar/side-bar.rl.properties
@@ -92,3 +92,8 @@ side-bar.visibilityTooltip=RL
 side-bar.ariaLabelEmailPublic=RL
 side-bar.ariaLabelEmailTrustedParties=RL
 side-bar.ariaLabelEmailPrivate=RL
+side-bar.invalidEmailErrorMessage=RL
+side-bar.emailAddress=RL
+side-bar.newEmailAddress=RL
+side-bar.ariaOpenAccountSettings=RL
+side-bar.notificationsAreSentToEmail=RL
diff --git a/src/locale/properties/side-bar/side-bar.xx.properties b/src/locale/properties/side-bar/side-bar.xx.properties
@@ -93,3 +93,8 @@ side-bar.visibilityTooltip=X
 side-bar.ariaLabelEmailPublic=X
 side-bar.ariaLabelEmailTrustedParties=X
 side-bar.ariaLabelEmailPrivate=X
+side-bar.invalidEmailErrorMessage=X
+side-bar.emailAddress=X
+side-bar.newEmailAddress=X
+side-bar.ariaOpenAccountSettings=X
+side-bar.notificationsAreSentToEmail=X