Merge pull request #2863 from ORCID/lmendoza/PD-5389

PD-5389, PD-5402

Author: cryptalith

projects/orcid-ui/src/lib/components/record-header/record-header.component.scss

@@ -325,6 +325,11 @@
   min-width: 0;
   flex: 1; // Grow to fill space
 
+  // Keep Copy/Print actions close to the ORCID iD on desktop non-compact mode.
+  .desktop:not(.compact) & {
+    flex: 0 0 auto;
+  }
+
   .id-content {
     display: flex;
     align-items: center;

src/app/account-settings/components/settings-actions-duplicated/settings-actions-duplicated.component.html

@@ -53,7 +53,7 @@ <h4 title i18n>What happens when you remove a duplicate ORCID account?</h4>
     </ul>
   </app-alert-message>
   @if (authenticated) {
-  <form [formGroup]="form" (ngSubmit)="onSubmit()">
+  <form [formGroup]="form" (ngSubmit)="onSubmit()" autocomplete="off">
     <h3 i18n class="mb-2 mt-0">You are removing this duplicate account</h3>
     @if (data.deprecatingAccountName) {
     <p class="leading-5.25">{{ data.deprecatingAccountName }}</p>
@@ -82,7 +82,7 @@ <h3 i18n class="mb-2 mt-0">You are removing this duplicate account</h3>
     </button>
   </form>
   } @else {
-  <form [formGroup]="form" (ngSubmit)="submitVerify()">
+  <form [formGroup]="form" (ngSubmit)="submitVerify()" autocomplete="off">
     <h3 i18n class="mt-0 mb-2">Which account do you want to remove?</h3>
     <p i18n class="mb-8!">
       You will need to verify your sign in details for the duplicate account
@@ -108,7 +108,7 @@ <h3 i18n class="mt-0 mb-2">Which account do you want to remove?</h3>
         formControlName="deprecatingOrcidOrEmail"
         type="text"
         matInput
-        autocomplete="email"
+        autocomplete="off"
         [errorStateMatcher]="errorMatcher"
         id="cy-duplicate-rercod-email"
       />
@@ -132,7 +132,7 @@ <h3 i18n class="mt-0 mb-2">Which account do you want to remove?</h3>
         formControlName="password"
         type="password"
         matInput
-        autocomplete="password"
+        autocomplete="new-password"
         [errorStateMatcher]="errorMatcher"
         id="cy-duplicate-rercod-email"
       />

src/app/account-settings/components/settings-actions-duplicated/settings-actions-duplicated.component.ts

@@ -1,4 +1,11 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
+import {
+  Component,
+  EventEmitter,
+  Input,
+  OnDestroy,
+  OnInit,
+  Output,
+} from '@angular/core'
 import {
   FormGroupDirective,
   NgForm,
@@ -37,7 +44,7 @@ export class NeverShowErrorMatcher implements ErrorStateMatcher {
   preserveWhitespaces: true,
   standalone: false,
 })
-export class SettingsActionsDuplicatedComponent implements OnInit {
+export class SettingsActionsDuplicatedComponent implements OnInit, OnDestroy {
   errorMatcher = new NeverShowErrorMatcher()
   userSession: UserSession
   constructor(
@@ -121,7 +128,7 @@ export class SettingsActionsDuplicatedComponent implements OnInit {
         document.activeElement.blur()
       }
       this.loadingVerify = false
-      this.form.reset()
+      this.resetFormState()
       if (success) {
         this.authenticated = true
       } else {
@@ -169,7 +176,7 @@ export class SettingsActionsDuplicatedComponent implements OnInit {
 
         if (data.success) {
           this.errors = []
-          this.form.reset()
+          this.resetFormState()
           this.success = true
         }
         if (data.errors?.length || !data.twoFactorToken) {
@@ -179,9 +186,17 @@ export class SettingsActionsDuplicatedComponent implements OnInit {
       },
       error: () => {
         this.cancelAuthentication = true
-        this.form.reset()
+        this.resetFormState()
         this.loading.next(false)
       },
     })
   }
+
+  ngOnDestroy(): void {
+    this.resetFormState()
+  }
+
+  private resetFormState(): void {
+    this.form?.reset()
+  }
 }

src/app/account-settings/components/settings-security-password/settings-security-password.component.html

@@ -1,5 +1,5 @@
 <app-settings-panels-data *ngIf="form">
-  <form [formGroup]="form">
+  <form [formGroup]="form" autocomplete="off">
     @if (success) {
     <app-alert-message type="success" class="mb-8">
       <div content class="mt-0.5" i18n>
@@ -33,6 +33,7 @@
           matInput
           formControlName="oldPassword"
           type="password"
+          autocomplete="new-password"
           [errorStateMatcher]="errorMatcher"
           [ngClass]="{
             error:

src/app/account-settings/components/settings-security-password/settings-security-password.component.ts

@@ -193,6 +193,7 @@ export class SettingsSecurityPasswordComponent implements OnInit, OnDestroy {
     return status
   }
   ngOnDestroy(): void {
+    this.form?.reset()
     this.$destroy.next()
     this.$destroy.complete()
   }