added displaying mentions #55

This commit is contained in:
Nicolas Constant 2019-03-25 00:52:30 -04:00
parent 06a9e4abff
commit 5a0deefa80
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
7 changed files with 174 additions and 30 deletions

View File

@ -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() {
}
}

View File

@ -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>

View File

@ -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){

View File

@ -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;
});
}
}

View File

@ -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() {
}
}

View File

@ -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;

View File

@ -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;
}