fix no-var and prefer-const ESLint errors (#1679)

* fix `no-var` and `prefer-const` ESLint errors

* more

* more

* fix build

Author: dimaMachina

.eslintrc.cjs

@@ -33,10 +33,9 @@ module.exports = {
             ],
           },
         ],
+        'prefer-const': ['error', { destructuring: 'all' }],
         // TODO: fix below
-        "no-var": "off",
         "no-useless-escape": "off",
-        "prefer-const": "off",
         "prefer-rest-params": "off",
         "prefer-spread": "off",
         "@typescript-eslint/no-explicit-any": "off",

scripts/update-code-data/organize-code-data.ts

@@ -12,8 +12,8 @@ export type List = {
 export async function organizeCodeData(
   codeData: CodeData,
 ): Promise<{ languageList: List[]; toolList: List[]; serviceList: Library[] }> {
-  let languageList: List[] = []
-  let toolList: List[] = []
+  const languageList: List[] = []
+  const toolList: List[] = []
   let serviceList: Library[] = []
   await Promise.all([
     ...Object.keys(codeData.Languages).map(async languageName => {

scripts/update-code-data/update-code-data.ts

@@ -24,7 +24,7 @@ export async function updateCodeData(
   markdownFilePaths: string[],
   slugMap: string,
 ): Promise<CodeData> {
-  let codeData = {} as CodeData
+  const codeData = {} as CodeData
   await Promise.all(
     markdownFilePaths.map(async markdownFilePath => {
       const markdownFileContent = await readFile(markdownFilePath, "utf-8")

src/app/conf/2023/_data.ts

@@ -63,7 +63,7 @@ async function getSchedule(): Promise<ScheduleSession[]> {
   )
 
   const result = sessions.map(session => {
-    let { description } = session
+    const { description } = session
     if (description?.includes("<")) {
       // console.log(`Found HTML element in about field for session "${session.name}"`)
     }

src/app/conf/2023/gallery/page.tsx

@@ -8,11 +8,10 @@ export const metadata: Metadata = {
 }
 
 function chunk<T>(arr: T[], len: number): T[][] {
-  let chunks = [],
-    i = 0,
-    n = arr.length
+  const chunks = []
+  let i = 0
 
-  while (i < n) {
+  while (i < arr.length) {
     chunks.push(arr.slice(i, (i += len)))
   }
 

src/components/marked/index.tsx

@@ -18,7 +18,7 @@ export function Marked(props: { children: string }) {
  * Block-Level Grammar
  */
 
-var block = {
+const block = {
   newline: /^\n+/,
   code: /^( {4}[^\n]+\n*)+/,
   fences: noop,
@@ -124,7 +124,7 @@ Lexer.rules = block
  */
 
 Lexer.lex = function (src, options) {
-  var lexer = new Lexer(options)
+  const lexer = new Lexer(options)
   return lexer.lex(src)
 }
 
@@ -147,16 +147,8 @@ Lexer.prototype.lex = function (src) {
  */
 
 Lexer.prototype.token = function (src, top) {
-  var src = src.replace(/^ +$/gm, ""),
-    next,
-    loose,
-    cap,
-    bull,
-    b,
-    item,
-    space,
-    i,
-    l
+  src = src.replace(/^ +$/gm, "")
+  let next, loose, cap, bull, b, item, space, i, l
 
   while (src) {
     // newline
@@ -437,7 +429,7 @@ Lexer.prototype.token = function (src, top) {
  * Inline-Level Grammar
  */
 
-var inline = {
+const inline = {
   escape: /^\\([\\`*{}\[\]()#+\-.!_>])/,
   autolink: /^<([^ >]+(@|:\/)[^ >]+)>/,
   url: noop,
@@ -533,7 +525,7 @@ InlineLexer.rules = inline
  */
 
 InlineLexer.output = function (src, links, options) {
-  var inline = new InlineLexer(links, options)
+  const inline = new InlineLexer(links, options)
   return inline.output(src)
 }
 
@@ -542,11 +534,8 @@ InlineLexer.output = function (src, links, options) {
  */
 
 InlineLexer.prototype.output = function (src) {
-  var out = [],
-    link,
-    text,
-    href,
-    cap
+  const out = []
+  let link, text, href, cap
 
   while (src) {
     // escape
@@ -686,7 +675,7 @@ InlineLexer.prototype.output = function (src) {
 InlineLexer.prototype.sanitizeUrl = function (url) {
   if (this.options.sanitize) {
     try {
-      var prot = decodeURIComponent(url)
+      const prot = decodeURIComponent(url)
         .replace(/[^A-Za-z0-9:]/g, "")
         .toLowerCase()
       if (prot.indexOf("javascript:") === 0) {
@@ -705,7 +694,7 @@ InlineLexer.prototype.sanitizeUrl = function (url) {
 
 InlineLexer.prototype.outputLink = function (cap, link) {
   if (cap[0][0] !== "!") {
-    var shouldOpenInNewWindow =
+    const shouldOpenInNewWindow =
       link.href.charAt(0) !== "/" && link.href.charAt(0) !== "#"
 
     return createElement(
@@ -762,7 +751,7 @@ function Parser(options) {
  */
 
 Parser.parse = function (src, options) {
-  var parser = new Parser(options)
+  const parser = new Parser(options)
   return parser.parse(src)
 }
 
@@ -774,7 +763,7 @@ Parser.prototype.parse = function (src) {
   this.inline = new InlineLexer(src.links, this.options)
   this.tokens = src.reverse()
 
-  var out = []
+  const out = []
   while (this.next()) {
     out.push(this.tok())
   }
@@ -803,7 +792,7 @@ Parser.prototype.peek = function () {
  */
 
 Parser.prototype.parseText = function () {
-  var body = this.token.text
+  let body = this.token.text
 
   while (this.peek().type === "text") {
     body += "\n" + this.next().text
@@ -820,18 +809,18 @@ Parser.prototype.tok = function () {
   switch (this.token.type) {
     case "code": {
       if (this.token.lang === "graphql") {
-        var lines = this.token.text.split("\n")
-        var firstLine = lines.shift().match(/^\s*#\s*({.*})$/)
+        const lines = this.token.text.split("\n")
+        const firstLine = lines.shift().match(/^\s*#\s*({.*})$/)
         if (firstLine) {
-          var metaData
+          let metaData
           try {
             metaData = JSON.parse(firstLine[1])
           } catch (e) {
             console.error("Invalid Metadata JSON:", firstLine[1])
           }
           if (metaData) {
-            var query = lines.join("\n")
-            var variables = metaData.variables
+            const query = lines.join("\n")
+            const variables = metaData.variables
               ? JSON.stringify(metaData.variables, null, 2)
               : ""
             const schemaMap = {
@@ -871,7 +860,7 @@ function noop() {}
 noop.exec = noop
 
 function merge(obj) {
-  var i = 1,
+  let i = 1,
     target,
     key
 
@@ -900,8 +889,8 @@ function marked(src, opt, callback) {
 
     if (opt) opt = merge({}, marked.defaults, opt)
 
-    var highlight = opt.highlight,
-      tokens,
+    const highlight = opt.highlight
+    let tokens,
       pending,
       i = 0
 
@@ -913,8 +902,8 @@ function marked(src, opt, callback) {
 
     pending = tokens.length
 
-    var done = function (hi) {
-      var out, err
+    const done = function (hi) {
+      let out, err
 
       if (hi !== true) {
         delete opt.highlight

src/components/marked/mini-graphiQL.tsx

@@ -76,7 +76,7 @@ export class MiniGraphiQL extends Component {
 
   async _runQuery() {
     this._editorQueryID++
-    var queryID = this._editorQueryID
+    const queryID = this._editorQueryID
     try {
       const result = await graphql({
         schema: this.props.schema,
@@ -139,7 +139,7 @@ class QueryEditor extends Component {
   }
 
   componentDidMount() {
-    var CodeMirror = require("codemirror")
+    const CodeMirror = require("codemirror")
     require("codemirror/addon/hint/show-hint")
     require("codemirror/addon/comment/comment")
     require("codemirror/addon/edit/matchbrackets")
@@ -230,7 +230,7 @@ class QueryEditor extends Component {
   }
 
   _onKeyUp(cm, event) {
-    var code = event.keyCode
+    const code = event.keyCode
     if (
       (code >= 65 && code <= 90) || // letters
       (!event.shiftKey && code >= 48 && code <= 57) || // numbers
@@ -272,7 +272,7 @@ class QueryEditor extends Component {
  */
 class ResultViewer extends Component {
   componentDidMount() {
-    var CodeMirror = require("codemirror")
+    const CodeMirror = require("codemirror")
     require("codemirror-graphql/results/mode")
 
     this.viewer = CodeMirror(this.domNode, {
@@ -464,28 +464,28 @@ class VariableEditor extends Component {
  * about the type and description for the selected context.
  */
 function onHasCompletion(cm, data, onHintInformationRender) {
-  var CodeMirror = require("codemirror")
-  var wrapper
-  var information
+  const CodeMirror = require("codemirror")
+  let wrapper
+  let information
 
   // When a hint result is selected, we touch the UI.
   CodeMirror.on(data, "select", (ctx, el) => {
     // Only the first time (usually when the hint UI is first displayed)
     // do we create the wrapping node.
     if (!wrapper) {
       // Wrap the existing hint UI, so we have a place to put information.
-      var hintsUl = el.parentNode
-      var container = hintsUl.parentNode
+      const hintsUl = el.parentNode
+      const container = hintsUl.parentNode
       wrapper = document.createElement("div")
       container.appendChild(wrapper)
 
       // CodeMirror vertically inverts the hint UI if there is not enough
       // space below the cursor. Since this modified UI appends to the bottom
       // of CodeMirror's existing UI, it could cover the cursor. This adjusts
       // the positioning of the hint UI to accomodate.
-      var top = hintsUl.style.top
-      var bottom = ""
-      var cursorTop = cm.cursorCoords().top
+      let top = hintsUl.style.top
+      let bottom = ""
+      const cursorTop = cm.cursorCoords().top
       if (parseInt(top, 10) < cursorTop) {
         top = ""
         bottom = window.innerHeight - cursorTop + 3 + "px"
@@ -516,7 +516,7 @@ function onHasCompletion(cm, data, onHintInformationRender) {
       // When CodeMirror attempts to remove the hint UI, we detect that it was
       // removed from our wrapper and in turn remove the wrapper from the
       // original container.
-      var onRemoveFn
+      let onRemoveFn
       wrapper.addEventListener(
         "DOMNodeRemoved",
         (onRemoveFn = event => {
@@ -532,10 +532,10 @@ function onHasCompletion(cm, data, onHintInformationRender) {
     }
 
     // Now that the UI has been set up, add info to information.
-    var description = ctx.description
+    const description = ctx.description
       ? marked(ctx.description, { smartypants: true })
       : "Self descriptive."
-    var type = ctx.type
+    const type = ctx.type
       ? '<span class="infoType">' + String(ctx.type) + "</span>"
       : ""
     information.innerHTML =

src/components/marked/users-schema.ts

@@ -9,7 +9,7 @@ import {
 } from "graphql"
 
 // Example data set
-var data = ppl({
+const data = ppl({
   1572451031: "Daniel Schafer",
   4802170: "Lee Byron",
   37000641: "Nick Schrock",
@@ -46,7 +46,7 @@ function makePic(user, size) {
 
 // @ts-expect-error -- fixme
 function friends(user, first) {
-  var allFriends = Object.keys(data)
+  const allFriends = Object.keys(data)
     .map(id => data[id])
     .filter(v => v !== user)
   return {
@@ -55,7 +55,7 @@ function friends(user, first) {
   }
 }
 
-var ImageType = new GraphQLObjectType({
+const ImageType = new GraphQLObjectType({
   name: "Image",
   fields: {
     width: { type: GraphQLInt },
@@ -65,7 +65,7 @@ var ImageType = new GraphQLObjectType({
 })
 
 // @ts-expect-error -- fixme
-var FriendConnection = new GraphQLObjectType({
+const FriendConnection = new GraphQLObjectType({
   name: "FriendConnection",
   fields: () => ({
     totalCount: { type: GraphQLInt },
@@ -74,7 +74,7 @@ var FriendConnection = new GraphQLObjectType({
 })
 
 // @ts-expect-error -- fixme
-var UserType = new GraphQLObjectType({
+const UserType = new GraphQLObjectType({
   name: "User",
   fields: {
     id: { type: GraphQLID },