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 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 | 29x 29x 29x 29x 1094x 1094x 1094x 1094x 1094x 1094x | import {
AdditionalToggle,
CardPropsTypes as CardProps,
} from "@pages/ManageMoney/Modal/filter.types";
import { Stack } from "@mui/material";
import GiveText from "@shared/Text/GiveText";
import {
BriefcaseIcon,
StorefrontIcon,
UserPlusIcon,
} from "@phosphor-icons/react";
import useGetAssigneeSelect from "./useGetAssigneeSelect";
import { endpointNames, FilterPagesEnum } from "../constants";
import useUserReducer from "@hooks/Reducers/useUserReducer";
import { checkPortals } from "@utils/routing";
import GiveAvatar from "@shared/Avatar/GiveAvatar";
export const providerTransfers: AdditionalToggle = {
toggleTitle: (
<Stack direction="row" alignItems="flex-start" gap="8px">
<BriefcaseIcon size={20} />
<Stack direction="column" alignItems="flex-start" gap="4px">
<GiveText variant="bodyS">Provider Transfers</GiveText>
<GiveText variant="bodyXS" color="secondary">
View transfers initiated by providers
</GiveText>
</Stack>
</Stack>
),
apiKeyName: "isProviderTransfers",
};
export const merchantTransfers: AdditionalToggle = {
toggleTitle: (
<Stack direction="row" alignItems="flex-start" gap="8px">
<StorefrontIcon size={20} />
<Stack direction="column" alignItems="flex-start" gap="4px">
<GiveText variant="bodyS">Merchant Transfers</GiveText>
<GiveText variant="bodyXS" color="secondary">
View transfers from merchants associated with providers
</GiveText>
</Stack>
</Stack>
),
apiKeyName: "isMerchantTransfers",
};
const filterPageProviderMerchantMap: Partial<
Record<FilterPagesEnum, FilterPagesEnum>
> = {
[FilterPagesEnum.PROVIDER_KYB_TAB]: FilterPagesEnum.MERCHANT_KYB_TAB,
[FilterPagesEnum.PROVIDER_UNDERWRITING_TAB]:
FilterPagesEnum.MERCHANT_UNDERWRITING_TAB,
};
export const useGetToggleFilters = ({
filterPage,
}: {
filterPage: FilterPagesEnum;
}) => {
const { isEnterprisePortal, isDisputes } = checkPortals();
const { img: userImg, id: userId, email: userEmail } = useUserReducer();
//for now this is dublicated but in the future will may need to enable independent
const isGetAssigneeCallEnabled = [
FilterPagesEnum.MERCHANT_SPONSOR_TAB,
FilterPagesEnum.MERCHANT_KYB_TAB,
FilterPagesEnum.MERCHANT_UNDERWRITING_TAB,
FilterPagesEnum.MERCHANT_RISK_TAB,
FilterPagesEnum.PROVIDER_KYB_TAB,
FilterPagesEnum.PROVIDER_UNDERWRITING_TAB,
].includes(filterPage);
const {
assigneesOptions,
assigneesSearchBarProps,
assigneesClearSearch,
assigneesIsLoading,
} = useGetAssigneeSelect({
id: userId,
enabled: isGetAssigneeCallEnabled || isDisputes,
filterPage: filterPageProviderMerchantMap?.[filterPage] || filterPage,
});
const assignSection: CardProps = {
toggleTitle: (
<Stack direction="row" alignItems="center" gap="8px">
<GiveAvatar size="20px" imageUrl={userImg} />
<GiveText variant="bodyS">Assigned to Me</GiveText>
</Stack>
),
toggleData: {
label: userEmail,
icon: userImg,
value: userEmail,
id: userId,
},
showDivider: !isEnterprisePortal,
apiKeyName: endpointNames.assignee,
selected: [],
title: isEnterprisePortal ? null : (
<Stack direction="row" alignItems="center" gap="8px">
<UserPlusIcon size={20} />
<GiveText variant="bodyS">Other Assignees</GiveText>
</Stack>
),
...(isEnterprisePortal
? {}
: {
contextualMenuProps: {
options: assigneesOptions,
searchBarProps: assigneesSearchBarProps,
clearSearch: assigneesClearSearch,
isLoading: assigneesIsLoading,
},
}),
};
return {
assignSection,
providerTransfers,
merchantTransfers,
};
};
|