Do not nest buttons in the conversation header
This commit is contained in:
parent
781531d8d7
commit
d39ef234e0
1 changed files with 20 additions and 14 deletions
|
@ -54,6 +54,7 @@ export function ConversationDetailsHeader({
|
||||||
|
|
||||||
let preferredBadge: undefined | BadgeType;
|
let preferredBadge: undefined | BadgeType;
|
||||||
let subtitle: ReactNode;
|
let subtitle: ReactNode;
|
||||||
|
let hasNestedButton = false;
|
||||||
if (isGroup) {
|
if (isGroup) {
|
||||||
if (conversation.groupDescription) {
|
if (conversation.groupDescription) {
|
||||||
subtitle = (
|
subtitle = (
|
||||||
|
@ -63,6 +64,7 @@ export function ConversationDetailsHeader({
|
||||||
title={conversation.title}
|
title={conversation.title}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
hasNestedButton = true;
|
||||||
} else if (canEdit) {
|
} else if (canEdit) {
|
||||||
subtitle = i18n('icu:ConversationDetailsHeader--add-group-description');
|
subtitle = i18n('icu:ConversationDetailsHeader--add-group-description');
|
||||||
} else {
|
} else {
|
||||||
|
@ -163,21 +165,25 @@ export function ConversationDetailsHeader({
|
||||||
>
|
>
|
||||||
{contents}
|
{contents}
|
||||||
</button>
|
</button>
|
||||||
<button
|
{hasNestedButton ? (
|
||||||
type="button"
|
|
||||||
onClick={ev => {
|
|
||||||
if (ev.target instanceof HTMLAnchorElement) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
ev.preventDefault();
|
|
||||||
ev.stopPropagation();
|
|
||||||
startEditing(false);
|
|
||||||
}}
|
|
||||||
className={bem('root', 'editable')}
|
|
||||||
>
|
|
||||||
<div className={bem('subtitle')}>{subtitle}</div>
|
<div className={bem('subtitle')}>{subtitle}</div>
|
||||||
</button>
|
) : (
|
||||||
|
<button
|
||||||
|
type="button"
|
||||||
|
onClick={ev => {
|
||||||
|
if (ev.target instanceof HTMLAnchorElement) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
startEditing(false);
|
||||||
|
}}
|
||||||
|
className={bem('root', 'editable')}
|
||||||
|
>
|
||||||
|
<div className={bem('subtitle')}>{subtitle}</div>
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue