You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
83 lines
2.4 KiB
TypeScript
83 lines
2.4 KiB
TypeScript
import React from 'react';
|
|
|
|
import { isEmpty } from 'lodash';
|
|
import styled from 'styled-components';
|
|
import { useIsPrivate, useIsPublic } from '../../../../hooks/useParamSelector';
|
|
import {
|
|
ConversationInteractionStatus,
|
|
ConversationInteractionType,
|
|
} from '../../../../interactions/conversationInteractions';
|
|
import { PropsForInteractionNotification } from '../../../../state/ducks/conversations';
|
|
import { assertUnreachable } from '../../../../types/sqlSharedTypes';
|
|
import { Flex } from '../../../basic/Flex';
|
|
import { ReadableMessage } from './ReadableMessage';
|
|
|
|
const StyledFailText = styled.div`
|
|
color: var(--danger-color);
|
|
`;
|
|
|
|
export const InteractionNotification = (props: PropsForInteractionNotification) => {
|
|
const { notificationType, convoId, messageId, receivedAt, isUnread } = props;
|
|
|
|
const { interactionStatus, interactionType } = notificationType;
|
|
|
|
const isGroup = !useIsPrivate(convoId);
|
|
const isCommunity = useIsPublic(convoId);
|
|
|
|
// NOTE at this time we don't show visible control messages in communities, that might change in future...
|
|
if (isCommunity) {
|
|
return null;
|
|
}
|
|
|
|
if (interactionStatus !== ConversationInteractionStatus.Error) {
|
|
// NOTE For now we only show interaction errors in the message history
|
|
return null;
|
|
}
|
|
|
|
let text = '';
|
|
|
|
switch (interactionType) {
|
|
case ConversationInteractionType.Hide:
|
|
// this can't happen
|
|
break;
|
|
case ConversationInteractionType.Leave:
|
|
text = isCommunity
|
|
? window.i18n('leaveCommunityFailedPleaseTryAgain')
|
|
: isGroup
|
|
? window.i18n('leaveGroupFailedPleaseTryAgain')
|
|
: window.i18n('deleteConversationFailedPleaseTryAgain');
|
|
break;
|
|
default:
|
|
assertUnreachable(
|
|
interactionType,
|
|
`InteractionErrorMessage: Missing case error "${interactionType}"`
|
|
);
|
|
}
|
|
|
|
if (isEmpty(text)) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<ReadableMessage
|
|
messageId={messageId}
|
|
receivedAt={receivedAt}
|
|
isUnread={isUnread}
|
|
key={`readable-message-${messageId}`}
|
|
dataTestId="interaction-notification"
|
|
>
|
|
<Flex
|
|
id={`convo-interaction-${convoId}`}
|
|
container={true}
|
|
flexDirection="row"
|
|
alignItems="center"
|
|
justifyContent="center"
|
|
margin={'var(--margins-md) var(--margins-sm)'}
|
|
data-testid="control-message"
|
|
>
|
|
<StyledFailText>{text}</StyledFailText>
|
|
</Flex>
|
|
</ReadableMessage>
|
|
);
|
|
};
|