All files / src/pages/EnterprisePortal/Merchants Merchants.tsx

0% Statements 0/11
0% Branches 0/7
0% Functions 0/3
0% Lines 0/11

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