@botonic/react
Version:
Build Chatbots using React
40 lines • 2.31 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useContext } from 'react';
import { WEBCHAT } from '../../constants';
import { SENDERS } from '../../index-types';
import { resolveImage } from '../../util';
import { WebchatContext } from '../../webchat/context';
import { TimestampContainer, TimestampText } from './styles';
export const resolveMessageTimestamps = (getThemeProperty, timestampEnabled) => {
const timestampsFormat = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.messageTimestampsFormat);
const timestampStyle = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.messageTimestampsStyle);
const timestampsEnabled = Boolean(timestampEnabled !== undefined
? timestampEnabled
: getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.enableMessageTimestamps, Boolean(timestampStyle) || Boolean(timestampsFormat) || false));
const defaultTimestampFormat = {
month: 'short',
day: 'numeric',
hour: 'numeric',
minute: 'numeric',
second: 'numeric',
};
const getFormattedTimestamp = timestampsFormat
? timestampsFormat()
: // @ts-ignore
new Date().toLocaleString(undefined, defaultTimestampFormat);
return {
timestampsEnabled,
getFormattedTimestamp,
timestampStyle,
};
};
export const MessageTimestamp = ({ timestamp, style, sentBy, }) => {
const { getThemeProperty } = useContext(WebchatContext);
const isSentByUser = sentBy === SENDERS.user;
const isSentByAgent = sentBy === SENDERS.agent;
const BotMessageImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.botMessageImage);
const AgentMessageImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.agentMessageImage, BotMessageImage);
const timestampsWithImage = getThemeProperty(WEBCHAT.CUSTOM_PROPERTIES.messageTimestampsWithImage);
return (_jsxs(TimestampContainer, Object.assign({ className: `botonic-timestamp-container ${sentBy}`, isSentByUser: isSentByUser }, { children: [timestampsWithImage && BotMessageImage && !isSentByUser && (_jsx("img", { src: resolveImage(isSentByAgent ? AgentMessageImage : BotMessageImage) })), _jsx(TimestampText, Object.assign({ isSentByUser: isSentByUser, style: style }, { children: timestamp }))] })));
};
//# sourceMappingURL=timestamps.js.map