Merge pull request #826 from sharetribe/update-packages

Update packages to see how many nsp alerts we can get rid of easily

.nsprc

@@ -5,6 +5,8 @@
     "https://nodesecurity.io/advisories/532",
     "https://nodesecurity.io/advisories/534",
     "https://nodesecurity.io/advisories/535",
-    "https://nodesecurity.io/advisories/566"
+    "https://nodesecurity.io/advisories/566",
+    "https://nodesecurity.io/advisories/157",
+    "https://nodesecurity.io/advisories/577"
   ]
 }

package.json

@@ -43,7 +43,6 @@
     "react-moment-proptypes": "^1.5.0",
     "react-redux": "^5.0.7",
     "react-router-dom": "^4.2.2",
-    "react-sortable-hoc": "^0.6.8",
     "redux": "^3.7.2",
     "redux-form": "^7.3.0",
     "redux-thunk": "^2.2.0",

src/components/AddImages/AddImages.example.js

@@ -1,7 +1,6 @@
 /* eslint-disable no-console */
 import React, { Component } from 'react';
 import { findIndex, uniqueId } from 'lodash';
-import { arrayMove } from 'react-sortable-hoc';
 import { types as sdkTypes } from '../../util/sdkLoader';
 import AddImages from './AddImages';
 import css from './AddImages.example.css';
@@ -19,7 +18,6 @@ class AddImagesTest extends Component {
       images: [],
     };
     this.onChange = this.onChange.bind(this);
-    this.onSortEnd = this.onSortEnd.bind(this);
   }
 
   onChange(event) {
@@ -50,19 +48,11 @@ class AddImagesTest extends Component {
     }, 1000);
   }
 
-  onSortEnd({ oldIndex, newIndex }) {
-    const { images } = this.state;
-    this.setState({
-      images: arrayMove(images, oldIndex, newIndex),
-    });
-  }
-
   render() {
     return (
       <div>
         <AddImages
           images={this.state.images}
-          onSortEnd={this.onSortEnd}
           savedImageAltText="Saved image"
           onRemoveImage={imageId => console.log('remove image:', imageId)}
         >

src/components/AddImages/AddImages.js

@@ -9,7 +9,6 @@
  */
 import React from 'react';
 import PropTypes from 'prop-types';
-import { SortableContainer } from 'react-sortable-hoc';
 import classNames from 'classnames';
 import { ImageFromFile, ResponsiveImage, IconSpinner } from '../../components';
 
@@ -76,21 +75,7 @@ ThumbnailWrapper.propTypes = {
   onRemoveImage: func.isRequired,
 };
 
-// Sorting is disabled temporarily.
-//
-// The issue with sorting is that in touch devices it makes
-// scrolling the page really hard. The image takes 100% of the width
-// of the device (minus margin) and thus the whole screen is filled
-// up with the sortable images. When the user tries to scroll by dragging
-// the finger on the device, it actually start to sort the images and
-// not scroll.
-//
-// TODO Think what to do with the scrolling issue when sorting is in use
-//
-const SortableImage = ThumbnailWrapper;
-
-// Create container where there are sortable images and passed children like "Add image" input etc.
-const SortableImages = SortableContainer(props => {
+const AddImages = props => {
   const {
     children,
     className,
@@ -104,7 +89,7 @@ const SortableImages = SortableContainer(props => {
     <div className={classes}>
       {images.map((image, index) => {
         return (
-          <SortableImage
+          <ThumbnailWrapper
             image={image}
             index={index}
             key={image.id.uuid || image.id}
@@ -117,13 +102,6 @@ const SortableImages = SortableContainer(props => {
       {children}
     </div>
   );
-});
-
-// Configure sortable container see. https://github.com/clauderic/react-sortable-hoc
-// Items can be sorted horizontally, vertically or in a grid.
-// axis="xy" means grid like sorting
-const AddImages = props => {
-  return <SortableImages axis="xy" {...props} />;
 };
 
 AddImages.defaultProps = { className: null, thumbnailClassName: null, images: [] };
@@ -133,7 +111,6 @@ AddImages.propTypes = {
   children: node.isRequired,
   className: string,
   thumbnailClassName: string,
-  onSortEnd: func.isRequired,
   savedImageAltText: string.isRequired,
   onRemoveImage: func.isRequired,
 };

src/components/BookingBreakdown/LineItemUnitPrice.js

@@ -11,7 +11,9 @@ const LineItemUnitPrice = props => {
   const isDaily = unitType === LINE_ITEM_DAY;
   const translationKey = isNightly
     ? 'BookingBreakdown.pricePerNight'
-    : isDaily ? 'BookingBreakdown.pricePerDay' : 'BookingBreakdown.pricePerQuantity';
+    : isDaily
+      ? 'BookingBreakdown.pricePerDay'
+      : 'BookingBreakdown.pricePerQuantity';
 
   const unitPurchase = transaction.attributes.lineItems.find(
     item => item.code === unitType && !item.reversal

src/components/EditListingLocationPanel/EditListingLocationPanel.js

@@ -59,7 +59,9 @@ const EditListingLocationPanel = props => {
         initialValues={initialSearchFormValues}
         onSubmit={values => {
           const { building = '', location } = values;
-          const { selectedPlace: { address, origin } } = location;
+          const {
+            selectedPlace: { address, origin },
+          } = location;
           const updateValues = {
             geolocation: origin,
             publicData: {

src/components/FieldCurrencyInput/FieldCurrencyInput.js

@@ -118,7 +118,10 @@ class CurrencyInputComponent extends Component {
   onInputBlur(event) {
     event.preventDefault();
     event.stopPropagation();
-    const { currencyConfig, input: { onBlur } } = this.props;
+    const {
+      currencyConfig,
+      input: { onBlur },
+    } = this.props;
     this.setState(prevState => {
       if (onBlur) {
         // If parent component has provided onBlur function, call it with current price.
@@ -134,7 +137,10 @@ class CurrencyInputComponent extends Component {
   onInputFocus(event) {
     event.preventDefault();
     event.stopPropagation();
-    const { currencyConfig, input: { onFocus } } = this.props;
+    const {
+      currencyConfig,
+      input: { onFocus },
+    } = this.props;
     this.setState(prevState => {
       if (onFocus) {
         // If parent component has provided onFocus function, call it with current price.

src/components/StripeBankAccountTokenInputField/StripeBankAccountTokenInputField.js

@@ -108,7 +108,12 @@ class TokenInputFieldComponent extends Component {
    * @param {Object} values - values from different input types
    */
   requestToken(values) {
-    const { country, currency, input: { onChange }, intl } = this.props;
+    const {
+      country,
+      currency,
+      input: { onChange },
+      intl,
+    } = this.props;
 
     // First we have to clear the current token value so the parent
     // form doesn't submit with an old value.

src/components/TransactionPanel/TransactionPanel.helpers.js

@@ -99,7 +99,9 @@ export const AddressLinkMaybe = props => {
   const { lat, lng } = geolocation || {};
   const hrefToGoogleMaps = geolocation
     ? `https://maps.google.com/?q=${lat},${lng}`
-    : address ? `https://maps.google.com/?q=${encodeURIComponent(address)}` : null;
+    : address
+      ? `https://maps.google.com/?q=${encodeURIComponent(address)}`
+      : null;
 
   const fullAddress =
     typeof building === 'string' && building.length > 0 ? `${building}, ${address}` : address;

src/forms/BookingDatesForm/EstimatedBreakdownMaybe.js

@@ -63,7 +63,9 @@ const estimatedTransaction = (unitType, bookingStart, bookingEnd, unitPrice, qua
 
   const unitCount = isNightly
     ? nightsBetween(bookingStart, bookingEnd)
-    : isDaily ? daysBetween(bookingStart, bookingEnd) : quantity;
+    : isDaily
+      ? daysBetween(bookingStart, bookingEnd)
+      : quantity;
 
   const totalPrice = estimatedTotalPrice(unitPrice, unitCount);
 

src/forms/EditListingPhotosForm/EditListingPhotosForm.js

@@ -3,7 +3,6 @@ import { array, bool, func, object, shape, string } from 'prop-types';
 import { compose } from 'redux';
 import { Form as FinalForm, Field } from 'react-final-form';
 import { FormattedMessage, intlShape, injectIntl } from 'react-intl';
-import { arrayMove } from 'react-sortable-hoc';
 import { isEqual } from 'lodash';
 import classNames from 'classnames';
 import { propTypes } from '../../util/types';
@@ -20,7 +19,6 @@ export class EditListingPhotosFormComponent extends Component {
     super(props);
     this.state = { imageUploadRequested: false };
     this.onImageUploadHandler = this.onImageUploadHandler.bind(this);
-    this.onSortEnd = this.onSortEnd.bind(this);
     this.submittedImages = [];
   }
 
@@ -38,11 +36,6 @@ export class EditListingPhotosFormComponent extends Component {
     }
   }
 
-  onSortEnd({ oldIndex, newIndex }) {
-    const images = arrayMove(this.props.images, oldIndex, newIndex);
-    this.props.onUpdateImageOrder(images.map(i => i.id));
-  }
-
   render() {
     return (
       <FinalForm
@@ -150,7 +143,6 @@ export class EditListingPhotosFormComponent extends Component {
               <AddImages
                 className={css.imagesField}
                 images={images}
-                onSortEnd={this.onSortEnd}
                 thumbnailClassName={css.thumbnail}
                 savedImageAltText={intl.formatMessage({
                   id: 'EditListingPhotosForm.savedImageAltText',