Show common groups in contact modal
This commit is contained in:
parent
8ac2d8fcec
commit
885ff5fe42
6 changed files with 121 additions and 88 deletions
83
ts/components/SharedGroupNames.tsx
Normal file
83
ts/components/SharedGroupNames.tsx
Normal file
|
@ -0,0 +1,83 @@
|
|||
// Copyright 2021 Signal Messenger, LLC
|
||||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import React, { FunctionComponent } from 'react';
|
||||
import { take } from 'lodash';
|
||||
|
||||
import { Emojify } from './conversation/Emojify';
|
||||
import { Intl } from './Intl';
|
||||
import { LocalizerType } from '../types/Util';
|
||||
|
||||
type PropsType = {
|
||||
i18n: LocalizerType;
|
||||
nameClassName?: string;
|
||||
sharedGroupNames: Array<string>;
|
||||
};
|
||||
|
||||
export const SharedGroupNames: FunctionComponent<PropsType> = ({
|
||||
i18n,
|
||||
nameClassName,
|
||||
sharedGroupNames,
|
||||
}) => {
|
||||
const firstThreeGroups = take(sharedGroupNames, 3).map((group, i) => (
|
||||
// We cannot guarantee uniqueness of group names
|
||||
// eslint-disable-next-line react/no-array-index-key
|
||||
<strong key={i} className={nameClassName}>
|
||||
<Emojify text={group} />
|
||||
</strong>
|
||||
));
|
||||
|
||||
if (sharedGroupNames.length > 3) {
|
||||
const remainingCount = sharedGroupNames.length - 3;
|
||||
return (
|
||||
<Intl
|
||||
i18n={i18n}
|
||||
id="member-of-more-than-3-groups"
|
||||
components={{
|
||||
group1: firstThreeGroups[0],
|
||||
group2: firstThreeGroups[1],
|
||||
group3: firstThreeGroups[2],
|
||||
remainingCount: remainingCount.toString(),
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
if (firstThreeGroups.length === 3) {
|
||||
return (
|
||||
<Intl
|
||||
i18n={i18n}
|
||||
id="member-of-3-groups"
|
||||
components={{
|
||||
group1: firstThreeGroups[0],
|
||||
group2: firstThreeGroups[1],
|
||||
group3: firstThreeGroups[2],
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
if (firstThreeGroups.length >= 2) {
|
||||
return (
|
||||
<Intl
|
||||
i18n={i18n}
|
||||
id="member-of-2-groups"
|
||||
components={{
|
||||
group1: firstThreeGroups[0],
|
||||
group2: firstThreeGroups[1],
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
if (firstThreeGroups.length >= 1) {
|
||||
return (
|
||||
<Intl
|
||||
i18n={i18n}
|
||||
id="member-of-1-group"
|
||||
components={{
|
||||
group: firstThreeGroups[0],
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
return <>{i18n('no-groups-in-common')}</>;
|
||||
};
|
Loading…
Add table
Add a link
Reference in a new issue