From 3fb7fe14c625b0e797429843a0275b6ae3fdf5a1 Mon Sep 17 00:00:00 2001
From: Claire <claire.github-309c@sitedethib.com>
Date: Sun, 7 May 2023 18:22:25 +0200
Subject: [PATCH] Fix some of the Javascript linting issues, as well as bugs
 and unneeded divergences with upstream (#2208)

* Run eslint --fix

* Fix linting issues in video player and reduce divergences with upstream

This includes a behavior change of not auto-looping videos anymore. I don't
remember loops being ever intended, and they have been removed from upstream
a while ago, but we somehow missed the change.

* Fix lint issues in `app/javascript/flavours/glitch/selectors/index.js`

Those were basically caused by dead code that isn't present upstream, so
that brings us closer to upstream as well.

* Fix linting issue and bug in streaming/index.js

* Fix linting issues in config/webpack/shared.js

* Fix unused import in flavours/glitch/features/ui/index.js

* Fix linting issues and reduce divergences from upstream in flavours/glitch/features/ui/components/video_modal.jsx

* Fix linting issues in flavours/glitch/reducers

* Fix linting issues in glitch-soc onboarding modal

* Fix linting issues in flavours/glitch/features/ui/components/navigation_panel.jsx

* Remove dead code for unused local setting navbar_under

* Fix various linting issues

* Fix linting issues in flavours/glitch/components/scrollable_list.jsx and reduce divergences with upstream
---
 .../glitch/components/scrollable_list.jsx     | 47 ++++++++++++-------
 .../features/compose/components/options.jsx   |  4 --
 .../compose/containers/options_container.js   |  2 -
 .../features/status/components/card.jsx       |  3 +-
 .../status/components/detailed_status.jsx     |  3 +-
 .../containers/detailed_status_container.js   |  2 -
 .../features/ui/components/columns_area.jsx   |  3 +-
 .../components/deprecated_settings_modal.jsx  |  2 +-
 .../ui/components/navigation_panel.jsx        |  6 +--
 .../ui/components/onboarding_modal.jsx        | 14 +++---
 .../features/ui/components/video_modal.jsx    |  6 +--
 .../flavours/glitch/features/ui/index.jsx     | 19 +++-----
 .../flavours/glitch/features/video/index.jsx  | 17 +++----
 .../flavours/glitch/reducers/compose.js       |  1 +
 .../glitch/reducers/local_settings.js         |  1 -
 .../flavours/glitch/selectors/index.js        |  3 +-
 .../glitch/styles/components/columns.scss     | 25 ----------
 config/webpack/shared.js                      |  7 ++-
 config/webpack/translationRunner.js           |  2 +-
 streaming/index.js                            |  3 +-
 20 files changed, 68 insertions(+), 102 deletions(-)

diff --git a/app/javascript/flavours/glitch/components/scrollable_list.jsx b/app/javascript/flavours/glitch/components/scrollable_list.jsx
index fc7dc989d..c1f511b48 100644
--- a/app/javascript/flavours/glitch/components/scrollable_list.jsx
+++ b/app/javascript/flavours/glitch/components/scrollable_list.jsx
@@ -90,15 +90,19 @@ class ScrollableList extends PureComponent {
   lastScrollWasSynthetic = false;
   scrollToTopOnMouseIdle = false;
 
+  _getScrollingElement = () => {
+    if (this.props.bindToDocument) {
+      return (document.scrollingElement || document.body);
+    } else {
+      return this.node;
+    }
+  };
+
   setScrollTop = newScrollTop => {
     if (this.getScrollTop() !== newScrollTop) {
       this.lastScrollWasSynthetic = true;
 
-      if (this.props.bindToDocument) {
-        document.scrollingElement.scrollTop = newScrollTop;
-      } else {
-        this.node.scrollTop = newScrollTop;
-      }
+      this._getScrollingElement().scrollTop = newScrollTop;
     }
   };
 
@@ -106,6 +110,7 @@ class ScrollableList extends PureComponent {
     if (this.mouseIdleTimer === null) {
       return;
     }
+
     clearTimeout(this.mouseIdleTimer);
     this.mouseIdleTimer = null;
   };
@@ -113,13 +118,13 @@ class ScrollableList extends PureComponent {
   handleMouseMove = throttle(() => {
     // As long as the mouse keeps moving, clear and restart the idle timer.
     this.clearMouseIdleTimer();
-    this.mouseIdleTimer =
-      setTimeout(this.handleMouseIdle, MOUSE_IDLE_DELAY);
+    this.mouseIdleTimer = setTimeout(this.handleMouseIdle, MOUSE_IDLE_DELAY);
 
     if (!this.mouseMovedRecently && this.getScrollTop() === 0) {
       // Only set if we just started moving and are scrolled to the top.
       this.scrollToTopOnMouseIdle = true;
     }
+
     // Save setting this flag for last, so we can do the comparison above.
     this.mouseMovedRecently = true;
   }, MOUSE_IDLE_DELAY / 2);
@@ -134,6 +139,7 @@ class ScrollableList extends PureComponent {
     if (this.scrollToTopOnMouseIdle && !this.props.preventScroll) {
       this.setScrollTop(0);
     }
+
     this.mouseMovedRecently = false;
     this.scrollToTopOnMouseIdle = false;
   };
@@ -141,6 +147,7 @@ class ScrollableList extends PureComponent {
   componentDidMount () {
     this.attachScrollListener();
     this.attachIntersectionObserver();
+
     attachFullscreenListener(this.onFullScreenChange);
 
     // Handle initial scroll position
@@ -156,15 +163,15 @@ class ScrollableList extends PureComponent {
   };
 
   getScrollTop = () => {
-    return this.props.bindToDocument ? document.scrollingElement.scrollTop : this.node.scrollTop;
+    return this._getScrollingElement().scrollTop;
   };
 
   getScrollHeight = () => {
-    return this.props.bindToDocument ? document.scrollingElement.scrollHeight : this.node.scrollHeight;
+    return this._getScrollingElement().scrollHeight;
   };
 
   getClientHeight = () => {
-    return this.props.bindToDocument ? document.scrollingElement.clientHeight : this.node.clientHeight;
+    return this._getScrollingElement().clientHeight;
   };
 
   updateScrollBottom = (snapshot) => {
@@ -173,11 +180,7 @@ class ScrollableList extends PureComponent {
     this.setScrollTop(newScrollTop);
   };
 
-  cacheMediaWidth = (width) => {
-    if (width && this.state.cachedMediaWidth != width) this.setState({ cachedMediaWidth: width });
-  };
-
-  getSnapshotBeforeUpdate (prevProps, prevState) {
+  getSnapshotBeforeUpdate (prevProps) {
     const someItemInserted = React.Children.count(prevProps.children) > 0 &&
       React.Children.count(prevProps.children) < React.Children.count(this.props.children) &&
       this.getFirstChildKey(prevProps) !== this.getFirstChildKey(this.props);
@@ -198,10 +201,17 @@ class ScrollableList extends PureComponent {
     }
   }
 
+  cacheMediaWidth = (width) => {
+    if (width && this.state.cachedMediaWidth !== width) {
+      this.setState({ cachedMediaWidth: width });
+    }
+  };
+
   componentWillUnmount () {
     this.clearMouseIdleTimer();
     this.detachScrollListener();
     this.detachIntersectionObserver();
+
     detachFullscreenListener(this.onFullScreenChange);
   }
 
@@ -210,10 +220,13 @@ class ScrollableList extends PureComponent {
   };
 
   attachIntersectionObserver () {
-    this.intersectionObserverWrapper.connect({
+    let nodeOptions = {
       root: this.node,
       rootMargin: '300% 0px',
-    });
+    };
+
+    this.intersectionObserverWrapper
+      .connect(this.props.bindToDocument ? {} : nodeOptions);
   }
 
   detachIntersectionObserver () {
diff --git a/app/javascript/flavours/glitch/features/compose/components/options.jsx b/app/javascript/flavours/glitch/features/compose/components/options.jsx
index 19ead2f21..cedb906ca 100644
--- a/app/javascript/flavours/glitch/features/compose/components/options.jsx
+++ b/app/javascript/flavours/glitch/features/compose/components/options.jsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { defineMessages, injectIntl } from 'react-intl';
-import spring from 'react-motion/lib/spring';
 import Toggle from 'react-toggle';
 import { connect } from 'react-redux';
 
@@ -16,7 +15,6 @@ import LanguageDropdown from '../containers/language_dropdown_container';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 //  Utils.
-import Motion from '../../ui/util/optional_motion';
 import { pollLimits } from 'flavours/glitch/initial_state';
 
 //  Messages.
@@ -125,7 +123,6 @@ class ComposerOptions extends ImmutablePureComponent {
     advancedOptions: ImmutablePropTypes.map,
     disabled: PropTypes.bool,
     allowMedia: PropTypes.bool,
-    hasMedia: PropTypes.bool,
     allowPoll: PropTypes.bool,
     hasPoll: PropTypes.bool,
     intl: PropTypes.object.isRequired,
@@ -190,7 +187,6 @@ class ComposerOptions extends ImmutablePureComponent {
       contentType,
       disabled,
       allowMedia,
-      hasMedia,
       allowPoll,
       hasPoll,
       onChangeAdvancedOption,
diff --git a/app/javascript/flavours/glitch/features/compose/containers/options_container.js b/app/javascript/flavours/glitch/features/compose/containers/options_container.js
index 19a90ac8b..5b7ccc06b 100644
--- a/app/javascript/flavours/glitch/features/compose/containers/options_container.js
+++ b/app/javascript/flavours/glitch/features/compose/containers/options_container.js
@@ -9,7 +9,6 @@ import {
 import { openModal } from 'flavours/glitch/actions/modal';
 
 function mapStateToProps (state) {
-  const spoilersAlwaysOn = state.getIn(['local_settings', 'always_show_spoilers_field']);
   const poll = state.getIn(['compose', 'poll']);
   const media = state.getIn(['compose', 'media_attachments']);
   const pending_media = state.getIn(['compose', 'pending_media_attachments']);
@@ -18,7 +17,6 @@ function mapStateToProps (state) {
     resetFileKey: state.getIn(['compose', 'resetFileKey']),
     hasPoll: !!poll,
     allowMedia: !poll && (media ? media.size + pending_media < 4 && !media.some(item => ['video', 'audio'].includes(item.get('type'))) : pending_media < 4),
-    hasMedia: media && !!media.size,
     allowPoll: !(media && !!media.size),
     showContentTypeChoice: state.getIn(['local_settings', 'show_content_type_choice']),
     contentType: state.getIn(['compose', 'content_type']),
diff --git a/app/javascript/flavours/glitch/features/status/components/card.jsx b/app/javascript/flavours/glitch/features/status/components/card.jsx
index 7e834b2dc..0d5f781a0 100644
--- a/app/javascript/flavours/glitch/features/status/components/card.jsx
+++ b/app/javascript/flavours/glitch/features/status/components/card.jsx
@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import Immutable from 'immutable';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { FormattedMessage } from 'react-intl';
-import punycode from 'punycode';
 import classnames from 'classnames';
 import { decode as decodeIDNA } from 'flavours/glitch/utils/idna';
 import Icon from 'flavours/glitch/components/icon';
@@ -164,7 +163,7 @@ export default class Card extends React.PureComponent {
   }
 
   render () {
-    const { card, compact, defaultWidth } = this.props;
+    const { card, compact } = this.props;
     const { width, embedded, revealed } = this.state;
 
     if (card === null) {
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
index cfe6c965e..3f5b11944 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.jsx
@@ -122,9 +122,8 @@ class DetailedStatus extends ImmutablePureComponent {
 
   render () {
     const status = (this.props.status && this.props.status.get('reblog')) ? this.props.status.get('reblog') : this.props.status;
-    const { expanded, onToggleHidden, settings, pictureInPicture, intl } = this.props;
     const outerStyle = { boxSizing: 'border-box' };
-    const { compact } = this.props;
+    const { compact, pictureInPicture, expanded, onToggleHidden, settings } = this.props;
 
     if (!status) {
       return null;
diff --git a/app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js b/app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js
index e5e065987..25517a9f7 100644
--- a/app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js
+++ b/app/javascript/flavours/glitch/features/status/containers/detailed_status_container.js
@@ -18,8 +18,6 @@ import {
   muteStatus,
   unmuteStatus,
   deleteStatus,
-  hideStatus,
-  revealStatus,
 } from 'flavours/glitch/actions/statuses';
 import { initMuteModal } from 'flavours/glitch/actions/mutes';
 import { initBlockModal } from 'flavours/glitch/actions/blocks';
diff --git a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
index 3b3b0d58f..458f48cde 100644
--- a/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/columns_area.jsx
@@ -50,7 +50,6 @@ export default class ColumnsArea extends ImmutablePureComponent {
     columns: ImmutablePropTypes.list.isRequired,
     singleColumn: PropTypes.bool,
     children: PropTypes.node,
-    navbarUnder: PropTypes.bool,
     openSettings: PropTypes.func,
   };
 
@@ -136,7 +135,7 @@ export default class ColumnsArea extends ImmutablePureComponent {
   };
 
   render () {
-    const { columns, children, singleColumn, navbarUnder, openSettings } = this.props;
+    const { columns, children, singleColumn, openSettings } = this.props;
     const { renderComposePanel } = this.state;
 
     if (singleColumn) {
diff --git a/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
index 5a1c1ee1b..3face1146 100644
--- a/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/deprecated_settings_modal.jsx
@@ -64,7 +64,7 @@ class DeprecatedSettingsModal extends React.PureComponent {
           <div className='deprecated-settings-info'>
             <ul>
               { settings.map((setting_name) => (
-                <li>
+                <li key={setting_name}>
                   <a href={preferenceLink(setting_name)}><FormattedMessage {...messages[setting_name]} /></a>
                 </li>
               )) }
diff --git a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
index 6e8744ef0..40a983fbc 100644
--- a/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/navigation_panel.jsx
@@ -1,15 +1,14 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
-import { Link } from 'react-router-dom';
 import { timelinePreview, showTrends } from 'flavours/glitch/initial_state';
-import ColumnLink from 'flavours/glitch/features/ui/components/column_link';
+import ColumnLink from './column_link';
 import DisabledAccountBanner from './disabled_account_banner';
 import FollowRequestsColumnLink from './follow_requests_column_link';
 import ListPanel from './list_panel';
 import NotificationsCounterIcon from './notifications_counter_icon';
 import SignInBanner from './sign_in_banner';
-import { preferencesLink, relationshipsLink } from 'flavours/glitch/utils/backend_links';
+import { preferencesLink } from 'flavours/glitch/utils/backend_links';
 import NavigationPortal from 'flavours/glitch/components/navigation_portal';
 
 const messages = defineMessages({
@@ -37,6 +36,7 @@ class NavigationPanel extends React.Component {
   };
 
   static propTypes = {
+    intl: PropTypes.object.isRequired,
     onOpenSettings: PropTypes.func,
   };
 
diff --git a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
index 29eb91a6b..a28be0e88 100644
--- a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.jsx
@@ -40,7 +40,7 @@ PageOne.propTypes = {
   domain: PropTypes.string.isRequired,
 };
 
-const PageTwo = ({ intl, myAccount }) => (
+const PageTwo = ({ myAccount }) => (
   <div className='onboarding-modal__page onboarding-modal__page-two'>
     <div className='figure non-interactive'>
       <div className='pseudo-drawer'>
@@ -63,7 +63,7 @@ PageTwo.propTypes = {
   myAccount: ImmutablePropTypes.map.isRequired,
 };
 
-const PageThree = ({ intl, myAccount }) => (
+const PageThree = ({ myAccount }) => (
   <div className='onboarding-modal__page onboarding-modal__page-three'>
     <div className='figure non-interactive'>
       <Search
@@ -187,11 +187,11 @@ class OnboardingModal extends React.PureComponent {
   componentWillMount() {
     const { myAccount, admin, domain, intl } = this.props;
     this.pages = [
-      <PageOne acct={myAccount.get('acct')} domain={domain} />,
-      <PageTwo myAccount={myAccount} intl={intl} />,
-      <PageThree myAccount={myAccount} intl={intl} />,
-      <PageFour domain={domain} intl={intl} />,
-      <PageSix admin={admin} domain={domain} />,
+      <PageOne key='1' acct={myAccount.get('acct')} domain={domain} />,
+      <PageTwo key='2' myAccount={myAccount} intl={intl} />,
+      <PageThree key='3' myAccount={myAccount} intl={intl} />,
+      <PageFour key='4' domain={domain} intl={intl} />,
+      <PageSix key='6' admin={admin} domain={domain} />,
     ];
   }
 
diff --git a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
index 4cde0ebad..61c26d0d0 100644
--- a/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
+++ b/app/javascript/flavours/glitch/features/ui/components/video_modal.jsx
@@ -13,10 +13,6 @@ const mapStateToProps = (state, { statusId }) => ({
 
 class VideoModal extends ImmutablePureComponent {
 
-  static contextTypes = {
-    router: PropTypes.object,
-  };
-
   static propTypes = {
     media: ImmutablePropTypes.map.isRequired,
     statusId: PropTypes.string,
@@ -31,7 +27,7 @@ class VideoModal extends ImmutablePureComponent {
   };
 
   componentDidMount () {
-    const { media, onChangeBackgroundColor, onClose } = this.props;
+    const { media, onChangeBackgroundColor } = this.props;
 
     const backgroundColor = getAverageFromBlurhash(media.get('blurhash'));
 
diff --git a/app/javascript/flavours/glitch/features/ui/index.jsx b/app/javascript/flavours/glitch/features/ui/index.jsx
index fa35f689d..aee6743dc 100644
--- a/app/javascript/flavours/glitch/features/ui/index.jsx
+++ b/app/javascript/flavours/glitch/features/ui/index.jsx
@@ -60,7 +60,6 @@ import { HotKeys } from 'react-hotkeys';
 import initialState, { me, owner, singleUserMode, showTrends, trendsAsLanding } from '../../initial_state';
 import { closeOnboarding, INTRODUCTION_VERSION } from 'flavours/glitch/actions/onboarding';
 import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
-import { Helmet } from 'react-helmet';
 import Header from './components/header';
 
 // Dummy import, to make sure that <Status /> ends up in the application bundle.
@@ -76,10 +75,8 @@ const mapStateToProps = state => ({
   hasComposingText: state.getIn(['compose', 'text']).trim().length !== 0,
   hasMediaAttachments: state.getIn(['compose', 'media_attachments']).size > 0,
   canUploadMore: !state.getIn(['compose', 'media_attachments']).some(x => ['audio', 'video'].includes(x.get('type'))) && state.getIn(['compose', 'media_attachments']).size < 4,
-  layout: state.getIn(['meta', 'layout']),
   layout_local_setting: state.getIn(['local_settings', 'layout']),
   isWide: state.getIn(['local_settings', 'stretch']),
-  navbarUnder: state.getIn(['local_settings', 'navbar_under']),
   dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null,
   unreadNotifications: state.getIn(['notifications', 'unread']),
   showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']),
@@ -133,7 +130,6 @@ class SwitchingColumnsArea extends React.PureComponent {
   static propTypes = {
     children: PropTypes.node,
     location: PropTypes.object,
-    navbarUnder: PropTypes.bool,
     mobile: PropTypes.bool,
   };
 
@@ -165,7 +161,7 @@ class SwitchingColumnsArea extends React.PureComponent {
   };
 
   render () {
-    const { children, mobile, navbarUnder } = this.props;
+    const { children, mobile } = this.props;
     const { signedIn } = this.context.identity;
 
     let redirect;
@@ -185,7 +181,7 @@ class SwitchingColumnsArea extends React.PureComponent {
     }
 
     return (
-      <ColumnsAreaContainer ref={this.setRef} singleColumn={mobile} navbarUnder={navbarUnder}>
+      <ColumnsAreaContainer ref={this.setRef} singleColumn={mobile}>
         <WrappedSwitch>
           {redirect}
 
@@ -256,7 +252,6 @@ class UI extends React.Component {
     layout_local_setting: PropTypes.string,
     isWide: PropTypes.bool,
     systemFontUi: PropTypes.bool,
-    navbarUnder: PropTypes.bool,
     isComposing: PropTypes.bool,
     hasComposingText: PropTypes.bool,
     hasMediaAttachments: PropTypes.bool,
@@ -268,6 +263,7 @@ class UI extends React.Component {
     dropdownMenuIsOpen: PropTypes.bool,
     unreadNotifications: PropTypes.number,
     showFaviconBadge: PropTypes.bool,
+    hicolorPrivacyIcons: PropTypes.bool,
     moved: PropTypes.map,
     layout: PropTypes.string.isRequired,
     firstLaunch: PropTypes.bool,
@@ -456,8 +452,8 @@ class UI extends React.Component {
   }
 
   componentDidUpdate (prevProps) {
-    if (this.props.unreadNotifications != prevProps.unreadNotifications ||
-        this.props.showFaviconBadge != prevProps.showFaviconBadge) {
+    if (this.props.unreadNotifications !== prevProps.unreadNotifications ||
+        this.props.showFaviconBadge !== prevProps.showFaviconBadge) {
       if (this.favicon) {
         try {
           this.favicon.badge(this.props.showFaviconBadge ? this.props.unreadNotifications : 0);
@@ -606,7 +602,7 @@ class UI extends React.Component {
 
   render () {
     const { draggingOver } = this.state;
-    const { children, isWide, navbarUnder, location, dropdownMenuIsOpen, layout, moved } = this.props;
+    const { children, isWide, location, dropdownMenuIsOpen, layout, moved } = this.props;
 
     const columnsClass = layout => {
       switch (layout) {
@@ -622,7 +618,6 @@ class UI extends React.Component {
     const className = classNames('ui', columnsClass(layout), {
       'wide': isWide,
       'system-font': this.props.systemFontUi,
-      'navbar-under': navbarUnder,
       'hicolor-privacy-icons': this.props.hicolorPrivacyIcons,
     });
 
@@ -665,7 +660,7 @@ class UI extends React.Component {
 
           <Header />
 
-          <SwitchingColumnsArea location={location} mobile={layout === 'mobile' || layout === 'single-column'} navbarUnder={navbarUnder}>
+          <SwitchingColumnsArea location={location} mobile={layout === 'mobile' || layout === 'single-column'}>
             {children}
           </SwitchingColumnsArea>
 
diff --git a/app/javascript/flavours/glitch/features/video/index.jsx b/app/javascript/flavours/glitch/features/video/index.jsx
index 28a8bb1fd..a73320e89 100644
--- a/app/javascript/flavours/glitch/features/video/index.jsx
+++ b/app/javascript/flavours/glitch/features/video/index.jsx
@@ -29,6 +29,7 @@ export const formatTime = secondsNum => {
   if (hours   < 10) hours   = '0' + hours;
   if (minutes < 10) minutes = '0' + minutes;
   if (seconds < 10) seconds = '0' + seconds;
+
   return (hours === '00' ? '' : `${hours}:`) + `${minutes}:${seconds}`;
 };
 
@@ -107,18 +108,18 @@ class Video extends React.PureComponent {
     currentTime: PropTypes.number,
     onOpenVideo: PropTypes.func,
     onCloseVideo: PropTypes.func,
-    letterbox: PropTypes.bool,
-    fullwidth: PropTypes.bool,
     detailed: PropTypes.bool,
     inline: PropTypes.bool,
     editable: PropTypes.bool,
     alwaysVisible: PropTypes.bool,
     cacheWidth: PropTypes.func,
-    intl: PropTypes.object.isRequired,
     visible: PropTypes.bool,
+    letterbox: PropTypes.bool,
+    fullwidth: PropTypes.bool,
+    preventPlayback: PropTypes.bool,
     onToggleVisibility: PropTypes.func,
     deployPictureInPicture: PropTypes.func,
-    preventPlayback: PropTypes.bool,
+    intl: PropTypes.object.isRequired,
     blurhash: PropTypes.string,
     autoPlay: PropTypes.bool,
     volume: PropTypes.number,
@@ -161,7 +162,7 @@ class Video extends React.PureComponent {
   _setDimensions () {
     const width = this.player.offsetWidth;
 
-    if (width && width != this.state.containerWidth) {
+    if (width && width !== this.state.containerWidth) {
       if (this.props.cacheWidth) {
         this.props.cacheWidth(width);
       }
@@ -403,7 +404,7 @@ class Video extends React.PureComponent {
   }
 
   componentDidUpdate (prevProps) {
-    if (this.player && this.player.offsetWidth && this.player.offsetWidth != this.state.containerWidth && !this.state.fullscreen) {
+    if (this.player && this.player.offsetWidth && this.player.offsetWidth !== this.state.containerWidth && !this.state.fullscreen) {
       if (this.props.cacheWidth) this.props.cacheWidth(this.player.offsetWidth);
       this.setState({
         containerWidth: this.player.offsetWidth,
@@ -534,7 +535,7 @@ class Video extends React.PureComponent {
       return this.props.frameRate.split('/').reduce((p, c) => p / c);
     }
 
-    return this.props.frameRate || 25;
+    return this.props.frameRate;
   }
 
   render () {
@@ -576,6 +577,7 @@ class Video extends React.PureComponent {
 
     return (
       <div
+        role='menuitem'
         className={computedClass}
         style={playerStyle}
         ref={this.setPlayerRef}
@@ -598,7 +600,6 @@ class Video extends React.PureComponent {
           src={src}
           poster={preview}
           preload={preload}
-          loop
           role='button'
           tabIndex={0}
           aria-label={alt}
diff --git a/app/javascript/flavours/glitch/reducers/compose.js b/app/javascript/flavours/glitch/reducers/compose.js
index 109e4c723..00b64d904 100644
--- a/app/javascript/flavours/glitch/reducers/compose.js
+++ b/app/javascript/flavours/glitch/reducers/compose.js
@@ -446,6 +446,7 @@ export default function compose(state = initialState, action) {
     });
   case COMPOSE_REPLY_CANCEL:
     state = state.setIn(['advanced_options', 'threaded_mode'], false);
+    // eslint-disable-next-line no-fallthrough -- fall-through to `COMPOSE_RESET` is intended
   case COMPOSE_RESET:
     return state.withMutations(map => {
       map.set('in_reply_to', null);
diff --git a/app/javascript/flavours/glitch/reducers/local_settings.js b/app/javascript/flavours/glitch/reducers/local_settings.js
index 887e0e135..322806862 100644
--- a/app/javascript/flavours/glitch/reducers/local_settings.js
+++ b/app/javascript/flavours/glitch/reducers/local_settings.js
@@ -8,7 +8,6 @@ import { LOCAL_SETTING_CHANGE, LOCAL_SETTING_DELETE } from 'flavours/glitch/acti
 const initialState = ImmutableMap({
   layout    : 'auto',
   stretch   : true,
-  navbar_under : false,
   side_arm  : 'none',
   side_arm_reply_mode : 'keep',
   show_reply_count : false,
diff --git a/app/javascript/flavours/glitch/selectors/index.js b/app/javascript/flavours/glitch/selectors/index.js
index 83f8783d9..22393bf6e 100644
--- a/app/javascript/flavours/glitch/selectors/index.js
+++ b/app/javascript/flavours/glitch/selectors/index.js
@@ -1,6 +1,5 @@
-import escapeTextContentForBrowser from 'escape-html';
 import { createSelector } from 'reselect';
-import { List as ImmutableList, Map as ImmutableMap, is } from 'immutable';
+import { List as ImmutableList, Map as ImmutableMap } from 'immutable';
 import { toServerSideType } from 'flavours/glitch/utils/filters';
 import { me } from 'flavours/glitch/initial_state';
 
diff --git a/app/javascript/flavours/glitch/styles/components/columns.scss b/app/javascript/flavours/glitch/styles/components/columns.scss
index 2404578df..533c5eda0 100644
--- a/app/javascript/flavours/glitch/styles/components/columns.scss
+++ b/app/javascript/flavours/glitch/styles/components/columns.scss
@@ -711,31 +711,6 @@ $ui-header-height: 55px;
   }
 }
 
-// more fixes for the navbar-under mode
-@mixin fix-margins-for-navbar-under {
-  .tabs-bar {
-    margin-top: 0 !important;
-    margin-bottom: -6px !important;
-  }
-}
-
-.single-column.navbar-under {
-  @include fix-margins-for-navbar-under;
-}
-
-.auto-columns.navbar-under {
-  @media screen and (max-width: $no-gap-breakpoint) {
-    @include fix-margins-for-navbar-under;
-  }
-}
-
-.auto-columns.navbar-under .react-swipeable-view-container .columns-area,
-.single-column.navbar-under .react-swipeable-view-container .columns-area {
-  @media screen and (max-width: $no-gap-breakpoint) {
-    height: 100% !important;
-  }
-}
-
 .column-inline-form {
   padding: 7px 15px;
   padding-inline-end: 5px;
diff --git a/config/webpack/shared.js b/config/webpack/shared.js
index 405858d0c..9bdb60bad 100644
--- a/config/webpack/shared.js
+++ b/config/webpack/shared.js
@@ -1,11 +1,10 @@
 // Note: You must restart bin/webpack-dev-server for changes to take effect
 
 const webpack = require('webpack');
-const { basename, dirname, join, relative, resolve } = require('path');
-const { sync } = require('glob');
+const { resolve } = require('path');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const AssetsManifestPlugin = require('webpack-assets-manifest');
-const { env, settings, core, flavours, output } = require('./configuration.js');
+const { env, settings, core, flavours, output } = require('./configuration');
 const rules = require('./rules');
 const localePacks = require('./generateLocalePacks');
 
@@ -50,7 +49,7 @@ const entries = Object.assign(
   { locales: resolve('app', 'javascript', 'locales') },
   localePacks,
   reducePacks(core),
-  Object.values(flavours).reduce((map, data) => reducePacks(data, map), {})
+  Object.values(flavours).reduce((map, data) => reducePacks(data, map), {}),
 );
 
 
diff --git a/config/webpack/translationRunner.js b/config/webpack/translationRunner.js
index c7f84cc7e..227727bff 100644
--- a/config/webpack/translationRunner.js
+++ b/config/webpack/translationRunner.js
@@ -95,7 +95,7 @@ const provideExtractedMessages = () => {
 
   originalExtractedMessages.forEach(file => {
     file.descriptors.forEach(descriptor => {
-      originalKeys.add(descriptor.id)
+      originalKeys.add(descriptor.id);
     });
   });
 
diff --git a/streaming/index.js b/streaming/index.js
index 9f1507d27..a5b53ea49 100644
--- a/streaming/index.js
+++ b/streaming/index.js
@@ -373,7 +373,6 @@ const startServer = async () => {
   const channelNameFromPath = req => {
     const { path, query } = req;
     const onlyMedia = isTruthy(query.only_media);
-    const allowLocalOnly = isTruthy(query.allow_local_only);
 
     switch (path) {
     case '/api/v1/streaming/user':
@@ -990,7 +989,7 @@ const startServer = async () => {
     case 'public:media':
       resolve({
         channelIds: ['timeline:public:media'],
-        options: { needsFiltering: true, allowLocalOnly: isTruthy(query.allow_local_only) },
+        options: { needsFiltering: true, allowLocalOnly: isTruthy(params.allow_local_only) },
       });
 
       break;