-
-
Notifications
You must be signed in to change notification settings - Fork 2.6k
/
ContactName.tsx
56 lines (51 loc) · 1.33 KB
/
ContactName.tsx
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
// Copyright 2018 Signal Messenger, LLC
// SPDX-License-Identifier: AGPL-3.0-only
import React from 'react';
import classNames from 'classnames';
import { Emojify } from './Emojify';
import type { ContactNameColorType } from '../../types/Colors';
import { getClassNamesFor } from '../../util/getClassNamesFor';
export type PropsType = {
contactNameColor?: ContactNameColorType;
firstName?: string;
isSignalConversation?: boolean;
isMe?: boolean;
module?: string;
preferFirstName?: boolean;
title: string;
onClick?: VoidFunction;
};
export function ContactName({
contactNameColor,
firstName,
isSignalConversation,
isMe,
module,
preferFirstName,
title,
onClick,
}: PropsType): JSX.Element {
const getClassName = getClassNamesFor('module-contact-name', module);
let text: string;
if (preferFirstName) {
text = firstName || title || '';
} else {
text = title || '';
}
const WrappingElement = onClick ? 'button' : 'span';
return (
<WrappingElement
className={classNames(
getClassName(''),
contactNameColor ? getClassName(`--${contactNameColor}`) : null
)}
dir="auto"
onClick={onClick}
>
<Emojify text={text} />
{(isSignalConversation || isMe) && (
<span className="ContactModal__official-badge" />
)}
</WrappingElement>
);
}