workspace: update eslint rule (#1027)

packages/ui-default/components/DOMAttachedObject.ts

@@ -118,7 +118,6 @@ export default class DOMAttachedObject {
   }
 
   constructor($dom: JQuery<HTMLElement>, monitorDetach = false) {
-    // eslint-disable-next-line no-constructor-return
     if ($dom == null) return null;
     this.$dom = $dom;
     this.id = ++DOMAttachedObject.uniqueIdCounter;

packages/ui-default/components/autocomplete/CustomSelectAutoComplete.tsx

@@ -2,7 +2,7 @@ import { CustomSelectAutoComplete as CustomSelectAutoCompleteFC } from '@hydrooj
 import AutoComplete, { AutoCompleteOptions } from '.';
 
 interface CustomSelectOptions {
-  data: any[]
+  data: any[];
 }
 
 export default class CustomSelectAutoComplete<Multi extends boolean> extends AutoComplete<CustomSelectOptions> {

packages/ui-default/components/autocomplete/index.tsx

@@ -19,7 +19,7 @@ export interface AutoCompleteOptions<Multi extends boolean = boolean> {
   text?: () => string;
 }
 
-export default class AutoComplete<Options extends Record<string, any> = {}, Multi extends boolean = boolean> extends DOMAttachedObject {
+export default class AutoComplete<Options extends Record<string, any> = object, Multi extends boolean = boolean> extends DOMAttachedObject {
   static DOMAttachKey = 'ucwAutoCompleteInstance';
   ref = null;
   container = document.createElement('div');

packages/ui-default/components/calendar/index.js

@@ -215,7 +215,7 @@ export default class Calendar {
     const daysByWeek = _.chunk(days, 7);
 
     const numberOfWeeks = days.length / 7;
-    const bannersByWeek = _.fill(new Array(numberOfWeeks), 1).map(() => []);
+    const bannersByWeek = _.fill(Array.from({ length: numberOfWeeks }), 1).map(() => []);
     const beginDate = days[0].date.clone();
     const endDate = _.last(days).date.clone();
 
@@ -268,7 +268,7 @@ export default class Calendar {
         ]))
       .map((banners) => {
         const dayBitmap = _
-          .fill(new Array(7), 1)
+          .fill(Array.from({ length: 7 }), 1)
           .map(() => []);
         banners.forEach((banner) => {
           const beginDay = banner.beginAt.day();
@@ -292,7 +292,7 @@ export default class Calendar {
         // merge adjacent cells and arrange banners by vertical index
         const vMaxLength = _.max(_.range(0, 7).map((day) => dayBitmap[day].length));
         const weekBanners = _
-          .fill(new Array(vMaxLength), 1)
+          .fill(Array.from({ length: vMaxLength }), 1)
           .map(() => []);
         for (let vIndex = 0; vIndex < vMaxLength; ++vIndex) {
           let last = { span: 1, banner: dayBitmap[0][vIndex] };

packages/ui-default/components/customFont.page.tsx

@@ -27,12 +27,14 @@ export default new AutoloadPage('customFont', (pageName) => {
     if (!dialog) {
       const fonts = await getAvailableFonts();
       dialog = new ActionDialog({
-        $body: $(tpl(<CustomSelectAutoComplete
-          ref={(el) => { handle = el; }}
-          allowEmptyQuery={false}
-          data={fonts}
-          renderItem={(item) => <div style={{ fontFamily: item.id }}>{item.name}</div>}
-        />, true)),
+        $body: $(tpl(
+          <CustomSelectAutoComplete
+            ref={(el) => { handle = el; }}
+            allowEmptyQuery={false}
+            data={fonts}
+            renderItem={(item) => <div style={{ fontFamily: item.id }}>{item.name}</div>}
+          />, true,
+        )),
         onDispatch: (action) => {
           selection = handle.getSelectedItems()?.[0]?.id;
           return action !== 'ok' || selection;

packages/ui-default/components/dialog/index.tsx

@@ -144,24 +144,29 @@ export async function prompt<T extends string>(title: string, fields: Record<T,
             <div className="textbox-container">
               {field.type === 'text'
                 ? <input
-                  type="text" className="textbox" data-autofocus={field.autofocus}
+                  type="text"
+                  className="textbox"
+                  data-autofocus={field.autofocus}
                   defaultValue={field.default}
                   onChange={(e) => setValues({ ...values, [name]: e.target.value })}
                 />
                 : field.type === 'user'
                   ? <UserSelectAutoComplete
-                    data-autofocus={field.autofocus} selectedKeys={values[name] ? [values[name].toString()] : []}
+                    data-autofocus={field.autofocus}
+                    selectedKeys={values[name] ? [values[name].toString()] : []}
                     onChange={(e) => setValues({ ...values, [name]: +e })}
                     byId
                   />
                   : <DomainSelectAutoComplete
-                    data-autofocus={field.autofocus} selectedKeys={values[name] ? [values[name]] : []}
+                    data-autofocus={field.autofocus}
+                    selectedKeys={values[name] ? [values[name]] : []}
                     onChange={(e) => setValues({ ...values, [name]: e })}
                   />}
             </div>
           </label>}
           {field.type === 'checkbox' && <label className="checkbox">
-            <input type="checkbox"
+            <input
+              type="checkbox"
               defaultChecked={field.default === 'true'}
               onChange={(e) => setValues({ ...values, [name]: !!e.target.checked })}
             />

packages/ui-default/components/discussion/reaction.page.tsx

@@ -62,8 +62,8 @@ function Reaction({ payload, ele }) {
             <input name="emojiSuggest" onFocus={() => updateFocus(true)} onBlur={() => updateFocus(false)}></input>
           </div>
         </div>
-      </div>
-      }>
+      </div>}
+    >
       <span className="icon icon-emoji"></span>
     </Popover>
   );

packages/ui-default/components/editor/index.tsx

@@ -169,9 +169,9 @@ export default class Editor extends DOMAttachedObject {
       const [val, setVal] = React.useState(value);
       that.setMarkdownEditorValue = setVal;
       return <MdEditor
-        className='textbox'
+        className="textbox"
         autoFocus={hasFocus}
-        codeTheme='github'
+        codeTheme="github"
         codeStyleReverse={false}
         ref={renderCallback}
         value={val}

packages/ui-default/components/highlighter/prismjs.js

@@ -73,7 +73,7 @@ function addInvisibles(grammar) {
   for (const name in grammar) {
     if (Object.prototype.hasOwnProperty.call(grammar, name) && !invisibles[name]) {
       if (name === 'rest') addInvisibles(grammar.rest);
-      else handlerInvisiblesToken(grammar, name); // eslint-disable-line @typescript-eslint/no-use-before-define
+      else handlerInvisiblesToken(grammar, name); // eslint-disable-line ts/no-use-before-define
     }
   }
 }

packages/ui-default/components/marker/Marker.js

@@ -23,7 +23,6 @@ class Marker {
   }
 
   constructor() {
-    // eslint-disable-next-line no-constructor-return
     if (Marker.exists()) return markerInstance;
     if (markerInstance) {
       markerInstance.destroy();

packages/ui-default/components/message/worker.ts

@@ -1,4 +1,3 @@
-/* eslint-disable no-restricted-globals */
 /// <reference no-default-lib="true" />
 /// <reference lib="webworker" />
 import ReconnectingWebsocket from 'reconnecting-websocket';
@@ -64,10 +63,10 @@ function initConn(path: string, port: MessagePort, cookie: any) {
     console.log('Connected');
     broadcastMsg({ type: 'open' });
     conn.send(JSON.stringify({
-      'operation': 'subscribe',
-      'request_id': Math.random().toString(16).substring(2),
-      'credential': lcookie,
-      'channels': ['message'],
+      operation: 'subscribe',
+      request_id: Math.random().toString(16).substring(2),
+      credential: lcookie,
+      channels: ['message'],
     }));
   };
   conn.onerror = () => broadcastMsg({ type: 'error' });

packages/ui-default/components/messagepad/MessagePadDialogueContentContainer.jsx

@@ -94,11 +94,11 @@ export default connect(mapStateToProps)(class MessagePadDialogueContentContainer
       <>
         <div className="messagepad__header">
           { this.props.item
-          && (
-            <a className="messagepad__content__header__title" href={`/user/${this.props.item.udoc._id}`}>
-              {`${this.props.item.udoc.uname}(UID: ${this.props.item.udoc._id})`}
-            </a>
-          )}
+            && (
+              <a className="messagepad__content__header__title" href={`/user/${this.props.item.udoc._id}`}>
+                {`${this.props.item.udoc.uname}(UID: ${this.props.item.udoc._id})`}
+              </a>
+            )}
         </div>
         <ol className="messagepad__content" ref="list">
           {this.renderInner()}

packages/ui-default/components/messagepad/MessagePadInputContainer.jsx

@@ -51,7 +51,7 @@ export default connect(mapStateToProps, mapDispatchToProps)(class MessagePadInpu
   componentDidUpdate(prevProps) {
     this.focusInput = (
       this.props.activeId !== prevProps.activeId
-      || prevProps.isPosting !== this.props.isPosting && this.props.isPosting === false
+      || (prevProps.isPosting !== this.props.isPosting && this.props.isPosting === false)
     );
     if (this.focusInput) {
       const { scrollX, scrollY } = window;

packages/ui-default/components/monaco/nls.js

@@ -12,7 +12,7 @@ function format(message, args) {
   return result;
 }
 
-let CURRENT_LOCALE_DATA = {}; // eslint-disable-line @typescript-eslint/naming-convention
+let CURRENT_LOCALE_DATA = {}; // eslint-disable-line ts/naming-convention
 
 export function localize(path, message, ...args) {
   return format(CURRENT_LOCALE_DATA[path.key || path] || CURRENT_LOCALE_DATA[message] || message, args);

packages/ui-default/components/preview/preview.page.ts

@@ -159,7 +159,7 @@ export async function previewFile(ev?, type = '') {
     Notification.info(i18n('Loading file...'));
     try {
       const { url } = await request.get(link, {}, { headers: { Pragma: 'no-cache' } });
-      if (/^(doc|xls|ppt)x?$/.test(ext)) return previewOffice(link, url);
+      if (/^(?:doc|xls|ppt)x?$/.test(ext)) return previewOffice(link, url);
       content = await request.get(url, undefined, { dataType: 'text' });
     } catch (e) {
       Notification.error(i18n('Failed to load file: {0}', e.message));

packages/ui-default/components/problemconfig/ProblemConfigEditor.tsx

@@ -24,7 +24,7 @@ const mapDispatchToProps = (dispatch) => ({
 
 interface Props {
   config: any;
-  handleUpdateCode: Function;
+  handleUpdateCode: (val: string) => void;
 }
 
 const configKey = [

packages/ui-default/components/problemconfig/index.tsx

@@ -10,7 +10,7 @@ import { ProblemConfigTree } from './ProblemConfigTree';
 import { RootState } from './reducer';
 
 interface Props {
-  onSave: () => void
+  onSave: () => void;
 }
 
 export default function ProblemConfig(props: Props) {
@@ -31,8 +31,12 @@ export default function ProblemConfig(props: Props) {
         <Tabs onChange={(t) => (t !== 'errors' && setSelected(t.toString()))} selectedTabId={valid ? selected : 'errors'}>
           <Tab id="basic" disabled={!valid} title={i18n('Basic')} panel={<ProblemConfigForm />} />
           <Tab id="subtasks" disabled={!valid} title={i18n('Subtasks')} panel={<ProblemConfigTree />} />
-          <Tab id="errors" disabled={valid} title={errors.length ? `Errors(${errors.length})` : 'No Errors'} panel={
-            <div>{errors.map((i) => (<pre key={i}>{i}</pre>))}</div>} />
+          <Tab
+            id="errors"
+            disabled={valid}
+            title={errors.length ? `Errors(${errors.length})` : 'No Errors'}
+            panel={<div>{errors.map((i) => (<pre key={i}>{i}</pre>))}</div>}
+          />
         </Tabs>
       </div>
     </div>

packages/ui-default/components/problemconfig/tree/SelectionManager.tsx

@@ -42,9 +42,9 @@ export function SelectionManager(props: SelectionManagerProps) {
     for (const el of selected) {
       if (collide(el, { ...pos, width: 1, height: 1 })) return;
     }
-    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    // eslint-disable-next-line ts/no-use-before-define
     document.body.addEventListener('mousemove', handleMouseMove);
-    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    // eslint-disable-next-line ts/no-use-before-define
     document.body.addEventListener('mouseup', handleMouseUp);
     $('body').css('cursor', 'crosshair')
       .append('<div id="divSelectArea" style="position:absolute;background-color:#e073d4;"></div>');

packages/ui-default/components/problemconfig/tree/Testcase.tsx

@@ -30,7 +30,7 @@ export function TestcaseNode(props: TestcaseNodeProps) {
       data-selected={selected}
       content={
         <Menu>
-          <MenuItem icon="drawer-left" text={i18n('Move to subtask')} >
+          <MenuItem icon="drawer-left" text={i18n('Move to subtask')}>
             {subtaskIds.filter((i) => i !== subtaskId).map((i) => (
               <MenuItem key={i} text={i18n('Subtask {0}', i)} />
             ))}

packages/ui-default/components/rotator/index.js

@@ -56,7 +56,7 @@ export default class Rotator extends DOMAttachedObject {
       return;
     }
     let fromPosition;
-    if (parseFloat(value) > parseFloat(this.value)) {
+    if (Number.parseFloat(value) > Number.parseFloat(this.value)) {
       fromPosition = POS_BELOW;
     } else {
       fromPosition = POS_ABOVE;

packages/ui-default/components/upload.tsx

@@ -20,15 +20,21 @@ interface UploadOptions {
 export default async function uploadFiles(endpoint = '', files: File[] | FileList = [], options: UploadOptions = {}) {
   const dialog = new Dialog({
     $body: $(tpl(<>
-      <div className="file-label" style={{
-        textAlign: 'center', marginBottom: '5px', color: 'gray', fontSize: 'small',
-      }}></div>
+      <div
+        className="file-label"
+        style={{
+          textAlign: 'center', marginBottom: '5px', color: 'gray', fontSize: 'small',
+        }}
+      ></div>
       <div className={`${Classes.PROGRESS_BAR} ${Classes.INTENT_PRIMARY} bp5-no-stripes`}>
         <div className={`file-progress ${Classes.PROGRESS_METER}`} style={{ width: 0 }}></div>
       </div>
-      <div className="upload-label" style={{
-        textAlign: 'center', margin: '5px 0', color: 'gray', fontSize: 'small',
-      }}></div>
+      <div
+        className="upload-label"
+        style={{
+          textAlign: 'center', margin: '5px 0', color: 'gray', fontSize: 'small',
+        }}
+      ></div>
       <div className={`${Classes.PROGRESS_BAR} ${Classes.INTENT_PRIMARY} bp5-no-stripes`}>
         <div className={`upload-progress ${Classes.PROGRESS_METER}`} style={{ width: 0 }}></div>
       </div>

packages/ui-default/components/zipDownloader/index.ts

@@ -84,13 +84,13 @@ export default async function download(filename, targets) {
 
 declare module '../../api' {
   interface EventMap {
-    'problemset/download': (pids: number[], name: string, targets: { filename: string; url?: string; content?: string }[]) => void;
+    'problemset/download': (pids: number[], name: string, targets: { filename: string, url?: string, content?: string }[]) => void;
   }
 }
 
 export async function downloadProblemSet(pids, name = 'Export') {
   Notification.info(i18n('Downloading...'));
-  const targets: { filename: string; url?: string; content?: string }[] = [];
+  const targets: { filename: string, url?: string, content?: string }[] = [];
   try {
     await ctx.serial('problemset/download', pids, name, targets);
     for (const pid of pids) {
@@ -122,7 +122,7 @@ export async function downloadProblemSet(pids, name = 'Export') {
       });
       try {
         const c = JSON.parse(pdoc.content);
-        if (c instanceof Array || typeof c === 'string') throw new Error();
+        if (c instanceof Array || typeof c === 'string') throw new Error('Invalid content');
         for (const key of Object.keys(c)) {
           targets.push({
             filename: `${pid}/problem_${key}.md`,