added delete list functionnality #46
This commit is contained in:
parent
5568c3c38d
commit
72e72cfc86
|
@ -9,12 +9,24 @@
|
|||
|
||||
<h4 class="my-account__label my-account__margin-top">manage list:</h4>
|
||||
<div class="my-account__link--margin-bottom" *ngFor="let list of availableLists">
|
||||
<a href class="my-account__list--button" title="delete list" (click)="deleteList(list)">
|
||||
<a href class="my-account__list--button" title="delete list"
|
||||
(click)="openCloseDeleteConfirmation(list, true)" *ngIf="!list.confirmDeletion">
|
||||
<fa-icon class="my-account__link--icon" [icon]="faTrash"></fa-icon>
|
||||
</a>
|
||||
<a href class="my-account__list--button" title="edit list" (click)="editList(list)">
|
||||
<a href class="my-account__list--button" title="edit list"
|
||||
(click)="editList(list)" *ngIf="!list.confirmDeletion">
|
||||
<fa-icon class="my-account__link--icon" [icon]="faPenAlt"></fa-icon>
|
||||
</a>
|
||||
|
||||
<a href class="my-account__list--button" title="cancel"
|
||||
(click)="openCloseDeleteConfirmation(list, false)" *ngIf="list.confirmDeletion">
|
||||
<fa-icon class="my-account__link--icon" [icon]="faTimes"></fa-icon>
|
||||
</a>
|
||||
<a href class="my-account__list--button my-account__red" title="delete list"
|
||||
(click)="deleteList(list)" *ngIf="list.confirmDeletion">
|
||||
<fa-icon class="my-account__link--icon" [icon]="faCheck"></fa-icon>
|
||||
</a>
|
||||
|
||||
<a class="my-account__link my-account__list my-account__blue" href (click)="addStream(list)"
|
||||
title="{{ list.isAdded ? '' : 'add list'}}" [class.my-account__link--disabled]="list.isAdded">
|
||||
{{ list.name }} <fa-icon class="my-account__link--icon" *ngIf="list.isAdded" [icon]="faCheckSquare">
|
||||
|
|
|
@ -17,22 +17,7 @@
|
|||
margin-top: 10px;
|
||||
margin-left: 5px;
|
||||
color: $font-color-secondary;
|
||||
}
|
||||
&__blue {
|
||||
background-color: $color-primary;
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: lighten($color-primary, 15);
|
||||
}
|
||||
}
|
||||
&__red {
|
||||
$red-button-color: rgb(65, 3, 3);
|
||||
background-color: $red-button-color;
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: lighten($red-button-color, 15);
|
||||
}
|
||||
}
|
||||
}
|
||||
&__link {
|
||||
text-decoration: none;
|
||||
display: block; // width: calc(100% - 20px);
|
||||
|
@ -90,4 +75,19 @@
|
|||
&__margin-top {
|
||||
margin-top: 25px;
|
||||
}
|
||||
&__blue {
|
||||
background-color: $color-primary;
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: lighten($color-primary, 15);
|
||||
}
|
||||
}
|
||||
&__red {
|
||||
$red-button-color: rgb(65, 3, 3);
|
||||
background-color: $red-button-color;
|
||||
color: #fff;
|
||||
&:hover {
|
||||
background-color: lighten($red-button-color, 15);
|
||||
}
|
||||
}
|
||||
}
|
|
@ -2,7 +2,7 @@ import { Component, OnInit, OnDestroy, Input } from '@angular/core';
|
|||
import { Observable, Subscription } from 'rxjs';
|
||||
import { Store, Select } from '@ngxs/store';
|
||||
import { faCheckSquare } from "@fortawesome/free-regular-svg-icons";
|
||||
import { faPenAlt, faTrash, faPlus } from "@fortawesome/free-solid-svg-icons";
|
||||
import { faPenAlt, faTrash, faPlus, faCheck, faTimes } from "@fortawesome/free-solid-svg-icons";
|
||||
|
||||
import { NotificationService } from '../../../../services/notification.service';
|
||||
import { StreamElement, StreamTypeEnum, AddStream, RemoveAllStreams } from '../../../../states/streams.state';
|
||||
|
@ -21,6 +21,8 @@ export class MyAccountComponent implements OnInit, OnDestroy {
|
|||
faTrash = faTrash;
|
||||
faPenAlt = faPenAlt;
|
||||
faCheckSquare = faCheckSquare;
|
||||
faCheck = faCheck;
|
||||
faTimes = faTimes;
|
||||
|
||||
availableStreams: StreamWrapper[] = [];
|
||||
availableLists: StreamWrapper[] = [];
|
||||
|
@ -136,8 +138,19 @@ export class MyAccountComponent implements OnInit, OnDestroy {
|
|||
return false;
|
||||
}
|
||||
|
||||
deleteList(list: StreamWrapper): boolean {
|
||||
openCloseDeleteConfirmation(list: StreamWrapper, state: boolean): boolean {
|
||||
list.confirmDeletion = state;
|
||||
return false;
|
||||
}
|
||||
|
||||
deleteList(list: StreamWrapper): boolean {
|
||||
this.mastodonService.deleteList(this.account.info, list.listId)
|
||||
.then(() => {
|
||||
this.availableLists = this.availableLists.filter(x => x.id !== list.id);
|
||||
})
|
||||
.catch(err => {
|
||||
this.notificationService.notifyHttpError(err);
|
||||
});
|
||||
|
||||
return false;
|
||||
}
|
||||
|
|
|
@ -7,7 +7,7 @@ import { AccountInfo } from '../states/accounts.state';
|
|||
import { StreamTypeEnum, StreamElement } from '../states/streams.state';
|
||||
|
||||
@Injectable()
|
||||
export class MastodonService {
|
||||
export class MastodonService {
|
||||
private apiRoutes = new ApiRoutes();
|
||||
|
||||
constructor(private readonly httpClient: HttpClient) { }
|
||||
|
@ -280,6 +280,12 @@ export class MastodonService {
|
|||
return new StreamElement(StreamTypeEnum.list, list.title, account.id, null, list.title, list.id, account.instance);
|
||||
});
|
||||
}
|
||||
|
||||
deleteList(account: AccountInfo, listId: string): Promise<any> {
|
||||
let route = `https://${account.instance}${this.apiRoutes.deleteList}`.replace('{0}', listId);
|
||||
const headers = new HttpHeaders({ 'Authorization': `Bearer ${account.token.access_token}` });
|
||||
return this.httpClient.delete(route, { headers: headers }).toPromise();
|
||||
}
|
||||
}
|
||||
|
||||
export enum VisibilityEnum {
|
||||
|
|
Loading…
Reference in New Issue