Cleaned some warnings when rendering (#7358)

* Cleaned some polluting messages when rendering warning and unnecesary messages

* removed unnecesary property

* Migrated more defaultProps to JS default value way

* updated some snapshots

* updated more snapshots

app/react/DocumentForm/components/FormGroup.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 
 const FormGroup = props => {
-  let className = `${props.className} form-group`;
+  let className = `${props.className || ''} form-group`;
   if ((!props.pristine || props.submitFailed) && props.valid === false) {
     className += ' has-error';
   }
@@ -12,10 +12,6 @@ const FormGroup = props => {
 
 const childrenType = PropTypes.oneOfType([PropTypes.object, PropTypes.array]);
 
-FormGroup.defaultProps = {
-  className: '',
-};
-
 FormGroup.propTypes = {
   className: PropTypes.string,
   pristine: PropTypes.bool,

app/react/Documents/components/SnippetList.js

@@ -9,7 +9,7 @@ import SafeHTML from 'app/utils/SafeHTML';
 import getFieldLabel from 'app/Templates/utils/getFieldLabel';
 import Immutable from 'immutable';
 
-const MetadataFieldSnippets = ({ fieldSnippets, documentViewUrl, template, searchTerm }) => (
+const MetadataFieldSnippets = ({ fieldSnippets, documentViewUrl, template, searchTerm = '' }) => (
   <>
     <li className="snippet-list-item-header metadata-snippet-header">
       <I18NLink to={`${documentViewUrl}?searchTerm=${searchTerm}`}>
@@ -26,10 +26,6 @@ const MetadataFieldSnippets = ({ fieldSnippets, documentViewUrl, template, searc
   </>
 );
 
-MetadataFieldSnippets.defaultProps = {
-  searchTerm: '',
-};
-
 MetadataFieldSnippets.propTypes = {
   fieldSnippets: PropTypes.instanceOf(Immutable.Map).isRequired,
   documentViewUrl: PropTypes.string.isRequired,
@@ -39,10 +35,6 @@ MetadataFieldSnippets.propTypes = {
   }),
 };
 
-MetadataFieldSnippets.defaultProps = {
-  template: undefined,
-};
-
 const DocumentContentSnippets = ({
   selectSnippet,
   documentSnippets,
@@ -132,10 +124,6 @@ SnippetList.propTypes = {
   }),
 };
 
-SnippetList.defaultProps = {
-  template: undefined,
-};
-
 const mapStateToProps = (state, ownProps) => ({
   template: state.templates.find(tmpl => tmpl.get('_id') === ownProps.doc.get('template')),
   selectedSnippet: state.documentViewer.uiState.get('snippet'),

app/react/Documents/components/TocForm.js

@@ -18,7 +18,7 @@ export class TocForm extends Component {
     );
     return (
       <button type="button" onClick={onClick} className={`toc-indent-${direction} btn btn-default`}>
-        <Icon icon={direction === 'more' ? 'arrow-right' : 'arrow-left'} directionAware />
+        <Icon icon={direction === 'more' ? 'arrow-right' : 'arrow-left'} />
       </button>
     );
   }

app/react/Layout/BackButton.js

@@ -6,7 +6,7 @@ import { I18NLink, t } from 'app/I18N';
 
 const BackButton = ({ to, className }) => (
   <I18NLink to={to} className={`btn btn-default ${className}`}>
-    <Icon icon="arrow-left" directionAware />
+    <Icon icon="arrow-left" />
     <span className="btn-label">{t('System', 'Back')}</span>
   </I18NLink>
 );

app/react/Layout/CurrentLocationLink.js

@@ -7,7 +7,7 @@ const validProps = props => {
   return valid;
 };
 
-const CurrentLocationLink = ({ children, queryParams, ...otherProps }) => {
+const CurrentLocationLink = ({ children, queryParams = {}, ...otherProps }) => {
   const location = useLocation();
   const query = new URLSearchParams(location.search);
   Object.keys(queryParams).forEach(key => {
@@ -27,11 +27,6 @@ const CurrentLocationLink = ({ children, queryParams, ...otherProps }) => {
   );
 };
 
-CurrentLocationLink.defaultProps = {
-  children: '',
-  queryParams: {},
-};
-
 CurrentLocationLink.propTypes = {
   children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),
   queryParams: PropTypes.object, // eslint-disable-line react/forbid-prop-types

app/react/Layout/Lists.js

@@ -60,7 +60,7 @@ const ItemLabel = ({ children, status }) => {
 ItemFooter.Label = ItemLabel;
 ItemFooter.ProgressBar = ProgressBar;
 
-const RowList = ({ children, zoomLevel }) => (
+const RowList = ({ children, zoomLevel = 0 }) => (
   <div className={`item-group item-group-zoom-${zoomLevel}`}>{children}</div>
 );
 
@@ -99,11 +99,6 @@ const childrenType = PropTypes.oneOfType([PropTypes.object, PropTypes.array, Pro
 
 List.propTypes = { children: childrenType };
 
-RowList.defaultProps = {
-  children: '',
-  zoomLevel: 0,
-};
-
 RowList.propTypes = {
   children: childrenType,
   zoomLevel: PropTypes.number,

app/react/Layout/Tip.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import { Icon } from 'UI';
 
-const Tip = ({ children, icon, position }) => {
+const Tip = ({ children, icon = 'question-circle', position = '' }) => {
   const className = position ? `property-description-${position}` : 'property-description';
   return (
     <span className="property-help">
@@ -12,11 +12,6 @@ const Tip = ({ children, icon, position }) => {
   );
 };
 
-Tip.defaultProps = {
-  icon: 'question-circle',
-  position: '',
-};
-
 Tip.propTypes = {
   children: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).isRequired,
   icon: PropTypes.string,

app/react/Layout/specs/__snapshots__/BackButton.spec.js.snap

@@ -6,7 +6,6 @@ exports[`Icon should render the back button to the provided url 1`] = `
   to="/some/url"
 >
   <Connect(Icon)
-    directionAware={true}
     icon="arrow-left"
   />
   <span

app/react/Library/components/DateFilter.js

@@ -2,7 +2,7 @@ import { DateRange } from 'app/ReactReduxForms';
 import PropTypes from 'prop-types';
 import React from 'react';
 
-const DateFilter = ({ onChange, model, label, format }) => (
+const DateFilter = ({ onChange = () => {}, model, label = '', format = '' }) => (
   <ul className="search__filter is-active">
     <li>
       <label>{label}</label>
@@ -13,12 +13,6 @@ const DateFilter = ({ onChange, model, label, format }) => (
   </ul>
 );
 
-DateFilter.defaultProps = {
-  onChange: () => {},
-  label: '',
-  format: '',
-};
-
 DateFilter.propTypes = {
   model: PropTypes.string.isRequired,
   format: PropTypes.string,

app/react/Library/components/FiltersFromProperties.js

@@ -92,12 +92,13 @@ const getPropertyType = (property, templates) => {
 };
 
 const FiltersFromProperties = ({
-  onChange,
+  onChange = () => {},
   properties,
-  translationContext,
+  translationContext = '',
   modelPrefix = '',
   storeKey,
   templates,
+  dateFormat = '',
   ...props
 }) => {
   const location = useLocation();
@@ -152,7 +153,7 @@ const FiltersFromProperties = ({
           case 'multidate':
           case 'multidaterange':
           case 'daterange':
-            filter = <DateFilter {...commonProps} format={props.dateFormat} />;
+            filter = <DateFilter {...commonProps} format={dateFormat} />;
             break;
 
           default:
@@ -165,13 +166,6 @@ const FiltersFromProperties = ({
   );
 };
 
-FiltersFromProperties.defaultProps = {
-  onChange: () => {},
-  dateFormat: '',
-  modelPrefix: '',
-  translationContext: '',
-};
-
 FiltersFromProperties.propTypes = {
   templates: PropTypes.instanceOf(Array).isRequired,
   onChange: PropTypes.func,

app/react/Library/components/SelectFilter.js

@@ -4,16 +4,16 @@ import React from 'react';
 import { LookupMultiSelect, Switcher } from 'app/ReactReduxForms';
 
 const SelectFilter = ({
-  onChange,
+  onChange = () => {},
   model,
-  label,
-  options,
-  prefix,
-  showBoolSwitch,
-  sort,
-  lookup,
-  totalPossibleOptions,
-  allowSelectGroup,
+  label = '',
+  options = [],
+  prefix = '',
+  showBoolSwitch = false,
+  sort = false,
+  lookup = null,
+  totalPossibleOptions = 0,
+  allowSelectGroup = false,
 }) => (
   <ul className="search__filter is-active">
     <li>
@@ -35,18 +35,6 @@ const SelectFilter = ({
   </ul>
 );
 
-SelectFilter.defaultProps = {
-  onChange: () => {},
-  label: '',
-  prefix: '',
-  showBoolSwitch: false,
-  sort: false,
-  options: [],
-  lookup: null,
-  totalPossibleOptions: 0,
-  allowSelectGroup: false,
-};
-
 SelectFilter.propTypes = {
   model: PropTypes.string.isRequired,
   onChange: PropTypes.func,

app/react/Library/components/ViewDocButton.js

@@ -56,7 +56,7 @@ export class ViewDocButton extends Component {
         className="btn btn-default btn-xs view-doc"
         onClick={this.onClick}
       >
-        <Icon icon={icon} directionAware /> <Translate>View</Translate>
+        <Icon icon={icon} /> <Translate>View</Translate>
       </I18NLink>
     );
   }

app/react/Library/components/specs/__snapshots__/ViewDocButton.spec.js.snap

@@ -7,7 +7,6 @@ exports[`ViewDocButton should render a view button poiting to the doc url with t
   to="/entity/123"
 >
   <Connect(Icon)
-    directionAware={true}
     icon="angle-right"
   />
    
@@ -24,7 +23,6 @@ exports[`ViewDocButton should render a view button poiting to the doc url with t
   to="/entity/123?searchTerm=something"
 >
   <Connect(Icon)
-    directionAware={true}
     icon="angle-right"
   />
    
@@ -41,7 +39,6 @@ exports[`ViewDocButton when targetReference is provided should render view butto
   to="/entity/123?ref=ref1"
 >
   <Connect(Icon)
-    directionAware={true}
     icon="angle-right"
   />
    
@@ -58,7 +55,6 @@ exports[`ViewDocButton when targetReference is provided should render view butto
   to="/entity/123?searchTerm=something&ref=ref1"
 >
   <Connect(Icon)
-    directionAware={true}
     icon="angle-right"
   />
    

app/react/Metadata/components/Metadata.js

@@ -215,12 +215,12 @@ const flattenInherittedRelationships = metadata =>
 
 const Metadata = ({
   metadata,
-  compact,
-  showSubset,
-  highlight,
-  groupGeolocations,
+  compact = false,
+  showSubset = undefined,
+  highlight = [],
+  groupGeolocations = false,
   templateId,
-  useV2Player,
+  useV2Player = false,
   attachments,
 }) => {
   const filteredMetadata = metadata.filter(filterProps(showSubset));
@@ -263,14 +263,6 @@ const Metadata = ({
   });
 };
 
-Metadata.defaultProps = {
-  compact: false,
-  showSubset: undefined,
-  highlight: [],
-  groupGeolocations: false,
-  useV2Player: false,
-};
-
 Metadata.propTypes = {
   metadata: PropTypes.arrayOf(
     PropTypes.shape({

app/react/Metadata/containers/FormatMetadata.js

@@ -8,11 +8,12 @@ import Metadata from '../components/Metadata';
 const removeUneededProps = ({ templates, thesauris, settings, excludePreview, ...rest }) => rest;
 
 const BaseFormatMetadata = ({
-  additionalMetadata,
-  sortedProperty,
+  additionalMetadata = [],
+  sortedProperty = '',
   entity,
-  relationships,
-  useV2Player,
+  relationships = Immutable.fromJS([]),
+  useV2Player = false,
+  excludePreview = false,
   ...props
 }) => {
   const { attachments } = entity;
@@ -21,7 +22,7 @@ const BaseFormatMetadata = ({
     <Metadata
       metadata={additionalMetadata.concat(
         metadataSelectors.formatMetadata(props, entity, sortedProperty, relationships, {
-          excludePreview: props.excludePreview,
+          excludePreview,
         })
       )}
       attachments={attachments}
@@ -33,14 +34,6 @@ const BaseFormatMetadata = ({
   );
 };
 
-BaseFormatMetadata.defaultProps = {
-  sortedProperty: '',
-  additionalMetadata: [],
-  relationships: Immutable.fromJS([]),
-  excludePreview: false,
-  useV2Player: false,
-};
-
 BaseFormatMetadata.propTypes = {
   entity: PropTypes.shape({
     metadata: PropTypes.object,

app/react/Metadata/containers/specs/__snapshots__/FormatMetadata.spec.js.snap

@@ -3,8 +3,6 @@
 exports[`FormatMetadata should render Metadata component passing the formatted metadata 1`] = `
 <Metadata
   compact={true}
-  groupGeolocations={false}
-  highlight={Array []}
   metadata={
     Array [
       Object {
@@ -19,8 +17,6 @@ exports[`FormatMetadata should render Metadata component passing the formatted m
 exports[`FormatMetadata should unshift additional metadata if passed 1`] = `
 <Metadata
   compact={false}
-  groupGeolocations={false}
-  highlight={Array []}
   metadata={
     Array [
       Object {