Fix lint.

src/form/components/ForisForm.js

@@ -5,16 +5,16 @@
  * See /LICENSE for more information.
  */
 
-import React, {useEffect, useState} from 'react';
-import PropTypes from 'prop-types';
-import {Prompt} from 'react-router';
+import React, { useEffect, useState } from "react";
+import PropTypes from "prop-types";
 
-import {Spinner} from 'bootstrap/Spinner';
-import {useAPIPost} from 'api/hooks';
+import { Spinner } from "bootstrap/Spinner";
+import { useAPIPost } from "api/hooks";
 
-import {useForisModule, useForm} from '../hooks';
-import {STATES as SUBMIT_BUTTON_STATES, SubmitButton} from './SubmitButton';
-import {FailAlert, SuccessAlert} from './alerts';
+import { Prompt } from "react-router";
+import { useForisModule, useForm } from "../hooks";
+import { STATES as SUBMIT_BUTTON_STATES, SubmitButton } from "./SubmitButton";
+import { FailAlert, SuccessAlert } from "./alerts";
 
 ForisForm.propTypes = {
     /** WebSocket object see `scr/common/WebSockets.js`. */
@@ -27,7 +27,7 @@ ForisForm.propTypes = {
          *  If it's not passed then WebSockets aren't used
          * */
         wsModule: PropTypes.string,
-        /**`foris-controller` action name to be used via WebSockets.
+        /** `foris-controller` action name to be used via WebSockets.
          *  If it's not passed then `update_settings` is used. see `src/common/WebSocketHooks.js`
          * */
         wsAction: PropTypes.string,
@@ -45,42 +45,41 @@ ForisForm.propTypes = {
     /** reForis form components. */
     children: PropTypes.node.isRequired,
     /** Optional override of form submit callback */
-    onSubmitOverridden: PropTypes.func
+    onSubmitOverridden: PropTypes.func,
 };
 
 ForisForm.defaultProps = {
-    prepData: data => data,
-    prepDataToSubmit: data => data,
+    prepData: (data) => data,
+    prepDataToSubmit: (data) => data,
     postCallback: () => undefined,
     validator: () => undefined,
-    disabled: false
+    disabled: false,
 };
 
 /** Serves as HOC for all foris forms components. */
-export function ForisForm({
-                              ws,
-                              forisConfig,
-                              prepData,
-                              prepDataToSubmit,
-                              postCallback,
-                              validator,
-                              disabled,
-                              onSubmitOverridden,
-                              children
-                          }) {
+export default function ForisForm({
+    ws,
+    forisConfig,
+    prepData,
+    prepDataToSubmit,
+    postCallback,
+    validator,
+    disabled,
+    onSubmitOverridden,
+    children,
+}) {
     const [formState, onFormChangeHandler, resetFormData] = useForm(validator, prepData);
 
     const [forisModuleState] = useForisModule(ws, forisConfig);
     useEffect(() => {
         if (forisModuleState.data) {
-            resetFormData(forisModuleState.data)
+            resetFormData(forisModuleState.data);
         }
     }, [forisModuleState.data, resetFormData, prepData]);
 
     const [postState, post] = useAPIPost(forisConfig.endpoint);
     useEffect(() => {
-        if (postState.isSuccess)
-            postCallback();
+        if (postState.isSuccess) postCallback();
     }, [postCallback, postState.isSuccess]);
 
 
@@ -93,56 +92,57 @@ export function ForisForm({
     }
 
     function getSubmitButtonState() {
-        if (postState.isSending)
-            return SUBMIT_BUTTON_STATES.SAVING;
-        else if (forisModuleState.isLoading)
-            return SUBMIT_BUTTON_STATES.LOAD;
+        if (postState.isSending) return SUBMIT_BUTTON_STATES.SAVING;
+        if (forisModuleState.isLoading) return SUBMIT_BUTTON_STATES.LOAD;
         return SUBMIT_BUTTON_STATES.READY;
     }
 
     const [alertIsDismissed, setAlertIsDismissed] = useState(false);
 
-    if (!formState.data)
-        return <Spinner className='row justify-content-center'/>;
+    if (!formState.data) return <Spinner className="row justify-content-center"/>;
 
     const formIsDisabled = disabled || forisModuleState.isLoading || postState.isSending;
     const submitButtonIsDisabled = disabled || !!formState.errors;
 
-    const childrenWithFormProps =
-        React.Children.map(children, child =>
-            React.cloneElement(child, {
-                formData: formState.data,
-                formErrors: formState.errors,
-                setFormValue: onFormChangeHandler,
-                disabled: formIsDisabled,
-            })
-        );
+    const childrenWithFormProps = React.Children.map(
+        children,
+        (child) => React.cloneElement(child, {
+            formData: formState.data,
+            formErrors: formState.errors,
+            setFormValue: onFormChangeHandler,
+            disabled: formIsDisabled,
+        }),
+    );
 
-    const onSubmit = onSubmitOverridden ?
-        onSubmitOverridden(formState.data, onFormChangeHandler, onSubmitHandler) : onSubmitHandler;
+    const onSubmit = onSubmitOverridden
+        ? onSubmitOverridden(formState.data, onFormChangeHandler, onSubmitHandler)
+        : onSubmitHandler;
 
     function getMessageOnLeavingPage() {
-        if (JSON.stringify(formState.data) === JSON.stringify(formState.initialData))
-            return true;
-        return _('Changes you made may not be saved. Are you sure you want to leave?')
+        if (JSON.stringify(formState.data) === JSON.stringify(formState.initialData)) return true;
+        return _("Changes you made may not be saved. Are you sure you want to leave?");
     }
 
-    return <>
-        <Prompt message={getMessageOnLeavingPage}/>
-        {!alertIsDismissed ?
-            postState.isSuccess ?
-                <SuccessAlert onDismiss={() => setAlertIsDismissed(true)}/>
-                : postState.isError ?
-                <FailAlert onDismiss={() => setAlertIsDismissed(true)}/>
-                : null
-            : null
+    let alert = null;
+    if (!alertIsDismissed) {
+        if (postState.isSuccess) {
+            alert = <SuccessAlert onDismiss={() => setAlertIsDismissed(true)}/>;
+        } else if (postState.isError) {
+            alert = <FailAlert onDismiss={() => setAlertIsDismissed(true)}/>;
         }
-        <form onSubmit={onSubmit}>
-            {childrenWithFormProps}
-            <SubmitButton
-                state={getSubmitButtonState()}
-                disabled={submitButtonIsDisabled}
-            />
-        </form>
-    </>
+    }
+
+    return (
+        <>
+            <Prompt message={getMessageOnLeavingPage}/>
+            {alert}
+            <form onSubmit={onSubmit}>
+                {childrenWithFormProps}
+                <SubmitButton
+                    state={getSubmitButtonState()}
+                    disabled={submitButtonIsDisabled}
+                />
+            </form>
+        </>
+    );
 }

src/form/components/SubmitButton.js

@@ -8,7 +8,7 @@
 import React from "react";
 import PropTypes from "prop-types";
 
-import { Button } from "bootstrap/Button";
+import Button from "bootstrap/Button";
 
 export const STATES = {
     READY: 1,

src/form/components/alerts.js

@@ -5,38 +5,42 @@
  * See /LICENSE for more information.
  */
 
-import React from 'react';
-import PropTypes from 'prop-types';
+import React from "react";
+import PropTypes from "prop-types";
 
-import {Alert} from 'bootstrap/Alert';
-import {Portal} from 'utils/Portal';
+import Alert from "bootstrap/Alert";
+import Portal from "utils/Portal";
 
 SuccessAlert.propTypes = {
     onDismiss: PropTypes.func.isRequired,
 };
 
-const ALERT_CONTAINER_ID = 'alert_container';
+const ALERT_CONTAINER_ID = "alert-container";
 
-export function SuccessAlert({onDismiss}) {
-    return <Portal containerId={ALERT_CONTAINER_ID}>
-        <Alert
-            type='success'
-            message={_('Settings were successfully saved.')}
-            onDismiss={onDismiss}
-        />
-    </Portal>;
+export function SuccessAlert({ onDismiss }) {
+    return (
+        <Portal containerId={ALERT_CONTAINER_ID}>
+            <Alert
+                type="success"
+                message={_("Settings were successfully saved.")}
+                onDismiss={onDismiss}
+            />
+        </Portal>
+    );
 }
 
 FailAlert.propTypes = {
     onDismiss: PropTypes.func.isRequired,
 };
 
-export function FailAlert({onDismiss}) {
-    return <Portal containerId={ALERT_CONTAINER_ID}>
-        <Alert
-            type='danger'
-            message={_('Settings update was failed.')}
-            onDismiss={onDismiss}
-        />
-    </Portal>
+export function FailAlert({ onDismiss }) {
+    return (
+        <Portal containerId={ALERT_CONTAINER_ID}>
+            <Alert
+                type="danger"
+                message={_("Settings update was failed.")}
+                onDismiss={onDismiss}
+            />
+        </Portal>
+    );
 }