ENG-9951 | User page should display a link to the merger profile page as a redirect (#838)

* feat(user-page): User page should display a link to the merger profile page as a redirect
* feat(user-page): Fix banner styling

Author: sh-andriy

src/app/features/profile/components/profile-information/profile-information.component.html

@@ -1,4 +1,4 @@
-<div class="py-5 px-3 md:p-5 xl:p-4 xl:mt-6">
+<div class="py-5 px-3 md:p-5 xl:p-4">
   <div class="flex align-items-center">
     <h1>{{ currentUser()?.fullName }}</h1>
 

src/app/features/profile/profile.component.html

@@ -2,7 +2,19 @@
   <osf-loading-spinner />
 } @else {
   @if (user()) {
-    <osf-profile-information [currentUser]="user()" [showEdit]="isMyProfile()" (editProfile)="toProfileSettings()" />
+    <div class="mt-7 px-3 md:px-5 xl:px-4">
+      @if (user()?.mergedBy) {
+        <p-message class="overview-message w-full mb-4" severity="info">
+          <ng-template #container>
+            <span>
+              {{ 'profile.mergedAccount.message' | translate }}
+              <a [href]="user()?.mergedBy">{{ user()?.mergedBy }}</a>
+            </span>
+          </ng-template>
+        </p-message>
+      }
+      <osf-profile-information [currentUser]="user()" [showEdit]="isMyProfile()" (editProfile)="toProfileSettings()" />
+    </div>
 
     @if (defaultSearchFiltersInitialized()) {
       <div class="mt-6">

src/app/features/profile/profile.component.ts

@@ -1,5 +1,9 @@
 import { createDispatchMap, select } from '@ngxs/store';
 
+import { TranslatePipe } from '@ngx-translate/core';
+
+import { Message } from 'primeng/message';
+
 import {
   ChangeDetectionStrategy,
   Component,
@@ -30,7 +34,7 @@ import { FetchUserProfile, ProfileSelectors, SetUserProfile } from './store';
   templateUrl: './profile.component.html',
   styleUrl: './profile.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
-  imports: [ProfileInformationComponent, GlobalSearchComponent, LoadingSpinnerComponent],
+  imports: [ProfileInformationComponent, GlobalSearchComponent, LoadingSpinnerComponent, Message, TranslatePipe],
 })
 export class ProfileComponent implements OnInit, OnDestroy {
   private router = inject(Router);

src/app/shared/mappers/user/user.mapper.ts

@@ -36,6 +36,7 @@ export class UserMapper {
       canViewReviews: user.attributes.can_view_reviews === true, // [NS] Do not simplify it
       timezone: user.attributes.timezone,
       locale: user.attributes.locale,
+      mergedBy: user.links.merged_by,
     };
   }
 

src/app/shared/models/user/user-json-api.model.ts

@@ -70,6 +70,7 @@ interface UserLinksJsonApi {
   iri: string;
   profile_image: string;
   self: string;
+  merged_by?: string;
 }
 
 interface UserRelationshipsJsonApi {

src/app/shared/models/user/user.models.ts

@@ -27,4 +27,5 @@ export interface UserModel {
   defaultRegionId: string;
   link?: string;
   iri?: string;
+  mergedBy?: string;
 }

src/assets/i18n/en.json

@@ -227,6 +227,11 @@
     "institutions": "Institutions",
     "recentActivity": "Recent Activity"
   },
+  "profile": {
+    "mergedAccount": {
+      "message": "This account has been merged with "
+    }
+  },
   "toast": {
     "tos-consent": {
       "message": "Notice: We've updated our",

src/testing/mocks/data.mock.ts

@@ -57,6 +57,7 @@ export const MOCK_USER: UserModel = {
   defaultRegionId: 'us',
   allowIndexing: true,
   canViewReviews: true,
+  mergedBy: undefined,
 };
 
 export const MOCK_USER_RELATED_COUNTS: UserRelatedCounts = {