ci: lint for ui

packages/ui-default/backendlib/markdown-it-media.js

@@ -44,51 +44,45 @@ function extractVideoParameters(url) {
   return parameterMap;
 }
 function videoUrl(service, videoID, url, options) {
-  switch (service) {
-    case 'youtube': {
-      const parameters = extractVideoParameters(url);
-      if (options.youtube.parameters) {
-        Object.keys(options.youtube.parameters).forEach((key) => {
-          parameters.set(key, options.youtube.parameters[key]);
-        });
-      }
-      const timeParameter = parameters.get('t');
-      if (timeParameter !== undefined) {
-        let startTime = 0;
-        const timeParts = timeParameter.match(/[0-9]+/g);
-        let j = 0;
-        while (timeParts.length > 0) {
-          startTime += Number(timeParts.pop()) * Math.pow(60, j);
-          j += 1;
-        }
-        parameters.set('start', startTime);
-        parameters.delete('t');
-      }
-      parameters.delete('v');
-      parameters.delete('feature');
-      parameters.delete('origin');
-      const parameterArray = Array.from(parameters, (p) => p.join('='));
-      const parameterPos = videoID.indexOf('?');
-      let finalUrl = 'https://www.youtube';
-      if (options.youtube.nocookie || url.indexOf('youtube-nocookie.com') > -1) finalUrl += '-nocookie';
-      finalUrl += `.com/embed/${parameterPos > -1 ? videoID.substr(0, parameterPos) : videoID}`;
-      if (parameterArray.length > 0) finalUrl += `?${parameterArray.join('&')}`;
-      return finalUrl;
+  if (service === 'youtube') {
+    const parameters = extractVideoParameters(url);
+    if (options.youtube.parameters) {
+      Object.keys(options.youtube.parameters).forEach((key) => {
+        parameters.set(key, options.youtube.parameters[key]);
+      });
     }
-    case 'vimeo':
-      return `https://player.vimeo.com/video/${videoID}`;
-    case 'vine':
-      return `https://vine.co/v/${videoID}/embed/${options.vine.embed}`;
-    case 'prezi':
-      return `https://prezi.com/embed/${videoID
-        }/?bgcolor=ffffff&lock_to_path=0&autoplay=0&autohide_ctrls=0&`
-        + 'landing_data=bHVZZmNaNDBIWnNjdEVENDRhZDFNZGNIUE43MHdLNWpsdFJLb2ZHanI5N1lQVHkxSHFxazZ0UUNCRHloSXZROHh3PT0&'
-        + 'landing_sign=1kD6c0N6aYpMUS0wxnQjxzSqZlEB8qNFdxtdjYhwSuI';
-    case 'osf':
-      return `https://mfr.osf.io/render?url=https://osf.io/${videoID}/?action=download`;
-    default:
-      return videoID;
+    const timeParameter = parameters.get('t');
+    if (timeParameter !== undefined) {
+      let startTime = 0;
+      const timeParts = timeParameter.match(/[0-9]+/g);
+      let j = 0;
+      while (timeParts.length > 0) {
+        startTime += Number(timeParts.pop()) * Math.pow(60, j);
+        j += 1;
+      }
+      parameters.set('start', startTime);
+      parameters.delete('t');
+    }
+    parameters.delete('v');
+    parameters.delete('feature');
+    parameters.delete('origin');
+    const parameterArray = Array.from(parameters, (p) => p.join('='));
+    const parameterPos = videoID.indexOf('?');
+    let finalUrl = 'https://www.youtube';
+    if (options.youtube.nocookie || url.indexOf('youtube-nocookie.com') > -1) finalUrl += '-nocookie';
+    finalUrl += `.com/embed/${parameterPos > -1 ? videoID.substr(0, parameterPos) : videoID}`;
+    if (parameterArray.length > 0) finalUrl += `?${parameterArray.join('&')}`;
+    return finalUrl;
   }
+  if (service === 'vimeo') return `https://player.vimeo.com/video/${videoID}`;
+  if (service === 'vine') return `https://vine.co/v/${videoID}/embed/${options.vine.embed}`;
+  if (service === 'prezi') {
+    return `https://prezi.com/embed/${videoID}/?bgcolor=ffffff&lock_to_path=0&autoplay=0&autohide_ctrls=0&`
+      + 'landing_data=bHVZZmNaNDBIWnNjdEVENDRhZDFNZGNIUE43MHdLNWpsdFJLb2ZHanI5N1lQVHkxSHFxazZ0UUNCRHloSXZROHh3PT0&'
+      + 'landing_sign=1kD6c0N6aYpMUS0wxnQjxzSqZlEB8qNFdxtdjYhwSuI';
+  }
+  if (service === 'osf') return `https://mfr.osf.io/render?url=https://osf.io/${videoID}/?action=download`;
+  return videoID;
 }
 
 module.exports = function videoPlugin(md) {
@@ -138,10 +132,10 @@ module.exports = function videoPlugin(md) {
     }
     if (options[service]?.width) {
       return `<div class="embed-responsive embed-responsive-16by9">
-      <iframe class="embed-responsive-item ${service}-player" type="text/html" width="${options[service].width || 640
-        }" height="${options[service].height || 390
-        }" src="${options.url(service, videoID, tokens[idx].url, options)
-        }" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>`;
+      <iframe class="embed-responsive-item ${service}-player" type="text/html" width="${options[service].width || 640}"\
+        height="${options[service].height || 390}"\
+        src="${options.url(service, videoID, tokens[idx].url, options)}"
+        frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>`;
     }
     return `<div data-${service}>${escapeHtml(videoID)}</div>`;
   };

packages/ui-default/components/messagepad/reducers/dialogues.js

@@ -4,11 +4,11 @@ export default function reducer(state = {}, action) {
   switch (action.type) {
   case 'DIALOGUES_LOAD_DIALOGUES_FULFILLED': {
     const { messages } = action.payload;
-    return {...state, ..._.keyBy(messages, 'udoc._id')};
+    return { ...state, ..._.keyBy(messages, 'udoc._id') };
   }
   case 'DIALOGUES_CREATE': {
     const { user } = action.payload;
-    if (state[user._id]) return state
+    if (state[user._id]) return state;
     return {
       ...state,
       [user._id]: {

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

@@ -40,10 +40,10 @@ export function setLocaleData(data) {
   CURRENT_LOCALE_DATA = data;
 }
 
-export function loadMessageBundle(file) {
+export function loadMessageBundle() {
   return localize;
 }
 
-export function config(opt) {
+export function config() {
   return loadMessageBundle;
 }

packages/ui-default/components/react/DomComponent.jsx

@@ -1,26 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-
-export default class DomComponent extends React.PureComponent {
-  componentDidMount() {
-    this.refs.dom.appendChild(this.props.childDom);
-  }
-
-  componentWillUnmount() {
-    $(this.refs.dom).empty();
-  }
-
-  render() {
-    const {
-      childDom,
-      ...rest
-    } = this.props;
-    return (
-      <div {...rest} ref="dom"></div>
-    );
-  }
-}
-
-DomComponent.propTypes = {
-  childDom: PropTypes.instanceOf(HTMLElement).isRequired,
-};

packages/ui-default/components/react/DomComponent.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import { omit } from 'lodash';
+
+export default function DomComponent(props: React.HTMLAttributes<HTMLDivElement> & { childDom: HTMLElement }) {
+  const ref = React.useRef<HTMLDivElement>();
+  React.useEffect(() => {
+    ref.current.appendChild(props.childDom);
+    return () => {
+      $(ref.current).empty();
+    };
+  });
+  return <div {...omit(props, 'childDom')} ref={ref}></div>;
+}

packages/ui-default/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.33.2",
+  "version": "4.33.3",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",

packages/ui-default/pages/problem_detail.page.jsx

@@ -254,7 +254,7 @@ const page = new NamedPage(['problem_detail', 'contest_detail_problem', 'homewor
     window.onresize = function () {
       statusChart.resize();
       scoreChart.resize();
-    }
+    };
   }
 
   $(document).on('click', '[name="problem-sidebar__open-scratchpad"]', (ev) => {