remove last uses of String.prototype.substr in favor of slice and substring

src/actions/fetch.js

@@ -200,7 +200,7 @@ export async function requestHistoricalTimes(day, canvasId) {
     }
     const times = await response.json();
     const parsedTimes = times
-      .map((a) => `${a.substr(0, 2)}:${a.substr(-2, 2)}`);
+      .map((a) => `${a.substring(0, 2)}:${a.substring(2)}`);
     return [
       '00:00',
       ...parsedTimes,

src/components/ChatMessage.jsx

@@ -96,7 +96,7 @@ function ChatMessage({
               <span
                 className="ping"
                 style={{
-                  color: setBrightness(colorFromText(txt.substr(1)), dark),
+                  color: setBrightness(colorFromText(txt.substring(1)), dark),
                 }}
               >{txt}</span>
             );
@@ -105,7 +105,7 @@ function ChatMessage({
               <span
                 className="mention"
                 style={{
-                  color: setBrightness(colorFromText(txt.substr(1)), dark),
+                  color: setBrightness(colorFromText(txt.substring(1)), dark),
                 }}
               >{txt}</span>
             );

src/components/HistorySelect.jsx

@@ -17,12 +17,12 @@ function stringToDate(dateString) {
   if (!dateString) return null;
   // YYYYMMDD
   // eslint-disable-next-line max-len
-  return `${dateString.substr(0, 4)}-${dateString.substr(4, 2)}-${dateString.substr(6, 2)}`;
+  return `${dateString.substring(0, 4)}-${dateString.substring(4, 6)}-${dateString.substring(6)}`;
 }
 
 function stringToTime(timeString) {
   if (!timeString) return null;
-  return `${timeString.substr(0, 2)}:${timeString.substr(2, 2)}`;
+  return `${timeString.substring(0, 2)}:${timeString.substring(2)}`;
 }
 
 const HistorySelect = () => {
@@ -47,7 +47,7 @@ const HistorySelect = () => {
   const dispatch = useDispatch();
 
   const setTime = useCallback((date, time) => {
-    const timeString = time.substr(0, 2) + time.substr(-2, 2);
+    const timeString = time.substring(0, 2) + time.substring(3, 5);
     const dateString = dateToString(date);
     dispatch(selectHistoricalTime(dateString, timeString));
   }, [dispatch]);

src/components/Modtools.jsx

@@ -7,7 +7,7 @@ import React, { useState, useEffect } from 'react';
 import { useSelector, shallowEqual } from 'react-redux';
 import { t } from 'ttag';
 
-import { getToday } from '../core/utils';
+import { getToday, dateToString } from '../core/utils';
 
 const keptState = {
   coords: null,
@@ -67,7 +67,7 @@ async function submitRollback(
   callback,
 ) {
   const data = new FormData();
-  const timeString = date.substr(0, 4) + date.substr(5, 2) + date.substr(8, 2);
+  const timeString = dateToString(date);
   data.append('rollback', timeString);
   data.append('canvasid', canvas);
   data.append('ulcoor', tlcoords);

src/controls/keypress.js

@@ -54,7 +54,7 @@ function onKeyPress(event: KeyboardEvent) {
     if (!key.startsWith('Key')) {
       return;
     }
-    key = key.substr(-1).toLowerCase();
+    key = key.slice(-1).toLowerCase();
   }
 
   switch (key) {

src/core/ChatProvider.js

@@ -233,7 +233,7 @@ export class ChatProvider {
   adminCommands(message: string, channelId: number) {
     // admin commands
     const cmdArr = message.split(' ');
-    const cmd = cmdArr[0].substr(1);
+    const cmd = cmdArr[0].substring(1);
     const args = cmdArr.slice(1);
     switch (cmd) {
       case 'mute': {
@@ -460,7 +460,8 @@ export class ChatProvider {
   }
 
   async mute(plainName, channelId, timeMin = null) {
-    const name = (plainName.startsWith('@')) ? plainName.substr(1) : plainName;
+    const name = (plainName.startsWith('@'))
+      ? plainName.substring(1) : plainName;
     const id = await User.name2Id(name);
     if (!id) {
       return `Couldn't find user ${name}`;
@@ -489,7 +490,8 @@ export class ChatProvider {
   }
 
   async unmute(plainName, channelId) {
-    const name = (plainName.startsWith('@')) ? plainName.substr(1) : plainName;
+    const name = (plainName.startsWith('@'))
+      ? plainName.substring(1) : plainName;
     const id = await User.name2Id(name);
     if (!id) {
       return `Couldn't find user ${name}`;

src/core/utils.js

@@ -47,7 +47,7 @@ export function clamp(n, min, max) {
  */
 export function dateToString(date) {
   // YYYY-MM-DD
-  return date.substr(0, 4) + date.substr(5, 2) + date.substr(8, 2);
+  return ate.substring(0, 4) + date.substring(5, 7) + date.substring(8)
 }
 
 /*
@@ -291,9 +291,9 @@ export function setBrightness(hex, dark: boolean = false) {
     hex = hex.replace(/(.)/g, '$1$1');
   }
 
-  let r = Math.floor(parseInt(hex.substr(0, 2), 16) / 2);
-  let g = Math.floor(parseInt(hex.substr(2, 2), 16) / 2);
-  let b = Math.floor(parseInt(hex.substr(4, 2), 16) / 2);
+  let r = Math.floor(parseInt(hex.substring(0, 2), 16) / 2);
+  let g = Math.floor(parseInt(hex.substring(2, 4), 16) / 2);
+  let b = Math.floor(parseInt(hex.substring(4, 6), 16) / 2);
   if (dark) {
     r += 128;
     g += 128;

src/reducers/windows.js

@@ -646,7 +646,7 @@ export default function windows(
         msg,
       } = action;
       let { inputMessage } = state.args[windowId];
-      const lastChar = inputMessage.substr(-1);
+      const lastChar = inputMessage.slice(-1);
       const pad = (lastChar && lastChar !== ' ') ? ' ' : '';
       inputMessage += pad + msg;
       return {

src/ui/InfiniteGridHelper.js

@@ -16,7 +16,7 @@ export default class InfiniteGridHelper extends THREE.Mesh {
     size2 = size2 || 100;
 
     distance = distance || 8000;
-    const planeAxes = axes.substr(0, 2);
+    const planeAxes = axes.substring(0, 2);
     const geometry = new THREE.PlaneBufferGeometry(2, 2, 1, 1);
     const material = new THREE.ShaderMaterial({