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 | 51x 51x 157x 157x 157x 71x 26x 26x 26x 26x 26x 26x | import { css } from '@emotion/react';
import { IconArchive } from '@tabler/icons-react';
import { useMemo } from 'react';
import { FormattedMessage, useIntl } from 'react-intl';
import { generatePath } from 'react-router-dom';
import { ColumnHelper, DataGrid, Table, Tooltip } from '@allshares/studio-design-system';
import { routes } from '@amalia/core/routes';
import { fuzzyFilter } from '@amalia/ext/filters';
import { canModifyTeamAssignments, canViewThisTeam } from '@amalia/kernel/auth/shared';
import { useAbilityContext } from '@amalia/kernel/auth/state';
import { type TeamAssignmentWithTeam } from '@amalia/tenants/assignments/teams/types';
import { TeamRoleLabel } from '@amalia/tenants/users/profile/components';
import { type UserContract } from '@amalia/tenants/users/types';
import { TeamAssignmentsTableDeleteAssignmentAction } from '../team-assignments-table/cells/actions/TeamAssignmentsTableDeleteAssignmentAction';
import { TeamAssignmentsTableEndDateCell } from '../team-assignments-table/cells/end-date/TeamAssignmentsTableEndDateCell';
import { TeamAssignmentsTableStartDateCell } from '../team-assignments-table/cells/start-date/TeamAssignmentsTableStartDateCell';
const columnHelper = new ColumnHelper<TeamAssignmentWithTeam>();
export const useUserTeamAssignmentsTableColumns = ({
user,
}: {
user: Pick<UserContract, 'firstName' | 'lastName'>;
}) => {
const ability = useAbilityContext();
const { formatMessage } = useIntl();
return useMemo(
() =>
[
columnHelper.accessor((teamAssignment) => teamAssignment.team.name, {
id: 'teamName',
header: formatMessage({ defaultMessage: 'Team name' }),
size: 320,
sortingFn: DataGrid.sortingFn.strings,
filterFn: fuzzyFilter,
cell: ({ value: teamName, row: teamAssignment }) => (
<Table.Cell.Main
tooltipContent={teamName}
link={
canViewThisTeam(ability, { team: { id: teamAssignment.team.id } }) ? (
<Table.Cell.Main.Link to={generatePath(routes.TEAM_DETAILS, { teamId: teamAssignment.team.id })}>
<FormattedMessage defaultMessage="View team" />
</Table.Cell.Main.Link>
) : undefined
}
>
<div
css={css`
display: flex;
align-items: center;
gap: 6px;
`}
>
{!!teamAssignment.team.archived && (
<Tooltip content={formatMessage({ defaultMessage: 'This team is archived' })}>
<IconArchive size={16} />
</Tooltip>
)}
<span>{teamName}</span>
</div>
</Table.Cell.Main>
),
}),
columnHelper.accessor('effectiveAsOf', {
id: 'effectiveAsOf',
header: formatMessage({ defaultMessage: 'Start date' }),
size: 150,
cell: ({ row: teamAssignment }) => (
<TeamAssignmentsTableStartDateCell
team={teamAssignment.team}
teamAssignment={teamAssignment}
/>
),
}),
columnHelper.accessor('effectiveUntil', {
id: 'effectiveUntil',
header: formatMessage({ defaultMessage: 'End date' }),
size: 150,
cell: ({ row: teamAssignment }) => (
<TeamAssignmentsTableEndDateCell
team={teamAssignment.team}
teamAssignment={teamAssignment}
/>
),
}),
columnHelper.accessor('teamRole', {
id: 'teamRole',
header: formatMessage({ defaultMessage: 'Team role' }),
size: 150,
cell: ({ value }) => (
<Table.Cell.Text tooltipContent={<TeamRoleLabel teamRole={value} />}>
<TeamRoleLabel teamRole={value} />
</Table.Cell.Text>
),
}),
canModifyTeamAssignments(ability) &&
columnHelper.display({
id: Table.Cell.Actions.columnId,
header: '',
size: 0,
cell: ({ row: teamAssignment }) => (
<Table.Cell.Actions>
<TeamAssignmentsTableDeleteAssignmentAction
team={teamAssignment.team}
teamAssignment={teamAssignment}
user={user}
/>
</Table.Cell.Actions>
),
}),
].filter(Boolean),
[formatMessage, ability, user],
);
};
|