added displaying mentions #55
This commit is contained in:
parent
06a9e4abff
commit
5a0deefa80
|
@ -1,15 +1,28 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, OnInit, Input } from '@angular/core';
|
||||
|
||||
import { AccountWrapper } from '../../../../models/account.models';
|
||||
|
||||
@Component({
|
||||
selector: 'app-direct-messages',
|
||||
templateUrl: './direct-messages.component.html',
|
||||
styleUrls: ['./direct-messages.component.scss']
|
||||
selector: 'app-direct-messages',
|
||||
templateUrl: './direct-messages.component.html',
|
||||
styleUrls: ['./direct-messages.component.scss']
|
||||
})
|
||||
export class DirectMessagesComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
@Input('account')
|
||||
set account(acc: AccountWrapper) {
|
||||
console.warn('account');
|
||||
this._account = acc;
|
||||
}
|
||||
get account(): AccountWrapper {
|
||||
return this._account;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
private _account: AccountWrapper;
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -28,10 +28,9 @@
|
|||
</a>
|
||||
</div>
|
||||
|
||||
<app-direct-messages class="account__body" *ngIf="subPanel === 'dm'"></app-direct-messages>
|
||||
<app-direct-messages class="account__body" *ngIf="subPanel === 'dm'" [account]="account"></app-direct-messages>
|
||||
<app-favorites class="account__body" *ngIf="subPanel === 'favorites'" [account]="account"></app-favorites>
|
||||
<app-mentions class="account__body" *ngIf="subPanel === 'mentions'"></app-mentions>
|
||||
<app-my-account class="account__body" *ngIf="subPanel === 'account'" [account]="account">
|
||||
</app-my-account>
|
||||
<app-notifications class="account__body" *ngIf="subPanel === 'notifications'"></app-notifications>
|
||||
<app-mentions class="account__body" *ngIf="subPanel === 'mentions'" [account]="account"></app-mentions>
|
||||
<app-my-account class="account__body" *ngIf="subPanel === 'account'" [account]="account"></app-my-account>
|
||||
<app-notifications class="account__body" *ngIf="subPanel === 'notifications'" [account]="account"></app-notifications>
|
||||
</div>
|
|
@ -26,7 +26,6 @@ export class ManageAccountComponent implements OnInit, OnDestroy {
|
|||
|
||||
@Input('account')
|
||||
set account(acc: AccountWrapper) {
|
||||
console.warn('account');
|
||||
this._account = acc;
|
||||
this.checkNotifications();
|
||||
}
|
||||
|
@ -49,6 +48,10 @@ export class ManageAccountComponent implements OnInit, OnDestroy {
|
|||
}
|
||||
|
||||
private checkNotifications(){
|
||||
if(this.userNotificationServiceSub){
|
||||
this.userNotificationServiceSub.unsubscribe();
|
||||
}
|
||||
|
||||
this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => {
|
||||
const userNotification = userNotifications.find(x => x.account.id === this.account.info.id);
|
||||
if(userNotification){
|
||||
|
|
|
@ -1,15 +1,113 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, OnInit, OnDestroy, Input, ViewChild, ElementRef } from '@angular/core';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { AccountWrapper } from '../../../../models/account.models';
|
||||
import { UserNotificationServiceService, UserNotification } from '../../../../services/user-notification-service.service';
|
||||
import { StatusWrapper } from '../../../../models/common.model';
|
||||
import { Status, Notification } from '../../../../services/models/mastodon.interfaces';
|
||||
import { MastodonService } from '../../../../services/mastodon.service';
|
||||
import { NotificationService } from '../../../../services/notification.service';
|
||||
|
||||
|
||||
@Component({
|
||||
selector: 'app-mentions',
|
||||
templateUrl: './mentions.component.html',
|
||||
styleUrls: ['./mentions.component.scss']
|
||||
selector: 'app-mentions',
|
||||
templateUrl: '../../../stream/stream-statuses/stream-statuses.component.html',
|
||||
styleUrls: ['../../../stream/stream-statuses/stream-statuses.component.scss']
|
||||
})
|
||||
export class MentionsComponent implements OnInit {
|
||||
export class MentionsComponent implements OnInit, OnDestroy {
|
||||
statuses: StatusWrapper[] = [];
|
||||
displayError: string;
|
||||
isLoading = false;
|
||||
isThread = false;
|
||||
hasContentWarnings = false;
|
||||
|
||||
@Input('account')
|
||||
set account(acc: AccountWrapper) {
|
||||
console.warn('account');
|
||||
this._account = acc;
|
||||
this.loadMentions();
|
||||
}
|
||||
get account(): AccountWrapper {
|
||||
return this._account;
|
||||
}
|
||||
|
||||
@ViewChild('statusstream') public statustream: ElementRef;
|
||||
|
||||
constructor() { }
|
||||
private maxReached = false;
|
||||
private _account: AccountWrapper;
|
||||
private userNotificationServiceSub: Subscription;
|
||||
private lastId: string;
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
constructor(
|
||||
private readonly notificationService: NotificationService,
|
||||
private readonly userNotificationService: UserNotificationServiceService,
|
||||
private readonly mastodonService: MastodonService) { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.userNotificationServiceSub.unsubscribe();
|
||||
}
|
||||
|
||||
private loadMentions(){
|
||||
if(this.userNotificationServiceSub){
|
||||
this.userNotificationServiceSub.unsubscribe();
|
||||
}
|
||||
|
||||
this.statuses.length = 0;
|
||||
this.userNotificationService.markMentionsAsRead(this.account.info);
|
||||
|
||||
this.userNotificationServiceSub = this.userNotificationService.userNotifications.subscribe((userNotifications: UserNotification[]) => {
|
||||
const userNotification = userNotifications.find(x => x.account.id === this.account.info.id);
|
||||
if(userNotification && userNotification.mentions){
|
||||
userNotification.mentions.forEach((mention: Status) => {
|
||||
const statusWrapper = new StatusWrapper(mention, this.account.info);
|
||||
this.statuses.push(statusWrapper);
|
||||
});
|
||||
}
|
||||
this.lastId = userNotification.lastId;
|
||||
});
|
||||
}
|
||||
|
||||
onScroll() {
|
||||
var element = this.statustream.nativeElement as HTMLElement;
|
||||
const atBottom = element.scrollHeight <= element.clientHeight + element.scrollTop + 1000;
|
||||
|
||||
if (atBottom) {
|
||||
this.scrolledToBottom();
|
||||
}
|
||||
}
|
||||
|
||||
private scrolledToBottom() {
|
||||
if (this.isLoading || this.maxReached || this.statuses.length === 0) return;
|
||||
|
||||
this.isLoading = true;
|
||||
|
||||
console.warn(`this.lastId ${this.lastId}`);
|
||||
|
||||
this.mastodonService.getNotifications(this.account.info, ['follow', 'favourite', 'reblog'], this.lastId)
|
||||
.then((result: Notification[]) => {
|
||||
console.warn(result);
|
||||
|
||||
const statuses = result.map(x => x.status);
|
||||
if (statuses.length === 0) {
|
||||
this.maxReached = true;
|
||||
return;
|
||||
}
|
||||
|
||||
for (const s of statuses) {
|
||||
const wrapper = new StatusWrapper(s, this.account.info);
|
||||
this.statuses.push(wrapper);
|
||||
}
|
||||
|
||||
this.lastId = result[result.length - 1].id;
|
||||
})
|
||||
.catch(err => {
|
||||
this.notificationService.notifyHttpError(err);
|
||||
})
|
||||
.then(() => {
|
||||
this.isLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,15 +1,28 @@
|
|||
import { Component, OnInit } from '@angular/core';
|
||||
import { Component, OnInit, Input } from '@angular/core';
|
||||
|
||||
import { AccountWrapper } from '../../../../models/account.models';
|
||||
|
||||
@Component({
|
||||
selector: 'app-notifications',
|
||||
templateUrl: './notifications.component.html',
|
||||
styleUrls: ['./notifications.component.scss']
|
||||
selector: 'app-notifications',
|
||||
templateUrl: './notifications.component.html',
|
||||
styleUrls: ['./notifications.component.scss']
|
||||
})
|
||||
export class NotificationsComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
@Input('account')
|
||||
set account(acc: AccountWrapper) {
|
||||
console.warn('account');
|
||||
this._account = acc;
|
||||
}
|
||||
get account(): AccountWrapper {
|
||||
return this._account;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
private _account: AccountWrapper;
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -252,7 +252,7 @@ export class MastodonService {
|
|||
private formatArray(data: string[], paramName: string): string {
|
||||
let result = '';
|
||||
data.forEach(x => {
|
||||
if (result.includes('paramName')) result += '&';
|
||||
if (result.includes(paramName)) result += '&';
|
||||
result += `${paramName}[]=${x}`;
|
||||
});
|
||||
return result;
|
||||
|
|
|
@ -11,7 +11,6 @@ import { NotificationService } from './notification.service';
|
|||
providedIn: 'root'
|
||||
})
|
||||
export class UserNotificationServiceService {
|
||||
|
||||
userNotifications = new BehaviorSubject<UserNotification[]>([]);
|
||||
|
||||
constructor(
|
||||
|
@ -52,6 +51,8 @@ export class UserNotificationServiceService {
|
|||
const userNotifications = notifications.filter(x => x.type !== 'mention');
|
||||
const userMentions = notifications.filter(x => x.type === 'mention').map(x => x.status);
|
||||
|
||||
const lastId = notifications[notifications.length - 1].id;
|
||||
|
||||
if (currentAccountNotifications) {
|
||||
const currentUserNotifications = currentAccountNotifications.notifications;
|
||||
const currentUserMentions = currentAccountNotifications.mentions;
|
||||
|
@ -66,6 +67,7 @@ export class UserNotificationServiceService {
|
|||
currentAccountNotifications.hasNewNotifications = hasNewNotifications;
|
||||
currentAccountNotifications.notifications = userNotifications;
|
||||
currentAccountNotifications.mentions = userMentions;
|
||||
currentAccountNotifications.lastId = lastId;
|
||||
|
||||
currentNotifications = currentNotifications.filter(x => x.account.id !== account.id);
|
||||
currentNotifications.push(currentAccountNotifications);
|
||||
|
@ -78,11 +80,26 @@ export class UserNotificationServiceService {
|
|||
newNotifications.hasNewMentions = false; //TODO: check in local settings
|
||||
newNotifications.notifications = userNotifications;
|
||||
newNotifications.mentions = userMentions;
|
||||
newNotifications.lastId = lastId;
|
||||
|
||||
currentNotifications.push(newNotifications);
|
||||
this.userNotifications.next(currentNotifications);
|
||||
}
|
||||
}
|
||||
|
||||
markMentionsAsRead(account: AccountInfo) {
|
||||
let currentNotifications = this.userNotifications.value;
|
||||
const currentAccountNotifications = currentNotifications.find(x => x.account.id === account.id);
|
||||
currentAccountNotifications.hasNewMentions = false;
|
||||
this.userNotifications.next(currentNotifications);
|
||||
}
|
||||
|
||||
markNotificationAsRead(account: AccountInfo) {
|
||||
let currentNotifications = this.userNotifications.value;
|
||||
const currentAccountNotifications = currentNotifications.find(x => x.account.id === account.id);
|
||||
currentAccountNotifications.hasNewNotifications = false;
|
||||
this.userNotifications.next(currentNotifications);
|
||||
}
|
||||
}
|
||||
|
||||
export class UserNotification {
|
||||
|
@ -91,4 +108,5 @@ export class UserNotification {
|
|||
hasNewMentions: boolean;
|
||||
notifications: Notification[] = [];
|
||||
mentions: Status[] = [];
|
||||
lastId: string;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue