Moved src/utils out of src/ folder to utilities/ folder. (#7875)

2020-05-15 10:07:42 -04:00 · 2020-05-15 10:07:42 -04:00 · 03ff779ca3
commit 03ff779ca3
parent 457915beef
20 changed files with 79 additions and 68 deletions
--- a/app/javascript/Search/Search.jsx
+++ b/app/javascript/Search/Search.jsx
@ -6,7 +6,7 @@ import {
  hasInstantClick,
  preloadSearchResults,
  displaySearchResults,
-} from '../src/utils/search';
+} from '../utilities/search';
 import { SearchForm } from './SearchForm';

 const GLOBAL_MINIMIZE_KEY = '0';
--- a/app/javascript/analytics/client.js
+++ b/app/javascript/analytics/client.js
@ -1,4 +1,4 @@
-import handleFetchAPIErrors from '../src/utils/errors';
+import { handleFetchAPIErrors } from '../utilities/http';

 function callAnalyticsAPI(path, date, { organizationId, articleId }, callback) {
  let url = `${path}?start=${date.toISOString().split('T')[0]}`;
@ -12,10 +12,10 @@ function callAnalyticsAPI(path, date, { organizationId, articleId }, callback) {

  fetch(url)
    .then(handleFetchAPIErrors)
-    .then(response => response.json())
+    .then((response) => response.json())
    .then(callback)
    // eslint-disable-next-line no-console
-    .catch(error => console.error(error)); // we should come up with better error handling
+    .catch((error) => console.error(error)); // we should come up with better error handling
 }

 export function callHistoricalAPI(
--- a/app/javascript/chat/actions.js
+++ b/app/javascript/chat/actions.js
@ -1,4 +1,4 @@
-import { fetchSearch } from '../src/utils/search';
+import { fetchSearch } from '../utilities/search';

 export function getAllMessages(channelId, messageOffset, successCb, failureCb) {
  fetch(`/chat_channels/${channelId}?message_offset=${messageOffset}`, {
--- a/app/javascript/chat/chat.jsx
+++ b/app/javascript/chat/chat.jsx
@ -31,8 +31,8 @@ import ActionMessage from './actionMessage';
 import Content from './content';
 import VideoContent from './videoContent';

-import setupPusher from '../src/utils/pusher';
-import debounceAction from '../src/utils/debounceAction';
+import { setupPusher } from '../utilities/connect';
+import debounceAction from '../utilities/debounceAction';

 export default class Chat extends Component {
  static propTypes = {
@ -206,8 +206,11 @@ export default class Chat extends Component {

  loadChannels = (channels, query) => {
    const { activeChannelId } = this.state;
-    const activeChannel = this.state.activeChannel ||
-      channels.filter((channel) => channel.chat_channel_id === activeChannelId)[0];
+    const activeChannel =
+      this.state.activeChannel ||
+      channels.filter(
+        (channel) => channel.chat_channel_id === activeChannelId,
+      )[0];
    if (activeChannelId && query.length === 0) {
      this.setState({
        chatChannels: channels,
@ -282,7 +285,7 @@ export default class Chat extends Component {
  };

  loadPaginatedChannels = (channels) => {
-    const {state} = this;
+    const { state } = this;
    const currentChannels = state.chatChannels;
    const currentChannelIds = currentChannels.map((channel) => channel.id);
    const newChannels = currentChannels;
@ -1113,7 +1116,7 @@ export default class Chat extends Component {

  toggleSearchShowing = () => {
    if (!this.state.searchShowing) {
-      setTimeout(function () {
+      setTimeout(() => {
        document.getElementById('chatchannelsearchbar').focus();
      }, 100);
    } else {
--- a/app/javascript/listings/listings.jsx
+++ b/app/javascript/listings/listings.jsx
@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
-import debounceAction from '../src/utils/debounceAction';
-import { fetchSearch } from '../src/utils/search';
+import debounceAction from '../utilities/debounceAction';
+import { fetchSearch } from '../utilities/search';
 import ModalBackground from './components/ModalBackground';
 import Modal from './components/Modal';
 import AllListings from './components/AllListings';
--- a/app/javascript/packs/Onboarding.jsx
+++ b/app/javascript/packs/Onboarding.jsx
@ -1,6 +1,6 @@
 import { h, render } from 'preact';
 import { getUserDataAndCsrfToken } from '../chat/util';
-import getUnopenedChannels from '../src/utils/getUnopenedChannels';
+import { getUnopenedChannels } from '../utilities/connect';

 HTMLDocument.prototype.ready = new Promise((resolve) => {
  if (document.readyState !== 'loading') {
--- a/app/javascript/packs/onboardingRedirectCheck.jsx
+++ b/app/javascript/packs/onboardingRedirectCheck.jsx
@ -1,7 +1,7 @@
 import { getUserDataAndCsrfToken } from '../chat/util';
-import getUnopenedChannels from '../src/utils/getUnopenedChannels';
+import { getUnopenedChannels } from '../utilities/connect';

-HTMLDocument.prototype.ready = new Promise(resolve => {
+HTMLDocument.prototype.ready = new Promise((resolve) => {
  if (document.readyState !== 'loading') {
    return resolve();
  }
@ -36,7 +36,7 @@ document.ready.then(
        window.location = `${window.location.origin}/onboarding?referrer=${window.location}`;
      }
    })
-    .catch(error => {
+    .catch((error) => {
      // eslint-disable-next-line no-console
      console.error('Error getting user and CSRF Token', error);
    }),
@ -53,7 +53,7 @@ window.InstantClick.on('change', () => {
        window.location = `${window.location.origin}/onboarding?referrer=${window.location}`;
      }
    })
-    .catch(error => {
+    .catch((error) => {
      // eslint-disable-next-line no-console
      console.error('Error getting user and CSRF Token', error);
    });
--- a/app/javascript/readingList/readingList.jsx
+++ b/app/javascript/readingList/readingList.jsx
@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import { PropTypes } from 'preact-compat';
-import debounceAction from '../src/utils/debounceAction';
+import debounceAction from '../utilities/debounceAction';

 import {
  defaultState,
--- a/app/javascript/searchableItemList/searchableItemList.js
+++ b/app/javascript/searchableItemList/searchableItemList.js
@ -1,5 +1,5 @@
 // Shared behavior between the reading list and history pages
-import { fetchSearch } from '../src/utils/search';
+import { fetchSearch } from '../utilities/search';

 // Provides the initial state for the component
 export function defaultState(options) {
--- a/app/javascript/shared/components/tags.jsx
+++ b/app/javascript/shared/components/tags.jsx
@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import PropTypes from 'prop-types';
-import { fetchSearch } from '../../src/utils/search';
+import { fetchSearch } from '../../utilities/search';

 const KEYS = {
  UP: 'ArrowUp',
@ -95,8 +95,8 @@ class Tags extends Component {
    const { defaultValue } = this.props;
    return defaultValue
      .split(',')
-      .map(item => item !== undefined && item.trim())
-      .filter(item => item.length > 0);
+      .map((item) => item !== undefined && item.trim())
+      .filter((item) => item.length > 0);
  }

  get isTopOfSearchResults() {
@ -159,7 +159,7 @@ class Tags extends Component {
    return [start, end];
  };

-  handleKeyDown = e => {
+  handleKeyDown = (e) => {
    const component = this;
    const { maxTags } = this.props;
    if (component.selected.length === maxTags && e.key === KEYS.COMMA) {
@ -205,7 +205,7 @@ class Tags extends Component {
    }
  };

-  handleRulesClick = e => {
+  handleRulesClick = (e) => {
    e.preventDefault();
    const { showingRulesForTag } = this.state;
    if (showingRulesForTag === e.target.dataset.content) {
@ -215,7 +215,7 @@ class Tags extends Component {
    }
  };

-  handleTagClick = e => {
+  handleTagClick = (e) => {
    if (e.target.className === 'articleform__tagsoptionrulesbutton') {
      return;
    }
@ -229,7 +229,7 @@ class Tags extends Component {
    this.insertTag(e.currentTarget.dataset.content);
  };

-  handleInput = e => {
+  handleInput = (e) => {
    let { value } = e.target;
    // If we start typing immediately after a comma, add a space
    // before what we typed.
@ -277,7 +277,7 @@ class Tags extends Component {
    return `${value.slice(0, position)} ${value.slice(position, value.length)}`;
  };

-  handleTagEnter = e => {
+  handleTagEnter = (e) => {
    if (e.key === KEYS.RETURN) {
      this.handleTagClick();
    }
@ -307,7 +307,7 @@ class Tags extends Component {

  search(query) {
    if (query === '') {
-      return new Promise(resolve => {
+      return new Promise((resolve) => {
        setTimeout(() => {
          this.resetSearchResults();
          resolve();
@ -319,15 +319,15 @@ class Tags extends Component {
    const dataHash = { name: query };
    const responsePromise = fetchSearch('tags', dataHash);

-    return responsePromise.then(response => {
+    return responsePromise.then((response) => {
      if (listing === true) {
        const { additionalTags } = this.state;
        const { category } = this.props;
-        const additionalItems = (additionalTags[category] || []).filter(t =>
+        const additionalItems = (additionalTags[category] || []).filter((t) =>
          t.includes(query),
        );
        const resultsArray = response.result;
-        additionalItems.forEach(t => {
+        additionalItems.forEach((t) => {
          if (!resultsArray.includes(t)) {
            resultsArray.push({ name: t });
          }
@ -348,13 +348,13 @@ class Tags extends Component {
  }

  moveUpInSearchResults() {
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
      selectedIndex: prevState.selectedIndex - 1,
    }));
  }

  moveDownInSearchResults() {
-    this.setState(prevState => ({
+    this.setState((prevState) => ({
      selectedIndex: prevState.selectedIndex + 1,
    }));
  }
@ -398,6 +398,7 @@ class Tags extends Component {
          className={`${classPrefix}__tagrules--${
            showingRulesForTag === tag.name ? 'active' : 'inactive'
          }`}
+          // eslint-disable-next-line react/no-danger
          dangerouslySetInnerHTML={{ __html: tag.rules_html }}
        />
      </div>
@ -427,7 +428,7 @@ class Tags extends Component {
        <input
          id="tag-input"
          type="text"
-          ref={t => {
+          ref={(t) => {
            this.textArea = t;
            return this.textArea;
          }}
--- a/app/javascript/sidebar-widget/SidebarWidget.jsx
+++ b/app/javascript/sidebar-widget/SidebarWidget.jsx
@ -1,5 +1,5 @@
 import { h, Component } from 'preact';
-import sendFollowUser from '../src/utils/sendFollowUser';
+import sendFollowUser from '../utilities/sendFollowUser';
 import SidebarUser from './sidebarUser';

 class SidebarWidget extends Component {
@ -36,11 +36,11 @@ class SidebarWidget extends Component {
      },
      credentials: 'same-origin',
    })
-      .then(response => response.json())
-      .then(json => {
+      .then((response) => response.json())
+      .then((json) => {
        this.setState({ suggestedUsers: json });
      })
-      .catch(error => {
+      .catch((error) => {
        this.setState({ suggestedUsers: [] });
        Honeybadger.notify(error);
      });
@ -57,7 +57,7 @@ class SidebarWidget extends Component {
    );
    followBtn.innerText = updatedUser.following ? '+ FOLLOW' : '✓ FOLLOWING';

-    const toggleFollowState = newFollowState => {
+    const toggleFollowState = (newFollowState) => {
      updatedUser.following = newFollowState === 'followed';
      updatedSuggestedUsers[userIndex] = updatedUser;
      this.setState({ suggestedUsers: updatedSuggestedUsers });
--- a/app/javascript/utilities/tests/search.test.js
+++ b/app/javascript/utilities/tests/search.test.js
@ -7,7 +7,7 @@ import {
  fetchSearch,
  createSearchUrl,
 } from '../search';
-import '../../../../assets/javascripts/lib/xss';
+import '../../../assets/javascripts/lib/xss';

 /* global globalThis */

--- a/app/javascript/utilities/connect/getUnopenedChannels.jsx
+++ b/app/javascript/utilities/connect/getUnopenedChannels.jsx
@ -1,6 +1,8 @@
 import { h, render, Component } from 'preact';
 import PropTypes from 'prop-types';
-import setupPusher from './pusher';
+import { setupPusher } from './pusher';
+
+/* global userData */

 class UnopenedChannelNotice extends Component {
  propTypes = {
@ -38,16 +40,18 @@ class UnopenedChannelNotice extends Component {
    };
  }

-  updateMessageNotification = unopenedChannels => {
+  updateMessageNotification = (unopenedChannels) => {
    const number = document.getElementById('connect-number');
    this.setState({ unopenedChannels });
    if (unopenedChannels.length > 0) {
-      if (unopenedChannels[0].adjusted_slug === "@"+userData().username) {
+      if (unopenedChannels[0].adjusted_slug === `@${userData().username}`) {
        return;
      }
      number.classList.remove('hidden');
      number.innerHTML = unopenedChannels.length;
-      document.getElementById('connect-link').href = '/connect/' + unopenedChannels[0].adjusted_slug;
+      document.getElementById(
+        'connect-link',
+      ).href = `/connect/${unopenedChannels[0].adjusted_slug}`;
      InstantClick.preload(
        document.getElementById('connect-link').href,
        'force',
@ -61,13 +65,13 @@ class UnopenedChannelNotice extends Component {

  updateMessage = () => {};

-  mentionedMessage = e => {
+  mentionedMessage = (e) => {
    if (window.location.pathname.startsWith('/connect')) {
      return;
    }

-    this.setState(prevState => ({
-      unopenedChannels: prevState.unopenedChannels.map(unopenedChannel =>
+    this.setState((prevState) => ({
+      unopenedChannels: prevState.unopenedChannels.map((unopenedChannel) =>
        unopenedChannel.adjusted_slug === e.chat_channel_adjusted_slug
          ? { ...unopenedChannel, request_type: 'mentioned' }
          : unopenedChannel,
@ -78,7 +82,7 @@ class UnopenedChannelNotice extends Component {
    this.hideNotice();
  };

-  messageOpened = e => {
+  messageOpened = (e) => {
    const { unopenedChannels } = this.state;
    if (
      !window.location.pathname.startsWith('/connect') ||
@ -87,12 +91,12 @@ class UnopenedChannelNotice extends Component {
      return;
    this.updateMessageNotification(
      unopenedChannels.filter(
-        unopenedChannel => unopenedChannel.adjusted_slug !== e.adjusted_slug,
+        (unopenedChannel) => unopenedChannel.adjusted_slug !== e.adjusted_slug,
      ),
    );
  };

-  receiveNewMessage = e => {
+  receiveNewMessage = (e) => {
    if (
      (window.location.pathname.startsWith('/connect') &&
        e.user_id === window.currentUser.id &&
@ -105,7 +109,7 @@ class UnopenedChannelNotice extends Component {
    const newObj = { adjusted_slug: e.chat_channel_adjusted_slug };

    const ifMessageExist = unopenedChannels.some(
-      channel => channel.adjusted_slug === newObj.adjusted_slug,
+      (channel) => channel.adjusted_slug === newObj.adjusted_slug,
    );

    if (
@ -116,7 +120,7 @@ class UnopenedChannelNotice extends Component {
    }
    if (ifMessageExist) {
      const index = unopenedChannels.findIndex(
-        channel => channel.adjusted_slug === newObj.adjusted_slug,
+        (channel) => channel.adjusted_slug === newObj.adjusted_slug,
      );
      unopenedChannels[index].notified = false;
    }
@ -139,8 +143,8 @@ class UnopenedChannelNotice extends Component {

  hideNotice = () => {
    setTimeout(() => {
-      this.setState(prevState => ({
-        unopenedChannels: prevState.unopenedChannels.map(unopenedChannel =>
+      this.setState((prevState) => ({
+        unopenedChannels: prevState.unopenedChannels.map((unopenedChannel) =>
          !unopenedChannel.notified
            ? { ...unopenedChannel, notified: true }
            : unopenedChannel,
@ -150,20 +154,20 @@ class UnopenedChannelNotice extends Component {
    }, 7500);
  };

-  fetchUnopenedChannel = successCb => {
+  fetchUnopenedChannel = (successCb) => {
    fetch('/chat_channels?state=unopened', {
      Accept: 'application/json',
      'Content-Type': 'application/json',
      credentials: 'same-origin',
    })
-      .then(response => response.json())
+      .then((response) => response.json())
      .then(successCb);
  };

  render() {
    const { visible, unopenedChannels } = this.state;
-    if (visible && unopenedChannels.some(channel => !channel.notified)) {
-      const message = unopenedChannels.map(channel => {
+    if (visible && unopenedChannels.some((channel) => !channel.notified)) {
+      const message = unopenedChannels.map((channel) => {
        if (channel.notified) return null;
        return (
          <div>
@ -218,7 +222,7 @@ class UnopenedChannelNotice extends Component {
  }
 }

-export default function getUnopenedChannels() {
+export function getUnopenedChannels() {
  if (window.frameElement) {
    return;
  }
--- a/app/javascript/utilities/connect/index.js
+++ b/app/javascript/utilities/connect/index.js
@ -0,0 +1,2 @@
+export * from './getUnopenedChannels';
+export * from './pusher';
--- a/app/javascript/utilities/connect/pusher.js
+++ b/app/javascript/utilities/connect/pusher.js
@ -1,7 +1,7 @@
 // import Pusher from 'pusher-js';

-export default function setupPusher(key, callbackObjects) {
-  return import('pusher-js').then(_ => {
+export function setupPusher(key, callbackObjects) {
+  return import('pusher-js').then((_) => {
    const {
      pusher = new Pusher(key, {
        authEndpoint: '/pusher/auth',
--- a/app/javascript/utilities/debounceAction.js
+++ b/app/javascript/utilities/debounceAction.js
--- a/app/javascript/utilities/http/errors.js
+++ b/app/javascript/utilities/http/errors.js
@ -1,5 +1,5 @@
 // eslint-disable-next-line consistent-return
-export default function handleFetchAPIErrors(response) {
+export function handleFetchAPIErrors(response) {
  // pass along a correct response
  if (response.ok) {
    return response;
@ -8,7 +8,7 @@ export default function handleFetchAPIErrors(response) {
  // API errors contain the error message in {"error": "error message"}
  // but they could be unhandled 500 errors
  try {
-    response.json().then(data => {
+    response.json().then((data) => {
      throw new Error(data.error);
    });
  } catch (e) {
--- a/app/javascript/utilities/http/index.js
+++ b/app/javascript/utilities/http/index.js
@ -1 +1,2 @@
+export * from './errors';
 export * from './request';
--- a/app/javascript/utilities/search/index.js
+++ b/app/javascript/utilities/search/index.js
@ -1,7 +1,7 @@
 // TODO: We should really be using the xss package by installing it in package.json
 // but for now filterXSS is global because of legacy JS

-import { request } from '../../utilities/http';
+import { request } from '../http';

 function getParameterByName(name, url = window.location.href) {
  const sanitizedName = name.replace(/[[\]]/g, '\\$&');
--- a/app/javascript/utilities/sendFollowUser.js
+++ b/app/javascript/utilities/sendFollowUser.js
@ -14,12 +14,12 @@ export default function sendFollowUser(user, successCb) {
    body: formData,
    credentials: 'same-origin',
  })
-    .then(response => response.json())
-    .then(json => {
+    .then((response) => response.json())
+    .then((json) => {
      successCb(json.outcome);
      // json is followed or unfollowed
    })
-    .catch(error => {
+    .catch((error) => {
      // TODO: Add client-side error tracking. See https://github.com/thepracticaldev/dev.to/issues/2501
      // for the discussion.
      console.log(error); // eslint-disable-line no-console