From 16b8fc8620c293e2b491e795f17b70bf50226b72 Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric@loki.network>
Date: Tue, 6 Oct 2020 13:56:53 +1100
Subject: [PATCH 1/2] hide shortened pubkey except for public groups
---
ts/components/ConversationListItem.tsx | 1 +
ts/components/MessageSearchResult.tsx | 2 ++
ts/components/conversation/ContactName.tsx | 22 ++++++++++---------
.../conversation/ConversationHeader.tsx | 2 +-
ts/components/conversation/Message.tsx | 2 ++
ts/components/conversation/MessageDetail.tsx | 1 +
ts/components/conversation/Quote.tsx | 2 ++
.../conversation/SafetyNumberNotification.tsx | 1 +
.../conversation/TimerNotification.tsx | 1 +
.../conversation/VerificationNotification.tsx | 1 +
.../session/SessionMemberListItem.tsx | 3 ---
11 files changed, 24 insertions(+), 14 deletions(-)
diff --git a/ts/components/ConversationListItem.tsx b/ts/components/ConversationListItem.tsx
index 0d2c62451..febf5e563 100644
--- a/ts/components/ConversationListItem.tsx
+++ b/ts/components/ConversationListItem.tsx
@@ -357,6 +357,7 @@ class ConversationListItem extends React.PureComponent<Props> {
module="module-conversation__user"
i18n={window.i18n}
boldProfileName={true}
+ shouldShowPubkey={false}
/>
</div>
);
diff --git a/ts/components/MessageSearchResult.tsx b/ts/components/MessageSearchResult.tsx
index 0a56b0aff..936aa2211 100644
--- a/ts/components/MessageSearchResult.tsx
+++ b/ts/components/MessageSearchResult.tsx
@@ -68,6 +68,7 @@ export class MessageSearchResult extends React.PureComponent<Props> {
profileName={from.profileName}
i18n={i18n}
module="module-message-search-result__header__name"
+ shouldShowPubkey={false}
/>
);
}
@@ -86,6 +87,7 @@ export class MessageSearchResult extends React.PureComponent<Props> {
name={to.name}
profileName={to.profileName}
i18n={i18n}
+ shouldShowPubkey={false}
/>
</span>
</div>
diff --git a/ts/components/conversation/ContactName.tsx b/ts/components/conversation/ContactName.tsx
index 39f69d4c9..0f3ab3414 100644
--- a/ts/components/conversation/ContactName.tsx
+++ b/ts/components/conversation/ContactName.tsx
@@ -12,6 +12,7 @@ interface Props {
module?: string;
boldProfileName?: Boolean;
compact?: Boolean;
+ shouldShowPubkey: Boolean;
}
export class ContactName extends React.Component<Props> {
@@ -24,19 +25,27 @@ export class ContactName extends React.Component<Props> {
module,
boldProfileName,
compact,
+ shouldShowPubkey,
} = this.props;
const prefix = module ? module : 'module-contact-name';
const title = name ? name : phoneNumber;
- const shouldShowProfile = Boolean(profileName && !name);
+ const shouldShowProfile = Boolean(profileName || name);
const styles = (boldProfileName
? {
fontWeight: 'bold',
}
: {}) as React.CSSProperties;
+ const textProfile = profileName || name || '';
const profileElement = shouldShowProfile ? (
<span style={styles} className={`${prefix}__profile-name`}>
- <Emojify text={profileName || ''} i18n={i18n} />
+ <Emojify text={textProfile} i18n={i18n} />
+ </span>
+ ) : null;
+
+ const pubKeyElement = shouldShowPubkey ? (
+ <span className={`${prefix}__profile-number`}>
+ <Emojify text={title} i18n={i18n} />
</span>
) : null;
@@ -44,14 +53,7 @@ export class ContactName extends React.Component<Props> {
<span className={classNames(prefix, compact && 'compact')} dir="auto">
{profileElement}
{shouldShowProfile ? ' ' : null}
- <span
- className={classNames(
- `${prefix}__profile-number`,
- shouldShowProfile && 'italic'
- )}
- >
- <Emojify text={title} i18n={i18n} />
- </span>
+ {pubKeyElement}
</span>
);
}
diff --git a/ts/components/conversation/ConversationHeader.tsx b/ts/components/conversation/ConversationHeader.tsx
index 82151ed7f..c890cec6b 100644
--- a/ts/components/conversation/ConversationHeader.tsx
+++ b/ts/components/conversation/ConversationHeader.tsx
@@ -181,7 +181,7 @@ class ConversationHeader extends React.Component<Props> {
let title;
if (profileName) {
- title = `${profileName} ${window.shortenPubkey(phoneNumber)}`;
+ title = `${profileName}`;
} else {
if (name) {
title = `${name}`;
diff --git a/ts/components/conversation/Message.tsx b/ts/components/conversation/Message.tsx
index 73143a2b0..ec2a033fe 100644
--- a/ts/components/conversation/Message.tsx
+++ b/ts/components/conversation/Message.tsx
@@ -1169,6 +1169,7 @@ export class Message extends React.PureComponent<Props, State> {
conversationType,
direction,
i18n,
+ isPublic,
} = this.props;
const title = authorName ? authorName : authorPhoneNumber;
@@ -1192,6 +1193,7 @@ export class Message extends React.PureComponent<Props, State> {
module="module-message__author"
i18n={i18n}
boldProfileName={true}
+ shouldShowPubkey={Boolean(isPublic)}
/>
</div>
);
diff --git a/ts/components/conversation/MessageDetail.tsx b/ts/components/conversation/MessageDetail.tsx
index 235deb18b..1b432c432 100644
--- a/ts/components/conversation/MessageDetail.tsx
+++ b/ts/components/conversation/MessageDetail.tsx
@@ -107,6 +107,7 @@ export class MessageDetail extends React.Component<Props> {
name={contact.name}
profileName={contact.profileName}
i18n={i18n}
+ shouldShowPubkey={true}
/>
</div>
{errors.map((error, index) => (
diff --git a/ts/components/conversation/Quote.tsx b/ts/components/conversation/Quote.tsx
index 3737817b9..3856064d0 100644
--- a/ts/components/conversation/Quote.tsx
+++ b/ts/components/conversation/Quote.tsx
@@ -302,6 +302,7 @@ export class Quote extends React.Component<Props, State> {
i18n,
isFromMe,
isIncoming,
+ isPublic,
} = this.props;
return (
@@ -320,6 +321,7 @@ export class Quote extends React.Component<Props, State> {
profileName={authorProfileName}
i18n={i18n}
compact={true}
+ shouldShowPubkey={Boolean(isPublic)}
/>
)}
</div>
diff --git a/ts/components/conversation/SafetyNumberNotification.tsx b/ts/components/conversation/SafetyNumberNotification.tsx
index 47e633994..e31a90b09 100644
--- a/ts/components/conversation/SafetyNumberNotification.tsx
+++ b/ts/components/conversation/SafetyNumberNotification.tsx
@@ -42,6 +42,7 @@ export class SafetyNumberNotification extends React.Component<Props> {
profileName={contact.profileName}
phoneNumber={contact.phoneNumber}
module="module-verification-notification__contact"
+ shouldShowPubkey={true}
/>
</span>,
]}
diff --git a/ts/components/conversation/TimerNotification.tsx b/ts/components/conversation/TimerNotification.tsx
index 2d08c4497..a38a8cf23 100644
--- a/ts/components/conversation/TimerNotification.tsx
+++ b/ts/components/conversation/TimerNotification.tsx
@@ -51,6 +51,7 @@ export class TimerNotification extends React.Component<Props> {
name={name}
module="module-message__author"
boldProfileName={true}
+ shouldShowPubkey={false}
/>,
timespan,
]}
diff --git a/ts/components/conversation/VerificationNotification.tsx b/ts/components/conversation/VerificationNotification.tsx
index 0d9fca24e..43a67f797 100644
--- a/ts/components/conversation/VerificationNotification.tsx
+++ b/ts/components/conversation/VerificationNotification.tsx
@@ -53,6 +53,7 @@ export class VerificationNotification extends React.Component<Props> {
profileName={contact.profileName}
phoneNumber={contact.phoneNumber}
module="module-verification-notification__contact"
+ shouldShowPubkey={true}
/>,
]}
i18n={i18n}
diff --git a/ts/components/session/SessionMemberListItem.tsx b/ts/components/session/SessionMemberListItem.tsx
index 7497800b5..0cd21a1c7 100644
--- a/ts/components/session/SessionMemberListItem.tsx
+++ b/ts/components/session/SessionMemberListItem.tsx
@@ -49,8 +49,6 @@ export class SessionMemberListItem extends React.Component<Props, State> {
const { isSelected } = this.state;
const name = this.props.member.authorProfileName;
- const pubkey = this.props.member.authorPhoneNumber;
- const shortPubkey = window.shortenPubkey(pubkey);
return (
<div
@@ -67,7 +65,6 @@ export class SessionMemberListItem extends React.Component<Props, State> {
{this.renderAvatar()}
</span>
<span className="session-member-item__name">{name}</span>
- <span className="session-member-item__pubkey">{shortPubkey}</span>
</div>
<span
className={classNames(
From f57c85dc0d6121a2d2d5104d4e52f1495f049d0d Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric@loki.network>
Date: Tue, 6 Oct 2020 15:45:27 +1100
Subject: [PATCH 2/2] hide pubkey when not needed on conversationHeader and
listItem
---
stylesheets/_modules.scss | 8 +++++++-
ts/components/ConversationListItem.tsx | 7 ++++++-
ts/components/conversation/ContactName.tsx | 2 +-
ts/components/conversation/ConversationHeader.tsx | 11 +----------
ts/components/session/settings/SessionSettings.tsx | 2 --
5 files changed, 15 insertions(+), 15 deletions(-)
diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index c595ca77b..c3ac5b341 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -1112,7 +1112,7 @@
}
.module-conversation-header__title {
- margin-inline-start: 6px;
+ margin: 0px 20px;
min-width: 0;
font-size: 16px;
@@ -1130,6 +1130,12 @@
align-items: center;
-webkit-user-select: text;
+
+ .module-contact-name__profile-name {
+ width: 100%;
+ overflow: hidden !important;
+ text-overflow: ellipsis;
+ }
}
.module-conversation-header__title__profile-name {
diff --git a/ts/components/ConversationListItem.tsx b/ts/components/ConversationListItem.tsx
index febf5e563..993ce5792 100644
--- a/ts/components/ConversationListItem.tsx
+++ b/ts/components/ConversationListItem.tsx
@@ -348,6 +348,11 @@ class ConversationListItem extends React.PureComponent<Props> {
const displayedPubkey = profileName ? shortenedPubkey : phoneNumber;
const displayName = isMe ? i18n('noteToSelf') : profileName;
+ let shouldShowPubkey = false;
+ if (!name || name.length === 0) {
+ shouldShowPubkey = true;
+ }
+
return (
<div className="module-conversation__user">
<ContactName
@@ -357,7 +362,7 @@ class ConversationListItem extends React.PureComponent<Props> {
module="module-conversation__user"
i18n={window.i18n}
boldProfileName={true}
- shouldShowPubkey={false}
+ shouldShowPubkey={shouldShowPubkey}
/>
</div>
);
diff --git a/ts/components/conversation/ContactName.tsx b/ts/components/conversation/ContactName.tsx
index 0f3ab3414..02252f909 100644
--- a/ts/components/conversation/ContactName.tsx
+++ b/ts/components/conversation/ContactName.tsx
@@ -36,7 +36,7 @@ export class ContactName extends React.Component<Props> {
fontWeight: 'bold',
}
: {}) as React.CSSProperties;
- const textProfile = profileName || name || '';
+ const textProfile = profileName || name || i18n('anonymous');
const profileElement = shouldShowProfile ? (
<span style={styles} className={`${prefix}__profile-name`}>
<Emojify text={textProfile} i18n={i18n} />
diff --git a/ts/components/conversation/ConversationHeader.tsx b/ts/components/conversation/ConversationHeader.tsx
index c890cec6b..ba56d7fcf 100644
--- a/ts/components/conversation/ConversationHeader.tsx
+++ b/ts/components/conversation/ConversationHeader.tsx
@@ -179,16 +179,7 @@ class ConversationHeader extends React.Component<Props> {
<span className="module-conversation-header__title-text">{text}</span>
);
- let title;
- if (profileName) {
- title = `${profileName}`;
- } else {
- if (name) {
- title = `${name}`;
- } else {
- title = `User ${window.shortenPubkey(phoneNumber)}`;
- }
- }
+ const title = profileName || name || phoneNumber;
return (
<div className="module-conversation-header__title">
diff --git a/ts/components/session/settings/SessionSettings.tsx b/ts/components/session/settings/SessionSettings.tsx
index 5a3928e89..29193d1ca 100644
--- a/ts/components/session/settings/SessionSettings.tsx
+++ b/ts/components/session/settings/SessionSettings.tsx
@@ -583,8 +583,6 @@ export class SettingsView extends React.Component<SettingsViewProps, State> {
title = window.i18n('anonymous');
}
- title = `${title} ${window.shortenPubkey(blockedNumber)}`;
-
results.push({
id: blockedNumber,
title,