Remove react-datetime dep and Date compo in helper plugin

Signed-off-by: soupette <cyril.lpz@gmail.com>

packages/strapi-admin/admin/src/app.js

@@ -18,7 +18,6 @@ import '@babel/polyfill';
 import 'sanitize.css/sanitize.css';
 
 // Third party css library needed
-import 'react-datetime/css/react-datetime.css';
 import 'bootstrap/dist/css/bootstrap.css';
 import 'font-awesome/css/font-awesome.min.css';
 import '@fortawesome/fontawesome-free/css/all.css';

packages/strapi-admin/package.json

@@ -63,7 +63,6 @@
     "prop-types": "^15.7.2",
     "react": "^16.9.0",
     "react-copy-to-clipboard": "^5.0.1",
-    "react-datetime": "^2.16.3",
     "react-dnd": "^10.0.2",
     "react-dnd-html5-backend": "^10.0.2",
     "react-dom": "^16.9.0",
@@ -82,7 +81,7 @@
     "redux-immutable": "^4.0.0",
     "redux-saga": "^0.16.0",
     "remove-markdown": "^0.2.2",
-    "reselect": "^3.0.1",
+    "reselect": "^4.0.0",
     "sanitize.css": "^4.1.0",
     "shelljs": "^0.7.8",
     "strapi-helper-plugin": "3.0.0-beta.20",

packages/strapi-admin/webpack.alias.js

@@ -2,7 +2,6 @@ const alias = [
   'object-assign',
   'whatwg-fetch',
   '@babel/polyfill',
-
   '@buffetjs/core',
   '@buffetjs/custom',
   '@buffetjs/icons',

packages/strapi-helper-plugin/lib/src/components/InputDate/StyledDateTime.js

@@ -1,19 +0,0 @@
-import DateTime from 'react-datetime';
-import styled from 'styled-components';
-
-const StyledDateTime = styled(DateTime)`
-  .input {
-    height: 3.4rem;
-    margin-top: 0.9rem;
-    padding-left: 1rem;
-    background-size: 0 !important;
-    border: 1px solid #e3e9f3;
-    border-radius: 0.25rem;
-    line-height: 3.4rem;
-    font-size: 1.3rem;
-    font-family: 'Lato' !important;
-    box-shadow: 0px 1px 1px rgba(104, 118, 142, 0.05);
-  }
-`;
-
-export default StyledDateTime;

packages/strapi-helper-plugin/lib/src/components/InputDate/index.js

@@ -1,109 +0,0 @@
-/**
- *
- * InputDate
- *
- */
-
-import React from 'react';
-import moment from 'moment';
-import PropTypes from 'prop-types';
-import { FormattedMessage } from 'react-intl';
-import { isEmpty, isObject } from 'lodash';
-import cn from 'classnames';
-import StyledDateTime from './StyledDateTime';
-
-/* eslint-disable react/jsx-boolean-value */
-function InputDate(props) {
-  const value =
-    isObject(props.value) && props.value._isAMomentObject === true
-      ? props.value
-      : moment(props.value);
-  const formattedPlaceholder =
-    props.placeholder === ''
-      ? 'app.utils.placeholder.defaultMessage'
-      : props.placeholder;
-
-  return (
-    <FormattedMessage
-      id={formattedPlaceholder}
-      defaultMessage={formattedPlaceholder}
-    >
-      {placeholder => (
-        <StyledDateTime
-          dateFormat="YYYY-MM-DD"
-          inputProps={{
-            autoFocus: props.autoFocus,
-            className: cn(
-              'form-control',
-              'input',
-              !props.deactivateErrorHighlight && props.error && 'is-invalid',
-              !isEmpty(props.className) && props.className
-            ),
-            disabled: props.disabled,
-            id: props.name,
-            name: props.name,
-            placeholder,
-            style: props.style,
-          }}
-          onBlur={moment =>
-            props.onBlur({
-              target: {
-                name: props.name,
-                value: moment,
-              },
-            })
-          }
-          onChange={moment =>
-            props.onChange({
-              target: {
-                name: props.name,
-                value: moment,
-                type: 'date',
-              },
-            })
-          }
-          onFocus={props.onFocus}
-          ref={props.inputRef}
-          tabIndex={props.tabIndex}
-          timeFormat="HH:mm:ss"
-          utc={true}
-          value={value}
-          style={props.style}
-        />
-      )}
-    </FormattedMessage>
-  );
-}
-
-InputDate.defaultProps = {
-  autoFocus: false,
-  className: '',
-  deactivateErrorHighlight: false,
-  disabled: false,
-  error: false,
-  inputRef: () => {},
-  onBlur: () => {},
-  onFocus: () => {},
-  placeholder: 'app.utils.placeholder.defaultMessage',
-  style: {},
-  tabIndex: '0',
-};
-
-InputDate.propTypes = {
-  autoFocus: PropTypes.bool,
-  className: PropTypes.string,
-  deactivateErrorHighlight: PropTypes.bool,
-  disabled: PropTypes.bool,
-  error: PropTypes.bool,
-  inputRef: PropTypes.func,
-  name: PropTypes.string.isRequired,
-  onBlur: PropTypes.func,
-  onChange: PropTypes.func.isRequired,
-  onFocus: PropTypes.func,
-  placeholder: PropTypes.string,
-  style: PropTypes.object,
-  tabIndex: PropTypes.string,
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,
-};
-
-export default InputDate;

packages/strapi-helper-plugin/lib/src/components/InputDateWithErrors/Container.js

@@ -1,37 +0,0 @@
-import styled from 'styled-components';
-
-const Container = styled.div`
-  min-width: 200px;
-  margin-bottom: 1.5rem;
-  font-size: 1.3rem;
-
-  > div:first-of-type {
-    &:before {
-      content: '\f073';
-      position: absolute;
-      left: 1px;
-      top: 1px;
-      width: 32px;
-      height: 32px;
-      border-radius: 3px 0px 0px 3px;
-      background: #fafafb;
-      color: #b3b5b9;
-      text-align: center;
-      font-family: 'FontAwesome';
-      font-size: 1.4rem;
-      line-height: 32px;
-      -webkit-font-smoothing: none;
-    }
-
-    input {
-      width: 100%;
-      padding-left: 42px;
-      box-shadow: 0px 1px 1px rgba(104, 118, 142, 0.05);
-      &:focus {
-        outline: none;
-      }
-    }
-  }
-`;
-
-export default Container;

packages/strapi-helper-plugin/lib/src/components/InputDateWithErrors/index.js

@@ -1,221 +0,0 @@
-/**
- *
- * InputDateWithErrors
- *
- */
-
-import React from 'react';
-import PropTypes from 'prop-types';
-import { get, isEmpty, isFunction } from 'lodash';
-import cn from 'classnames';
-
-// Utils
-import validateInput from '../../utils/inputsValidations';
-
-// Design
-import Label from '../Label';
-import InputDescription from '../InputDescription';
-import InputErrors from '../InputErrors';
-import InputDate from '../InputDate';
-import InputSpacer from '../InputSpacer';
-import Container from './Container';
-
-class InputDateWithErrors extends React.Component {
-  // eslint-disable-line react/prefer-stateless-function
-  state = { errors: [], hasInitialValue: false };
-
-  componentDidMount() {
-    const { value, errors } = this.props;
-
-    // Prevent the input from displaying an error when the user enters and leaves without filling it
-    if (!isEmpty(value)) {
-      this.setState({ hasInitialValue: true });
-    }
-
-    // Display input error if it already has some
-    if (!isEmpty(errors)) {
-      this.setState({ errors });
-    }
-  }
-
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    // Show required error if the input's value is received after the compo is mounted
-    if (!isEmpty(nextProps.value) && !this.state.hasInitialValue) {
-      this.setState({ hasInitialValue: true });
-    }
-
-    // Check if errors have been updated during validations
-    if (nextProps.didCheckErrors !== this.props.didCheckErrors) {
-      // Remove from the state the errors that have already been set
-      const errors = isEmpty(nextProps.errors) ? [] : nextProps.errors;
-      this.setState({ errors });
-    }
-  }
-
-  /**
-   * Set the errors depending on the validations given to the input
-   * @param  {Object} target
-   */
-  handleBlur = ({ target }) => {
-    // Prevent from displaying error if the input is initially isEmpty
-    if (!isEmpty(get(target, 'value')) || this.state.hasInitialValue) {
-      const errors = validateInput(target.value, this.props.validations);
-      this.setState({ errors, hasInitialValue: true });
-    }
-  };
-
-  render() {
-    const {
-      autoFocus,
-      className,
-      customBootstrapClass,
-      deactivateErrorHighlight,
-      disabled,
-      errorsClassName,
-      errorsStyle,
-      inputClassName,
-      inputDescription,
-      inputDescriptionClassName,
-      inputDescriptionStyle,
-      inputStyle,
-      label,
-      labelClassName,
-      labelStyle,
-      name,
-      noErrorsDescription,
-      onBlur,
-      onChange,
-      onFocus,
-      placeholder,
-      style,
-      tabIndex,
-      value,
-    } = this.props;
-    const handleBlur = isFunction(onBlur) ? onBlur : this.handleBlur;
-
-    let spacer = !isEmpty(inputDescription) ? <InputSpacer /> : <div />;
-
-    if (!noErrorsDescription && !isEmpty(this.state.errors)) {
-      spacer = <div />;
-    }
-
-    return (
-      <Container
-        className={cn(
-          (!isEmpty(customBootstrapClass) && customBootstrapClass) ||
-            'col-md-4',
-          !isEmpty(className) && className
-        )}
-        style={style}
-      >
-        <Label
-          className={labelClassName}
-          htmlFor={name}
-          message={label}
-          style={labelStyle}
-        />
-        <InputDate
-          autoFocus={autoFocus}
-          className={inputClassName}
-          disabled={disabled}
-          deactivateErrorHighlight={deactivateErrorHighlight}
-          error={!isEmpty(this.state.errors)}
-          name={name}
-          onBlur={handleBlur}
-          onChange={onChange}
-          onFocus={onFocus}
-          placeholder={placeholder}
-          style={inputStyle}
-          tabIndex={tabIndex}
-          value={value}
-        />
-        <InputDescription
-          className={inputDescriptionClassName}
-          message={inputDescription}
-          style={inputDescriptionStyle}
-        />
-        <InputErrors
-          className={errorsClassName}
-          errors={(!noErrorsDescription && this.state.errors) || []}
-          name={name}
-          style={errorsStyle}
-        />
-        {spacer}
-      </Container>
-    );
-  }
-}
-
-InputDateWithErrors.defaultProps = {
-  autoFocus: false,
-  className: '',
-  customBootstrapClass: 'col-md-4',
-  deactivateErrorHighlight: false,
-  didCheckErrors: false,
-  disabled: false,
-  onBlur: false,
-  onFocus: () => {},
-  errors: [],
-  errorsClassName: '',
-  errorsStyle: {},
-  inputClassName: '',
-  inputDescription: '',
-  inputDescriptionClassName: '',
-  inputDescriptionStyle: {},
-  inputStyle: {},
-  label: '',
-  labelClassName: '',
-  labelStyle: {},
-  noErrorsDescription: false,
-  placeholder: 'app.utils.placeholder.defaultMessage',
-  style: {},
-  tabIndex: '0',
-  validations: {},
-  value: null,
-};
-
-InputDateWithErrors.propTypes = {
-  autoFocus: PropTypes.bool,
-  className: PropTypes.string,
-  customBootstrapClass: PropTypes.string,
-  deactivateErrorHighlight: PropTypes.bool,
-  didCheckErrors: PropTypes.bool,
-  disabled: PropTypes.bool,
-  errors: PropTypes.array,
-  errorsClassName: PropTypes.string,
-  errorsStyle: PropTypes.object,
-  inputClassName: PropTypes.string,
-  inputDescription: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  inputDescriptionClassName: PropTypes.string,
-  inputDescriptionStyle: PropTypes.object,
-  inputStyle: PropTypes.object,
-  label: PropTypes.oneOfType([
-    PropTypes.string,
-    PropTypes.func,
-    PropTypes.shape({
-      id: PropTypes.string,
-      params: PropTypes.object,
-    }),
-  ]),
-  labelClassName: PropTypes.string,
-  labelStyle: PropTypes.object,
-  name: PropTypes.string.isRequired,
-  noErrorsDescription: PropTypes.bool,
-  onBlur: PropTypes.oneOfType([PropTypes.bool, PropTypes.func]),
-  onChange: PropTypes.func.isRequired,
-  onFocus: PropTypes.func,
-  placeholder: PropTypes.string,
-  style: PropTypes.object,
-  tabIndex: PropTypes.string,
-  validations: PropTypes.object,
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
-};
-
-export default InputDateWithErrors;

packages/strapi-helper-plugin/lib/src/components/InputsIndex/index.js

@@ -11,7 +11,6 @@ import { isEmpty, merge } from 'lodash';
 // Design
 import InputAddonWithErrors from '../InputAddonWithErrors';
 import InputCheckboxWithErrors from '../InputCheckboxWithErrors';
-import InputDateWithErrors from '../InputDateWithErrors';
 import InputEmailWithErrors from '../InputEmailWithErrors';
 import InputNumberWithErrors from '../InputNumberWithErrors';
 import InputSearchWithErrors from '../InputSearchWithErrors';
@@ -30,7 +29,6 @@ const DefaultInputError = ({ type }) => (
 const inputs = {
   addon: InputAddonWithErrors,
   checkbox: InputCheckboxWithErrors,
-  date: InputDateWithErrors,
   email: InputEmailWithErrors,
   number: InputNumberWithErrors,
   password: InputPasswordWithErrors,

packages/strapi-helper-plugin/lib/src/index.js

@@ -27,8 +27,6 @@ export { default as InputAddon } from './components/InputAddon';
 export { default as InputAddonWithErrors } from './components/InputAddonWithErrors';
 export { default as InputCheckbox } from './components/InputCheckbox';
 export { default as InputCheckboxWithErrors } from './components/InputCheckboxWithErrors';
-export { default as InputDate } from './components/InputDate';
-export { default as InputDateWithErrors } from './components/InputDateWithErrors';
 export { default as InputDescription } from './components/InputDescription';
 export { default as InputEmail } from './components/InputEmail';
 export { default as InputEmailWithErrors } from './components/InputEmailWithErrors';

packages/strapi-helper-plugin/package.json

@@ -57,7 +57,6 @@
     "lodash": "^4.17.5",
     "moment": "^2.16.0",
     "react": "^16.9.0",
-    "react-datetime": "^2.16.3",
     "react-dom": "^16.9.0",
     "react-intl": "^4.5.0",
     "react-router": "^5.0.0",

packages/strapi-plugin-content-manager/package.json

@@ -25,7 +25,7 @@
     "reactstrap": "8.4.1",
     "redux": "^4.0.1",
     "redux-immutable": "^4.0.0",
-    "reselect": "^3.0.1",
+    "reselect": "^4.0.0",
     "showdown": "^1.9.0",
     "strapi-helper-plugin": "3.0.0-beta.20",
     "strapi-utils": "3.0.0-beta.20",

packages/strapi-plugin-content-type-builder/package.json

@@ -22,7 +22,7 @@
     "reactstrap": "8.4.1",
     "redux": "^4.0.1",
     "redux-immutable": "^4.0.0",
-    "reselect": "^3.0.1",
+    "reselect": "^4.0.0",
     "strapi-generate": "3.0.0-beta.20",
     "strapi-generate-api": "3.0.0-beta.20",
     "strapi-helper-plugin": "3.0.0-beta.20",

yarn.lock

@@ -5777,11 +5777,6 @@ core-js-compat@^3.6.2:
     browserslist "^4.8.5"
     semver "7.0.0"
 
-core-js@^1.0.0:
-  version "1.2.7"
-  resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
-  integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
-
 core-js@^2.4.0, core-js@^2.4.1, core-js@^2.6.5:
   version "2.6.11"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c"
@@ -5868,15 +5863,6 @@ create-hmac@^1.1.0, create-hmac@^1.1.2, create-hmac@^1.1.4:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
-create-react-class@^15.5.2:
-  version "15.6.3"
-  resolved "https://registry.yarnpkg.com/create-react-class/-/create-react-class-15.6.3.tgz#2d73237fb3f970ae6ebe011a9e66f46dbca80036"
-  integrity sha512-M+/3Q6E6DLO6Yx3OwrWjwHBnvfXXYA7W+dFjt/ZDBemHO1DDZhsalX/NUtnTYclN6GfnBDRh4qRHjcDHmlJBJg==
-  dependencies:
-    fbjs "^0.8.9"
-    loose-envify "^1.3.1"
-    object-assign "^4.1.1"
-
 create-react-context@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/create-react-context/-/create-react-context-0.3.0.tgz#546dede9dc422def0d3fc2fe03afe0bc0f4f7d8c"
@@ -7855,19 +7841,6 @@ fbjs-css-vars@^1.0.0:
   resolved "https://registry.yarnpkg.com/fbjs-css-vars/-/fbjs-css-vars-1.0.2.tgz#216551136ae02fe255932c3ec8775f18e2c078b8"
   integrity sha512-b2XGFAFdWZWg0phtAWLHCk836A1Xann+I+Dgd3Gk64MHKZO44FfoD1KxyvbSh0qZsIoXQGGlVztIY+oitJPpRQ==
 
-fbjs@^0.8.9:
-  version "0.8.17"
-  resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
-  integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=
-  dependencies:
-    core-js "^1.0.0"
-    isomorphic-fetch "^2.1.1"
-    loose-envify "^1.0.0"
-    object-assign "^4.1.0"
-    promise "^7.1.1"
-    setimmediate "^1.0.5"
-    ua-parser-js "^0.7.18"
-
 fbjs@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-1.0.0.tgz#52c215e0883a3c86af2a7a776ed51525ae8e0a5a"
@@ -12925,11 +12898,6 @@ object-assign@4.x, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.
   resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863"
   integrity sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=
 
-object-assign@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-3.0.0.tgz#9bedd5ca0897949bca47e7ff408062d549f587f2"
-  integrity sha1-m+3VygiXlJvKR+f/QIBi1Un1h/I=
-
 object-copy@^0.1.0:
   version "0.1.0"
   resolved "https://registry.yarnpkg.com/object-copy/-/object-copy-0.1.0.tgz#7e7d858b781bd7c991a41ba975ed3812754e998c"
@@ -14734,16 +14702,6 @@ react-dates@^21.1.0, react-dates@^21.5.1:
     react-with-styles "^4.1.0"
     react-with-styles-interface-css "^6.0.0"
 
-react-datetime@^2.16.3:
-  version "2.16.3"
-  resolved "https://registry.yarnpkg.com/react-datetime/-/react-datetime-2.16.3.tgz#7f9ac7d4014a939c11c761d0c22d1fb506cb505e"
-  integrity sha512-amWfb5iGEiyqjLmqCLlPpu2oN415jK8wX1qoTq7qn6EYiU7qQgbNHglww014PT4O/3G5eo/3kbJu/M/IxxTyGw==
-  dependencies:
-    create-react-class "^15.5.2"
-    object-assign "^3.0.0"
-    prop-types "^15.5.7"
-    react-onclickoutside "^6.5.0"
-
 react-dnd-html5-backend@^10.0.2:
   version "10.0.2"
   resolved "https://registry.yarnpkg.com/react-dnd-html5-backend/-/react-dnd-html5-backend-10.0.2.tgz#15cb9d2b923f43576a136df854e288cb5969784c"
@@ -14840,11 +14798,6 @@ react-moment-proptypes@^1.6.0, react-moment-proptypes@^1.7.0:
   dependencies:
     moment ">=1.6.0"
 
-react-onclickoutside@^6.5.0:
-  version "6.9.0"
-  resolved "https://registry.yarnpkg.com/react-onclickoutside/-/react-onclickoutside-6.9.0.tgz#a54bc317ae8cf6131a5d78acea55a11067f37a1f"
-  integrity sha512-8ltIY3bC7oGhj2nPAvWOGi+xGFybPNhJM0V1H8hY/whNcXgmDeaeoCMPPd8VatrpTsUWjb/vGzrmu6SrXVty3A==
-
 react-outside-click-handler@^1.2.4:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz#3831d541ac059deecd38ec5423f81e80ad60e115"
@@ -15585,11 +15538,6 @@ requires-port@^1.0.0:
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
   integrity sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=
 
-reselect@^3.0.1:
-  version "3.0.1"
-  resolved "https://registry.yarnpkg.com/reselect/-/reselect-3.0.1.tgz#efdaa98ea7451324d092b2b2163a6a1d7a9a2147"
-  integrity sha1-79qpjqdFEyTQkrKyFjpqHXqaIUc=
-
 reselect@^4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/reselect/-/reselect-4.0.0.tgz#f2529830e5d3d0e021408b246a206ef4ea4437f7"