1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
|
import { Component, EventEmitter, Input, OnInit, Output, ViewChild } from '@angular/core'
import { AuthService, HtmlRendererService, Notifier } from '@app/core'
import { FormReactive, FormValidatorService } from '@app/shared/shared-forms'
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
import { logger } from '@root-helpers/logger'
import { AbuseMessage, UserAbuse } from '@shared/models'
import { ABUSE_MESSAGE_VALIDATOR } from '../form-validators/abuse-validators'
import { AbuseService } from '../shared-moderation'
@Component({
selector: 'my-abuse-message-modal',
templateUrl: './abuse-message-modal.component.html',
styleUrls: [ './abuse-message-modal.component.scss' ]
})
export class AbuseMessageModalComponent extends FormReactive implements OnInit {
@ViewChild('modal', { static: true }) modal: NgbModal
@Input() isAdminView: boolean
@Output() countMessagesUpdated = new EventEmitter<{ abuseId: number, countMessages: number }>()
abuseMessages: (AbuseMessage & { messageHtml: string })[] = []
textareaMessage: string
sendingMessage = false
noResults = false
private openedModal: NgbModalRef
private abuse: UserAbuse
constructor (
protected formValidatorService: FormValidatorService,
private modalService: NgbModal,
private htmlRenderer: HtmlRendererService,
private auth: AuthService,
private notifier: Notifier,
private abuseService: AbuseService
) {
super()
}
ngOnInit () {
this.buildForm({
message: ABUSE_MESSAGE_VALIDATOR
})
}
openModal (abuse: UserAbuse) {
this.abuse = abuse
this.openedModal = this.modalService.open(this.modal, { centered: true })
this.loadMessages()
}
hide () {
this.abuseMessages = []
this.openedModal.close()
}
addMessage () {
this.sendingMessage = true
this.abuseService.addAbuseMessage(this.abuse, this.form.value['message'])
.subscribe({
next: () => {
this.form.reset()
this.sendingMessage = false
this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length + 1 })
this.loadMessages()
},
error: err => {
this.sendingMessage = false
logger.error(err)
this.notifier.error('Sorry but you cannot send this message. Please retry later')
}
})
}
deleteMessage (abuseMessage: AbuseMessage) {
this.abuseService.deleteAbuseMessage(this.abuse, abuseMessage)
.subscribe({
next: () => {
this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length - 1 })
this.abuseMessages = this.abuseMessages.filter(m => m.id !== abuseMessage.id)
},
error: err => this.notifier.error(err.message)
})
}
isMessageByMe (abuseMessage: AbuseMessage) {
return this.auth.getUser().account.id === abuseMessage.account.id
}
getPlaceholderMessage () {
if (this.isAdminView) {
return $localize`Add a message to communicate with the reporter`
}
return $localize`Add a message to communicate with the moderation team`
}
private loadMessages () {
this.abuseService.listAbuseMessages(this.abuse)
.subscribe({
next: async res => {
this.abuseMessages = []
for (const m of res.data) {
this.abuseMessages.push(Object.assign(m, {
messageHtml: await this.htmlRenderer.convertToBr(m.message)
}))
}
this.noResults = this.abuseMessages.length === 0
setTimeout(() => {
// Don't use ViewChild: it is not supported inside a ng-template
const messagesBlock = document.querySelector('.messages')
messagesBlock.scroll(0, messagesBlock.scrollHeight)
})
},
error: err => this.notifier.error(err.message)
})
}
}
|
