Merge pull request #1950 from SpareBank1/develop_remove-default-props

Develop remove default props
SpareBank1 · Apr 29, 2024 · 40dffbc · 40dffbc
2 parents 292bd10 + 9dced76
commit 40dffbc
Show file tree

Hide file tree

Showing 62 changed files with 228 additions and 441 deletions.
diff --git a/component-overview/webapp/components/HamburgerButton.jsx b/component-overview/webapp/components/HamburgerButton.jsx
@@ -2,7 +2,7 @@ import React from 'react';
 import { bool, func } from 'prop-types';
 import classNames from 'classnames';
 
-const HamburgerButton = ({ isOpen, onToggle }) => {
+const HamburgerButton = ({ isOpen = false, onToggle }) => {
     const cns = classNames({
         'sb1ex-hamburger-button': true,
         'sb1ex-hamburger-button--expanded': isOpen,
@@ -28,8 +28,4 @@ HamburgerButton.propTypes = {
     onToggle: func.isRequired,
 };
 
-HamburgerButton.defaultProps = {
-    isOpen: false,
-};
-
 export default HamburgerButton;
diff --git a/.../ffe-account-selector-react/src/components/account-selector-multi/AccountSelectorMulti.js b/.../ffe-account-selector-react/src/components/account-selector-multi/AccountSelectorMulti.js
@@ -55,19 +55,25 @@ class AccountSelectorMulti extends React.Component {
     }
 
     onSuggestionSelect(suggestion) {
-        const { onAccountSelected, selectedAccounts, accounts } = this.props;
+        const {
+            onAccountSelected,
+            selectedAccounts = [],
+            accounts,
+        } = this.props;
         if (suggestion) {
             if (suggestion.id === allAccountsElement.id) {
                 const allSelected = selectedAccounts.length === accounts.length;
-                this.props.onSelectAll(!allSelected);
+                if (this.props.onSelectAll) {
+                    this.props.onSelectAll(!allSelected);
+                }
                 return;
             }
             onAccountSelected(suggestion);
         }
     }
 
     renderSuggestion(account) {
-        const { locale, selectedAccounts, accounts } = this.props;
+        const { locale, selectedAccounts = [], accounts } = this.props;
         const isSelected = selectedAccounts.filter(
             a => a.accountNumber === account.accountNumber,
         );
@@ -102,7 +108,7 @@ class AccountSelectorMulti extends React.Component {
     renderSuggestionDetails(listHeight) {
         if (this.baseRef) {
             let statusText;
-            const { selectedAccounts, isLoading } = this.props;
+            const { selectedAccounts = [], isLoading = false } = this.props;
             if (selectedAccounts.length === 0) {
                 statusText = txt[this.props.locale].NO_ACCOUNTS_SELECTED;
             } else if (selectedAccounts.length === 1) {
@@ -189,13 +195,6 @@ class AccountSelectorMulti extends React.Component {
     }
 }
 
-AccountSelectorMulti.defaultProps = {
-    onSelectAll: () => {},
-    selectedAccounts: [],
-    showSelectAllOption: false,
-    isLoading: false,
-};
-
 AccountSelectorMulti.propTypes = {
     /**
      * Array of objects:

diff --git a/packages/ffe-account-selector-react/src/components/base-selector/BaseSelector.js b/packages/ffe-account-selector-react/src/components/base-selector/BaseSelector.js
@@ -21,9 +21,13 @@ class BaseSelector extends Component {
     }
 
     _onSuggestionListChange() {
-        setTimeout(() => {
-            this.props.onSuggestionListChange(this.getSuggestionListHeight());
-        });
+        if (this.props.onSuggestionListChange) {
+            setTimeout(() => {
+                this.props.onSuggestionListChange(
+                    this.getSuggestionListHeight(),
+                );
+            });
+        }
     }
 
     getSuggestionListHeight() {
@@ -49,15 +53,17 @@ class BaseSelector extends Component {
             this.setState(
                 { showSuggestions: true, highlightedSuggestionIndex: -1 },
                 () => {
-                    this.props.onChange(val);
+                    if (this.props.onChange) {
+                        this.props.onChange(val);
+                    }
                     this._onSuggestionListChange();
                 },
             );
         }
     }
 
     onFocus() {
-        const { shouldShowSuggestionsOnFocus, onFocus } = this.props;
+        const { shouldShowSuggestionsOnFocus = true, onFocus } = this.props;
         this.showOrHideSuggestions(shouldShowSuggestionsOnFocus, onFocus);
     }
 
@@ -192,16 +198,16 @@ class BaseSelector extends Component {
     render() {
         const {
             value,
-            placeholder,
+            placeholder = '',
             suggestionsHeightMax,
-            ariaInvalid,
+            ariaInvalid = false,
             id,
             name,
             suggestions,
             onSuggestionSelect,
             readOnly,
             locale,
-            highCapacity,
+            highCapacity = false,
         } = this.props;
         const {
             showSuggestions,
@@ -287,17 +293,4 @@ BaseSelector.propTypes = {
     highCapacity: bool,
 };
 
-BaseSelector.defaultProps = {
-    onChange: Function.prototype,
-    onBlur: Function.prototype,
-    onClick: Function.prototype,
-    onFocus: Function.prototype,
-    onReset: Function.prototype,
-    onSuggestionListChange: Function.prototype,
-    ariaInvalid: false,
-    placeholder: '',
-    shouldShowSuggestionsOnFocus: true,
-    highCapacity: false,
-};
-
 export default BaseSelector;
diff --git a/...account-selector-react/src/subcomponents/account-selector-multi/AccountSuggestionMulti.js b/...account-selector-react/src/subcomponents/account-selector-multi/AccountSuggestionMulti.js
@@ -5,7 +5,7 @@ import { Checkbox } from '@sb1/ffe-form-react';
 import { accountFormatter, balanceWithCurrency } from '../../util/format';
 import { Account, Locale } from '../../util/types';
 
-function AccountSuggestionMulti({ account, locale, selected }) {
+function AccountSuggestionMulti({ account, locale, selected = false }) {
     const { accountNumber, balance, name, currencyCode } = account;
     const hasBalance = balance !== null;
     return (
@@ -42,8 +42,4 @@ AccountSuggestionMulti.propTypes = {
     selected: bool.isRequired,
 };
 
-AccountSuggestionMulti.defaultProps = {
-    selected: false,
-};
-
 export default AccountSuggestionMulti;
diff --git a/packages/ffe-account-selector-react/src/subcomponents/input-field/InputField.js b/packages/ffe-account-selector-react/src/subcomponents/input-field/InputField.js
@@ -18,17 +18,17 @@ const InputField = props => {
         id,
         placeholder,
         isSuggestionsShowing,
-        ariaInvalid,
+        ariaInvalid = false,
         onClick,
-        inputFieldRef,
+        inputFieldRef = () => {},
         highlightedIndex,
         suggestionListId,
         name,
-        readOnly,
+        readOnly = false,
         locale,
         value,
-        onBlur,
-        onFocus,
+        onBlur = () => {},
+        onFocus = () => {},
         onChange,
         onReset,
     } = props;
@@ -143,12 +143,4 @@ InputField.propTypes = {
     locale: Locale.isRequired,
 };
 
-InputField.defaultProps = {
-    onBlur: () => {},
-    onFocus: () => {},
-    inputFieldRef: () => {},
-    ariaInvalid: false,
-    readOnly: false,
-};
-
 export default InputField;
diff --git a/...s/ffe-account-selector-react/src/subcomponents/suggestion-high-capacity/SuggestionList.js b/...s/ffe-account-selector-react/src/subcomponents/suggestion-high-capacity/SuggestionList.js
@@ -49,11 +49,11 @@ export default function SuggestionList(props) {
         suggestions,
         highlightedIndex,
         renderSuggestion,
-        renderNoMatches,
+        renderNoMatches = () => {},
         id,
-        isLoading,
-        height,
-        itemSize,
+        isLoading = false,
+        height = 300,
+        itemSize = 55,
     } = props;
     return isLoading ? (
         <Spinner center={true} large={true} />
@@ -108,10 +108,3 @@ SuggestionList.propTypes = {
     height: number,
     itemSize: number,
 };
-
-SuggestionList.defaultProps = {
-    renderNoMatches: () => {},
-    isLoading: false,
-    height: 300,
-    itemSize: 55,
-};
diff --git a/...ount-selector-react/src/subcomponents/suggestion-high-capacity/SuggestionListContainer.js b/...ount-selector-react/src/subcomponents/suggestion-high-capacity/SuggestionListContainer.js
@@ -51,7 +51,7 @@ class SuggestionListContainer extends React.Component {
     };
 
     render() {
-        const { heightMax, autoHeight } = this.props;
+        const { heightMax = 300, autoHeight = true } = this.props;
         return (
             <div
                 className="ffe-base-selector__suggestion-container"
@@ -86,9 +86,4 @@ SuggestionListContainer.propTypes = {
     renderSuggestion: func.isRequired,
 };
 
-SuggestionListContainer.defaultProps = {
-    heightMax: 300,
-    autoHeight: true,
-};
-
 export default SuggestionListContainer;
diff --git a/packages/ffe-account-selector-react/src/subcomponents/suggestion/SuggestionList.js b/packages/ffe-account-selector-react/src/subcomponents/suggestion/SuggestionList.js
@@ -9,9 +9,9 @@ export default function SuggestionList(props) {
         suggestions,
         highlightedIndex,
         renderSuggestion,
-        renderNoMatches,
+        renderNoMatches = () => {},
         id,
-        isLoading,
+        isLoading = false,
     } = props;
     return isLoading ? (
         <Spinner center={true} large={true} />
@@ -47,8 +47,3 @@ SuggestionList.propTypes = {
     id: string.isRequired,
     isLoading: bool,
 };
-
-SuggestionList.defaultProps = {
-    renderNoMatches: () => {},
-    isLoading: false,
-};
diff --git a/packages/ffe-account-selector-react/src/subcomponents/suggestion/SuggestionListContainer.js b/packages/ffe-account-selector-react/src/subcomponents/suggestion/SuggestionListContainer.js
@@ -43,7 +43,7 @@ class SuggestionListContainer extends React.Component {
     }
 
     render() {
-        const { heightMax, autoHeight } = this.props;
+        const { heightMax = 300, autoHeight = true } = this.props;
         return (
             <div
                 className="ffe-base-selector__suggestion-container"
@@ -75,9 +75,4 @@ SuggestionListContainer.propTypes = {
     renderSuggestion: func.isRequired,
 };
 
-SuggestionListContainer.defaultProps = {
-    heightMax: 300,
-    autoHeight: true,
-};
-
 export default SuggestionListContainer;
diff --git a/packages/ffe-buttons-react/src/BaseButton.js b/packages/ffe-buttons-react/src/BaseButton.js
@@ -17,11 +17,11 @@ import classNames from 'classnames';
  */
 const BaseButton = props => {
     const {
-        ariaLoadingMessage,
+        ariaLoadingMessage = 'Vennligst vent',
         buttonType,
         children,
         className,
-        element: Element,
+        element: Element = 'button',
         innerRef,
         isLoading,
         leftIcon,
@@ -106,9 +106,4 @@ BaseButton.propTypes = {
     onClick: func,
 };
 
-BaseButton.defaultProps = {
-    ariaLoadingMessage: 'Vennligst vent',
-    element: 'button',
-};
-
 export default BaseButton;
diff --git a/packages/ffe-buttons-react/src/ExpandButton.js b/packages/ffe-buttons-react/src/ExpandButton.js
@@ -16,8 +16,8 @@ const ExpandButton = props => {
     const {
         children,
         className,
-        closeLabel,
-        element: Element,
+        closeLabel = 'Lukk',
+        element: Element = 'button',
         innerRef,
         isExpanded,
         ...rest
@@ -67,9 +67,4 @@ ExpandButton.propTypes = {
     onClick: func.isRequired,
 };
 
-ExpandButton.defaultProps = {
-    closeLabel: 'Lukk',
-    element: 'button',
-};
-
 export default ExpandButton;
diff --git a/packages/ffe-buttons-react/src/ExpandButton.spec.js b/packages/ffe-buttons-react/src/ExpandButton.spec.js
@@ -42,9 +42,7 @@ describe('<ExpandButton />', () => {
         });
         it('uses the default aria-label property on the button', () => {
             const wrapper = getWrapper({ isExpanded: true });
-            expect(wrapper.prop('aria-label')).toBe(
-                ExpandButton.defaultProps.closeLabel,
-            );
+            expect(wrapper.prop('aria-label')).toBe('Lukk');
         });
     });
 });
diff --git a/packages/ffe-buttons-react/src/InlineBaseButton.js b/packages/ffe-buttons-react/src/InlineBaseButton.js
@@ -20,7 +20,7 @@ const InlineBaseButton = props => {
         buttonType,
         children,
         className,
-        element: Element,
+        element: Element = 'button',
         innerRef,
         leftIcon,
         rightIcon,
@@ -74,8 +74,4 @@ InlineBaseButton.propTypes = {
     rightIcon: node,
 };
 
-InlineBaseButton.defaultProps = {
-    element: 'button',
-};
-
 export default InlineBaseButton;
diff --git a/packages/ffe-cards-react/src/CardBase.js b/packages/ffe-cards-react/src/CardBase.js
@@ -3,7 +3,7 @@ import classNames from 'classnames';
 import { oneOfType, node, func, string, elementType } from 'prop-types';
 
 const CardBase = React.forwardRef((props, ref) => {
-    const { className, element: Element, children, ...rest } = props;
+    const { className, element: Element = 'a', children, ...rest } = props;
     return (
         <Element
             className={classNames('ffe-card-base', className)}
@@ -15,10 +15,6 @@ const CardBase = React.forwardRef((props, ref) => {
     );
 });
 
-CardBase.defaultProps = {
-    element: 'a',
-};
-
 CardBase.propTypes = {
     className: string,
     children: node,

diff --git a/packages/ffe-cards-react/src/IconCard/IconCard.js b/packages/ffe-cards-react/src/IconCard/IconCard.js
@@ -9,7 +9,7 @@ const IconCard = props => {
         className,
         icon,
         condensed,
-        element: Element,
+        element: Element = 'a',
         children,
         ...rest
     } = props;
@@ -39,10 +39,6 @@ const IconCard = props => {
     );
 };
 
-IconCard.defaultProps = {
-    element: 'a',
-};
-
 IconCard.propTypes = {
     className: string,
     /** Element of icon */