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 | 15x | import { useTheme } from '@emotion/react';
import { memo, useMemo } from 'react';
import { FormattedMessage } from 'react-intl';
import { type CurrencyValue } from '@amalia/kernel/monetary/types';
import { useCurrentPeriod } from '@amalia/payout-definition/state';
import { CustomReportsPresetsEnum } from '@amalia/reporting/custom-reports/shared';
import { useBenchmarkByRuleWidget } from '@amalia/reporting/dashboards/state';
import { type UserContract } from '@amalia/tenants/users/types';
import { DashboardWidget } from '../dashboard-widget/DashboardWidget';
import { type DataBenchmarkByRule } from '../dashboard.utils';
import { WidgetTitle } from '../widget-title/WidgetTitle';
import { BenchmarkByRule } from './benchmark-by-rule/BenchmarkByRule';
export interface BenchmarkByRuleWidgetProps {
readonly selectedPlanIds: string[];
readonly selectedTeamIds: string[];
readonly user: UserContract;
}
export const BenchmarkByRuleWidget = memo(function BenchmarkByRuleWidget({
selectedPlanIds,
selectedTeamIds,
user,
}: BenchmarkByRuleWidgetProps) {
const theme = useTheme();
const { currentPeriod } = useCurrentPeriod();
const { data: benchmarkByRule, isLoading } = useBenchmarkByRuleWidget(
{
periodId: currentPeriod?.id ?? '',
userIds: [user.id],
planIds: selectedPlanIds,
teamIds: selectedTeamIds,
},
!!currentPeriod,
);
const dataBenchmarkByRule: DataBenchmarkByRule[] = useMemo(
() =>
(benchmarkByRule?.records ?? []).map((r) => ({
stats: { plan: r['PAYMENT__value'] as CurrencyValue },
label: r['ruleMetricOfPayment__ruleName'] as string,
})),
[benchmarkByRule],
);
return (
<DashboardWidget>
<WidgetTitle
customReportId={CustomReportsPresetsEnum.PRESET_BENCHMARK_BY_RULE}
title={<FormattedMessage defaultMessage="Benchmark by rules" />}
/>
<BenchmarkByRule
colors={[theme.ds.colors.primary[200], theme.ds.hues.green[300], theme.ds.hues.magenta[300]]}
data={dataBenchmarkByRule}
height="auto"
loading={isLoading}
width="100%"
/>
</DashboardWidget>
);
});
|