From 22a9691ac70a89da0ebda1ae1874709ff22c1679 Mon Sep 17 00:00:00 2001 From: Leonardo Mendoza Date: Wed, 26 Jul 2023 17:56:02 -0600 Subject: [PATCH 1/6] trusted-summary --- src/app/app-routing.module.ts | 8 + src/app/app.component.html | 6 +- src/app/app.component.ts | 3 +- .../platform-info/platform-info.service.ts | 2 + .../cdk/platform-info/platform-info.type.ts | 1 + src/app/constants.ts | 15 +- .../trusted-summary.service.spec.ts | 16 ++ .../trusted-summary.service.ts | 37 ++++ .../summary-dates-panel.component.html | 1 + .../summary-dates-panel.component.scss | 0 .../summary-dates-panel.component.spec.ts | 23 +++ .../summary-dates-panel.component.ts | 15 ++ .../summary-panel.component.html | 102 +++++++++++ .../summary-panel.component.scss | 87 ++++++++++ .../summary-panel.component.scss-theme.scss | 20 +++ .../summary-panel.component.spec.ts | 23 +++ .../summary-panel/summary-panel.component.ts | 61 +++++++ .../summary-simple-panel.component.html | 88 ++++++++++ .../summary-simple-panel.component.scss | 87 ++++++++++ ...ary-simple-panel.component.scss-theme.scss | 20 +++ .../summary-simple-panel.component.spec.ts | 23 +++ .../summary-simple-panel.component.ts | 49 ++++++ .../trusted-summary.component.html | 120 +++++++++++++ .../trusted-summary.component.scss | 164 ++++++++++++++++++ .../trusted-summary.component.scss-theme.scss | 20 +++ .../trusted-summary.component.spec.ts | 23 +++ .../trusted-summary.component.ts | 136 +++++++++++++++ .../trusted-summary-routing.module.ts | 16 ++ .../trusted-summary/trusted-summary.module.ts | 28 +++ src/app/types/trust-summary.ts | 28 +++ src/assets/vectors/bullet-point.svg | 3 + 31 files changed, 1222 insertions(+), 3 deletions(-) create mode 100644 src/app/core/trusted-summary/trusted-summary.service.spec.ts create mode 100644 src/app/core/trusted-summary/trusted-summary.service.ts create mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html create mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss create mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts create mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts create mode 100644 src/app/trusted-summary/component/summary-panel/summary-panel.component.html create mode 100644 src/app/trusted-summary/component/summary-panel/summary-panel.component.scss create mode 100644 src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss create mode 100644 src/app/trusted-summary/component/summary-panel/summary-panel.component.spec.ts create mode 100644 src/app/trusted-summary/component/summary-panel/summary-panel.component.ts create mode 100644 src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html create mode 100644 src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss create mode 100644 src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss create mode 100644 src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts create mode 100644 src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts create mode 100644 src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html create mode 100644 src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss create mode 100644 src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss-theme.scss create mode 100644 src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts create mode 100644 src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts create mode 100644 src/app/trusted-summary/trusted-summary-routing.module.ts create mode 100644 src/app/trusted-summary/trusted-summary.module.ts create mode 100644 src/app/types/trust-summary.ts create mode 100644 src/assets/vectors/bullet-point.svg diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 202d02309a..c46d2127d6 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -5,6 +5,7 @@ import { ApplicationRoutes, routerPublicPageUrl, routerReactivation, + routerSummaryPageUrl, routerThirdPartySignInMatch, } from './constants' import { AuthenticatedGuard } from './guards/authenticated.guard' @@ -22,6 +23,13 @@ const routes: Routes = [ path: ApplicationRoutes.home, loadChildren: () => import('./home/home.module').then((m) => m.HomeModule), }, + { + matcher: routerSummaryPageUrl, + loadChildren: () => + import('./trusted-summary/trusted-summary.module').then( + (m) => m.TrustedSummaryModule + ), + }, { matcher: routerPublicPageUrl, loadChildren: () => diff --git a/src/app/app.component.html b/src/app/app.component.html index 8995896c64..ad608ff4d1 100644 --- a/src/app/app.component.html +++ b/src/app/app.component.html @@ -3,7 +3,11 @@ -
+
diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 0c362b5b34..6b1d819228 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -130,9 +130,10 @@ export class AppComponent { } setPlatformClasses(platformInfo: PlatformInfo, oauthSessionFound?: boolean) { - this.headlessMode = + const isOauth = (platformInfo.hasOauthParameters || oauthSessionFound) && this.currentRouteIsHeadlessOnOauthPage + this.headlessMode = isOauth || platformInfo.summaryScreen this.ie = platformInfo.ie this.edge = platformInfo.edge this.tabletOrHandset = platformInfo.tabletOrHandset diff --git a/src/app/cdk/platform-info/platform-info.service.ts b/src/app/cdk/platform-info/platform-info.service.ts index 8605f24ca5..01257d5343 100644 --- a/src/app/cdk/platform-info/platform-info.service.ts +++ b/src/app/cdk/platform-info/platform-info.service.ts @@ -36,6 +36,7 @@ export class PlatformInfoService { currentRoute: '', reactivation: false, reactivationCode: '', + summaryScreen: false, } platformSubject = new BehaviorSubject(this.platform) @@ -231,6 +232,7 @@ export class PlatformInfoService { this.window.location.pathname.toLowerCase().indexOf('reactivation') >= 0, reactivationCode: this.getReactivationCode(), + summaryScreen: this.window.location.pathname.endsWith('/summary'), } this.platformSubject.next(this.platform) return this.platformSubject.asObservable() diff --git a/src/app/cdk/platform-info/platform-info.type.ts b/src/app/cdk/platform-info/platform-info.type.ts index bc43f8f725..acb583110f 100644 --- a/src/app/cdk/platform-info/platform-info.type.ts +++ b/src/app/cdk/platform-info/platform-info.type.ts @@ -23,4 +23,5 @@ export interface PlatformInfo { currentRoute: string reactivation: boolean reactivationCode: string + summaryScreen: boolean } diff --git a/src/app/constants.ts b/src/app/constants.ts index b62df73c25..79559e2569 100644 --- a/src/app/constants.ts +++ b/src/app/constants.ts @@ -27,6 +27,7 @@ import { } from './types/record-affiliation.endpoint' import { WorkBibtexModalComponent } from './record/components/work-stack-group/modals/work-bibtex-modal/work-bibtex-modal.component' import { environment } from 'src/environments/environment' +import { log } from 'console' export { COUNTRY_NAMES_TO_COUNTRY_CODES } from './constants-country-codes' @@ -218,10 +219,22 @@ export function objectToUrlParameters(object: Object) { } export function routerPublicPageUrl(segments: UrlSegment[]) { + console.log(segments) if (segments[0] && isValidOrcidFormat(segments[0].path)) { return { consumed: [segments[0]] } } - if (segments[1] && isValidOrcidFormat(segments[1].path)) { + return { + consumed: [], + } +} + +export function routerSummaryPageUrl(segments: UrlSegment[]) { + console.log(segments) + if ( + segments[0] && + isValidOrcidFormat(segments[0].path) && + segments[1].path === 'summary' + ) { return { consumed: [segments[0], segments[1]] } } return { diff --git a/src/app/core/trusted-summary/trusted-summary.service.spec.ts b/src/app/core/trusted-summary/trusted-summary.service.spec.ts new file mode 100644 index 0000000000..d75801f0db --- /dev/null +++ b/src/app/core/trusted-summary/trusted-summary.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { TrustedSummaryService } from './trusted-summary.service'; + +describe('TrustedSummaryService', () => { + let service: TrustedSummaryService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(TrustedSummaryService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/core/trusted-summary/trusted-summary.service.ts b/src/app/core/trusted-summary/trusted-summary.service.ts new file mode 100644 index 0000000000..ad717969dc --- /dev/null +++ b/src/app/core/trusted-summary/trusted-summary.service.ts @@ -0,0 +1,37 @@ +import { HttpClient, HttpHeaders } from '@angular/common/http' +import { Injectable } from '@angular/core' +import { ErrorHandlerService } from '../error-handler/error-handler.service' +import { Observable } from 'rxjs' +import { TrustedSummary } from 'src/app/types/trust-summary' +import { environment } from 'src/environments/environment' +import { catchError, retry } from 'rxjs/operators' +import { ERROR_REPORT } from 'src/app/errors' + +@Injectable({ + providedIn: 'root', +}) +export class TrustedSummaryService { + headers = new HttpHeaders({ + 'Access-Control-Allow-Origin': '*', + 'Content-Type': 'application/json', + }) + + constructor( + private _http: HttpClient, + private _errorHandler: ErrorHandlerService + ) {} + + getSummary(orcid): Observable { + let url = orcid + '/summary.json' + return this._http + .get(environment.BASE_URL + url, { + headers: this.headers, + }) + .pipe( + retry(3), + catchError((error) => + this._errorHandler.handleError(error, ERROR_REPORT.STANDARD_VERBOSE) + ) + ) + } +} diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html new file mode 100644 index 0000000000..f33eb4e9e7 --- /dev/null +++ b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html @@ -0,0 +1 @@ +

summary-dates-panel works!

diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts new file mode 100644 index 0000000000..2859aa7512 --- /dev/null +++ b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SummaryDatesPanelComponent } from './summary-dates-panel.component'; + +describe('SummaryDatesPanelComponent', () => { + let component: SummaryDatesPanelComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SummaryDatesPanelComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(SummaryDatesPanelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts new file mode 100644 index 0000000000..2a71d57554 --- /dev/null +++ b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts @@ -0,0 +1,15 @@ +import { Component, OnInit } from '@angular/core'; + +@Component({ + selector: 'app-summary-dates-panel', + templateUrl: './summary-dates-panel.component.html', + styleUrls: ['./summary-dates-panel.component.scss'] +}) +export class SummaryDatesPanelComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html new file mode 100644 index 0000000000..db2db49ece --- /dev/null +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html @@ -0,0 +1,102 @@ +
+ +
+
+
+ check_circle + + +

+ {{ activity.organizationName }} +

+

+ {{ activity.organizationName }} +

+
+ + + + + + + + +
+
+ + 2020-02-02 to present + +
Professor of Psychoceramic
+
Employment
+
+
+ +
+ + {{ count - 3 }} more Affiliations +
+
diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss new file mode 100644 index 0000000000..4170ce5dfb --- /dev/null +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss @@ -0,0 +1,87 @@ +.card-container { + display: flex; + padding: 16px; + flex-direction: column; + justify-content: center; + align-items: flex-start; + gap: 16px; + border: 2px solid #EEE; + border-radius: 4px; + background-color: white; + +} + +.mobile { + :host { + .card-container { + max-width: 100%; + } + } +} + +.activity-container.padding-botton { + padding-bottom: 16px; + +} + +.activity-container { + width: 100%; + border-bottom: 16px; + text-align: initial; + + .header { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + + .header-title { + display: flex; + align-items: center; + + color: rgba(0, 0, 0, 0.90); + + h3 { + font-weight: 400; + + margin: 0; + } + + } + + + + display: flex; + padding-bottom: 4px; + } + + caption { + font-style: italic; + display: flex; + width: 100%; + text-align: left; + } +} + +.activity-container.with-border { + border-bottom: 2px solid #EEE; +} + +.body-wrapper { + color: rgba(0, 0, 0, 0.60); + margin-inline-start: 27px; +} + +mat-icon.margin-compensation { + margin-bottom: 3px; + +} + +mat-icon { + min-width: 22px; + margin-inline-end: 3px; +} + +a { + font-weight: 400; +} \ No newline at end of file diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss new file mode 100644 index 0000000000..1cf886430d --- /dev/null +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss @@ -0,0 +1,20 @@ +@use '@angular/material' as mat; +@import 'src/assets/scss/material.orcid-theme.scss'; + +@mixin theme($theme) { + $primary: map-get($theme, primary); + $accent: map-get($theme, accent); + $warn: map-get($theme, warn); + $foreground: map-get($theme, foreground); + $background: map-get($theme, background); + + .verified { + color: mat.get-color-from-palette($accent, 400); + } + + .not-verified { + color: mat.get-color-from-palette($primary, 200); + } +} + +@include theme($orcid-app-theme); \ No newline at end of file diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.spec.ts b/src/app/trusted-summary/component/summary-panel/summary-panel.component.spec.ts new file mode 100644 index 0000000000..253b2e31f9 --- /dev/null +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SummaryPanelComponent } from './summary-panel.component'; + +describe('SummaryPanelComponent', () => { + let component: SummaryPanelComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SummaryPanelComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(SummaryPanelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts new file mode 100644 index 0000000000..9e4035bf3f --- /dev/null +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts @@ -0,0 +1,61 @@ +import { Component, Input, OnInit } from '@angular/core' +import { log } from 'console' +import { Subject } from 'rxjs' +import { takeUntil } from 'rxjs/operators' +import { PlatformInfoService } from 'src/app/cdk/platform-info' +import { ActivitySummary } from 'src/app/types/trust-summary' + +@Component({ + selector: 'app-summary-panel', + templateUrl: './summary-panel.component.html', + styleUrls: [ + './summary-panel.component.scss', + './summary-panel.component.scss-theme.scss', + ], +}) +export class SummaryPanelComponent implements OnInit { + validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` + selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` + @Input() activitySummary: ActivitySummary[] + @Input() url: string = '' + @Input() count: number = 0 + activitiesToDisplay: ActivitySummary[] + acitivityCountOverflow: boolean + unsubscribe = new Subject() + mobile: boolean + + constructor(private _platform: PlatformInfoService) {} + + ngOnDestroy(): void { + this.unsubscribe.next() + this.unsubscribe.complete() + } + + ngOnInit(): void { + this._platform + .get() + .pipe(takeUntil(this.unsubscribe)) + .subscribe((platform) => { + if (platform.columns4 || platform.columns8) { + this.mobile = true + } else { + this.mobile = false + } + }) + + if (this.activitySummary) { + this.activitySummary = [...this.activitySummary, ...this.activitySummary] + this.activitiesToDisplay = this.activitySummary + .slice(0, 3) + .map((activity) => { + return { + ...activity, + organizationName: 'Hey hello', + validatedOrSelfAsserted: false, + } + }) + + this.acitivityCountOverflow = this.count > 3 + } + } +} diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html new file mode 100644 index 0000000000..09fab0adfd --- /dev/null +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html @@ -0,0 +1,88 @@ +
+ +
+
+
+ check_circle + + + +
+ + {{ element.url }} + + + {{ element.countA }} + + {{ + element.stringA + }} + + {{ element.countB }} + + {{ + element.stringB + }} + + +
+
+ + + + + + + +
+
+ +
diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss new file mode 100644 index 0000000000..5584dca4bb --- /dev/null +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss @@ -0,0 +1,87 @@ +.card-container { + display: flex; + padding: 16px; + flex-direction: column; + justify-content: center; + align-items: flex-start; + gap: 16px; + border: 2px solid #EEE; + border-radius: 4px; + background-color: white; + + +} + +.mobile { + :host { + .card-container { + max-width: 100%; + } + } +} + + +.activity-container.padding-botton { + padding-bottom: 16px; + +} + + +.activity-container { + width: 100%; + border-bottom: 16px; + text-align: initial; + + .header { + display: flex; + flex-direction: row; + align-items: center; + justify-content: space-between; + + .header-title { + display: flex; + align-items: center; + + color: rgba(0, 0, 0, 0.90); + + h3 { + margin: 0; + } + + } + + + + display: flex; + padding-bottom: 4px; + } + + caption { + display: inline; + width: 100%; + text-align: left; + } +} + +.activity-container.with-border { + border-bottom: 2px solid #EEE; +} + +.body-wrapper { + color: rgba(0, 0, 0, 0.60); + margin-inline-start: 25px; +} + +mat-icon.margin-compensation { + margin-bottom: 3px; + +} + +mat-icon { + min-width: 25px; + margin-inline-end: 8px; +} + +a { + font-weight: 400; +} \ No newline at end of file diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss new file mode 100644 index 0000000000..1cf886430d --- /dev/null +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss @@ -0,0 +1,20 @@ +@use '@angular/material' as mat; +@import 'src/assets/scss/material.orcid-theme.scss'; + +@mixin theme($theme) { + $primary: map-get($theme, primary); + $accent: map-get($theme, accent); + $warn: map-get($theme, warn); + $foreground: map-get($theme, foreground); + $background: map-get($theme, background); + + .verified { + color: mat.get-color-from-palette($accent, 400); + } + + .not-verified { + color: mat.get-color-from-palette($primary, 200); + } +} + +@include theme($orcid-app-theme); \ No newline at end of file diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts new file mode 100644 index 0000000000..5e802953c2 --- /dev/null +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SummarySimplePanelComponent } from './summary-simple-panel.component'; + +describe('SummarySimplePanelComponent', () => { + let component: SummarySimplePanelComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SummarySimplePanelComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(SummarySimplePanelComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts new file mode 100644 index 0000000000..93b63b868b --- /dev/null +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts @@ -0,0 +1,49 @@ +import { Component, Input, OnDestroy, OnInit } from '@angular/core' +import { Subject } from 'rxjs' +import { takeUntil } from 'rxjs/operators' +import { PlatformInfoService } from 'src/app/cdk/platform-info' + +export interface SimpleActivityModel { + verified?: boolean + url?: string + countA?: number + countB?: number + stringA?: string + stringB?: string +} +;[] + +@Component({ + selector: 'app-summary-simple-panel', + templateUrl: './summary-simple-panel.component.html', + styleUrls: [ + './summary-simple-panel.component.scss', + './summary-simple-panel.component.scss-theme.scss', + ], +}) +export class SummarySimplePanelComponent implements OnInit, OnDestroy { + validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` + selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` + @Input() simpleActivities: SimpleActivityModel[] = [] + unsubscribe = new Subject() + mobile: boolean + + constructor(private _platform: PlatformInfoService) {} + ngOnDestroy(): void { + this.unsubscribe.next() + this.unsubscribe.complete() + } + + ngOnInit(): void { + this._platform + .get() + .pipe(takeUntil(this.unsubscribe)) + .subscribe((platform) => { + if (platform.columns4 || platform.columns8) { + this.mobile = true + } else { + this.mobile = false + } + }) + } +} diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html new file mode 100644 index 0000000000..334fef1e43 --- /dev/null +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html @@ -0,0 +1,120 @@ +
+
+ + +
+

{{ affiliation.name }}

+
+ + {{ + currentLocation + }}/{{ orcid }} + +
+
+
+
+
+ +

AFFILIATIONS

+ +

KEY DATES

+
+
    +
  • +
    + + Record created + + +
    +
    • +
  • +
    + + Record created + + +
    +
    • +
+
+ +
+
+ +

WORKS

+ + + +

PEER REVIEWS

+ + + +

FUNDING

+ + + +
+
+ +

PROFESSIONAL ACTIVITIES

+ + + +

OTHER IDENTIFIERS

+ + +
+
+
+
+ +
diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss new file mode 100644 index 0000000000..70a5ad8fe4 --- /dev/null +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss @@ -0,0 +1,164 @@ +:host { + display: flex; + align-items: center; + width: 100%; + justify-content: center; + min-height: 100vh +} + +.panel { + display: grid; + grid-template-columns: 1fr, 1fr, 1fr; + grid-gap: 10px; + border-radius: 8px 8px 0px 0px; + border: 2px solid var(--ui-background-ui-background-darkest, #212121); + + + +} + + +.panel-header { + border-bottom: 2px solid #212121; + grid-column: 1 / -1; + background-color: #003449; + color: #FFF; + padding: 16px; + display: flex; + flex-direction: row; + + caption { + text-align: initial; + display: inline; + line-height: 1; + + } + + + img { + padding-inline-end: 10px; + } + + .header-name { + display: flex; + flex-direction: column; + + h1 { + margin: 0; + line-height: 1; + word-break: break-word; + } + + + } +} + + +.column { + padding-left: 20px; + padding-right: 20px; + +} + +.mobile { + .panel-body { + grid-template-columns: 1fr; + } +} + +.panel-body { + grid-column: 1 / -1; + display: grid; + grid-template-columns: repeat(auto-fit, 250px); + + padding-bottom: 20px; +} + +.column-border { + border-right: 2px solid #EEE; +} + +h2 { + font-weight: 600; + letter-spacing: 2px; +} + +main { + width: 100%; + background: #FAFAFA; + max-width: 100%; + overflow: hidden; +} + +.date-item { + display: flex; + flex-direction: column; + padding-bottom: 16px; + + caption, + label { + display: block; + } +} + +.date-item.last-date { + padding-bottom: 0; + +} + +ul { + margin: 0; +} + +ul li { + position: relative; + /* so that pseudoelements are positioned relatively to their "li"s*/ + /* use padding-bottom instead of margin-bottom.*/ + margin-bottom: 0; + /* This overrides previously specified margin-bottom */ +} + +ul li:after { + /* bullets */ + content: url('/assets/vectors/bullet-point.svg'); + position: absolute; + left: -26px; + /*adjust manually*/ + top: 0px; +} + +ul li:before { + /* lines */ + content: ""; + position: absolute; + left: -16px; + /* adjust manually */ + border-left: 1px dashed #D4E7A1; + height: 100%; + width: 1px; +} + +ul li:first-child:before { + /* first li's line */ + top: 6px; + /* moves the line down so that it disappears under the bullet. Adjust manually */ +} + +ul li:last-child:before { + /* last li's line */ + height: 6px; + /* shorten the line so it goes only up to the bullet. Is equal to first-child:before's top */ +} + + +.card-container { + display: flex; + padding: 16px; + flex-direction: column; + justify-content: center; + align-items: flex-start; + gap: 16px; + border-radius: 4px; + border: 2px solid #EEE; + background: #FFF; +} \ No newline at end of file diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss-theme.scss b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss-theme.scss new file mode 100644 index 0000000000..1cf886430d --- /dev/null +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss-theme.scss @@ -0,0 +1,20 @@ +@use '@angular/material' as mat; +@import 'src/assets/scss/material.orcid-theme.scss'; + +@mixin theme($theme) { + $primary: map-get($theme, primary); + $accent: map-get($theme, accent); + $warn: map-get($theme, warn); + $foreground: map-get($theme, foreground); + $background: map-get($theme, background); + + .verified { + color: mat.get-color-from-palette($accent, 400); + } + + .not-verified { + color: mat.get-color-from-palette($primary, 200); + } +} + +@include theme($orcid-app-theme); \ No newline at end of file diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts new file mode 100644 index 0000000000..b32d3b6bf0 --- /dev/null +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts @@ -0,0 +1,23 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { TrustedSummaryComponent } from './trusted-summary.component'; + +describe('TrustedSummaryComponent', () => { + let component: TrustedSummaryComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ TrustedSummaryComponent ] + }) + .compileComponents(); + + fixture = TestBed.createComponent(TrustedSummaryComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts new file mode 100644 index 0000000000..3199a84c26 --- /dev/null +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts @@ -0,0 +1,136 @@ +import { Component, OnDestroy, OnInit } from '@angular/core' +import { Router } from '@angular/router' +import { TrustedSummaryService } from 'src/app/core/trusted-summary/trusted-summary.service' +import { TrustedSummary } from 'src/app/types/trust-summary' +import { SimpleActivityModel } from '../../component/summary-simple-panel/summary-simple-panel.component' +import { PlatformInfoService } from 'src/app/cdk/platform-info' +import { takeUntil } from 'rxjs/operators' +import { Subject } from 'rxjs' + +@Component({ + selector: 'app-trusted-summary', + templateUrl: './trusted-summary.component.html', + styleUrls: [ + './trusted-summary.component.scss', + './trusted-summary.component.scss-theme.scss', + ], +}) +export class TrustedSummaryComponent implements OnInit, OnDestroy { + affiliation: TrustedSummary + currentLocation: string + orcid: string + works: SimpleActivityModel[] = [] + unsubscribe = new Subject() + labelValidatedWorks = $localize`:@@record.validatedWorks:Validated works` + labelValidatedWork = $localize`:@@record.validatedWork:Validated work` + labelSelfAssertedWorks = $localize`:@@record.selfAssertedWorks:Self-asserted works` + labelSelfAssertedWork = $localize`:@@record.selfAssertedWork:Self-asserted work` + labelValidatedFunding = $localize`:@@record.validatedFunding:Validated funding` + labelValidatedFundings = $localize`:@@record.validatedFundings:Validated fundings` + labelSelfAssertedFunding = $localize`:@@record.selfAssertedFunding:Self-asserted funding` + labelSelfAssertedFundings = $localize`:@@record.selfAssertedFundings:Self-asserted fundings` + labelReviesFor = $localize`:@@record.reviewsFor:Reviews for` + labelReviewFor = $localize`:@@record.reviewFor:Review for` + labelpublicationgrants = $localize`:@@record.publicationgrantes:publication/grants` + labelpublicationgrant = $localize`:@@record.publicationgrant:publication/grant` + + funds: SimpleActivityModel[] = [] + peerReviews: SimpleActivityModel[] = [] + mobile: boolean + externalIdentifiers: SimpleActivityModel[] + + constructor( + private _affiliation: TrustedSummaryService, + private _router: Router, + private _platform: PlatformInfoService + ) {} + ngOnDestroy(): void { + this.unsubscribe.next() + this.unsubscribe.complete() + } + + ngOnInit(): void { + this._platform + .get() + .pipe(takeUntil(this.unsubscribe)) + .subscribe((platform) => { + if (platform.columns4 || platform.columns8) { + this.mobile = true + } else { + this.mobile = false + } + }) + this.currentLocation = window.location.origin + this.orcid = this._router.url.split('/')[1] + this._affiliation.getSummary(this.orcid).subscribe((data) => { + this.affiliation = data + if (this.affiliation.selfAssertedWorks) { + this.works.push({ + verified: false, + countA: this.affiliation.selfAssertedWorks, + stringA: + this.affiliation.selfAssertedWorks > 1 + ? this.labelSelfAssertedWorks + : this.labelSelfAssertedWork, + }) + } + if (this.affiliation.validatedWorks) { + this.works.push({ + verified: true, + countA: this.affiliation.validatedWorks, + stringA: + this.affiliation.validatedWorks > 1 + ? this.labelValidatedWorks + : this.labelValidatedWork, + }) + } + if (this.affiliation.validatedFunds) { + this.funds.push({ + verified: true, + countA: this.affiliation.validatedFunds, + stringA: + this.affiliation.validatedFunds > 1 + ? this.labelValidatedFundings + : this.labelValidatedFunding, + }) + } + if (this.affiliation.selfAssertedFunds) { + this.funds.push({ + verified: false, + countA: this.affiliation.selfAssertedFunds, + stringA: + this.affiliation.selfAssertedFunds > 1 + ? this.labelSelfAssertedFundings + : this.labelSelfAssertedFunding, + }) + } + if ( + this.affiliation.reviews && + this.affiliation.peerReviewPublicationGrants + ) { + this.peerReviews.push({ + verified: true, + countA: this.affiliation.reviews, + stringA: + this.affiliation.reviews > 1 + ? this.labelReviesFor + : this.labelReviewFor, + countB: this.affiliation.peerReviewPublicationGrants, + stringB: + this.affiliation.peerReviewPublicationGrants > 1 + ? this.labelpublicationgrants + : this.labelpublicationgrant, + }) + } + this.externalIdentifiers = this.affiliation.externalIdentifiers.map( + (id) => { + return { + verified: id.verified, + url: id.url, + stringA: id.id, + } + } + ) + }) + } +} diff --git a/src/app/trusted-summary/trusted-summary-routing.module.ts b/src/app/trusted-summary/trusted-summary-routing.module.ts new file mode 100644 index 0000000000..3c49708eff --- /dev/null +++ b/src/app/trusted-summary/trusted-summary-routing.module.ts @@ -0,0 +1,16 @@ +import { NgModule } from '@angular/core' +import { Routes, RouterModule } from '@angular/router' +import { TrustedSummaryComponent } from './pages/trusted-summary/trusted-summary.component' + +const routes: Routes = [ + { + path: '', + component: TrustedSummaryComponent, + }, +] + +@NgModule({ + imports: [RouterModule.forChild(routes)], + exports: [RouterModule], +}) +export class TrustedSummaryRouting {} diff --git a/src/app/trusted-summary/trusted-summary.module.ts b/src/app/trusted-summary/trusted-summary.module.ts new file mode 100644 index 0000000000..8e8f0d22f7 --- /dev/null +++ b/src/app/trusted-summary/trusted-summary.module.ts @@ -0,0 +1,28 @@ +import { NgModule } from '@angular/core' +import { CommonModule } from '@angular/common' +import { SummaryPanelComponent } from './component/summary-panel/summary-panel.component' +import { SummarySimplePanelComponent } from './component/summary-simple-panel/summary-simple-panel.component' +import { SummaryDatesPanelComponent } from './component/summary-dates-panel/summary-dates-panel.component' +import { TrustedSummaryComponent } from './pages/trusted-summary/trusted-summary.component' +import { TrustedSummaryRouting } from './trusted-summary-routing.module' +import { MatIconModule } from '@angular/material/icon' +import { + MatProgressSpinner, + MatProgressSpinnerModule, +} from '@angular/material/progress-spinner' + +@NgModule({ + declarations: [ + SummaryPanelComponent, + SummarySimplePanelComponent, + SummaryDatesPanelComponent, + TrustedSummaryComponent, + ], + imports: [ + CommonModule, + TrustedSummaryRouting, + MatIconModule, + MatProgressSpinnerModule, + ], +}) +export class TrustedSummaryModule {} diff --git a/src/app/types/trust-summary.ts b/src/app/types/trust-summary.ts new file mode 100644 index 0000000000..ba189e4edd --- /dev/null +++ b/src/app/types/trust-summary.ts @@ -0,0 +1,28 @@ +export interface TrustedSummary { + name: string + orcid: string + employmentAffiliations: ActivitySummary[] + employmentAffiliationsCount: number + creation: string + lastModified: string + validatedWorks: number + selfAssertedWorks: number + reviews: number + peerReviewPublicationGrants: number + validatedFunds: number + selfAssertedFunds: number + professionalActivities: ActivitySummary[] + professionalActivitiesCount: number + externalIdentifiers: any[] +} + +export interface ActivitySummary { + organizationName?: string + url?: string + startDate?: string + endDate?: string + role?: string + title: any + type: string + validatedOrSelfAsserted: boolean +} diff --git a/src/assets/vectors/bullet-point.svg b/src/assets/vectors/bullet-point.svg new file mode 100644 index 0000000000..5ab9f03859 --- /dev/null +++ b/src/assets/vectors/bullet-point.svg @@ -0,0 +1,3 @@ + + + \ No newline at end of file From ef459599a9f6b459d379670087621aa5727f65d2 Mon Sep 17 00:00:00 2001 From: Leonardo Mendoza Date: Wed, 26 Jul 2023 19:07:06 -0600 Subject: [PATCH 2/6] summary --- src/app/constants.ts | 1 + .../month-day-year-date-to-string.pipe.ts | 4 +- .../summary-panel.component.html | 12 ++- .../summary-panel/summary-panel.component.ts | 10 +- .../summary-simple-panel.component.html | 9 ++ .../summary-simple-panel.component.ts | 5 + .../trusted-summary.component.html | 101 +++++++++++++----- .../trusted-summary.component.scss | 56 +++++++--- .../trusted-summary.component.ts | 25 +++++ .../trusted-summary/trusted-summary.module.ts | 2 + 10 files changed, 172 insertions(+), 53 deletions(-) diff --git a/src/app/constants.ts b/src/app/constants.ts index 79559e2569..db456633ee 100644 --- a/src/app/constants.ts +++ b/src/app/constants.ts @@ -233,6 +233,7 @@ export function routerSummaryPageUrl(segments: UrlSegment[]) { if ( segments[0] && isValidOrcidFormat(segments[0].path) && + segments[1] && segments[1].path === 'summary' ) { return { consumed: [segments[0], segments[1]] } diff --git a/src/app/shared/pipes/month-day-year-date-to-string/month-day-year-date-to-string.pipe.ts b/src/app/shared/pipes/month-day-year-date-to-string/month-day-year-date-to-string.pipe.ts index 375a82c3c2..531fd5d546 100644 --- a/src/app/shared/pipes/month-day-year-date-to-string/month-day-year-date-to-string.pipe.ts +++ b/src/app/shared/pipes/month-day-year-date-to-string/month-day-year-date-to-string.pipe.ts @@ -5,8 +5,8 @@ import { MonthDayYearDate } from 'src/app/types' name: 'monthDayYearDateToString', }) export class MonthDayYearDateToStringPipe implements PipeTransform { - transform(value: MonthDayYearDate | number): string { - if (typeof value === 'number') { + transform(value: MonthDayYearDate | number | string): string { + if (typeof value === 'number' || typeof value === 'string') { const date = new Date(value) value = { day: date.getUTCDate() + '', diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html index db2db49ece..f58a34349d 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html @@ -83,10 +83,16 @@
- 2020-02-02 to present + + {{ activity.startDate | monthDayYearDateToString }} + + + to + {{ activity.endDate | monthDayYearDateToString }} + -
Professor of Psychoceramic
-
Employment
+
{{ activity.role }}
+
{{ activity.type }}
diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts index 9e4035bf3f..d3fb4af401 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts @@ -45,15 +45,7 @@ export class SummaryPanelComponent implements OnInit { if (this.activitySummary) { this.activitySummary = [...this.activitySummary, ...this.activitySummary] - this.activitiesToDisplay = this.activitySummary - .slice(0, 3) - .map((activity) => { - return { - ...activity, - organizationName: 'Hey hello', - validatedOrSelfAsserted: false, - } - }) + this.activitiesToDisplay = this.activitySummary.slice(0, 3) this.acitivityCountOverflow = this.count > 3 } diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html index 09fab0adfd..10b578f25c 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.html @@ -85,4 +85,13 @@ +
+ + {{ count - 3 }} more Affiliations +
diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts index 93b63b868b..befa69425f 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts @@ -25,8 +25,11 @@ export class SummarySimplePanelComponent implements OnInit, OnDestroy { validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` @Input() simpleActivities: SimpleActivityModel[] = [] + @Input() count: number = 0 + @Input() overflowUrl: string = '' unsubscribe = new Subject() mobile: boolean + acitivityCountOverflow = false constructor(private _platform: PlatformInfoService) {} ngOnDestroy(): void { @@ -35,6 +38,8 @@ export class SummarySimplePanelComponent implements OnInit, OnDestroy { } ngOnInit(): void { + this.acitivityCountOverflow = this.simpleActivities.length > 3 + this.simpleActivities = this.simpleActivities.slice(0, 3) this._platform .get() .pipe(takeUntil(this.unsubscribe)) diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html index 334fef1e43..782387827b 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html @@ -8,31 +8,70 @@
-
-

{{ affiliation.name }}

-
- - {{ - currentLocation - }}/{{ orcid }} - -
+
+ +

{{ affiliation.name }}

+ +
+ + + + + + +
+
-
+
-

AFFILIATIONS

+ +

AFFILIATIONS

+ -

KEY DATES

+ +

KEY DATES

+
  • @@ -46,7 +85,7 @@

    KEY DATES

    Record created
@@ -56,7 +95,7 @@

KEY DATES

Record created
@@ -66,25 +105,29 @@

KEY DATES

-

WORKS

+ +

WORKS

+ -

PEER REVIEWS

+ +

PEER REVIEWS

+ -

FUNDING

+ +

FUNDING

+ FUNDING
-

PROFESSIONAL ACTIVITIES

+ +

PROFESSIONAL ACTIVITIES

+ PROFESSIONAL ACTIVITIES > -

OTHER IDENTIFIERS

+ +

OTHER IDENTIFIERS

+
diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss index 70a5ad8fe4..a04b7b68ec 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.scss @@ -1,15 +1,13 @@ :host { display: flex; align-items: center; - width: 100%; justify-content: center; min-height: 100vh } .panel { display: grid; - grid-template-columns: 1fr, 1fr, 1fr; - grid-gap: 10px; + grid-gap: 16px; border-radius: 8px 8px 0px 0px; border: 2px solid var(--ui-background-ui-background-darkest, #212121); @@ -19,8 +17,8 @@ .panel-header { + height: 46px; border-bottom: 2px solid #212121; - grid-column: 1 / -1; background-color: #003449; color: #FFF; padding: 16px; @@ -57,21 +55,25 @@ .column { padding-left: 20px; padding-right: 20px; - } -.mobile { - .panel-body { - grid-template-columns: 1fr; - } -} .panel-body { grid-column: 1 / -1; display: grid; - grid-template-columns: repeat(auto-fit, 250px); + padding-bottom: 16px; +} - padding-bottom: 20px; +.panel-body-3-cols { + grid-template-columns: 1fr 1fr 1fr; +} + +.panel-body-2-cols { + grid-template-columns: 1fr 1fr; +} + +.panel-body-1-cols { + grid-template-columns: 1fr; } .column-border { @@ -84,7 +86,6 @@ h2 { } main { - width: 100%; background: #FAFAFA; max-width: 100%; overflow: hidden; @@ -161,4 +162,33 @@ ul li:last-child:before { border-radius: 4px; border: 2px solid #EEE; background: #FFF; +} + +.cursor-pointer { + cursor: pointer; +} + +a { + .label-with-icon { + padding-top: 2px; + color: #FFF; + text-decoration: underline; + + >svg>path { + fill: #FFF; + } + + display: flex; + align-items: centerf; + gap: 8px; + } + + h1 { + color: #FFF; + + } + + h2 { + color: black; + } } \ No newline at end of file diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts index 3199a84c26..2bc98a263e 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts @@ -38,6 +38,9 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { peerReviews: SimpleActivityModel[] = [] mobile: boolean externalIdentifiers: SimpleActivityModel[] + twoColumns: boolean = false + threeColumns: boolean = false + oneColumn: boolean constructor( private _affiliation: TrustedSummaryService, @@ -50,6 +53,7 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { } ngOnInit(): void { + this._platform .get() .pipe(takeUntil(this.unsubscribe)) @@ -131,6 +135,27 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { } } ) + + if ( + (this.works.length > 0 || + this.funds.length > 0 || + this.peerReviews.length > 0) && + (this.externalIdentifiers.length > 0 || + this.affiliation.professionalActivitiesCount > 0 || + this.affiliation.externalIdentifiers.length > 0) + ) { + this.threeColumns = true + } else if ( + this.works.length > 0 || + this.funds.length > 0 || + this.peerReviews.length > 0 || + this.externalIdentifiers.length > 0 || + this.affiliation.professionalActivitiesCount > 0 + ) { + this.twoColumns = true + } else { + this.oneColumn = true + } }) } } diff --git a/src/app/trusted-summary/trusted-summary.module.ts b/src/app/trusted-summary/trusted-summary.module.ts index 8e8f0d22f7..6b430519e1 100644 --- a/src/app/trusted-summary/trusted-summary.module.ts +++ b/src/app/trusted-summary/trusted-summary.module.ts @@ -10,6 +10,7 @@ import { MatProgressSpinner, MatProgressSpinnerModule, } from '@angular/material/progress-spinner' +import { SharedModule } from '../shared/shared.module' @NgModule({ declarations: [ @@ -23,6 +24,7 @@ import { TrustedSummaryRouting, MatIconModule, MatProgressSpinnerModule, + SharedModule, ], }) export class TrustedSummaryModule {} From f42d796813c26738671d8a0354a26b8f05621034 Mon Sep 17 00:00:00 2001 From: Leonardo Mendoza Date: Wed, 26 Jul 2023 19:21:38 -0600 Subject: [PATCH 3/6] Fix testing --- .../trusted-summary.service.spec.ts | 29 ++++++---- .../summary-panel.component.html | 8 +-- .../summary-panel.component.spec.ts | 28 +++++----- .../summary-panel/summary-panel.component.ts | 14 ----- .../summary-simple-panel.component.scss | 7 --- .../summary-simple-panel.component.ts | 18 +------ .../trusted-summary.component.html | 53 ++++++++++--------- .../trusted-summary.component.spec.ts | 41 +++++++++----- .../trusted-summary.component.ts | 52 +++++++++--------- 9 files changed, 117 insertions(+), 133 deletions(-) diff --git a/src/app/core/trusted-summary/trusted-summary.service.spec.ts b/src/app/core/trusted-summary/trusted-summary.service.spec.ts index d75801f0db..a87f5c8548 100644 --- a/src/app/core/trusted-summary/trusted-summary.service.spec.ts +++ b/src/app/core/trusted-summary/trusted-summary.service.spec.ts @@ -1,16 +1,27 @@ -import { TestBed } from '@angular/core/testing'; +import { TestBed } from '@angular/core/testing' -import { TrustedSummaryService } from './trusted-summary.service'; +import { TrustedSummaryService } from './trusted-summary.service' +import { HttpClientTestingModule } from '@angular/common/http/testing' +import { ErrorHandlerService } from '../error-handler/error-handler.service' describe('TrustedSummaryService', () => { - let service: TrustedSummaryService; + let service: TrustedSummaryService beforeEach(() => { - TestBed.configureTestingModule({}); - service = TestBed.inject(TrustedSummaryService); - }); + TestBed.configureTestingModule({ + imports: [HttpClientTestingModule], + providers: [ + { provide: ErrorHandlerService, userValue: {} }, + { + provide: ErrorHandlerService, + useValue: {}, + }, + ], + }) + service = TestBed.inject(TrustedSummaryService) + }) it('should be created', () => { - expect(service).toBeTruthy(); - }); -}); + expect(service).toBeTruthy() + }) +}) diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html index f58a34349d..22d51ba06f 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html @@ -1,10 +1,4 @@ -
+
{ - let component: SummaryPanelComponent; - let fixture: ComponentFixture; + let component: SummaryPanelComponent + let fixture: ComponentFixture beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [ SummaryPanelComponent ] - }) - .compileComponents(); + declarations: [SummaryPanelComponent], + providers: [], + }).compileComponents() - fixture = TestBed.createComponent(SummaryPanelComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + fixture = TestBed.createComponent(SummaryPanelComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) it('should create', () => { - expect(component).toBeTruthy(); - }); -}); + expect(component).toBeTruthy() + }) +}) diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts index d3fb4af401..3419de3675 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts @@ -22,9 +22,6 @@ export class SummaryPanelComponent implements OnInit { activitiesToDisplay: ActivitySummary[] acitivityCountOverflow: boolean unsubscribe = new Subject() - mobile: boolean - - constructor(private _platform: PlatformInfoService) {} ngOnDestroy(): void { this.unsubscribe.next() @@ -32,17 +29,6 @@ export class SummaryPanelComponent implements OnInit { } ngOnInit(): void { - this._platform - .get() - .pipe(takeUntil(this.unsubscribe)) - .subscribe((platform) => { - if (platform.columns4 || platform.columns8) { - this.mobile = true - } else { - this.mobile = false - } - }) - if (this.activitySummary) { this.activitySummary = [...this.activitySummary, ...this.activitySummary] this.activitiesToDisplay = this.activitySummary.slice(0, 3) diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss index 5584dca4bb..75e51b14ec 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss @@ -12,13 +12,6 @@ } -.mobile { - :host { - .card-container { - max-width: 100%; - } - } -} .activity-container.padding-botton { diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts index befa69425f..9f00a0867f 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts @@ -21,7 +21,7 @@ export interface SimpleActivityModel { './summary-simple-panel.component.scss-theme.scss', ], }) -export class SummarySimplePanelComponent implements OnInit, OnDestroy { +export class SummarySimplePanelComponent implements OnInit { validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` @Input() simpleActivities: SimpleActivityModel[] = [] @@ -31,24 +31,8 @@ export class SummarySimplePanelComponent implements OnInit, OnDestroy { mobile: boolean acitivityCountOverflow = false - constructor(private _platform: PlatformInfoService) {} - ngOnDestroy(): void { - this.unsubscribe.next() - this.unsubscribe.complete() - } - ngOnInit(): void { this.acitivityCountOverflow = this.simpleActivities.length > 3 this.simpleActivities = this.simpleActivities.slice(0, 3) - this._platform - .get() - .pipe(takeUntil(this.unsubscribe)) - .subscribe((platform) => { - if (platform.columns4 || platform.columns8) { - this.mobile = true - } else { - this.mobile = false - } - }) } } diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html index 782387827b..68e03805a3 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html @@ -1,5 +1,5 @@
-
+
-

{{ affiliation.name }}

+

{{ trustedSummary.name }}

+ +

AFFILIATIONS

 - +

KEY DATES
@@ -78,24 +78,27 @@

KEY DATES

Record created
  • -
    +
    Record created
    • @@ -109,7 +112,7 @@

    KEY DATES

    *ngIf="peerReviews?.length || works?.length || funds?.length" > - +

    WORKS

     WORKS >     - +

    PEER REVIEWS

     PEER REVIEWS >     - +

    FUNDING

     @@ -137,33 +140,33 @@

    FUNDING

    - - + +

    PROFESSIONAL ACTIVITIES

         - +

    OTHER IDENTIFIERS
    -
    +
    diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts index b32d3b6bf0..f2ac458fcc 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.spec.ts @@ -1,23 +1,36 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed } from '@angular/core/testing' -import { TrustedSummaryComponent } from './trusted-summary.component'; +import { TrustedSummaryComponent } from './trusted-summary.component' +import { TrustedSummaryService } from 'src/app/core/trusted-summary/trusted-summary.service' +import { ErrorHandlerService } from 'src/app/core/error-handler/error-handler.service' +import { HttpClientTestingModule } from '@angular/common/http/testing' +import { PlatformInfoService } from 'src/app/cdk/platform-info' +import { of } from 'rxjs' describe('TrustedSummaryComponent', () => { - let component: TrustedSummaryComponent; - let fixture: ComponentFixture; + let component: TrustedSummaryComponent + let fixture: ComponentFixture beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [ TrustedSummaryComponent ] - }) - .compileComponents(); + declarations: [TrustedSummaryComponent], + providers: [ + { provide: ErrorHandlerService, userValue: {} }, + { + provide: TrustedSummaryService, + useValue: { getSummary: () => of() }, + }, + { provide: PlatformInfoService, useValue: { get: () => of() } }, + ], + imports: [HttpClientTestingModule], + }).compileComponents() - fixture = TestBed.createComponent(TrustedSummaryComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + fixture = TestBed.createComponent(TrustedSummaryComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) it('should create', () => { - expect(component).toBeTruthy(); - }); -}); + expect(component).toBeTruthy() + }) +}) diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts index 2bc98a263e..4b83eb69f0 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.ts @@ -16,7 +16,7 @@ import { Subject } from 'rxjs' ], }) export class TrustedSummaryComponent implements OnInit, OnDestroy { - affiliation: TrustedSummary + trustedSummary: TrustedSummary currentLocation: string orcid: string works: SimpleActivityModel[] = [] @@ -43,7 +43,7 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { oneColumn: boolean constructor( - private _affiliation: TrustedSummaryService, + private _trustedSummary: TrustedSummaryService, private _router: Router, private _platform: PlatformInfoService ) {} @@ -66,67 +66,67 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { }) this.currentLocation = window.location.origin this.orcid = this._router.url.split('/')[1] - this._affiliation.getSummary(this.orcid).subscribe((data) => { - this.affiliation = data - if (this.affiliation.selfAssertedWorks) { + this._trustedSummary.getSummary(this.orcid).subscribe((data) => { + this.trustedSummary = data + if (this.trustedSummary.selfAssertedWorks) { this.works.push({ verified: false, - countA: this.affiliation.selfAssertedWorks, + countA: this.trustedSummary.selfAssertedWorks, stringA: - this.affiliation.selfAssertedWorks > 1 + this.trustedSummary.selfAssertedWorks > 1 ? this.labelSelfAssertedWorks : this.labelSelfAssertedWork, }) } - if (this.affiliation.validatedWorks) { + if (this.trustedSummary.validatedWorks) { this.works.push({ verified: true, - countA: this.affiliation.validatedWorks, + countA: this.trustedSummary.validatedWorks, stringA: - this.affiliation.validatedWorks > 1 + this.trustedSummary.validatedWorks > 1 ? this.labelValidatedWorks : this.labelValidatedWork, }) } - if (this.affiliation.validatedFunds) { + if (this.trustedSummary.validatedFunds) { this.funds.push({ verified: true, - countA: this.affiliation.validatedFunds, + countA: this.trustedSummary.validatedFunds, stringA: - this.affiliation.validatedFunds > 1 + this.trustedSummary.validatedFunds > 1 ? this.labelValidatedFundings : this.labelValidatedFunding, }) } - if (this.affiliation.selfAssertedFunds) { + if (this.trustedSummary.selfAssertedFunds) { this.funds.push({ verified: false, - countA: this.affiliation.selfAssertedFunds, + countA: this.trustedSummary.selfAssertedFunds, stringA: - this.affiliation.selfAssertedFunds > 1 + this.trustedSummary.selfAssertedFunds > 1 ? this.labelSelfAssertedFundings : this.labelSelfAssertedFunding, }) } if ( - this.affiliation.reviews && - this.affiliation.peerReviewPublicationGrants + this.trustedSummary.reviews && + this.trustedSummary.peerReviewPublicationGrants ) { this.peerReviews.push({ verified: true, - countA: this.affiliation.reviews, + countA: this.trustedSummary.reviews, stringA: - this.affiliation.reviews > 1 + this.trustedSummary.reviews > 1 ? this.labelReviesFor : this.labelReviewFor, - countB: this.affiliation.peerReviewPublicationGrants, + countB: this.trustedSummary.peerReviewPublicationGrants, stringB: - this.affiliation.peerReviewPublicationGrants > 1 + this.trustedSummary.peerReviewPublicationGrants > 1 ? this.labelpublicationgrants : this.labelpublicationgrant, }) } - this.externalIdentifiers = this.affiliation.externalIdentifiers.map( + this.externalIdentifiers = this.trustedSummary.externalIdentifiers.map( (id) => { return { verified: id.verified, @@ -141,8 +141,8 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { this.funds.length > 0 || this.peerReviews.length > 0) && (this.externalIdentifiers.length > 0 || - this.affiliation.professionalActivitiesCount > 0 || - this.affiliation.externalIdentifiers.length > 0) + this.trustedSummary.professionalActivitiesCount > 0 || + this.trustedSummary.externalIdentifiers.length > 0) ) { this.threeColumns = true } else if ( @@ -150,7 +150,7 @@ export class TrustedSummaryComponent implements OnInit, OnDestroy { this.funds.length > 0 || this.peerReviews.length > 0 || this.externalIdentifiers.length > 0 || - this.affiliation.professionalActivitiesCount > 0 + this.trustedSummary.professionalActivitiesCount > 0 ) { this.twoColumns = true } else { From 8606c5fb0f2ac5f194c2d68449365f438eb67b02 Mon Sep 17 00:00:00 2001 From: Leonardo Mendoza Date: Wed, 26 Jul 2023 19:40:59 -0600 Subject: [PATCH 4/6] Enable translations --- src/app/constants.ts | 3 - .../summary-dates-panel.component.html | 1 - .../summary-dates-panel.component.scss | 0 .../summary-dates-panel.component.spec.ts | 23 ------ .../summary-dates-panel.component.ts | 15 ---- .../summary-panel.component.html | 7 +- .../summary-panel.component.scss | 16 ++-- .../summary-panel.component.scss-theme.scss | 2 +- .../summary-panel/summary-panel.component.ts | 7 +- .../summary-simple-panel.component.scss | 20 ++--- ...ary-simple-panel.component.scss-theme.scss | 2 +- .../summary-simple-panel.component.spec.ts | 27 +++---- .../summary-simple-panel.component.ts | 4 +- .../trusted-summary.component.html | 81 +++++++++++++++---- .../trusted-summary.component.scss | 39 +++------ .../trusted-summary.component.scss-theme.scss | 2 +- .../trusted-summary.component.ts | 25 +++--- .../trusted-summary/trusted-summary.module.ts | 2 - .../properties/summary/summary.en.properties | 25 ++++++ 19 files changed, 149 insertions(+), 152 deletions(-) delete mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html delete mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss delete mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts delete mode 100644 src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts create mode 100644 src/locale/properties/summary/summary.en.properties diff --git a/src/app/constants.ts b/src/app/constants.ts index db456633ee..0ea5047377 100644 --- a/src/app/constants.ts +++ b/src/app/constants.ts @@ -27,7 +27,6 @@ import { } from './types/record-affiliation.endpoint' import { WorkBibtexModalComponent } from './record/components/work-stack-group/modals/work-bibtex-modal/work-bibtex-modal.component' import { environment } from 'src/environments/environment' -import { log } from 'console' export { COUNTRY_NAMES_TO_COUNTRY_CODES } from './constants-country-codes' @@ -219,7 +218,6 @@ export function objectToUrlParameters(object: Object) { } export function routerPublicPageUrl(segments: UrlSegment[]) { - console.log(segments) if (segments[0] && isValidOrcidFormat(segments[0].path)) { return { consumed: [segments[0]] } } @@ -229,7 +227,6 @@ export function routerPublicPageUrl(segments: UrlSegment[]) { } export function routerSummaryPageUrl(segments: UrlSegment[]) { - console.log(segments) if ( segments[0] && isValidOrcidFormat(segments[0].path) && diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html deleted file mode 100644 index f33eb4e9e7..0000000000 --- a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.html +++ /dev/null @@ -1 +0,0 @@ -

    summary-dates-panel works!

    diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.scss deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts deleted file mode 100644 index 2859aa7512..0000000000 --- a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.spec.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; - -import { SummaryDatesPanelComponent } from './summary-dates-panel.component'; - -describe('SummaryDatesPanelComponent', () => { - let component: SummaryDatesPanelComponent; - let fixture: ComponentFixture; - - beforeEach(async () => { - await TestBed.configureTestingModule({ - declarations: [ SummaryDatesPanelComponent ] - }) - .compileComponents(); - - fixture = TestBed.createComponent(SummaryDatesPanelComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); - - it('should create', () => { - expect(component).toBeTruthy(); - }); -}); diff --git a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts b/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts deleted file mode 100644 index 2a71d57554..0000000000 --- a/src/app/trusted-summary/component/summary-dates-panel/summary-dates-panel.component.ts +++ /dev/null @@ -1,15 +0,0 @@ -import { Component, OnInit } from '@angular/core'; - -@Component({ - selector: 'app-summary-dates-panel', - templateUrl: './summary-dates-panel.component.html', - styleUrls: ['./summary-dates-panel.component.scss'] -}) -export class SummaryDatesPanelComponent implements OnInit { - - constructor() { } - - ngOnInit(): void { - } - -} diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html index 22d51ba06f..5c4e640479 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.html +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.html @@ -81,7 +81,7 @@ {{ activity.startDate | monthDayYearDateToString }} - to + to {{ activity.endDate | monthDayYearDateToString }} @@ -96,7 +96,10 @@ class="underline orc-font-body-small" target="_blank" rel="noopener noreferrer" - >+ {{ count - 3 }} more Affiliations+ {{ count - 3 }} + more Affiliations
    diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss index 4170ce5dfb..76f95cd640 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss @@ -5,10 +5,9 @@ justify-content: center; align-items: flex-start; gap: 16px; - border: 2px solid #EEE; + border: 2px solid #eee; border-radius: 4px; background-color: white; - } .mobile { @@ -21,7 +20,6 @@ .activity-container.padding-botton { padding-bottom: 16px; - } .activity-container { @@ -39,18 +37,15 @@ display: flex; align-items: center; - color: rgba(0, 0, 0, 0.90); + color: rgba(0, 0, 0, 0.9); h3 { font-weight: 400; margin: 0; } - } - - display: flex; padding-bottom: 4px; } @@ -64,17 +59,16 @@ } .activity-container.with-border { - border-bottom: 2px solid #EEE; + border-bottom: 2px solid #eee; } .body-wrapper { - color: rgba(0, 0, 0, 0.60); + color: rgba(0, 0, 0, 0.6); margin-inline-start: 27px; } mat-icon.margin-compensation { margin-bottom: 3px; - } mat-icon { @@ -84,4 +78,4 @@ mat-icon { a { font-weight: 400; -} \ No newline at end of file +} diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss index 1cf886430d..dcd9db0f95 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.scss-theme.scss @@ -17,4 +17,4 @@ } } -@include theme($orcid-app-theme); \ No newline at end of file +@include theme($orcid-app-theme); diff --git a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts index 3419de3675..93e0381bb3 100644 --- a/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts +++ b/src/app/trusted-summary/component/summary-panel/summary-panel.component.ts @@ -1,8 +1,5 @@ import { Component, Input, OnInit } from '@angular/core' -import { log } from 'console' import { Subject } from 'rxjs' -import { takeUntil } from 'rxjs/operators' -import { PlatformInfoService } from 'src/app/cdk/platform-info' import { ActivitySummary } from 'src/app/types/trust-summary' @Component({ @@ -14,8 +11,8 @@ import { ActivitySummary } from 'src/app/types/trust-summary' ], }) export class SummaryPanelComponent implements OnInit { - validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` - selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` + validatedSourceAriaLabel = $localize`:@@summary.validatedSource:Validated source` + selftAssertedSource = $localize`:@@summary.selfAssertedSource:Self-asserted source` @Input() activitySummary: ActivitySummary[] @Input() url: string = '' @Input() count: number = 0 diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss index 75e51b14ec..ba70e4d7c5 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss @@ -5,21 +5,15 @@ justify-content: center; align-items: flex-start; gap: 16px; - border: 2px solid #EEE; + border: 2px solid #eee; border-radius: 4px; background-color: white; - - } - - .activity-container.padding-botton { padding-bottom: 16px; - } - .activity-container { width: 100%; border-bottom: 16px; @@ -35,16 +29,13 @@ display: flex; align-items: center; - color: rgba(0, 0, 0, 0.90); + color: rgba(0, 0, 0, 0.9); h3 { margin: 0; } - } - - display: flex; padding-bottom: 4px; } @@ -57,17 +48,16 @@ } .activity-container.with-border { - border-bottom: 2px solid #EEE; + border-bottom: 2px solid #eee; } .body-wrapper { - color: rgba(0, 0, 0, 0.60); + color: rgba(0, 0, 0, 0.6); margin-inline-start: 25px; } mat-icon.margin-compensation { margin-bottom: 3px; - } mat-icon { @@ -77,4 +67,4 @@ mat-icon { a { font-weight: 400; -} \ No newline at end of file +} diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss index 1cf886430d..dcd9db0f95 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.scss-theme.scss @@ -17,4 +17,4 @@ } } -@include theme($orcid-app-theme); \ No newline at end of file +@include theme($orcid-app-theme); diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts index 5e802953c2..15255373ae 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.spec.ts @@ -1,23 +1,22 @@ -import { ComponentFixture, TestBed } from '@angular/core/testing'; +import { ComponentFixture, TestBed } from '@angular/core/testing' -import { SummarySimplePanelComponent } from './summary-simple-panel.component'; +import { SummarySimplePanelComponent } from './summary-simple-panel.component' describe('SummarySimplePanelComponent', () => { - let component: SummarySimplePanelComponent; - let fixture: ComponentFixture; + let component: SummarySimplePanelComponent + let fixture: ComponentFixture beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [ SummarySimplePanelComponent ] - }) - .compileComponents(); + declarations: [SummarySimplePanelComponent], + }).compileComponents() - fixture = TestBed.createComponent(SummarySimplePanelComponent); - component = fixture.componentInstance; - fixture.detectChanges(); - }); + fixture = TestBed.createComponent(SummarySimplePanelComponent) + component = fixture.componentInstance + fixture.detectChanges() + }) it('should create', () => { - expect(component).toBeTruthy(); - }); -}); + expect(component).toBeTruthy() + }) +}) diff --git a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts index 9f00a0867f..9cd5442836 100644 --- a/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts +++ b/src/app/trusted-summary/component/summary-simple-panel/summary-simple-panel.component.ts @@ -22,8 +22,8 @@ export interface SimpleActivityModel { ], }) export class SummarySimplePanelComponent implements OnInit { - validatedSourceAriaLabel = $localize`:@@record.validatedSource:Validated source` - selftAssertedSource = $localize`:@@record.selfAssertedSource:Self-asserted source` + validatedSourceAriaLabel = $localize`:@@summary.validatedSource:Validated source` + selftAssertedSource = $localize`:@@summary.selfAssertedSource:Self-asserted source` @Input() simpleActivities: SimpleActivityModel[] = [] @Input() count: number = 0 @Input() overflowUrl: string = '' diff --git a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html index 68e03805a3..b8d4ce041d 100644 --- a/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html +++ b/src/app/trusted-summary/pages/trusted-summary/trusted-summary.component.html @@ -62,15 +62,27 @@

    {{ trustedSummary.name }}

    [ngClass]="{ 'column-border': !mobile && (twoColumns || threeColumns) }" > - -

    AFFILIATIONS

    +     +

    + AFFILIATIONS +

    - -

    KEY DATES

    +     +

    + KEY DATES +

      @@ -81,7 +93,10 @@

      KEY DATES

      'last-date': !trustedSummary.lastModified }" > - + Record created