From d554212dd9ea49e35ba7bd00ae57f1f3b0077539 Mon Sep 17 00:00:00 2001
From: Ivan Pazhitnykh <ivan.pazhitnykh@gmail.com>
Date: Thu, 12 Mar 2020 17:13:56 +0300
Subject: [PATCH] fix(core): remove legacy components [#94]

---
 components/common/layout/CoreLayout.js    |   2 -
 components/common/modal/Modal.js          |  39 ------
 components/common/modal/modal.module.scss |  78 -----------
 components/legacy/ActionWithConfirm.js    |  77 -----------
 components/legacy/DateTimePicker.js       |  78 -----------
 components/legacy/ImageUploader.js        |  65 ----------
 components/legacy/Select.js               | 149 ----------------------
 package-lock.json                         |  62 ---------
 package.json                              |   3 -
 pages/legacy/upload-test.js               |  44 -------
 stories/ui.js                             |  55 --------
 utils/request.js                          |  12 --
 12 files changed, 664 deletions(-)
 delete mode 100644 components/common/modal/Modal.js
 delete mode 100644 components/common/modal/modal.module.scss
 delete mode 100644 components/legacy/ActionWithConfirm.js
 delete mode 100644 components/legacy/DateTimePicker.js
 delete mode 100644 components/legacy/ImageUploader.js
 delete mode 100644 components/legacy/Select.js
 delete mode 100644 pages/legacy/upload-test.js

diff --git a/components/common/layout/CoreLayout.js b/components/common/layout/CoreLayout.js
index 8bfe7dfd..5402ee06 100644
--- a/components/common/layout/CoreLayout.js
+++ b/components/common/layout/CoreLayout.js
@@ -5,7 +5,6 @@ import ScrollToTop from 'react-scroll-up';
 
 import Icon from 'components/common/ui/Icon';
 import Clickable from 'components/common/Clickable';
-import { MODAL_ROOT_ID } from 'components/common/modal/Modal';
 
 import useBoolean from 'hooks/useBoolean';
 import { LangType } from 'utils/customPropTypes';
@@ -48,7 +47,6 @@ const CoreLayout = ({ children, hideFooter, hideSidebar, lang }) => {
           </ScrollToTop>
         </div>
       </div>
-      <div id={MODAL_ROOT_ID} />
     </>
   );
 };
diff --git a/components/common/modal/Modal.js b/components/common/modal/Modal.js
deleted file mode 100644
index e95c3a0d..00000000
--- a/components/common/modal/Modal.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import './modal.scss';
-
-import React, { useLayoutEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-
-import Icon from 'components/common/ui/Icon';
-import Portal from 'components/common/Portal';
-import Clickable from 'components/common/Clickable';
-
-export const MODAL_ROOT_ID = 'wir-modal-root';
-
-const DEFAULT_TOP_MARGIN = 0;
-
-const Modal = ({ children, onClose }) => {
-  const [margin, setState] = useState(DEFAULT_TOP_MARGIN);
-  useLayoutEffect(() => {
-    setState(DEFAULT_TOP_MARGIN + window.pageYOffset);
-  }, []);
-  return (
-    <Portal id={MODAL_ROOT_ID}>
-      <div className="wir-modal">
-        <Clickable tag="div" className="wir-modal__background" onClick={onClose} />
-        <div className="wir-modal__content" style={{ marginTop: margin }}>
-          <Clickable className="wir-modal__close" onClick={onClose}>
-            <Icon name="times" />
-          </Clickable>
-          {children}
-        </div>
-      </div>
-    </Portal>
-  );
-};
-
-Modal.propTypes = {
-  children: PropTypes.node.isRequired,
-  onClose: PropTypes.func.isRequired,
-};
-
-export default Modal;
diff --git a/components/common/modal/modal.module.scss b/components/common/modal/modal.module.scss
deleted file mode 100644
index 353bcfd1..00000000
--- a/components/common/modal/modal.module.scss
+++ /dev/null
@@ -1,78 +0,0 @@
-@import 'styles/responsiveness';
-@import 'styles/variables';
-
-.wir-modal {
-  height: 100%;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: 100%;
-
-  &__background {
-    background-color: $primary-black;
-    height: 100%;
-    opacity: 0.5;
-    position: fixed;
-    width: 100%;
-    z-index: map-get($zindex, modal-background);
-  }
-
-  &__content {
-    background-color: $primary-white;
-    position: absolute;
-    z-index: map-get($zindex, modal-content);
-  }
-
-  &__close {
-    color: $primary;
-    cursor: pointer;
-    font-size: 20px;
-    position: absolute;
-    right: 20px;
-    top: 20px;
-  }
-}
-
-@mixin shared-desktop-tablet-large {
-  .wir-modal {
-    &__content {
-      margin: 70px calc((100vw - 690px) / 3) 0 calc((100vw - 690px) / 6);
-      padding: 20px calc((100vw - 690px) / 3) 90px calc((100vw - 690px) / 6);
-    }
-  }
-}
-
-@include screen-desktop {
-  @include shared-desktop-tablet-large;
-}
-
-@include screen-tablet-large {
-  @include shared-desktop-tablet-large;
-}
-
-@include screen-tablet {
-  .wir-modal {
-    &__content {
-      margin: 70px calc((100vw - 530px) / 3) 0 calc((100vw - 530px) / 6);
-      padding: 20px calc((100vw - 530px) / 3) 90px calc((100vw - 530px) / 6);
-    }
-  }
-}
-
-@include screen-touch {
-  .wir-modal {
-    &__content {
-      margin: 70px calc((100vw - 450px) / 3) 0 calc((100vw - 450px) / 6);
-      padding: 20px calc((100vw - 450px) / 3) 90px calc((100vw - 450px) / 6);
-    }
-  }
-}
-
-@include screen-mobile {
-  .wir-modal {
-    &__content {
-      margin: 0;
-      padding: 20px calc((100vw - 302px) * 2 / 3) 20px calc((100vw - 302px) / 3);
-    }
-  }
-}
diff --git a/components/legacy/ActionWithConfirm.js b/components/legacy/ActionWithConfirm.js
deleted file mode 100644
index 2c330c34..00000000
--- a/components/legacy/ActionWithConfirm.js
+++ /dev/null
@@ -1,77 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux';
-
-import Text from 'components/common/Text';
-import Button from 'components/common/Button';
-// import Modal from 'components/legacy/Modal';
-// The Modal below is no functional with legacy code. This is to suppress lint warnings.
-import Modal from 'components/common/modal/Modal';
-
-const mapDispatchToProps = (dispatch, { action }) => ({
-  confirmAction: () => dispatch(action()),
-});
-
-class ActionWithConfirm extends Component {
-  static propTypes = {
-    render: PropTypes.func.isRequired,
-    // eslint-disable-next-line react/no-unused-prop-types
-    action: PropTypes.func.isRequired,
-    confirmAction: PropTypes.func.isRequired,
-    successCallback: PropTypes.func,
-  };
-
-  static defaultProps = {
-    successCallback: null,
-  };
-
-  state = {
-    confirmOpened: false,
-  };
-
-  componentDidMount() {}
-
-  handleToggleModal = () =>
-    this.setState(({ confirmOpened }) => ({ confirmOpened: !confirmOpened }));
-
-  handleConfirm = () => {
-    const { confirmAction, successCallback } = this.props;
-    this.setState({ pending: true });
-    confirmAction().then(() => {
-      if (successCallback) {
-        successCallback();
-        return;
-      }
-      this.setState({ pending: false, confirmOpened: false });
-    });
-  };
-
-  render() {
-    const { render } = this.props;
-    const { confirmOpened, pending } = this.state;
-    return (
-      <>
-        <Modal
-          isActive={confirmOpened}
-          title={<Text id="common.are-you-sure" />}
-          toggle={this.handleToggleModal}
-          footerClassName="confirm-footer"
-          small
-          renderFooter={() => (
-            <>
-              <Button className="button" onClick={this.handleToggleModal}>
-                <Text id="common.cancel" />
-              </Button>
-              <Button className="button is-danger" onClick={this.handleConfirm} pending={pending}>
-                <Text id="common.yes" />
-              </Button>
-            </>
-          )}
-        />
-        {render({ onClick: this.handleToggleModal })}
-      </>
-    );
-  }
-}
-
-export default connect(null, mapDispatchToProps)(ActionWithConfirm);
diff --git a/components/legacy/DateTimePicker.js b/components/legacy/DateTimePicker.js
deleted file mode 100644
index daeb075e..00000000
--- a/components/legacy/DateTimePicker.js
+++ /dev/null
@@ -1,78 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Head from 'next/head';
-import Datetime from 'react-datetime';
-import moment from 'moment';
-
-import Clickable from 'components/common/Clickable';
-import LocaleContext from 'components/common/LocaleContext';
-
-const yesterday = moment().subtract(1, 'day');
-const notInPast = current => current.isAfter(yesterday);
-
-export const TIME_FORMAT = 'HH:mm';
-
-const formatDate = date => {
-  if (!date) {
-    return null;
-  }
-  let momentDate = date;
-  if (typeof date === 'string') {
-    momentDate = moment(date);
-  }
-  return momentDate.format();
-};
-
-const DateTimePicker = ({ className, placeholder, value, onChange }) => (
-  <>
-    <Head>
-      <link
-        key="react-datetime-styles"
-        rel="stylesheet"
-        href="/static/react-datetime/react-datetime.css"
-      />
-    </Head>
-    <LocaleContext.Consumer>
-      {lang => (
-        <Datetime
-          utc
-          locale={lang}
-          defaultValue={value ? moment(value) : ''}
-          onChange={date => onChange(formatDate(date))}
-          timeFormat={TIME_FORMAT}
-          renderInput={props => (
-            <div className="field has-addons">
-              <p className="control">
-                <input {...props} className={className} placeholder={placeholder} />
-              </p>
-              <p className="control">
-                <Clickable
-                  className="button is-primary"
-                  onClick={props.onChange.bind(null, { target: { value: '' } })}
-                >
-                  ×
-                </Clickable>
-              </p>
-            </div>
-          )}
-          isValidDate={notInPast}
-        />
-      )}
-    </LocaleContext.Consumer>
-  </>
-);
-
-DateTimePicker.propTypes = {
-  className: PropTypes.string,
-  placeholder: PropTypes.string,
-  value: PropTypes.string,
-  onChange: PropTypes.func.isRequired,
-};
-
-DateTimePicker.defaultProps = {
-  className: '',
-  placeholder: '',
-  value: null,
-};
-
-export default DateTimePicker;
diff --git a/components/legacy/ImageUploader.js b/components/legacy/ImageUploader.js
deleted file mode 100644
index ddfb8515..00000000
--- a/components/legacy/ImageUploader.js
+++ /dev/null
@@ -1,65 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import Dropzone from 'react-dropzone';
-import noop from 'lodash/noop';
-
-import Button from 'components/common/Button';
-import { uploadFile } from 'utils/request';
-
-const SUPPORTED_FORMATS = ['jpeg', 'png', 'gif', 'apng', 'svg+xml'];
-
-class ImageUploader extends Component {
-  static propTypes = {
-    onFinish: PropTypes.func,
-  };
-
-  static defaultProps = {
-    onFinish: noop,
-  };
-
-  state = {
-    file: null,
-    pending: false,
-  };
-
-  handleDrop = files => {
-    const [file] = files;
-    this.setState({ file });
-  };
-
-  handleSubmit = () => {
-    const { onFinish } = this.props;
-    const { file } = this.state;
-    this.setState({ pending: true });
-    uploadFile(file).then(res => {
-      onFinish(res);
-      this.setState({ pending: false, file: null });
-    });
-  };
-
-  render() {
-    const { file, pending } = this.state;
-    const { preview } = file || {};
-
-    return (
-      <section>
-        <div className="dropzone">
-          <Dropzone
-            onDrop={this.handleDrop}
-            // style={{ backgroundImage: preview ? `url(${preview})` : null }}
-            accept={SUPPORTED_FORMATS.map(type => `image/${type}`)}
-            multiple={false}
-          >
-            {!preview && <p>Try dropping file here, or click to select file to upload.</p>}
-            {preview && <img alt={file.name} src={preview} />}
-          </Dropzone>
-        </div>
-        <Button onClick={this.handleSubmit} pending={pending} disabled={!file}>
-          Submit
-        </Button>
-      </section>
-    );
-  }
-}
-
-export default ImageUploader;
diff --git a/components/legacy/Select.js b/components/legacy/Select.js
deleted file mode 100644
index 0d60bf0d..00000000
--- a/components/legacy/Select.js
+++ /dev/null
@@ -1,149 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import Downshift from 'downshift';
-import cn from 'classnames';
-
-import Clickable from 'components/common/Clickable';
-import Button from 'components/common/Button';
-import Icon from 'components/common/ui/Icon';
-
-const DEFAULT_STATE = { selectedItem: null, inputValue: '', highlightedIndex: 0 };
-
-const Arrow = ({ isOpen }) => (
-  <span className="icon is-small is-right">
-    <Icon name={`angle-${isOpen ? 'down' : 'up'}`} aria-hidden="true" />
-  </span>
-);
-
-// TODO: extract Dropdown component (like lang switcher)
-// TODO: fix searchable mode
-const Select = ({
-  className,
-  size,
-  value,
-  options,
-  valueWholeObject,
-  clerable,
-  searchable,
-  dropdown,
-  placeholder,
-  renderOption,
-  onChange,
-}) => (
-  <Downshift
-    defaultSelectedItem={options.find(({ id }) => id === value)}
-    onChange={item => onChange(valueWholeObject ? item : item && item.id)}
-    itemToString={i => (i == null ? '' : i.label)}
-    render={({
-      getInputProps,
-      getItemProps,
-      getToggleButtonProps,
-      isOpen,
-      inputValue,
-      selectedItem: selected,
-      reset,
-    }) => (
-      <div className={cn('field', { 'has-addons': clerable })}>
-        <div className="control is-expanded">
-          <div
-            className={cn(
-              'babajka-dropdown dropdown',
-              className,
-              { 'is-active': isOpen },
-              `size-${size}`
-            )}
-          >
-            <div className="babajka-dropdown__trigger dropdown-trigger">
-              {dropdown && (
-                <Button {...getToggleButtonProps({ className: `button size-${size}` })}>
-                  <span>{placeholder}</span>
-                  <Arrow isOpen={isOpen} />
-                </Button>
-              )}
-              {!dropdown && (
-                <div {...getToggleButtonProps({ className: 'control has-icons-right' })}>
-                  {searchable && (
-                    <input
-                      {...getInputProps({
-                        className: 'babajka-dropdown-input input',
-                        placeholder,
-                      })}
-                    />
-                  )}
-                  {!searchable && (
-                    <div className="babajka-dropdown-input input">
-                      {selected ? renderOption(selected) : placeholder}
-                    </div>
-                  )}
-                  <Arrow isOpen={isOpen} />
-                </div>
-              )}
-            </div>
-            <div className="babajka-dropdown-menu dropdown-menu" id="dropdown-menu" role="menu">
-              <ul className="babajka-dropdown-content dropdown-content">
-                {options
-                  .filter(
-                    ({ label }) =>
-                      !searchable ||
-                      !inputValue ||
-                      label.toLowerCase().includes(inputValue.toLowerCase())
-                  )
-                  .map(item => (
-                    <li
-                      {...getItemProps({ item })}
-                      className={cn('dropdown-item', {
-                        'is-active': selected && selected.id === item.id,
-                      })}
-                      key={item.id}
-                    >
-                      {renderOption(item)}
-                    </li>
-                  ))}
-              </ul>
-            </div>
-          </div>
-        </div>
-        <div className="control">
-          {clerable && (
-            <Clickable className="button is-primary" onClick={reset.bind(null, DEFAULT_STATE)}>
-              ×
-            </Clickable>
-          )}
-        </div>
-      </div>
-    )}
-  />
-);
-
-Select.propTypes = {
-  className: PropTypes.string,
-  size: PropTypes.oneOf(['xs', 's', 'm', 'l']),
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  options: PropTypes.arrayOf(
-    PropTypes.shape({
-      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-      label: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
-    })
-  ).isRequired,
-  valueWholeObject: PropTypes.bool,
-  searchable: PropTypes.bool,
-  clerable: PropTypes.bool,
-  dropdown: PropTypes.bool,
-  placeholder: PropTypes.string,
-  renderOption: PropTypes.func,
-  onChange: PropTypes.func.isRequired,
-};
-
-Select.defaultProps = {
-  className: '',
-  size: 'm',
-  value: null,
-  valueWholeObject: false,
-  searchable: false,
-  clerable: false,
-  dropdown: false,
-  placeholder: 'Select...',
-  renderOption: ({ label }) => label,
-};
-
-export default Select;
diff --git a/package-lock.json b/package-lock.json
index d30fd04a..f3f4d04a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -4310,21 +4310,6 @@
       "integrity": "sha1-D+9a1G8b16hQLGVyfwNn1e5D1pY=",
       "dev": true
     },
-    "attr-accept": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/attr-accept/-/attr-accept-1.1.3.tgz",
-      "integrity": "sha512-iT40nudw8zmCweivz6j58g+RT33I4KbaIvRUhjNmDwO2WmsQUxFEZZYZ5w3vXe5x5MX9D7mfvA/XaLOZYFR9EQ==",
-      "requires": {
-        "core-js": "^2.5.0"
-      },
-      "dependencies": {
-        "core-js": {
-          "version": "2.6.11",
-          "resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.11.tgz",
-          "integrity": "sha512-5wjnpaT/3dV+XB4borEsnAYQchn00XSgTAWKDkEqv+K8KevjbzmofK6hfJ9TZIlpj2N0xQpazy7PiRQiWHqzWg=="
-        }
-      }
-    },
     "autodll-webpack-plugin": {
       "version": "0.4.2",
       "resolved": "https://registry.npmjs.org/autodll-webpack-plugin/-/autodll-webpack-plugin-0.4.2.tgz",
@@ -7034,16 +7019,6 @@
         "sha.js": "^2.4.8"
       }
     },
-    "create-react-class": {
-      "version": "15.6.3",
-      "resolved": "https://registry.npmjs.org/create-react-class/-/create-react-class-15.6.3.tgz",
-      "integrity": "sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==",
-      "requires": {
-        "fbjs": "^0.8.9",
-        "loose-envify": "^1.3.1",
-        "object-assign": "^4.1.1"
-      }
-    },
     "create-react-context": {
       "version": "0.3.0",
       "resolved": "https://registry.npmjs.org/create-react-context/-/create-react-context-0.3.0.tgz",
@@ -7752,11 +7727,6 @@
         "dotenv-defaults": "^1.0.2"
       }
     },
-    "downshift": {
-      "version": "1.31.16",
-      "resolved": "https://registry.npmjs.org/downshift/-/downshift-1.31.16.tgz",
-      "integrity": "sha512-RskXmiGSoz0EHAyBrmTBGSLHg6+NYDGuLu2W3GpmuOe6hmZEWhCiQrq5g6DWzhnUaJD41xHbbfC6j1Fe86YqgA=="
-    },
     "duplexer": {
       "version": "0.1.1",
       "resolved": "https://registry.npmjs.org/duplexer/-/duplexer-0.1.1.tgz",
@@ -21651,24 +21621,6 @@
         "tinycolor2": "^1.4.1"
       }
     },
-    "react-datetime": {
-      "version": "2.16.3",
-      "resolved": "https://registry.npmjs.org/react-datetime/-/react-datetime-2.16.3.tgz",
-      "integrity": "sha512-amWfb5iGEiyqjLmqCLlPpu2oN415jK8wX1qoTq7qn6EYiU7qQgbNHglww014PT4O/3G5eo/3kbJu/M/IxxTyGw==",
-      "requires": {
-        "create-react-class": "^15.5.2",
-        "object-assign": "^3.0.0",
-        "prop-types": "^15.5.7",
-        "react-onclickoutside": "^6.5.0"
-      },
-      "dependencies": {
-        "object-assign": {
-          "version": "3.0.0",
-          "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-3.0.0.tgz",
-          "integrity": "sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I="
-        }
-      }
-    },
     "react-dev-utils": {
       "version": "9.1.0",
       "resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-9.1.0.tgz",
@@ -21901,15 +21853,6 @@
         "prop-types": "^15.6.0"
       }
     },
-    "react-dropzone": {
-      "version": "6.2.4",
-      "resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-6.2.4.tgz",
-      "integrity": "sha512-fkG/Nxalhai12FdNw9RZ6dIr1SctmRXWekkSoOKAhNDAECwDg4HWKuvvZVkEAedGNeAgmkQRVoqNfT8uje1zfg==",
-      "requires": {
-        "attr-accept": "^1.1.3",
-        "prop-types": "^15.6.2"
-      }
-    },
     "react-error-overlay": {
       "version": "6.0.5",
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.5.tgz",
@@ -21986,11 +21929,6 @@
       "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
     },
-    "react-onclickoutside": {
-      "version": "6.9.0",
-      "resolved": "https://registry.npmjs.org/react-onclickoutside/-/react-onclickoutside-6.9.0.tgz",
-      "integrity": "sha512-8ltIY3bC7oGhj2nPAvWOGi+xGFybPNhJM0V1H8hY/whNcXgmDeaeoCMPPd8VatrpTsUWjb/vGzrmu6SrXVty3A=="
-    },
     "react-popper": {
       "version": "1.3.7",
       "resolved": "https://registry.npmjs.org/react-popper/-/react-popper-1.3.7.tgz",
diff --git a/package.json b/package.json
index 8b9d1f8f..2dba1baf 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,6 @@
     "classnames": "^2.2.6",
     "command-line-args": "^4.0.7",
     "cookie-parser": "^1.4.4",
-    "downshift": "^1.31.2",
     "env-ci": "^3.2.0",
     "express": "^4.17.1",
     "formik": "^1.5.2",
@@ -63,9 +62,7 @@
     "prop-types": "^15.7.2",
     "qs": "^6.6.0",
     "react": "^16.13.0",
-    "react-datetime": "^2.16.3",
     "react-dom": "^16.13.0",
-    "react-dropzone": "^6.0.2",
     "react-ga": "^2.5.7",
     "react-redux": "^6.0.0",
     "react-scroll-up": "^1.3.3",
diff --git a/pages/legacy/upload-test.js b/pages/legacy/upload-test.js
deleted file mode 100644
index 1ed061ca..00000000
--- a/pages/legacy/upload-test.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import React, { Component } from 'react';
-
-import ImageUploader from 'components/legacy/ImageUploader';
-
-import api from 'constants/api';
-
-import { makeRequest } from 'utils/request';
-
-class TestUploadPage extends Component {
-  static getLayoutProps = () => ({
-    hideFooter: true,
-  });
-
-  state = {
-    images: [],
-  };
-
-  componentDidMount() {
-    makeRequest(api.core.uploads)
-      .then(({ resources }) => resources.reverse().map(({ url }) => url))
-      .then(images => this.setState({ images }));
-  }
-
-  render() {
-    const { images } = this.state;
-    return (
-      <div className="page-content">
-        <h1>Test Cloudinary Integration</h1>
-        <ImageUploader
-          onFinish={({ url }) => {
-            this.setState({ images: images.concat(url) });
-          }}
-        />
-        <div>
-          {images.map((imageUrl, index) => (
-            <img key={imageUrl} src={imageUrl} alt={index} width="200px" />
-          ))}
-        </div>
-      </div>
-    );
-  }
-}
-
-export default TestUploadPage;
diff --git a/stories/ui.js b/stories/ui.js
index a3233164..dfb630cd 100644
--- a/stories/ui.js
+++ b/stories/ui.js
@@ -25,58 +25,3 @@ storiesOf(PREFIX, module)
       rightIcon={object('rightIcon', { pack: 's', name: 'arrow-right' })}
     />
   ));
-
-// storiesOf(`${PREFIX}/Select`)
-//   .add(
-//     'default',
-//     () => (
-//       <Select
-//         valueWholeObject={boolean('valueWholeObject', false)}
-//         options={object('options', [
-//           { id: 'apple', label: 'Apple' },
-//           { id: 'orange', label: 'Orange' },
-//           { id: 'carrot', label: 'Carrot' },
-//         ])}
-//         searchable={boolean('searchable', false)}
-//         clerable={boolean('clerable', false)}
-//         dropdown={boolean('dropdown', false)}
-//         placeholder={text('placeholder', 'Select fruit...')}
-//         size={select('size', ['xs', 's', 'm', 'l'], 's')}
-//         onChange={action('Select')}
-//       />
-//     ),
-//     {
-//       info: `
-//         Our custom select component
-//         built with awesome [Downshift](https://github.com/paypal/downshift)!
-//       `,
-//     }
-//   )
-//   .addParameters(infoSource)
-//   .add('dropdown', () => (
-//     <Select
-//       placeholder="Locale"
-//       options={[{ id: 'be', label: 'Be' }, { id: 'en', label: 'En' }, { id: 'ru', label: 'Ru' }]}
-//       onChange={action('Locale')}
-//       dropdown
-//       size="xs"
-//     />
-//   ))
-//   .add('custom render', () => (
-//     <Select
-//       placeholder="Assign task to..."
-//       options={[
-//         { id: 'drapegnik', name: 'Ivan' },
-//         { id: 'bohdan', name: 'Ulad' },
-//         { id: 'drozd', name: 'Vika' },
-//         { id: 'viarcinskaja', name: 'Tonya' },
-//       ]}
-//       renderOption={({ id, name }) => (
-//         <Author
-//           imageUrl={`https://res.cloudinary.com/wir-by/image/upload/v1528990359/production/team/${id}`}
-//           name={name}
-//         />
-//       )}
-//       onChange={action('Assigned to')}
-//     />
-//   ));
diff --git a/utils/request.js b/utils/request.js
index a3dd9714..62203979 100644
--- a/utils/request.js
+++ b/utils/request.js
@@ -3,7 +3,6 @@ import nextCookie from 'next-cookies';
 import castArray from 'lodash/castArray';
 
 import { Router, ROUTES_NAMES } from 'routes';
-import api from 'constants/api';
 import { BACKEND_URL } from 'constants/server';
 import { DEFAULT_LOCALE } from 'constants';
 
@@ -32,17 +31,6 @@ const getOptions = options => {
   return mergedOptions;
 };
 
-export const uploadFile = file => {
-  const fd = new FormData();
-  fd.append('image', file);
-  return fetch(api.core.uploads, {
-    mode: DEFAULT_OPTIONS.mode,
-    credentials: DEFAULT_OPTIONS.credentials,
-    method: 'POST',
-    body: fd,
-  }).then(res => res.json());
-};
-
 export const makeRequest = (url, method = 'GET', rawBody = null) =>
   new Promise((resolve, reject) => {
     if (!url) {