diff --git a/js/src/forum/components/ReplyComposer.js b/js/src/forum/components/ReplyComposer.js index 65c8b5f7e..866e2ad74 100644 --- a/js/src/forum/components/ReplyComposer.js +++ b/js/src/forum/components/ReplyComposer.js @@ -14,36 +14,31 @@ function minimizeComposerIfFullScreen(e) { * The `ReplyComposer` component displays the composer content for replying to a * discussion. * - * ### Props + * ### Attrs * - * - All of the props of ComposerBody + * - All of the attrs of ComposerBody * - `discussion` */ export default class ReplyComposer extends ComposerBody { - static initProps(props) { - super.initProps(props); + initAttrs(attrs) { + super.initAttrs(attrs); - props.placeholder = props.placeholder || extractText(app.translator.trans('core.forum.composer_reply.body_placeholder')); - props.submitLabel = props.submitLabel || app.translator.trans('core.forum.composer_reply.submit_button'); - props.confirmExit = props.confirmExit || extractText(app.translator.trans('core.forum.composer_reply.discard_confirmation')); + attrs.placeholder = attrs.placeholder || extractText(app.translator.trans('core.forum.composer_reply.body_placeholder')); + attrs.submitLabel = attrs.submitLabel || app.translator.trans('core.forum.composer_reply.submit_button'); + attrs.confirmExit = attrs.confirmExit || extractText(app.translator.trans('core.forum.composer_reply.discard_confirmation')); } headerItems() { const items = super.headerItems(); - const discussion = this.props.discussion; - - const routeAndMinimize = function (element, isInitialized) { - if (isInitialized) return; - $(element).on('click', minimizeComposerIfFullScreen); - m.route.apply(this, arguments); - }; + const discussion = this.attrs.discussion; items.add( 'title',

{icon('fas fa-reply')}{' '} - + {discussion.title()} + {''}

); @@ -57,7 +52,7 @@ export default class ReplyComposer extends ComposerBody { jumpToPreview(e) { minimizeComposerIfFullScreen(e); - m.route(app.route.discussion(this.props.discussion, 'reply')); + m.route.set(app.route.discussion(this.attrs.discussion, 'reply')); } /** @@ -68,12 +63,12 @@ export default class ReplyComposer extends ComposerBody { data() { return { content: this.composer.fields.content(), - relationships: { discussion: this.props.discussion }, + relationships: { discussion: this.attrs.discussion }, }; } onsubmit() { - const discussion = this.props.discussion; + const discussion = this.attrs.discussion; this.loading = true; m.redraw(); @@ -94,17 +89,18 @@ export default class ReplyComposer extends ComposerBody { // their reply has been posted, containing a button which will // transition to their new post when clicked. let alert; - const viewButton = Button.component({ - className: 'Button Button--link', - children: app.translator.trans('core.forum.composer_reply.view_button'), - onclick: () => { - m.route(app.route.post(post)); - app.alerts.dismiss(alert); + const viewButton = Button.component( + { + className: 'Button Button--link', + onclick: () => { + m.route.set(app.route.post(post)); + app.alerts.dismiss(alert); + }, }, - }); - alert = app.alerts.show({ + app.translator.trans('core.forum.composer_reply.view_button') + ); + alert = app.alerts.show(app.translator.trans('core.forum.composer_reply.posted_message'), { type: 'success', - children: app.translator.trans('core.forum.composer_reply.posted_message'), controls: [viewButton], }); }