diff --git a/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCardAvatars/NewGroupCardAvatars.tsx b/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCardAvatars/NewGroupCardAvatars.tsx index e04f0e41b9..17f9c503a9 100644 --- a/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCardAvatars/NewGroupCardAvatars.tsx +++ b/frontend/src/component/admin/groups/GroupsList/GroupCard/GroupCardAvatars/NewGroupCardAvatars.tsx @@ -47,11 +47,13 @@ interface IGroupCardAvatarsProps { imageUrl?: string; }[]; header?: ReactNode; + avatarLimit?: number; } export const GroupCardAvatars = ({ users = [], header = null, + avatarLimit = 9, }: IGroupCardAvatarsProps) => { const shownUsers = useMemo( () => @@ -68,7 +70,7 @@ export const GroupCardAvatars = ({ } return 0; }) - .slice(0, 9), + .slice(0, avatarLimit), [users], ); @@ -109,7 +111,7 @@ export const GroupCardAvatars = ({ /> ))} 9} + condition={users.length > avatarLimit} show={ +{users.length - shownUsers.length} diff --git a/frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx b/frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx index 9da71e237c..7a4c40a50a 100644 --- a/frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx +++ b/frontend/src/component/project/NewProjectCard/ProjectOwners/ProjectOwners.tsx @@ -59,6 +59,7 @@ export const ProjectOwners: FC = ({ owners = [] }) => {