Marmelator/red-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1.4k Wiki Activity

fix initials avatar not reloading user

Browse Source
This commit is contained in:
Dan Percic 2021-05-10 11:53:32 +03:00
parent 5cf4903fd6
commit 8356caa722
4 changed files with 44 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/red-ui/src/app/modules/projects/screens/project-listing-screen/project-listing-screen.component.html
View File

@ -125,7 +125,7 @@
<redaction-needs-work-badge [needsWorkInput]="pw"></redaction-needs-work-badge>
</div>
<div class="user-column">
<redaction-initials-avatar [user]="getUser(pw.project.ownerId)" [withName]="true"></redaction-initials-avatar>
<redaction-initials-avatar [userId]="pw.project.ownerId" [withName]="true"></redaction-initials-avatar>
</div>
<div class="status-container">
<redaction-project-listing-actions (actionPerformed)="actionPerformed($event)" [project]="pw"></redaction-project-listing-actions>

6
apps/red-ui/src/app/modules/projects/screens/project-listing-screen/project-listing-screen.component.ts
View File

@ -1,5 +1,5 @@
import { Component, Injector, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { Project, RuleSetModel, User } from '@redaction/red-ui-http';
import { Project, RuleSetModel } from '@redaction/red-ui-http';
import { AppStateService } from '../../../../state/app-state.service';
import { UserService } from '../../../../services/user.service';
import { DoughnutChartConfig } from '../../../shared/components/simple-doughnut-chart/simple-doughnut-chart.component';
@ -157,10 +157,6 @@ export class ProjectListingScreenComponent extends BaseListingComponent<ProjectW
return this._userService.user;
}
public getUser(id: string): User {
return this._userService.getUserById(id);
}
public get activeProjectsCount() {
return this.allEntities.filter((p) => p.project.status === Project.StatusEnum.ACTIVE).length;
}

14
apps/red-ui/src/app/modules/projects/screens/project-overview-screen/project-overview-screen.component.ts
View File

@ -51,6 +51,8 @@ export class ProjectOverviewScreenComponent extends BaseListingComponent<FileSta
@ViewChild('projectDetailsComponent', { static: false })
private _projectDetailsComponent: ProjectDetailsComponent;
private _filesAutoUpdateTimer: Subscription;
private _routerEventsScrollPositionSub: Subscription;
private _fileChangedSub: Subscription;
private _lastScrollPosition: number;
@ViewChild(CdkVirtualScrollViewport) private _scrollBar: CdkVirtualScrollViewport;
@ -58,12 +60,10 @@ export class ProjectOverviewScreenComponent extends BaseListingComponent<FileSta
@ViewChild('statusFilter') private _statusFilterComponent: FilterComponent;
@ViewChild('peopleFilter') private _peopleFilterComponent: FilterComponent;
@ViewChild('needsWorkFilter') private _needsWorkFilterComponent: FilterComponent;
private _routerEventsScrollPositionSub: Subscription;
private _fileChangedSub: Subscription;
constructor(
public readonly userService: UserService,
public readonly permissionsService: PermissionsService,
private readonly _userService: UserService,
private readonly _notificationService: NotificationService,
private readonly _dialogService: ProjectsDialogService,
private readonly _fileUploadService: FileUploadService,
@ -97,9 +97,9 @@ export class ProjectOverviewScreenComponent extends BaseListingComponent<FileSta
});
this._routerEventsScrollPositionSub = this._router.events
.pipe(filter((events) => events instanceof NavigationStart || events instanceof NavigationEnd))
.subscribe((event) => {
if (event instanceof NavigationStart && !event.url.endsWith(this._appStateService.activeProjectId)) {
.pipe(filter((events) => events instanceof NavigationStart))
.subscribe((event: NavigationStart) => {
if (!event.url.endsWith(this._appStateService.activeProjectId)) {
this._lastScrollPosition = this._scrollBar.measureScrollOffset('top');
}
});
@ -263,7 +263,7 @@ export class ProjectOverviewScreenComponent extends BaseListingComponent<FileSta
allDistinctPeople.forEach((userId) => {
peopleFilters.push({
key: userId,
label: this.userService.getNameForId(userId)
label: this._userService.getNameForId(userId)
});
});
this.peopleFilters = processFilters(this.peopleFilters, peopleFilters);

74
apps/red-ui/src/app/modules/shared/components/initials-avatar/initials-avatar.component.ts
View File

@ -1,4 +1,4 @@
import { Component, Input, OnChanges, OnInit } from '@angular/core';
import { Component, Input, OnChanges } from '@angular/core';
import { UserService } from '../../../../services/user.service';
import { User } from '@redaction/red-ui-http';
import { TranslateService } from '@ngx-translate/core';
@ -8,7 +8,7 @@ import { TranslateService } from '@ngx-translate/core';
templateUrl: './initials-avatar.component.html',
styleUrls: ['./initials-avatar.component.scss']
})
export class InitialsAvatarComponent implements OnInit, OnChanges {
export class InitialsAvatarComponent implements OnChanges {
@Input() public userId: string;
@Input() public user: User;
@Input() public color = 'lightgray';
@ -18,65 +18,61 @@ export class InitialsAvatarComponent implements OnInit, OnChanges {
@Input() public tooltipPosition: 'below' | 'above' = 'above';
public displayName: string;
public initials: string;
public colorClass: string;
constructor(private readonly _userService: UserService, private readonly _translateService: TranslateService) {}
ngOnInit(): void {}
ngOnChanges(): void {
const isSystemUser = this.userId && this.userId.toLowerCase() === 'system';
if (!isSystemUser) {
if (this.user) {
this.userId = this.user.userId;
} else {
this.user = this._userService.getUserById(this.userId);
}
this.displayName = this._userService.getName(this.user);
if (this.showYou && this._userService.userId === this.userId) {
this.displayName += ` (${this._translateService.instant('initials-avatar.you')})`;
}
this.initials = this._getInitials();
this.colorClass = this._colorClass;
} else {
if (isSystemUser) {
this.displayName = 'System';
this.initials = 'SY';
this.colorClass = 'red-white red';
return;
}
if (this.userId) {
this.user = this._userService.getUserById(this.userId);
}
this.displayName = this._userService.getName(this.user);
if (this.showYou && this._isCurrentUser) {
this.displayName += ` (${this._translateService.instant('initials-avatar.you')})`;
}
this.initials = this._getInitials();
this.colorClass = this._colorClass;
}
private _getInitials() {
private _getInitials(): string {
if (!this.user) {
return '?';
} else {
return this._userService
.getName(this.user)
.split(' ')
.filter((value) => value !== ' ')
.filter((value, idx) => idx < 2)
.map((str) => str[0])
.join('');
}
return this._userService
.getName(this.user)
.split(' ')
.filter((value) => value !== ' ')
.filter((value, idx) => idx < 2)
.map((str) => str[0])
.join('');
}
private get _colorClass() {
if (this._userService.userId === this.userId) {
return 'red-white';
}
if (this.disabled) {
return 'inactive';
}
if (this.color.includes('-')) {
return this.color;
}
private get _colorClass(): string {
if (this._isCurrentUser) return 'red-white';
if (this.disabled) return 'inactive';
if (this.color.includes('-')) return this.color;
return `${this.color}-dark`;
}
private get _isCurrentUser(): boolean {
return this.user && this._userService.userId === this.user.userId;
}
public get hasBorder(): boolean {
return !!this.user && this._userService.userId !== this.userId && this._userService.isManager(this.user);
return !!this.user && !this._isCurrentUser && this._userService.isManager(this.user);
}
public get disabled(): boolean {