awards-list PlanAwardsList.tsx

88.88% Statements 8/9

100% Branches 2/2

83.33% Functions 5/6

85.71% Lines 6/7

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  
 
 
 
 
 
 
 
 
 
 
 
 
142x
8x
8x
8x
 
 
8x
 
 
 
 
 
 
8x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { memo, useMemo } from 'react';
 
import { Group } from '@allshares/studio-design-system';
import { type BadgeAward, type BadgeConfiguration } from '@amalia/payout-definition/plans/types';
 
import { PlanAward, type PlanAwardProps } from '../award/PlanAward';
 
export type PlanAwardsListProps = {
  readonly awards: BadgeAward[];
  readonly configurations: BadgeConfiguration[];
  readonly period?: PlanAwardProps['period'];
};
 
export const PlanAwardsList = memo(function PlanAwardsList({ awards, configurations, period }: PlanAwardsListProps) {
  const notAwarded = useMemo(() => {
    const awardedIds = new Set(awards.map((b) => b.configurationId));
    return configurations.filter((c) => !c.deletedAt && !awardedIds.has(c.id));
  }, [configurations, awards]);
 
  return (
    <Group
      wrap
      align="center"
      gap={12}
    >
      {awards.map((award) => (
        <PlanAward
          key={award.configuration.id}
          isAwarded
          configuration={award.configuration}
          period={period}
        />
      ))}
 
      {notAwarded.map((awardConfiguration) => (
        <PlanAward
          key={awardConfiguration.id}
          configuration={awardConfiguration}
          isAwarded={false}
          period={period}
        />
      ))}
    </Group>
  );
});