session-desktop/ts/components/conversation/TimerNotification.tsx

60 lines
1.8 KiB
TypeScript

import React from 'react';
import { Intl } from '../Intl';
import { missingCaseError } from '../../util/missingCaseError';
import { SessionIcon } from '../session/icon';
import { PropsForExpirationTimer } from '../../state/ducks/conversations';
import { ReadableMessage } from './ReadableMessage';
const TimerNotificationContent = (props: PropsForExpirationTimer) => {
const { pubkey, profileName, timespan, type, disabled } = props;
const changeKey = disabled ? 'disabledDisappearingMessages' : 'theyChangedTheTimer';
const contact = (
<span key={`external-${pubkey}`} className="module-timer-notification__contact">
{profileName || pubkey}
</span>
);
switch (type) {
case 'fromOther':
return <Intl id={changeKey} components={[contact, timespan]} />;
case 'fromMe':
return disabled
? window.i18n('youDisabledDisappearingMessages')
: window.i18n('youChangedTheTimer', [timespan]);
case 'fromSync':
return disabled
? window.i18n('disappearingMessagesDisabled')
: window.i18n('timerSetOnSync', [timespan]);
default:
throw missingCaseError(type);
}
};
export const TimerNotification = (props: PropsForExpirationTimer) => {
const { messageId, receivedAt, isUnread } = props;
return (
<ReadableMessage
messageId={messageId}
receivedAt={receivedAt}
isUnread={isUnread}
key={`readable-message-${messageId}`}
>
<div className="module-timer-notification" id={`msg-${props.messageId}`}>
<div className="module-timer-notification__message">
<div>
<SessionIcon iconType="stopwatch" iconSize={'small'} iconColor={'#ABABAB'} />
</div>
<div>
<TimerNotificationContent {...props} />
</div>
</div>
</div>
</ReadableMessage>
);
};