x25 17.7.0 → 17.7.2

package/src/Modal/ConfirmationModal.tsx

@@ -1,120 +0,0 @@
-
-import React, { useState } from "react";
-import { useDispatch } from "react-redux";
-import { notifyError } from "../actions";
-import { words } from "../utility";
-import ModalWindow from "./ModalWindow";
-import { ConfirmationModalProps, FooterProps } from "./types";
-
-
-type ModalFooterProps = FooterProps & {
-  readonly tryToClose: (cb? : any) => any;
-}
-
-const ModalFooter = (props : ModalFooterProps) => {
-    const
-      { message: languageMessage, label } = words,
-
-      dispatch = useDispatch(),
-      {
-        cancelButtonLabel = label.cancel,
-        confirmButtonLabel = label.remove,
-        errMessage = languageMessage.failPerform,
-
-        isResponseValid = (response: any) => ({
-          valid : response === "",
-          error : response,
-        }),
-
-        confirmButtonColor = "danger",
-
-        showError = (msg : any) => {
-          dispatch(notifyError(msg));
-        },
-      } = props,
-
-      [isPerforming, setIsPerforming] = useState(false),
-
-      endPerforming = (cb?: any) => {
-        setIsPerforming(false);
-
-        if (typeof cb === "function") {
-          cb();
-        }
-      },
-
-      handleConfirmation = () => {
-        const { request, onSuccess, tryToClose, onBeforeSuccessClosing } = props;
-
-        setIsPerforming(true);
-
-        request().
-          then((possibleResponse : any) => {
-            const
-              theResponse = possibleResponse.response ? possibleResponse.response : possibleResponse,
-              { body } = theResponse,
-              { valid, error } = isResponseValid(body);
-
-            if (typeof onBeforeSuccessClosing === "function") {
-              onBeforeSuccessClosing(body);
-            }
-
-            if (valid) {
-              tryToClose(() => {
-                if (typeof onSuccess === "function") {
-                  onSuccess(body);
-                }
-              });
-            } else {
-              endPerforming();
-              showError(error);
-            }
-          }).
-          catch((exception : any) => {
-            endPerforming();
-            showError(errMessage);
-            // eslint-disable-next-line no-console
-            console.log("exception", exception);
-          });
-      };
-
-    return (
-      <div className="modal-footer">
-        <button
-          className="btn btn-secondary me-1"
-          disabled={isPerforming}
-          onClick={props.tryToClose}
-          type="button">
-          {cancelButtonLabel}
-        </button>
-        <button
-          autoFocus={props.focusButton}
-          className={`btn ${confirmButtonColor ? `btn-${confirmButtonColor}` : ""}`}
-          disabled={isPerforming}
-          onClick={handleConfirmation}
-          type="button">
-          {
-            isPerforming ? (
-              <span>
-                <i className="fa fa-refresh fa-spin fa-fw" />
-                {` ${words.PleaseWait}`}
-              </span>
-            ) : confirmButtonLabel
-          }
-        </button>
-      </div>
-    );
-  },
-  ConfirmationModal = (props : ConfirmationModalProps) => (
-    <ModalWindow
-      doNoPassTryToCloseToBody
-      {...props}
-      Footer={ModalFooter}
-      title={props.title ? props.title : words.Confirmation}>
-      <div>
-        {props.footerProps.message}
-      </div>
-    </ModalWindow>
-  );
-
-export default ConfirmationModal;

package/src/Modal/ModalWindow.tsx

@@ -1,167 +0,0 @@
-import React, { useEffect, useRef, useState } from "react";
-import { useDispatch } from "react-redux";
-import { hideModal } from "./actions";
-import { ModalWindowProps } from "./types";
-
-const ModalWindow = (props : ModalWindowProps) => {
-  const
-    delay = 150,
-    { size = "", Footer, Header } = props,
-
-    [show, setShow] = useState(false),
-    [waitingToClose, setWaitingToClose] = useState(false),
-
-    [enterTimeout, setEnterTimeout] = useState(0),
-    [exitTimeout, setExitTimeout] = useState(0),
-
-    bodyRef : any = useRef(null),
-    dialogRef : any = useRef(null),
-
-    dispatch = useDispatch(),
-
-    tryToClose = (cbTryToClose? : any) => {
-      const
-        closeModal = () => {
-          if (!props.preventDispatchHideModal) {
-            dispatch(hideModal());
-          }
-
-          if (typeof props.onClose === "function") {
-            props.onClose();
-          }
-
-          if (typeof cbTryToClose === "function") {
-            cbTryToClose();
-          }
-        };
-
-      clearTimeout(enterTimeout);
-      clearTimeout(exitTimeout);
-
-      setWaitingToClose(true);
-      setShow(false);
-
-      const theExit : any = setTimeout(() => {
-        closeModal();
-      }, delay);
-
-      setExitTimeout(theExit);
-    };
-
-  useEffect(() => {
-    const handleClickOutside = (event : MouseEvent) => {
-      const isClickOutsideButNotOnButton = (
-        bodyRef.current && bodyRef.current.contains(event.target) &&
-          !dialogRef.current.contains(event.target)
-      );
-
-      if (isClickOutsideButNotOnButton) {
-        tryToClose();
-      }
-    };
-
-    document.addEventListener("mousedown", handleClickOutside);
-
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
-  }, [bodyRef]);
-
-  useEffect(() => {
-    const keyPressed = (event : KeyboardEvent) => {
-      if (event.key === "Escape" && !props.doNotCloseByEscape) {
-        tryToClose();
-      }
-    };
-
-    if (!props.doNotCloseByEscape) {
-      document.addEventListener("keydown", keyPressed, false);
-    }
-
-    return () => {
-      if (!props.doNotCloseByEscape) {
-        document.removeEventListener("keydown", keyPressed, false);
-      }
-    };
-  }, [!props.doNotCloseByEscape]);
-
-
-  useEffect(() => {
-    if (!show && !waitingToClose) {
-
-      const theEnter : any = setTimeout(() => {
-        setShow(true);
-      }, delay);
-
-      setEnterTimeout(theEnter);
-    }
-
-  }, [show, waitingToClose]);
-
-  useEffect(() => () => {
-    clearTimeout(enterTimeout);
-    clearTimeout(exitTimeout);
-  });
-
-  useEffect(() => {
-    if (props.pleaseClose) {
-      tryToClose();
-    }
-  }, [props.pleaseClose]);
-
-  return (
-    <div
-      className={`modal fade d-block ${show ? "show" : ""}`}
-      ref={bodyRef}
-      style={{
-        background: "rgb(0 0 0 / 45%)",
-      }}>
-      <div className={`modal-dialog modal-${size}`} ref={dialogRef} role="document">
-        <div className="modal-content">
-          {
-            props.customContent ? (
-              React.cloneElement(props.children, { tryToClose })
-            ) : (
-              <>
-                <div className="modal-header">
-                  {
-                    typeof Header === "undefined" ? (
-                      <h5 className="modal-title">
-                        {props.title}
-                      </h5>
-                    ) : (
-                      <Header title={props.title} {...props.headerProps} tryToClose={tryToClose} />
-                    )
-                  }
-                  <button
-                    aria-label="Close"
-                    className="btn btn-link"
-                    data-dismiss="modal"
-                    onClick={tryToClose}
-                    type="button">
-                    <i className="fa fa-times" />
-                  </button>
-                </div>
-                <div className="modal-body">
-                  {
-                    props.doNoPassTryToCloseToBody ? props.children : React.cloneElement(props.children, { tryToClose })
-                  }
-                </div>
-              </>
-            )
-          }
-          {
-            typeof Footer === "undefined" ? null : (
-              <Footer {...props.footerProps} tryToClose={tryToClose} />
-            )
-          }
-        </div>
-      </div>
-    </div>
-  );
-};
-
-
-export default ModalWindow;
-
-

package/src/Modal/Root.tsx

@@ -1,64 +0,0 @@
-import React from "react";
-import { useSelector } from "react-redux";
-import { propsAreEqualCreator } from "../utility/others";
-import getComponent from "./getComponent";
-import { selectors } from "./reducer";
-import { Modals } from "./types";
-
-type RawModalRootProps = {
-  readonly list: Modals;
-}
-
-const   
-  propsAreEqual = propsAreEqualCreator([], ["list"]),
-  RawModalRoot = ({ list } : RawModalRootProps) => {
-    if (list.size === 0) {
-      return null;
-    }
-
-    return  (
-      <>
-        {
-          list.map((current : any, index : number) => {
-            const
-              modalType = current.get("type"),
-              Component = getComponent(modalType),
-              isTheLastOne = index !== list.size - 1;
-      
-            if (typeof Component === "undefined") {
-              return (
-                <div key="no-modal">
-                  {`No MODAL component for the type [${modalType}] in Modal/components.jsx`}
-                </div>
-              );
-            }
-
-            const theProps = (
-              current?.hasIn(["props", "immutableProps"]) ? ({
-                modalProps: current.get("props"), 
-              }) : (
-                current.get("props").toJS()
-              )
-            );
-      
-            return (
-              <Component
-                doNotCloseByEscape={isTheLastOne}
-                key={index}
-                pleaseClose={current.get("pleaseClose")}
-                {...theProps}
-              />
-            );
-          })
-        }
-      </>
-    );
-  },
-  InnerModalRoot = React.memo(RawModalRoot, propsAreEqual),
-  ModalRoot = () => {
-    const list = useSelector(selectors.getModals);
-
-    return <InnerModalRoot list={list} />;
-  };
-
-export default ModalRoot;

package/src/Modal/actions.ts

@@ -1,12 +0,0 @@
-import type { Action } from "src/types";
-
-export const
-  hideModal = (): Action => ({
-    type: "HIDE_MODAL",
-  }),
-  clearModals = (): Action => ({
-    type: "CLEAR_MODALS",
-  }),
-  softHideModal = (): Action => ({
-    type: "SOFT_HIDE_MODAL",
-  });

package/src/Modal/getComponent.tsx

@@ -1,24 +0,0 @@
-/* eslint-disable @typescript-eslint/no-empty-function */
-import React from "react";
-import { ErrorMessage } from "../Messages";
-import ModalWindow from "./ModalWindow";
-import { getModal } from "./util";
-
-const NothingSelected = () => (
-    <ModalWindow onClose={() => {}} title="Not registered">
-      <ErrorMessage message="Please define a modal component in Modal/components.jsx" />
-    </ModalWindow>
-  ),
-
-  /* eslint-disable complexity */
-  getComponent = (type: any): (props : any) => JSX.Element => {
-    const AutoModal = getModal(type);
-
-    if (AutoModal !== null) {
-      return AutoModal;
-    }
-
-    return NothingSelected;
-  };
-
-export default getComponent;

package/src/Modal/index.ts

@@ -1,5 +0,0 @@
-import ConfirmationModal from "./ConfirmationModal";
-import ModalWindow from "./ModalWindow";
-import { injectModals } from "./util";
-
-export { injectModals, ConfirmationModal, ModalWindow };

package/src/Modal/reducer.ts

@@ -1,52 +0,0 @@
-import * as Immutable from "immutable";
-import { getModalsState } from "../config";
-import { Modals } from "./types";
-import type { Action, State } from "src/types";
-
-const initialState = Immutable.List<Immutable.Map<string, any>>(),
-
-  showModal = (state: any, {
-    payload: {
-      modalType,
-      modalProps,
-    },
-  } : { payload : { modalType : any, modalProps : any }}) => state.push(Immutable.Map({
-    type  : modalType,
-    props : Immutable.Map(modalProps),
-  })),
-  hideModal = (state: any) => state.pop(),
-  softHideModal = (state: any) => {
-    const lastPosition = -1;
-
-    return (
-      state.update(lastPosition, (lastMap: Immutable.Map<string, any>) => (
-        lastMap.set("pleaseClose", true)
-      ))
-    );
-  },
-
-  reducer = (state: any = initialState, action: Action) => {
-    switch (action.type) {
-      case "SHOW_MODAL":
-        return showModal(state, action);
-
-      case "HIDE_MODAL":
-        return hideModal(state);
-
-      case "SOFT_HIDE_MODAL":
-        return softHideModal(state);
-
-      case "CLEAR_MODALS":
-        return state.clear();
-
-      default:
-        return state;
-    }
-  },
-
-  getModals = (state: State) => (getModalsState(state) || initialState) as Modals;
-
-export const selectors = {
-  getModals,
-};
-export default reducer;

package/src/Modal/types.ts

@@ -1,47 +0,0 @@
-import * as React from "react";
-
-export type ModalsTypes = Record<string, React.ReactNode>;
-
-export type Modals = Immutable.List<Immutable.Map<string, any>>;
-
-type CommonProps = {
-  pleaseClose?: boolean;
-  isStack?: boolean;
-  isLastOne?: boolean;
-  onClose?: () => any;
-  doNotCloseByEscape?: boolean;
-  preventDispatchHideModal?: boolean;
-  Footer?: any;
-  Header?: any;
-  footerProps?: FooterProps;
-  headerProps?: any;
-  size?: "lg" | "sm" | "xl" | "";
-}
-
-export type ModalWindowProps = CommonProps & {
-  customContent?: boolean;
-  title: string;
-  doNoPassTryToCloseToBody?: boolean;
-  children: JSX.Element;
-};
-
-export type ConfirmationModalProps = CommonProps & {
-  title?: string;
-  children?: JSX.Element;
-  footerProps: FooterProps
-}
-
-export type FooterProps = {
-  readonly confirmButtonColor?:string;
-  readonly cancelButtonLabel?: string;
-  readonly errMessage?: string;
-  readonly isResponseValid?: (response: any) => { valid: boolean; error: string; };
-  readonly confirmButtonLabel?: string;
-  readonly focusButton?: boolean;
-  readonly showError?: (message?: string) => void;
-
-  readonly message: any;
-  readonly request: () => Promise<any>;
-  readonly onSuccess?: (response: any) => void;
-  readonly onBeforeSuccessClosing?: (response: any) => void;
-}

package/src/Modal/util.ts

@@ -1,12 +0,0 @@
-import type { ModalsTypes } from "./types";
-
-let all : { [key: string]: any } = {};
-
-export const
-  injectModals = (newModals: ModalsTypes) => {
-    all = { ...all,
-    // $FlowFixMe
-      ...newModals,
-    };
-  },
-  getModal = (type: string) => all[type];

package/src/Payment/Modal/BankTransfer.tsx

@@ -1,117 +0,0 @@
-
-
-import React, { useState } from "react";
-import { ModalWindow } from "../../Modal";
-import { numberToLocale } from "../../utility";
-import { SIDEWORK_APPLICATION } from "../core/codes";
-import { sideworkCompanyInfo as info } from "../core/util/info";
-import { getDetails } from "../core/util/util";
-import BankTransferFormWrapper from "../Pieces/BankTransferForm/BankTransferFormWrapper";
-
-
-type PaymentBankTransferProps = {
-  readonly application: SIDEWORK_APPLICATION;
-  readonly options: any;
-  readonly info : any;
-};
-
-const 
-  PaymentBankTransfer = ({ application, options }: PaymentBankTransferProps) => {
-    const [done, setDone] = useState(false),
-      details = getDetails(application, options),
-
-      transferIsDone = () => {
-        setDone(true);
-      };
-
-    if (done) {
-      return <BankTransferFormWrapper details={details} />;
-    }
-
-    return (
-      <div className="container">
-        <div className="row">
-          <div className="col-xl">
-            <h4>
-              {"Pasul "}
-              <span className="badge text-bg-primary rounded-circle">1</span>
-            </h4>
-            <div className="text-muted">{"Te rugăm să operezi următorul transfer bancar."}</div>
-            <div className="container mt-3">
-              <div className="row">
-                <div className="col-lg card">
-                  <div className="container card-body">
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{"Către"}</div>
-                      <div className="col-md-8 fw-bold">{info.to}</div>
-                    </div>
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{""}</div>
-                      <div className="col-md-8 small">
-                        {`C.I.F. ${info.cif} și Reg. Com. ${info.regCom}`}
-                      </div>
-                    </div>
-                    <div className="row">
-                      <div className="col-md-4 text-md-right text-muted">{"Din"}</div>
-                      <div className="col-md-8 small text-muted">{info.address}</div>
-                    </div>
-                    <hr />
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{"Numele băncii"}</div>
-                      <div className="col-md-8">{info.bankName}</div>
-                    </div>
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{"IBAN"}</div>
-                      <div className="col-md-8 fw-bold">{info.bankAccount}</div>
-                    </div>
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{"Suma"}</div>
-                      <div className="col-md-8 fw-bold">
-                        {numberToLocale(options.amount)}{" lei"}
-                      </div>
-                    </div>
-                    <div className="row">
-                      <div className="col-md-4 text-md-right">{"Referință"}</div>
-                      <div className="col-md-8 fw-bold">
-                        <code>{details}</code>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div className="alert alert-warning mt-3">
-              <i className="fa fa-exclamation-circle me-1" />
-              {"Este foarte important să scrii cu atenție câmpul \"Referință\""}
-            </div>
-          </div>
-          <div className="col-xl">
-            <h4>
-              {"Pasul "}
-              <span className="badge text-bg-primary rounded-circle">2</span>
-            </h4>
-            <div className="mt-4">
-              {"După ce ai efectuat transferul bancar, apasă următorul buton:"}
-            </div>
-            <div className="text-center">
-              <button
-                className="btn btn-block btn-primary mt-4 me-1 ms-1 mb-3"
-                onClick={transferIsDone}
-                type="button">
-                <i className="fa fa-check me-1" />
-                {"Am efectuat transferul bancar"}
-              </button>
-            </div>
-          </div>
-        </div>
-      </div>
-    );
-  },
-
-  PaymentBankTransferModal = (props: PaymentBankTransferProps) => (
-    <ModalWindow size="xl" title="Transfer bancar">
-      <PaymentBankTransfer {...props} />
-    </ModalWindow>
-  );
-
-export default PaymentBankTransferModal;

package/src/Payment/Modal/BankTransferDoneModal.tsx

@@ -1,27 +0,0 @@
-
-
-import React from "react";
-import { ModalWindow } from "../../Modal";
-
-const PaymentBankTransferDoneModal = () => (
-  <ModalWindow title="Totul e în regulă!">
-    <div className="mt-2">
-      <h3 className="text-success">
-        <i className="fa fa-check text-success" /> {"Am înregistrat cererea ta"}
-      </h3>
-      <div className="mt-4">
-        <h5 className="mt-2">{"Ce se întâmplă acum?"}</h5>
-        {"Rămâne să primim confirmarea din partea băncii tale și vom efectua operațiunile"}
-      </div>
-      <h5 className="mt-3">{"Cât timp va dura?"}</h5>
-      <div>
-        {`Durează între 1 și 3 zile lucrătoare pentru operațiunea bancară să
-    se desfășoare. În momentul în care am primit banii în cont, te rugăm să acorzi
-    1-2 zile lucrătoare să operăm modificările pe platforma Sidework și să
-    te bucuri de beneficii.`}
-      </div>
-    </div>
-  </ModalWindow>
-);
-
-export default PaymentBankTransferDoneModal;

package/src/Payment/Modal/index.ts

@@ -1,11 +0,0 @@
-
-
-import PaymentBankTransferModal from "./BankTransfer";
-import PaymentBankTransferDoneModal from "./BankTransferDoneModal";
-
-const paymentModals = {
-  "PAYMENT_BANK_TRANSFER" : PaymentBankTransferModal,
-  "PAYMENT_WAS_DONE"      : PaymentBankTransferDoneModal,
-};
-
-export default paymentModals;