diff --git a/resources/skins.minerva.scripts/page-issues/overlay/IssueList.js b/resources/skins.minerva.scripts/page-issues/overlay/IssueList.js index 57ec9d917..3f0b19a20 100644 --- a/resources/skins.minerva.scripts/page-issues/overlay/IssueList.js +++ b/resources/skins.minerva.scripts/page-issues/overlay/IssueList.js @@ -12,16 +12,24 @@ const * * @param {IssueSummary} issues */ -function IssueList( issues ) { - this.issues = issues; - View.call( this, { className: 'cleanup' } ); +class IssueList extends View { + constructor( issues ) { + super( { + className: 'cleanup', + issues + } ); + } + + get tagName() { + return 'ul'; + } + + postRender() { + super.postRender(); + this.append( + ( this.options.issues || [] ).map( ( issue ) => new IssueNotice( issue ).$el ) + ); + } } -OO.inheritClass( IssueList, View ); -IssueList.prototype.tagName = 'ul'; -IssueList.prototype.postRender = function () { - View.prototype.postRender.apply( this, arguments ); - this.append( - ( this.issues || [] ).map( ( issue ) => new IssueNotice( issue ).$el ) - ); -}; + module.exports = IssueList; diff --git a/resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.js b/resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.js index 90d2cfb08..4ed1faa15 100644 --- a/resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.js +++ b/resources/skins.minerva.scripts/page-issues/overlay/IssueNotice.js @@ -11,14 +11,23 @@ const * * @param {IssueSummary} props */ -function IssueNotice( props ) { - View.call( this, props ); +class IssueNotice extends View { + constructor( props ) { + super( props ); + } + + get tagName() { + return 'li'; + } + + get template() { + return mw.template.get( 'skins.minerva.scripts', 'IssueNotice.mustache' ); + } + + postRender() { + super.postRender(); + this.$el.find( '.issue-notice' ).prepend( this.options.issue.iconElement ); + } } -OO.inheritClass( IssueNotice, View ); -IssueNotice.prototype.tagName = 'li'; -IssueNotice.prototype.template = mw.template.get( 'skins.minerva.scripts', 'IssueNotice.mustache' ); -IssueNotice.prototype.postRender = function () { - View.prototype.postRender.apply( this, arguments ); - this.$el.find( '.issue-notice' ).prepend( this.options.issue.iconElement ); -}; + module.exports = IssueNotice; diff --git a/resources/skins.minerva.scripts/page-issues/overlay/pageIssuesOverlay.js b/resources/skins.minerva.scripts/page-issues/overlay/pageIssuesOverlay.js index 2f8c66df8..5da154534 100644 --- a/resources/skins.minerva.scripts/page-issues/overlay/pageIssuesOverlay.js +++ b/resources/skins.minerva.scripts/page-issues/overlay/pageIssuesOverlay.js @@ -23,15 +23,10 @@ function pageIssuesOverlay( issues, section, namespaceID ) { getNamespaceHeadingText( namespaceID ) : mw.msg( 'minerva-meta-data-issues-section-header' ); - const overlay = new Overlay( { + return Overlay.make( { className: 'overlay overlay-issues', - heading: '' + headingText + '' - } ); - - overlay.$el.find( '.overlay-content' ).append( - new IssueList( issues ).$el - ); - return overlay; + heading: `${ headingText }` + }, new IssueList( issues ) ); } /**