better error display

This commit is contained in:
Nicolas Constant 2019-09-07 17:52:07 -04:00
parent 0c00a2aa86
commit 55d5f82e80
No known key found for this signature in database
GPG Key ID: 1E9F677FB01A5688
28 changed files with 123 additions and 82 deletions

View File

@ -100,7 +100,7 @@ export class AutosuggestComponent implements OnInit, OnDestroy {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
}

View File

@ -94,7 +94,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, value.provider);
})
.then(() => {
this.isSending = false;
@ -288,7 +288,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
this.countStatusChar(this.status);
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.selectedAccount);
});
}
@ -304,7 +304,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
this.setVisibility(defaultPrivacy);
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.selectedAccount);
});
}
@ -468,7 +468,7 @@ export class CreateStatusComponent implements OnInit, OnDestroy {
}
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, acc);
})
.then(() => {
this.isSending = false;

View File

@ -40,7 +40,7 @@ export class EmojiPickerComponent implements OnInit {
this.customEmojis = emojis.map(x => this.convertEmoji(x));
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, currentAccount);
})
.then(() => {
this.loaded = true;

View File

@ -69,11 +69,11 @@ export class AddNewAccountComponent implements OnInit {
})
.catch((err: HttpErrorResponse) => {
if (err instanceof HttpErrorResponse) {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, null);
} else if ((<Error>err).message === 'CORS') {
this.notificationService.notify('Connection Error. It\'s usually a CORS issue with the server you\'re connecting to. Please check in the console and if so, contact your administrator with those informations.', true);
this.notificationService.notify(null, null, 'Connection Error. It\'s usually a CORS issue with the server you\'re connecting to. Please check in the console and if so, contact your administrator with those informations.', true);
} else {
this.notificationService.notify('Unkown error', true);
this.notificationService.notify(null, null, 'Unkown error', true);
}
});

View File

@ -65,7 +65,7 @@ export class DirectMessagesComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;
@ -100,7 +100,7 @@ export class DirectMessagesComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;

View File

@ -65,7 +65,7 @@ export class FavoritesComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;
@ -102,7 +102,7 @@ export class FavoritesComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;

View File

@ -67,7 +67,7 @@ export class ManageAccountComponent implements OnInit, OnDestroy {
this.userAccount = acc;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
});
}

View File

@ -118,7 +118,7 @@ export class MentionsComponent implements OnInit, OnDestroy {
this.lastId = result[result.length - 1].id;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;

View File

@ -38,7 +38,7 @@ export class ListEditorComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
});
}
@ -57,7 +57,7 @@ export class ListEditorComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
});
}
@ -89,7 +89,7 @@ export class ListEditorComponent implements OnInit {
this.accountsInList.push(accountWrapper);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
accountWrapper.isLoading = false;
@ -131,7 +131,7 @@ export class ListEditorComponent implements OnInit {
this.accountsInList = this.accountsInList.filter(x => x.account.id !== accountWrapper.account.id);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
accountWrapper.isLoading = false;

View File

@ -115,7 +115,7 @@ export class MyAccountComponent implements OnInit, OnDestroy {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
});
}
@ -149,7 +149,7 @@ export class MyAccountComponent implements OnInit, OnDestroy {
this.availableLists.push(wrappedStream);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.creationLoading = false;
@ -178,7 +178,7 @@ export class MyAccountComponent implements OnInit, OnDestroy {
this.availableLists = this.availableLists.filter(x => x.id !== list.id);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
});
return false;

View File

@ -119,7 +119,7 @@ export class NotificationsComponent implements OnInit, OnDestroy {
this.lastId = notifications[notifications.length - 1].id;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account.info);
})
.then(() => {
this.isLoading = false;

View File

@ -57,7 +57,7 @@ export class ScheduledStatusComponent implements OnInit {
this.scheduledStatusService.removeStatus(this.account, this.status.id);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account);
})
.then(() => {
this.isLoading = false;
@ -87,7 +87,7 @@ export class ScheduledStatusComponent implements OnInit {
this.rescheduledEvent.next();
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account);
})
.then(() => {
this.isLoading = false;

View File

@ -82,7 +82,7 @@ export class SearchComponent implements OnInit {
}
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.lastAccountUsed);
})
.then(() => { this.isLoading = false; });
}

View File

@ -45,7 +45,7 @@ export class AccountIconComponent implements OnInit {
window.open(account.url, '_blank');
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, null);
});
return false;
}

View File

@ -1,5 +1,13 @@
<div class="notification-hub">
<div class="notification-hub__notification" [ngClass]="{'notification-hub__notification--error':notification.isError}" *ngFor="let notification of notifications" (click)="onClick(notification)" title="close">
{{ notification.message }}
<div class="notification-hub__notification"
[ngClass]="{'notification-hub__notification--error':notification.isError}"
*ngFor="let notification of notifications" (click)="onClick(notification)" title="close">
<img class="notification-hub__notification--avatar" *ngIf="notification.avatar"
src="{{ notification.avatar }}" />
<div class="notification-hub__notification--message">
<span *ngIf="!notification.message">Error {{ notification.errorCode }}</span>
<span *ngIf="notification.message">{{ notification.message }}</span>
</div>
</div>
</div>
</div>

View File

@ -7,10 +7,11 @@
&__notification{
background-color: #22b90e;
color: black;
padding: 5px 10px;
padding: 5px 10px 5px 5px;
border-radius: 2px;
margin: 0 0 5px 15px;
max-width: 305px;
min-height: 40px;
white-space: pre-line;
word-wrap: break-word;
cursor: pointer;
@ -19,5 +20,14 @@
background-color: #be0a0a;
color: whitesmoke;
}
&--avatar {
width: 30px;
float: left;
}
&--message {
margin-left: 37px;
}
}
}

View File

@ -23,13 +23,13 @@ export class NotificationHubComponent implements OnInit {
//this.autoSubmit();
}
autoSubmit(): any {
this.notificationService.notify("test message", true);
// autoSubmit(): any {
// //this.notificationService.notify("test message", true);
setTimeout(() => {
this.autoSubmit();
}, 1500);
}
// setTimeout(() => {
// this.autoSubmit();
// }, 1500);
// }
onClick(notification: NotificatioData): void{
this.notifications = this.notifications.filter(x => x.id !== notification.id);

View File

@ -161,7 +161,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
this.checkIfBoosted();
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
})
.then(() => {
this.boostIsLoading = false;
@ -192,7 +192,7 @@ export class ActionBarComponent implements OnInit, OnDestroy {
// this.isFavorited = !this.isFavorited;
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
})
.then(() => {
this.favoriteIsLoading = false;

View File

@ -139,7 +139,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.notificationService.hideAccount(target);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, acc);
});
});
@ -157,7 +157,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.notificationService.hideAccount(target);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, acc);
});
});
@ -175,7 +175,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.displayedStatus.muted = status.muted;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
return false;
@ -192,7 +192,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.displayedStatus.muted = status.muted;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
return false;
@ -210,7 +210,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.displayedStatus.pinned = status.pinned;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
return false;
@ -227,7 +227,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.displayedStatus.pinned = status.pinned;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
return false;
@ -249,7 +249,7 @@ export class StatusUserContextMenuComponent implements OnInit, OnDestroy {
this.notificationService.deleteStatus(deletedStatus);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, selectedAccount);
});
return false;

View File

@ -99,7 +99,7 @@ export class PollComponent implements OnInit {
return poll;
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, newSelectedAccount);
return null;
});
} else if (this.statusWrapper.status.visibility !== 'public' && this.statusWrapper.status.visibility !== 'unlisted' && this.statusWrapper.provider.id !== newSelectedAccount.id) {
@ -109,7 +109,7 @@ export class PollComponent implements OnInit {
.then((poll: Poll) => {
this.poll = poll;
})
.catch(err => this.notificationService.notifyHttpError(err));
.catch(err => this.notificationService.notifyHttpError(err, newSelectedAccount));
}
this.selectedAccount = newSelectedAccount;
}
@ -127,7 +127,7 @@ export class PollComponent implements OnInit {
this.poll = poll;
this.pollPerAccountId[selectedAccount.id] = Promise.resolve(poll);
})
.catch(err => this.notificationService.notifyHttpError(err));
.catch(err => this.notificationService.notifyHttpError(err, selectedAccount));
return false;
}
@ -152,7 +152,7 @@ export class PollComponent implements OnInit {
this.poll = poll;
this.pollPerAccountId[selectedAccount.id] = Promise.resolve(poll);
})
.catch(err => this.notificationService.notifyHttpError(err));
.catch(err => this.notificationService.notifyHttpError(err, selectedAccount));
return false;
}

View File

@ -259,7 +259,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
}
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account);
})
.then(() => {
this.isLoading = false;
@ -287,7 +287,7 @@ export class StreamStatusesComponent implements OnInit, OnDestroy {
}
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.account);
});
}

View File

@ -179,7 +179,7 @@ export class ThreadComponent implements OnInit, OnDestroy {
}, 0);
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, currentAccount);
})
.then(() => {
this.isLoading = false;

View File

@ -106,7 +106,7 @@ export class UserProfileComponent implements OnInit {
return this.getFollowStatus(userAccount, account);
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
})
.then(() => {
this.loadingRelationShip = false;
@ -170,7 +170,7 @@ export class UserProfileComponent implements OnInit {
return Promise.all([getFollowStatusPromise, getStatusesPromise, getPinnedStatusesPromise]);
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, this.currentlyUsedAccount);
})
.then(() => {
this.isLoading = false;
@ -188,7 +188,7 @@ export class UserProfileComponent implements OnInit {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
});
}
@ -200,7 +200,7 @@ export class UserProfileComponent implements OnInit {
this.loadStatus(userAccount, statuses);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
})
.then(() => {
this.statusLoading = false;
@ -214,7 +214,7 @@ export class UserProfileComponent implements OnInit {
this.relationship = result.filter(x => x.id === account.id)[0];
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
})
.then(() => {
this.loadingRelationShip = false;
@ -277,7 +277,7 @@ export class UserProfileComponent implements OnInit {
this.relationship = relationship;
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
});
return false;
}
@ -292,7 +292,7 @@ export class UserProfileComponent implements OnInit {
this.relationship = relationship;
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, userAccount);
});
return false;
}

View File

@ -58,7 +58,7 @@ export class RegisterNewAccountComponent implements OnInit {
var instance = appDataWrapper.instance.toLowerCase();
if(this.isAccountAlreadyPresent(username, instance)){
this.notificationService.notify(`Account @${username}@${instance} is already registered`, true);
this.notificationService.notify(null, null, `Account @${username}@${instance} is already registered`, true);
this.router.navigate(['/home']);
return;
}
@ -75,7 +75,7 @@ export class RegisterNewAccountComponent implements OnInit {
});
})
.catch((err: HttpErrorResponse) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, null);
});
});
}

View File

@ -45,7 +45,7 @@ export class MediaService {
})
.catch((err) => {
this.remove(wrapper);
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
});
}
@ -60,7 +60,7 @@ export class MediaService {
this.mediaSubject.next(medias);
})
.catch((err) => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
});
}
@ -94,7 +94,7 @@ export class MediaService {
})
.catch((err) => {
this.remove(media);
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
});
}
}

View File

@ -1,8 +1,11 @@
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';
import { HttpErrorResponse } from '@angular/common/http';
import { StatusWrapper } from '../models/common.model';
import { Account } from './models/mastodon.interfaces';
import { AccountInfo } from '../states/accounts.state';
import { ToolsService } from './tools.service';
@Injectable()
export class NotificationService {
@ -11,34 +14,52 @@ export class NotificationService {
public hideAccountUrlStream = new Subject<string>();
public deletedStatusStream = new Subject<StatusWrapper>();
constructor() {
constructor(private readonly toolsService: ToolsService) {
}
public notify(message: string, isError: boolean){
let newNotification = new NotificatioData(message, isError);
public notify(avatar: string, errorCode: number, message: string, isError: boolean) {
let newNotification = new NotificatioData(avatar, errorCode, message, isError);
this.notifactionStream.next(newNotification);
}
public notifyHttpError(err: HttpErrorResponse){
let message = 'Oops, Unknown Error' ;
try{
message = `Oops, Error ${err.status}`;
console.error(err.message);
} catch(err){}
this.notify(message, true);
public notifyHttpError(err: HttpErrorResponse, account: AccountInfo) {
let message = 'Oops, Unknown Error';
let code: number;
console.warn(err);
try {
code = err.status;
message = err.error.error; //Mastodon
if (!message) {
message = err.error.errors.detail; //Pleroma
}
} catch (err) { }
if (account) {
this.toolsService.getAvatar(account)
.then((avatar: string) => {
this.notify(avatar, code, message, true);
})
.catch(err => {
});
} else {
this.notify(null, code, message, true);
}
}
// public newStatusPosted(status: StatusWrapper){
public newStatusPosted(uiStatusRepliedToId: string, response: StatusWrapper){
public newStatusPosted(uiStatusRepliedToId: string, response: StatusWrapper) {
const notification = new NewReplyData(uiStatusRepliedToId, response);
this.newRespondPostedStream.next(notification);
}
public hideAccount(account: Account){
public hideAccount(account: Account) {
this.hideAccountUrlStream.next(account.url);
}
public deleteStatus(status: StatusWrapper){
public deleteStatus(status: StatusWrapper) {
this.deletedStatusStream.next(status);
}
}
@ -47,15 +68,17 @@ export class NotificatioData {
public id: string;
constructor(
public avatar: string,
public errorCode: number,
public message: string,
public isError: boolean
) {
) {
this.id = `${message}${new Date().getTime()}`;
}
}
export class NewReplyData {
constructor(public uiStatusId: string, public response: StatusWrapper){
constructor(public uiStatusId: string, public response: StatusWrapper) {
}
}

View File

@ -46,7 +46,7 @@ export class ScheduledStatusService {
}
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
});
}

View File

@ -40,7 +40,7 @@ export class UserNotificationService {
this.processNotifications(account, notifications);
})
.catch(err => {
this.notificationService.notifyHttpError(err);
this.notificationService.notifyHttpError(err, account);
});
promises.push(getNotificationPromise);
});