All files / src/pages/AcquirerPortal/Merchants AcquirerMerchants.tsx

92.3% Statements 12/13
57.14% Branches 4/7
100% Functions 3/3
92.3% Lines 12/13

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                                  4x                           264x   264x   264x   264x   264x 386x     264x           264x   264x     264x   230x                                                                  
import { useListAcquirerMerchants } from "@hooks/acquirer-api/merchants/useListMerchants";
import { useTargetRef } from "@hooks/common/useObserveHTMLNode";
import { useGetCurrentMerchantId, useMasqueradeRedirect } from "@hooks/common";
import { PortalRootContainer } from "@components/Layout/Layout";
import { ConnectionErrorState } from "@common/EmptyState";
import { NotAuthorizedWrapper } from "@containers/NotAuthorizedWrapper";
import { useAppSelector } from "@redux/hooks";
import MerchantsTable from "features/Merchants/MerchantsTable/MerchantsTable";
import { useAppTheme } from "@theme/v2/Provider";
import { QKEY_LIST_ACQUIRER_MERCHANTS } from "@constants/queryKeys";
import { STORED_MERCHANTS_ROWS_PER_PAGE } from "@constants/stringConstants";
import RESOURCE_BASE, { OPERATIONS } from "@constants/permissions";
import {
  composePermission,
  useAccessControl,
} from "@features/Permissions/AccessControl";
 
export const AcquirerMerchantsPage = () => {
  const {
    isLoading,
    isLoadingStats,
    totalRows,
    allRows,
    page,
    rowsPerPage,
    setPage,
    setPageDispatcher,
    isFetching,
    stats,
    statsRaw,
    state: { isError },
  } = useListAcquirerMerchants();
 
  const { palette } = useAppTheme();
 
  const { isSponsor } = useGetCurrentMerchantId();
 
  useMasqueradeRedirect();
 
  const hasNotMerchantListPermission = useAppSelector(
    (state) => state.app.permissions?.get_merchants_list,
  );
 
  const sponsorHasListMerchantPermission = useAccessControl({
    resource: composePermission(RESOURCE_BASE.MERCHANT, RESOURCE_BASE.SPONSOR),
    operation: OPERATIONS.LIST,
  });
 
  const listMerchantPermission =
    sponsorHasListMerchantPermission || !hasNotMerchantListPermission;
 
  Iif (isError && !listMerchantPermission && !isLoading)
    return <ConnectionErrorState />;
 
  return (
    <PortalRootContainer
      sx={(theme) => ({
        [theme.breakpoints.up("sm")]: {
          gap: "0",
        },
        [theme.breakpoints.down("sm")]: {
          gap: "0px !important",
        },
        alignItems: "center",
        backgroundColor: palette.surface?.primary,
      })}
    >
      <NotAuthorizedWrapper notAuthorized={!listMerchantPermission}>
        <MerchantsTable
          type="merchant"
          allRows={allRows}
          isLoading={isLoading}
          isFetching={isFetching}
          totalRows={totalRows}
          rowsPerPage={rowsPerPage}
          page={page}
          setPageDispatcher={setPageDispatcher}
          setPage={setPage}
          stats={stats}
          queryKey={QKEY_LIST_ACQUIRER_MERCHANTS}
          isError={Boolean(isError)}
          storageKey={STORED_MERCHANTS_ROWS_PER_PAGE}
          isSponsor={isSponsor}
          statsRaw={statsRaw}
        />
      </NotAuthorizedWrapper>
    </PortalRootContainer>
  );
};