diff options
author | Chocobozzz <me@florianbigard.com> | 2020-07-27 11:40:30 +0200 |
---|---|---|
committer | Chocobozzz <chocobozzz@cpy.re> | 2020-07-31 11:35:19 +0200 |
commit | 94148c9028829b5576a5dcbfba2c7fb9cf6443d3 (patch) | |
tree | 2774f272329111abd03e8441ff936da11fb1a3f3 /client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts | |
parent | 441e453ae53e491b09c9b09b00b041788176ce64 (diff) | |
download | PeerTube-94148c9028829b5576a5dcbfba2c7fb9cf6443d3.tar.gz PeerTube-94148c9028829b5576a5dcbfba2c7fb9cf6443d3.tar.zst PeerTube-94148c9028829b5576a5dcbfba2c7fb9cf6443d3.zip |
Add abuse messages management in my account
Diffstat (limited to 'client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts')
-rw-r--r-- | client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts | 127 |
1 files changed, 127 insertions, 0 deletions
diff --git a/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts b/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts new file mode 100644 index 000000000..03f5ad735 --- /dev/null +++ b/client/src/app/shared/shared-abuse-list/abuse-message-modal.component.ts | |||
@@ -0,0 +1,127 @@ | |||
1 | import { Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core' | ||
2 | import { AuthService, Notifier } from '@app/core' | ||
3 | import { AbuseValidatorsService, FormReactive, FormValidatorService } from '@app/shared/shared-forms' | ||
4 | import { NgbModal } from '@ng-bootstrap/ng-bootstrap' | ||
5 | import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref' | ||
6 | import { I18n } from '@ngx-translate/i18n-polyfill' | ||
7 | import { AbuseMessage, UserAbuse } from '@shared/models' | ||
8 | import { AbuseService } from '../shared-moderation' | ||
9 | |||
10 | @Component({ | ||
11 | selector: 'my-abuse-message-modal', | ||
12 | templateUrl: './abuse-message-modal.component.html', | ||
13 | styleUrls: [ './abuse-message-modal.component.scss' ] | ||
14 | }) | ||
15 | export class AbuseMessageModalComponent extends FormReactive implements OnInit { | ||
16 | @ViewChild('modal', { static: true }) modal: NgbModal | ||
17 | @ViewChild('messagesBlock', { static: false }) messagesBlock: ElementRef | ||
18 | |||
19 | @Input() isAdminView: boolean | ||
20 | |||
21 | @Output() countMessagesUpdated = new EventEmitter<{ abuseId: number, countMessages: number }>() | ||
22 | |||
23 | abuseMessages: AbuseMessage[] = [] | ||
24 | textareaMessage: string | ||
25 | sendingMessage = false | ||
26 | noResults = false | ||
27 | |||
28 | private openedModal: NgbModalRef | ||
29 | private abuse: UserAbuse | ||
30 | |||
31 | constructor ( | ||
32 | protected formValidatorService: FormValidatorService, | ||
33 | private abuseValidatorsService: AbuseValidatorsService, | ||
34 | private modalService: NgbModal, | ||
35 | private i18n: I18n, | ||
36 | private auth: AuthService, | ||
37 | private notifier: Notifier, | ||
38 | private abuseService: AbuseService | ||
39 | ) { | ||
40 | super() | ||
41 | } | ||
42 | |||
43 | ngOnInit () { | ||
44 | this.buildForm({ | ||
45 | message: this.abuseValidatorsService.ABUSE_MESSAGE | ||
46 | }) | ||
47 | } | ||
48 | |||
49 | openModal (abuse: UserAbuse) { | ||
50 | this.abuse = abuse | ||
51 | |||
52 | this.openedModal = this.modalService.open(this.modal, { centered: true }) | ||
53 | |||
54 | this.loadMessages() | ||
55 | } | ||
56 | |||
57 | hide () { | ||
58 | this.abuseMessages = [] | ||
59 | this.openedModal.close() | ||
60 | } | ||
61 | |||
62 | addMessage () { | ||
63 | this.sendingMessage = true | ||
64 | |||
65 | this.abuseService.addAbuseMessage(this.abuse, this.form.value['message']) | ||
66 | .subscribe( | ||
67 | () => { | ||
68 | this.form.reset() | ||
69 | this.sendingMessage = false | ||
70 | this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length + 1 }) | ||
71 | |||
72 | this.loadMessages() | ||
73 | }, | ||
74 | |||
75 | err => { | ||
76 | this.sendingMessage = false | ||
77 | console.error(err) | ||
78 | this.notifier.error('Sorry but you cannot send this message. Please retry later') | ||
79 | } | ||
80 | ) | ||
81 | } | ||
82 | |||
83 | deleteMessage (abuseMessage: AbuseMessage) { | ||
84 | this.abuseService.deleteAbuseMessage(this.abuse, abuseMessage) | ||
85 | .subscribe( | ||
86 | () => { | ||
87 | this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length - 1 }) | ||
88 | |||
89 | this.abuseMessages = this.abuseMessages.filter(m => m.id !== abuseMessage.id) | ||
90 | }, | ||
91 | |||
92 | err => this.notifier.error(err.message) | ||
93 | ) | ||
94 | } | ||
95 | |||
96 | isMessageByMe (abuseMessage: AbuseMessage) { | ||
97 | return this.auth.getUser().account.id === abuseMessage.account.id | ||
98 | } | ||
99 | |||
100 | getPlaceholderMessage () { | ||
101 | if (this.isAdminView) { | ||
102 | return this.i18n('Add a message to communicate with the reporter') | ||
103 | } | ||
104 | |||
105 | return this.i18n('Add a message to communicate with the moderation team') | ||
106 | } | ||
107 | |||
108 | private loadMessages () { | ||
109 | this.abuseService.listAbuseMessages(this.abuse) | ||
110 | .subscribe( | ||
111 | res => { | ||
112 | this.abuseMessages = res.data | ||
113 | this.noResults = this.abuseMessages.length === 0 | ||
114 | |||
115 | setTimeout(() => { | ||
116 | if (!this.messagesBlock) return | ||
117 | |||
118 | const element = this.messagesBlock.nativeElement as HTMLElement | ||
119 | element.scrollIntoView({ block: 'end', inline: 'nearest' }) | ||
120 | }) | ||
121 | }, | ||
122 | |||
123 | err => this.notifier.error(err.message) | ||
124 | ) | ||
125 | } | ||
126 | |||
127 | } | ||