Spam Reporting UI changes
This commit is contained in:
parent
e031d136a1
commit
8387f938eb
88 changed files with 2711 additions and 807 deletions
|
@ -2,52 +2,57 @@
|
|||
// SPDX-License-Identifier: AGPL-3.0-only
|
||||
|
||||
import * as React from 'react';
|
||||
import type { PropsType as ContactNameProps } from './ContactName';
|
||||
import { ContactName } from './ContactName';
|
||||
import { Button, ButtonVariant } from '../Button';
|
||||
import type { Props as MessageRequestActionsConfirmationProps } from './MessageRequestActionsConfirmation';
|
||||
import type { MessageRequestActionsConfirmationProps } from './MessageRequestActionsConfirmation';
|
||||
import {
|
||||
MessageRequestActionsConfirmation,
|
||||
MessageRequestState,
|
||||
} from './MessageRequestActionsConfirmation';
|
||||
import { Intl } from '../Intl';
|
||||
import type { LocalizerType } from '../../types/Util';
|
||||
import { strictAssert } from '../../util/assert';
|
||||
|
||||
export type Props = {
|
||||
i18n: LocalizerType;
|
||||
isHidden?: boolean;
|
||||
} & Omit<ContactNameProps, 'module'> &
|
||||
Omit<
|
||||
MessageRequestActionsConfirmationProps,
|
||||
'i18n' | 'state' | 'onChangeState'
|
||||
>;
|
||||
isHidden: boolean | null;
|
||||
} & Omit<
|
||||
MessageRequestActionsConfirmationProps,
|
||||
'i18n' | 'state' | 'onChangeState'
|
||||
>;
|
||||
|
||||
export function MessageRequestActions({
|
||||
addedByName,
|
||||
conversationId,
|
||||
conversationType,
|
||||
conversationName,
|
||||
i18n,
|
||||
isBlocked,
|
||||
isHidden,
|
||||
isReported,
|
||||
acceptConversation,
|
||||
blockAndReportSpam,
|
||||
blockConversation,
|
||||
conversationId,
|
||||
conversationType,
|
||||
reportSpam,
|
||||
deleteConversation,
|
||||
firstName,
|
||||
i18n,
|
||||
isHidden,
|
||||
isBlocked,
|
||||
title,
|
||||
}: Props): JSX.Element {
|
||||
const [mrState, setMrState] = React.useState(MessageRequestState.default);
|
||||
|
||||
const name = (
|
||||
<strong
|
||||
key="name"
|
||||
className="module-message-request-actions__message__name"
|
||||
>
|
||||
<ContactName firstName={firstName} title={title} preferFirstName />
|
||||
</strong>
|
||||
);
|
||||
const nameValue =
|
||||
conversationType === 'direct' ? conversationName : addedByName;
|
||||
|
||||
let message: JSX.Element | undefined;
|
||||
if (conversationType === 'direct') {
|
||||
strictAssert(nameValue != null, 'nameValue is null');
|
||||
const name = (
|
||||
<strong
|
||||
key="name"
|
||||
className="module-message-request-actions__message__name"
|
||||
>
|
||||
<ContactName {...nameValue} preferFirstName />
|
||||
</strong>
|
||||
);
|
||||
|
||||
if (isBlocked) {
|
||||
message = (
|
||||
<Intl
|
||||
|
@ -87,39 +92,26 @@ export function MessageRequestActions({
|
|||
<>
|
||||
{mrState !== MessageRequestState.default ? (
|
||||
<MessageRequestActionsConfirmation
|
||||
addedByName={addedByName}
|
||||
conversationId={conversationId}
|
||||
conversationType={conversationType}
|
||||
conversationName={conversationName}
|
||||
i18n={i18n}
|
||||
isBlocked={isBlocked}
|
||||
isReported={isReported}
|
||||
state={mrState}
|
||||
acceptConversation={acceptConversation}
|
||||
blockAndReportSpam={blockAndReportSpam}
|
||||
blockConversation={blockConversation}
|
||||
conversationId={conversationId}
|
||||
conversationType={conversationType}
|
||||
reportSpam={reportSpam}
|
||||
deleteConversation={deleteConversation}
|
||||
i18n={i18n}
|
||||
onChangeState={setMrState}
|
||||
state={mrState}
|
||||
title={title}
|
||||
/>
|
||||
) : null}
|
||||
<div className="module-message-request-actions">
|
||||
<p className="module-message-request-actions__message">{message}</p>
|
||||
<div className="module-message-request-actions__buttons">
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.deleting);
|
||||
}}
|
||||
variant={ButtonVariant.SecondaryDestructive}
|
||||
>
|
||||
{i18n('icu:MessageRequests--delete')}
|
||||
</Button>
|
||||
{isBlocked ? (
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.unblocking);
|
||||
}}
|
||||
variant={ButtonVariant.SecondaryAffirmative}
|
||||
>
|
||||
{i18n('icu:MessageRequests--unblock')}
|
||||
</Button>
|
||||
) : (
|
||||
{!isBlocked && (
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.blocking);
|
||||
|
@ -129,6 +121,36 @@ export function MessageRequestActions({
|
|||
{i18n('icu:MessageRequests--block')}
|
||||
</Button>
|
||||
)}
|
||||
{(isReported || isBlocked) && (
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.deleting);
|
||||
}}
|
||||
variant={ButtonVariant.SecondaryDestructive}
|
||||
>
|
||||
{i18n('icu:MessageRequests--delete')}
|
||||
</Button>
|
||||
)}
|
||||
{!isReported && (
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.reportingAndMaybeBlocking);
|
||||
}}
|
||||
variant={ButtonVariant.SecondaryDestructive}
|
||||
>
|
||||
{i18n('icu:MessageRequests--reportAndMaybeBlock')}
|
||||
</Button>
|
||||
)}
|
||||
{isBlocked && (
|
||||
<Button
|
||||
onClick={() => {
|
||||
setMrState(MessageRequestState.unblocking);
|
||||
}}
|
||||
variant={ButtonVariant.SecondaryAffirmative}
|
||||
>
|
||||
{i18n('icu:MessageRequests--unblock')}
|
||||
</Button>
|
||||
)}
|
||||
{!isBlocked ? (
|
||||
<Button
|
||||
onClick={() => acceptConversation(conversationId)}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue