All files / src/shared/GiveFilter/hooks useFilterButton.tsx

100% Statements 25/25
100% Branches 12/12
100% Functions 4/4
100% Lines 22/22

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94                                                                    44x 1323x 1323x 1323x 2106x   1323x   1323x 39x 39x           39x               17x               9x 17x 13x 9x     2x 7x 6x     1323x 17x     1323x         1323x              
import NiceModal from "@ebay/nice-modal-react";
import { GIVE_FILTER_MODAL } from "modals/modal_names";
import { useAppDispatch, useAppSelector } from "@redux/hooks";
import {
  resetFilterByKey,
  selectFiltersObject,
} from "@redux/slices/dynamicFilterSlice";
import {
  customAmountArrayKey,
  FilterPagesEnum,
  FilterPageValuesTYpes,
  reduxFilterKeys,
  TRANSFERS_TAB_BASE_TYPES,
  urlFilterFormat,
} from "../constants";
import { countNonEmptyValues, filterButtonLabel } from "../utils";
import {
  addBlockedAndQuarantinedFilter,
  addBlockedFilter,
  addStatusFilter,
  addTypeFilter,
  selectProcessingTab,
} from "@redux/slices/transactions";
import { tabNames } from "@features/Processing/hooks/useTransactionsFilters";
 
type Props = {
  filterPage: FilterPageValuesTYpes;
  /**
   * Scopes an entity-specific filter page (the EVENT_TICKETS panel's Ticket Name
   * chips are the event's own tiers). Handed to the modal at show() time because
   * it renders outside the route tree and cannot read the id itself.
   */
  productId?: string;
};
export const useFilterButton = ({ filterPage, productId }: Props) => {
  const reduxKey = reduxFilterKeys[filterPage];
  const dispatch = useAppDispatch();
  const filterObject = useAppSelector((state) =>
    selectFiltersObject(state, reduxKey),
  );
  const tab = useAppSelector(selectProcessingTab);
 
  const handleResetFilters = (event?: React.MouseEvent<HTMLElement>) => {
    event?.stopPropagation();
    dispatch(
      resetFilterByKey({
        filterKey: reduxKey,
      }),
    );
 
    if (
      //currently we only have special callback for this case, but if other filters will need it in future we can refactor this logic and customize more
      [
        FilterPagesEnum.MANAGE_MONEY,
        FilterPagesEnum.PROVIDER_PROCESSING,
        FilterPagesEnum.ACQUIRER_PROCESSING,
      ].includes(filterPage)
    ) {
      if (
        ![
          tabNames.declined,
          tabNames.settled,
          tabNames.transfers,
          tabNames.pending,
        ].includes(tab)
      )
        dispatch(addStatusFilter("!declined"));
      if (tab === tabNames.suspected) return dispatch(addBlockedFilter());
      if (tab === tabNames.quarantined) return;
      if (tab === tabNames.transfers)
        // Keep transfer_return in the base filter so Returned transfers stay
        // visible after a reset (mirrors the Transfers tab onClick).
        return dispatch(addTypeFilter(TRANSFERS_TAB_BASE_TYPES));
      if (tab === tabNames.settled) return dispatch(addStatusFilter("settled"));
      dispatch(addBlockedAndQuarantinedFilter());
    }
  };
  const handleOpenFilterModal = () => {
    NiceModal.show(GIVE_FILTER_MODAL, { filterPage: filterPage, productId });
  };
 
  const filtersAmount = countNonEmptyValues(filterObject, [
    customAmountArrayKey,
    urlFilterFormat,
  ]);
 
  return {
    handleOpenFilterModal,
    handleResetFilters,
    filtersAmount,
    filterLabel: filterButtonLabel(filtersAmount),
  };
};