diff --git a/apps/backoffice-v2/src/domains/business-reports/fetchers.ts b/apps/backoffice-v2/src/domains/business-reports/fetchers.ts index 78d5a3f251..282083eeb7 100644 --- a/apps/backoffice-v2/src/domains/business-reports/fetchers.ts +++ b/apps/backoffice-v2/src/domains/business-reports/fetchers.ts @@ -88,7 +88,7 @@ export const fetchBusinessReports = async ({ reportType, ...params }: { - reportType: MerchantReportType; + reportType: MerchantReportType | 'All'; page: { number: number; size: number; @@ -98,7 +98,7 @@ export const fetchBusinessReports = async ({ const queryParams = qs.stringify( { ...params, - type: reportType, + ...(reportType !== 'All' && { type: reportType }), }, { encode: false }, ); diff --git a/apps/backoffice-v2/src/domains/business-reports/hooks/queries/useBusinessReportsQuery/useBusinessReportsQuery.tsx b/apps/backoffice-v2/src/domains/business-reports/hooks/queries/useBusinessReportsQuery/useBusinessReportsQuery.tsx index 35ccbad732..47002e099c 100644 --- a/apps/backoffice-v2/src/domains/business-reports/hooks/queries/useBusinessReportsQuery/useBusinessReportsQuery.tsx +++ b/apps/backoffice-v2/src/domains/business-reports/hooks/queries/useBusinessReportsQuery/useBusinessReportsQuery.tsx @@ -12,7 +12,7 @@ export const useBusinessReportsQuery = ({ sortBy, sortDir, }: { - reportType: MerchantReportType; + reportType: MerchantReportType | 'All'; search: string; page: number; pageSize: number; diff --git a/apps/backoffice-v2/src/domains/business-reports/query-keys.ts b/apps/backoffice-v2/src/domains/business-reports/query-keys.ts index f7c417ee52..72d5d3389f 100644 --- a/apps/backoffice-v2/src/domains/business-reports/query-keys.ts +++ b/apps/backoffice-v2/src/domains/business-reports/query-keys.ts @@ -15,7 +15,7 @@ export const businessReportsQueryKey = createQueryKeys('business-reports', { sortDir, ...params }: { - reportType: MerchantReportType; + reportType: MerchantReportType | 'All'; search: string; page: number; pageSize: number; diff --git a/apps/backoffice-v2/src/pages/MerchantMonitoring/MerchantMonitoring.page.tsx b/apps/backoffice-v2/src/pages/MerchantMonitoring/MerchantMonitoring.page.tsx index 77ef7582a3..ed2d831620 100644 --- a/apps/backoffice-v2/src/pages/MerchantMonitoring/MerchantMonitoring.page.tsx +++ b/apps/backoffice-v2/src/pages/MerchantMonitoring/MerchantMonitoring.page.tsx @@ -5,15 +5,23 @@ import { useMerchantMonitoringLogic } from '@/pages/MerchantMonitoring/hooks/use import { NoBusinessReports } from '@/pages/MerchantMonitoring/components/NoBusinessReports/NoBusinessReports'; import { MerchantMonitoringTable } from '@/pages/MerchantMonitoring/components/MerchantMonitoringTable/MerchantMonitoringTable'; import { buttonVariants } from '@/common/components/atoms/Button/Button'; -import { Plus, Table2 } from 'lucide-react'; +import { Plus, SlidersHorizontal, Table2 } from 'lucide-react'; import { Link } from 'react-router-dom'; import { Search } from '@/common/components/molecules/Search'; -import { Skeleton } from '@ballerine/ui'; +import { + Button, + DropdownMenuTrigger, + DropdownMenu, + Skeleton, + DropdownMenuContent, + DropdownMenuCheckboxItem, +} from '@ballerine/ui'; import { TooltipProvider } from '@/common/components/atoms/Tooltip/Tooltip.Provider'; import { Tooltip } from '@/common/components/atoms/Tooltip/Tooltip'; import { TooltipTrigger } from '@/common/components/atoms/Tooltip/Tooltip.Trigger'; import { TooltipContent } from '@/common/components/atoms/Tooltip/Tooltip.Content'; import { t } from 'i18next'; +import { titleCase } from 'string-ts'; export const MerchantMonitoring: FunctionComponent = () => { const { @@ -31,6 +39,9 @@ export const MerchantMonitoring: FunctionComponent = () => { locale, createBusinessReport, createBusinessReportBatch, + reportType, + onReportTypeChange, + REPORT_TYPE_TO_DISPLAY_TEXT, } = useMerchantMonitoringLogic(); return ( @@ -90,8 +101,28 @@ export const MerchantMonitoring: FunctionComponent = () => { -
+
+ + + + + + {Object.entries(REPORT_TYPE_TO_DISPLAY_TEXT).map(([type, displayText]) => ( + + onReportTypeChange(type as keyof typeof REPORT_TYPE_TO_DISPLAY_TEXT) + } + > + {displayText} + + ))} + +
{isNonEmptyArray(businessReports) && } diff --git a/apps/backoffice-v2/src/pages/MerchantMonitoring/get-merchant-monitoring-search-schema.ts b/apps/backoffice-v2/src/pages/MerchantMonitoring/get-merchant-monitoring-search-schema.ts index 2671b17e1c..d42eb90689 100644 --- a/apps/backoffice-v2/src/pages/MerchantMonitoring/get-merchant-monitoring-search-schema.ts +++ b/apps/backoffice-v2/src/pages/MerchantMonitoring/get-merchant-monitoring-search-schema.ts @@ -2,6 +2,7 @@ import { BaseSearchSchema } from '@/common/hooks/useSearchParamsByEntity/validat import { z } from 'zod'; import { TBusinessReport } from '@/domains/business-reports/fetchers'; import { BooleanishRecordSchema } from '@ballerine/ui'; +import { REPORT_TYPE_TO_DISPLAY_TEXT } from './hooks/useMerchantMonitoringLogic/useMerchantMonitoringLogic'; export const getMerchantMonitoringSearchSchema = () => BaseSearchSchema.extend({ @@ -14,15 +15,24 @@ export const getMerchantMonitoringSearchSchema = () => 'business.country', 'riskScore', 'status', + 'reportType', ] as const satisfies ReadonlyArray< | Extract< keyof NonNullable, - 'createdAt' | 'updatedAt' | 'riskScore' | 'status' + 'createdAt' | 'updatedAt' | 'riskScore' | 'status' | 'reportType' > | 'business.website' | 'business.companyName' | 'business.country' >) .catch('createdAt'), + reportType: z + .enum([ + ...(Object.values(REPORT_TYPE_TO_DISPLAY_TEXT) as [ + (typeof REPORT_TYPE_TO_DISPLAY_TEXT)['All'], + ...Array<(typeof REPORT_TYPE_TO_DISPLAY_TEXT)[keyof typeof REPORT_TYPE_TO_DISPLAY_TEXT]>, + ]), + ]) + .catch('All'), selected: BooleanishRecordSchema.optional(), }); diff --git a/apps/backoffice-v2/src/pages/MerchantMonitoring/hooks/useMerchantMonitoringLogic/useMerchantMonitoringLogic.tsx b/apps/backoffice-v2/src/pages/MerchantMonitoring/hooks/useMerchantMonitoringLogic/useMerchantMonitoringLogic.tsx index b0392aecdf..563a34f507 100644 --- a/apps/backoffice-v2/src/pages/MerchantMonitoring/hooks/useMerchantMonitoringLogic/useMerchantMonitoringLogic.tsx +++ b/apps/backoffice-v2/src/pages/MerchantMonitoring/hooks/useMerchantMonitoringLogic/useMerchantMonitoringLogic.tsx @@ -6,15 +6,28 @@ import { useLocale } from '@/common/hooks/useLocale/useLocale'; import { useCustomerQuery } from '@/domains/customer/hooks/queries/useCustomerQuery/useCustomerQuery'; import { useSearch } from '@/common/hooks/useSearch/useSearch'; +export const REPORT_TYPE_TO_DISPLAY_TEXT = { + All: 'All', + MERCHANT_REPORT_T1: 'Onboarding', + ONGOING_MERCHANT_REPORT_T1: 'Monitoring', +} as const; + +const DISPLAY_TEXT_TO_MERCHANT_REPORT_TYPE = { + All: 'All', + MERCHANT_REPORT_T1: 'MERCHANT_REPORT_T1', + ONGOING_MERCHANT_REPORT_T1: 'ONGOING_MERCHANT_REPORT_T1', +} as const; + export const useMerchantMonitoringLogic = () => { const locale = useLocale(); const { data: customer } = useCustomerQuery(); const MerchantMonitoringSearchSchema = getMerchantMonitoringSearchSchema(); - const [{ page, pageSize, sortBy, sortDir, search: searchParamValue }] = useZodSearchParams( - MerchantMonitoringSearchSchema, - ); + const [ + { page, pageSize, sortBy, sortDir, search: searchParamValue, reportType }, + setSearchParams, + ] = useZodSearchParams(MerchantMonitoringSearchSchema); const { search: searchTerm, onSearch } = useSearch({ initialSearch: searchParamValue, @@ -23,7 +36,10 @@ export const useMerchantMonitoringLogic = () => { const search = searchTerm as string; const { data, isLoading: isLoadingBusinessReports } = useBusinessReportsQuery({ - reportType: 'MERCHANT_REPORT_T1', + reportType: + DISPLAY_TEXT_TO_MERCHANT_REPORT_TYPE[ + reportType as keyof typeof DISPLAY_TEXT_TO_MERCHANT_REPORT_TYPE + ], search, page, pageSize, @@ -31,6 +47,10 @@ export const useMerchantMonitoringLogic = () => { sortDir, }); + const onReportTypeChange = (reportType: keyof typeof REPORT_TYPE_TO_DISPLAY_TEXT) => { + setSearchParams({ reportType: REPORT_TYPE_TO_DISPLAY_TEXT[reportType] }); + }; + const { onPaginate, onPrevPage, onNextPage, onLastPage, isLastPage } = usePagination({ totalPages: data?.totalPages ?? 0, }); @@ -51,5 +71,8 @@ export const useMerchantMonitoringLogic = () => { onPaginate, isLastPage, locale, + reportType, + onReportTypeChange, + REPORT_TYPE_TO_DISPLAY_TEXT, }; }; diff --git a/services/workflows-service/prisma/data-migrations b/services/workflows-service/prisma/data-migrations index f7a9926755..bfc772b0ad 160000 --- a/services/workflows-service/prisma/data-migrations +++ b/services/workflows-service/prisma/data-migrations @@ -1 +1 @@ -Subproject commit f7a9926755b98bc9e1c908a81b86baf9824bc7f1 +Subproject commit bfc772b0ade3ae49465629d6c85ac26aac3796ab