linting .js .jsx: updating files to follow new linting rules

liqd · May 3, 2021 · 019bbc6 · 019bbc6
1 parent 5630709
commit 019bbc6
Show file tree

Hide file tree

Showing 18 changed files with 207 additions and 201 deletions.
diff --git a/euth/blueprints/static/euth_blueprintsuggest/js/blueprintsuggest.js b/euth/blueprints/static/euth_blueprintsuggest/js/blueprintsuggest.js
@@ -1,6 +1,6 @@
 /* global django */
 (function ($) {
-  var blueprintsuggest = {
+  const blueprintsuggest = {
     init: function () {
       $('.js-continue').on('click', this.clickContinueHandler.bind(this))
       $('.js-back').on('click', this.clickBackHandler)
@@ -11,22 +11,23 @@
       /*
        * Ensure that for each group of radio buttons in $tab at least one is checked.
        */
-      var $radioButtons = $tab.find('input[type=radio]')
-      var radioButtonsByName = {}
+      const $radioButtons = $tab.find('input[type=radio]')
+      const radioButtonsByName = {}
       $radioButtons.map(function () {
-        var $this = $(this)
-        var name = $this.attr('name')
+        const $this = $(this)
+        const name = $this.attr('name')
 
         if (!Object.prototype.hasOwnProperty.call(radioButtonsByName, name)) {
           radioButtonsByName[name] = $()
+        } else {
+          radioButtonsByName[name] = radioButtonsByName[name].add($this)
         }
-
-        radioButtonsByName[name] = radioButtonsByName[name].add($this)
+        return radioButtonsByName[name]
       })
 
-      for (var key in radioButtonsByName) {
+      for (const key in radioButtonsByName) {
         if (Object.prototype.hasOwnProperty.call(radioButtonsByName, key)) {
-          var $inputs = radioButtonsByName[key]
+          const $inputs = radioButtonsByName[key]
           if (!$inputs.filter(':checked').length) {
             return false
           }
@@ -37,9 +38,9 @@
     },
 
     clickContinueHandler: function (e) {
-      var $this = $(e.target)
-      var $tab = $this.parents('.tab-pane')
-      var isValid = this.validate($tab)
+      const $this = $(e.target)
+      const $tab = $this.parents('.tab-pane')
+      const isValid = this.validate($tab)
 
       // remove old errorlist
       $tab.find('.errorlist').remove()
@@ -55,9 +56,9 @@
     },
 
     clickSendHandler: function (e) {
-      var $this = $(e.target)
-      var $tab = $this.parents('.tab-pane')
-      var isValid = this.validate($tab)
+      const $this = $(e.target)
+      const $tab = $this.parents('.tab-pane')
+      const isValid = this.validate($tab)
 
       // remove old errorlist
       $tab.find('.errorlist').remove()
@@ -73,12 +74,12 @@
     },
 
     getErrorElement: function () {
-      var text = django.gettext('Please set all values for your project.')
+      const text = django.gettext('Please set all values for your project.')
       return '<ul class="errorlist"><li>' + text + '</li></ul>'
     },
 
     clickBackHandler: function () {
-      var $tab = $(this).parents('.tab-pane')
+      const $tab = $(this).parents('.tab-pane')
       $tab.removeClass('active').prev().addClass('active')
     }
   }

diff --git a/euth/communitydebate/static/js/fileupload_formset.js b/euth/communitydebate/static/js/fileupload_formset.js
@@ -5,11 +5,11 @@ import { showFileName } from '../../../../euth_wagtail/assets/js/euth_wagtail';
   document.addEventListener('a4.embed.ready', init, false)
 })(function () {
   // Dynamically add subforms to a formset.
-  var $formsets = $('.js-formset')
-  var PLACEHOLDER = /__prefix__/g
-  var dynamicFormSets = []
+  const $formsets = $('.js-formset')
+  const PLACEHOLDER = /__prefix__/g
+  const dynamicFormSets = []
 
-  var DynamicFormSet = function ($formset) {
+  const DynamicFormSet = function ($formset) {
     this.$formset = $formset
     this.$formTemplate = this.$formset.find('.js-form-template')
     this.prefix = this.$formset.data('prefix')
@@ -22,14 +22,14 @@ import { showFileName } from '../../../../euth_wagtail/assets/js/euth_wagtail';
 
   DynamicFormSet.prototype.addForm = function () {
     if (this.total < this.maxNum) {
-      var id = this.total
+      const id = this.total
       this.total += 1
       this.$totalInput.val(this.total)
-      var newForm = getNewForm(this.$formTemplate, id)
+      const newForm = getNewForm(this.$formTemplate, id)
       $(newForm).insertBefore(this.$formTemplate)
       document.getElementById(this.prefix + '-' + id.toString() + '-document').addEventListener('change', showFileName, false)
     } else {
-      var text = django.gettext('Maximum number of upload documents reached.')
+      const text = django.gettext('Maximum number of upload documents reached.')
       $('#error-max-num-forms').html('<ul class="errorlist"><li>' + text + '</li></ul>')
     }
   }

diff --git a/euth/contrib/static/js/formset.js b/euth/contrib/static/js/formset.js
@@ -6,11 +6,11 @@
   // Dynamically add more subforms to a formset.
   // Removing subforms is not (yet) supported)
 
-  var $formsets = $('.js-formset')
-  var PLACEHOLDER = /__prefix__/g
-  var dynamicFormSets = []
+  const $formsets = $('.js-formset')
+  const PLACEHOLDER = /__prefix__/g
+  const dynamicFormSets = []
 
-  var DynamicFormSet = function ($formset) {
+  const DynamicFormSet = function ($formset) {
     this.$formset = $formset
     this.$formTemplate = this.$formset.find('.js-form-template')
     this.prefix = this.$formset.data('prefix')
@@ -25,7 +25,7 @@
     if (this.id + 1 < this.maxNum) {
       this.id += 1
       this.$totalInput.val(this.id + 1)
-      var newForm = getNewForm(this.$formTemplate, this.id)
+      const newForm = getNewForm(this.$formTemplate, this.id)
       this.$formTemplate.before(newForm)
     }
   }

diff --git a/euth/dashboard/static/language_switch/react_language_switch.jsx b/euth/dashboard/static/language_switch/react_language_switch.jsx
@@ -1,10 +1,13 @@
-var PropTypes = require('prop-types')
-var React = require('react')
-var ReactDOM = require('react-dom')
+const PropTypes = require('prop-types')
+const React = require('react')
+const ReactDOM = require('react-dom')
 
 class LanguageSwitch extends React.Component {
   constructor (props) {
     super(props)
+    this.checkboxListRef = React.createRef()
+    this.toggleButtonRef = React.createRef()
+
     this.state = {
       activeLanguages: this.props.activeLanguages,
       activeTab: this.getInitialActiveTab()
@@ -20,8 +23,8 @@ class LanguageSwitch extends React.Component {
   }
 
   getNewActiveTab (removedLanguage) {
-    var index = this.state.activeLanguages.indexOf(removedLanguage)
-    var newActiveLanguages = this.state.activeLanguages.concat([])
+    const index = this.state.activeLanguages.indexOf(removedLanguage)
+    const newActiveLanguages = this.state.activeLanguages.concat([])
     if (index !== -1) {
       newActiveLanguages.splice(index, 1)
     }
@@ -33,14 +36,14 @@ class LanguageSwitch extends React.Component {
   }
 
   activateTab (e) {
-    var languageCode = e.target.textContent
+    const languageCode = e.target.textContent
     this.setState({ activeTab: languageCode })
   }
 
   addLanguage (e) {
-    var languageCode = e.target.textContent
-    var index = this.state.activeLanguages.indexOf(languageCode)
-    var newActiveLanguages = this.state.activeLanguages.concat([])
+    const languageCode = e.target.textContent
+    const index = this.state.activeLanguages.indexOf(languageCode)
+    const newActiveLanguages = this.state.activeLanguages.concat([])
     if (index === -1) {
       // adding language
       newActiveLanguages.push(languageCode)
@@ -53,9 +56,9 @@ class LanguageSwitch extends React.Component {
   }
 
   removeLanguage (e) {
-    var languageCode = e.target.textContent
-    var index = this.state.activeLanguages.indexOf(languageCode)
-    var newActiveLanguages = this.state.activeLanguages.concat([])
+    const languageCode = e.target.textContent
+    const index = this.state.activeLanguages.indexOf(languageCode)
+    const newActiveLanguages = this.state.activeLanguages.concat([])
     if (index !== -1) {
       // removing language
       newActiveLanguages.splice(index, 1)
@@ -73,7 +76,7 @@ class LanguageSwitch extends React.Component {
   render () {
     return (
       <div>
-        <ul className="checkbox-list" ref="checkboxList">
+        <ul className="checkbox-list" ref={this.checkboxListRef}>
           {
             this.props.languages.map((languageCode, i) => {
               return (
@@ -93,7 +96,7 @@ class LanguageSwitch extends React.Component {
           }
         </ul>
         <div className="dropdown ml-5">
-          <button className="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" ref="toggleButton">
+          <button className="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" ref={this.toggleButtonRef}>
             <i className="fa fa-plus" />
           </button>
           <div className="dropdown-menu">
@@ -120,7 +123,7 @@ class LanguageSwitch extends React.Component {
 
         {this.state.activeLanguages.length > 1 &&
           <div className="dropdown">
-            <button className="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" ref="toggleButton">
+            <button className="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" ref={this.toggleButtonRef}>
               <i className="fa fa-minus" />
             </button>
             <div className="dropdown-menu">

diff --git a/euth/dashboard/static/user_list/UserListItem.jsx b/euth/dashboard/static/user_list/UserListItem.jsx
@@ -1,7 +1,7 @@
-var React = require('react')
-var PropTypes = require('prop-types')
+const React = require('react')
+const PropTypes = require('prop-types')
 
-var UserListItem = function (props) {
+const UserListItem = function (props) {
   return (
     <tr>
       <td>
@@ -26,7 +26,7 @@ UserListItem.propTypes = {
   user: PropTypes.object
 }
 
-var Avatar = function (props) {
+const Avatar = function (props) {
   const avatar = props.src ? props.src : props.fallback
   return <img src={avatar} alt="" className="circled" />
 }

diff --git a/euth/dashboard/static/user_list/react_user_list.jsx b/euth/dashboard/static/user_list/react_user_list.jsx
@@ -1,10 +1,10 @@
-var $ = require('jquery')
-var cookie = require('js-cookie')
-var django = require('django')
-var PropTypes = require('prop-types')
-var React = require('react')
-var ReactDOM = require('react-dom')
-var UserListItem = require('./UserListItem.jsx')
+const $ = require('jquery')
+const cookie = require('js-cookie')
+const django = require('django')
+const PropTypes = require('prop-types')
+const React = require('react')
+const ReactDOM = require('react-dom')
+const UserListItem = require('./UserListItem.jsx')
 
 $(function () {
   $.ajaxSetup({
@@ -15,6 +15,7 @@ $(function () {
 class UserList extends React.Component {
   constructor (props) {
     super(props)
+    this.userlistRef = React.createRef()
 
     this.state = {
       users: props.users,
@@ -46,12 +47,12 @@ class UserList extends React.Component {
   }
 
   submitHandler (e) {
-    var checkedUsers = this.refs.userlist.querySelectorAll(':checked')
-    var idsToBeActedOn = Array.prototype.map.call(checkedUsers,
+    const checkedUsers = this.userlistRef.querySelectorAll(':checked')
+    const idsToBeActedOn = Array.prototype.map.call(checkedUsers,
       user => parseInt(user.dataset.userid)
     )
     // create new array
-    var users = this.state.users.concat([])
+    let users = this.state.users.concat([])
     if (e.target.value === 'remove') {
       // filter out users whose id is in idsToBeActedOn
       users = users.filter(user => idsToBeActedOn.indexOf(user.id) === -1)
@@ -60,11 +61,11 @@ class UserList extends React.Component {
   }
 
   render () {
-    var userList = this.state.users.map(user => {
+    const userList = this.state.users.map(user => {
       return <UserListItem key={user.id} user={user} />
     })
     return (
-      <div ref="userlist">
+      <div ref={this.userlistRef}>
         <table className="table table-hover">
           <thead>
             <tr>

diff --git a/euth/documents/static/documents/Paragraph.jsx b/euth/documents/static/documents/Paragraph.jsx
@@ -1,6 +1,6 @@
-var React = require('react')
-var django = require('django')
-var PropTypes = require('prop-types')
+const React = require('react')
+const django = require('django')
+const PropTypes = require('prop-types')
 
 class Paragraph extends React.Component {
   add () {
@@ -20,43 +20,43 @@ class Paragraph extends React.Component {
   }
 
   handleNameChange (e) {
-    var index = this.props.index
-    var text = e.target.value
+    const index = this.props.index
+    const text = e.target.value
     this.props.updateParagraphName(index, text)
   }
 
   ckEditorDestroy (id) {
-    var editor = window.CKEDITOR.instances[id]
+    const editor = window.CKEDITOR.instances[id]
     editor.destroy()
   }
 
   ckEditorCreate (id) {
-    var editor = window.CKEDITOR.replace(id, this.props.config)
+    const editor = window.CKEDITOR.replace(id, this.props.config)
     editor.on('change', function (e) {
-      var text = e.editor.getData()
-      var index = this.props.index
+      const text = e.editor.getData()
+      const index = this.props.index
       this.props.updateParagraphText(index, text)
     }.bind(this))
     editor.setData(this.props.paragraph.text)
   }
 
-  componentWillUpdate () {
-    var id = 'id_paragraphs-' + this.props.id + '-text'
+  UNSAFE_componentWillUpdate () {
+    const id = 'id_paragraphs-' + this.props.id + '-text'
     this.ckEditorDestroy(id)
   }
 
   componentDidUpdate () {
-    var id = 'id_paragraphs-' + this.props.id + '-text'
+    const id = 'id_paragraphs-' + this.props.id + '-text'
     this.ckEditorCreate(id)
   }
 
   componentDidMount () {
-    var id = 'id_paragraphs-' + this.props.id + '-text'
+    const id = 'id_paragraphs-' + this.props.id + '-text'
     this.ckEditorCreate(id)
   }
 
   render () {
-    var ckEditorToolbarsHeight = 60 // measured on example editor
+    const ckEditorToolbarsHeight = 60 // measured on example editor
     return (
       <div>
         <div className="row">
@@ -89,9 +89,9 @@ class Paragraph extends React.Component {
                 defaultValue={this.props.paragraph.name}
                 onChange={this.handleNameChange.bind(this)}
               />
-              {this.props.errors && this.props.errors.name ? <ul className="errorlist">
-                <li>{this.props.errors.name[0]}</li>
-              </ul> : null /* eslint-disable-line */ }
+              {this.props.errors && this.props.errors.name
+                ? <ul className="errorlist"><li>{this.props.errors.name[0]}</li></ul>
+                : null}
               <label
                 htmlFor={'id_paragraphs-' + this.props.id + '-text'}
               >
@@ -106,9 +106,9 @@ class Paragraph extends React.Component {
                   id={'id_paragraphs-' + this.props.id + '-text'}
                   style={{ height: this.props.config.height + ckEditorToolbarsHeight }}
                 />
-                {this.props.errors && this.props.errors.text ? <ul className="errorlist">
-                  <li>{this.props.errors.text[0]}</li>
-                </ul> : null /* eslint-disable-line */ }
+                {this.props.errors && this.props.errors.text
+                  ? <ul className="errorlist"><li>{this.props.errors.text[0]}</li></ul>
+                  : null /* eslint-disable-line */ }
               </div>
             </div>
           </div>