Skip to content

Commit 3700c6a

Browse files
authored
Merge branch 'master' into 2313-timestamp
2 parents a726229 + 04fe2c3 commit 3700c6a

108 files changed

Lines changed: 584 additions & 560 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

CHANGELOG.md

Lines changed: 506 additions & 502 deletions

lerna.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
"lerna": "3.19.0",
33
"packages": [
44
"packages/*",
5+
"samples/01.getting-started/g.hybrid-react-npm",
56
"samples/04.api/e.piping-to-redux",
67
"samples/04.api/f.selectable-activity",
78
"samples/04.api/g.chat-send-history",

packages/component/src/Activity/CarouselFilmStrip.js

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -7,25 +7,18 @@ import PropTypes from 'prop-types';
77
import React from 'react';
88
import remarkStripMarkdown from '../Utils/remarkStripMarkdown';
99

10-
import { Constants } from 'botframework-webchat-core';
11-
1210
import Avatar from './Avatar';
1311
import Bubble from './Bubble';
1412
import connectToWebChat from '../connectToWebChat';
1513
import ScreenReaderText from '../ScreenReaderText';
1614
import SendStatus from './SendStatus';
1715
import textFormatToContentType from '../Utils/textFormatToContentType';
18-
import Timestamp from './Timestamp';
1916
import useAvatarForBot from '../hooks/useAvatarForBot';
2017
import useAvatarForUser from '../hooks/useAvatarForUser';
2118
import useLocalize from '../hooks/useLocalize';
2219
import useStyleOptions from '../hooks/useStyleOptions';
2320
import useStyleSet from '../hooks/useStyleSet';
2421

25-
const {
26-
ActivityClientState: { SENDING, SEND_FAILED }
27-
} = Constants;
28-
2922
const ROOT_CSS = css({
3023
display: 'flex',
3124
MsOverflowStyle: 'none',
@@ -107,7 +100,7 @@ const WebChatCarouselFilmStrip = ({
107100

108101
const {
109102
attachments = [],
110-
channelData: { messageBack: { displayText: messageBackDisplayText } = {}, state } = {},
103+
channelData: { messageBack: { displayText: messageBackDisplayText } = {} } = {},
111104
from: { role } = {},
112105
text,
113106
textFormat
@@ -156,11 +149,7 @@ const WebChatCarouselFilmStrip = ({
156149
))}
157150
</ul>
158151
<div className={classNames({ webchat__carousel__item_indented: indented })}>
159-
{state === SENDING || state === SEND_FAILED ? (
160-
<SendStatus activity={activity} />
161-
) : (
162-
<Timestamp activity={activity} className={timestampClassName} />
163-
)}
152+
<SendStatus activity={activity} className={timestampClassName} />
164153
</div>
165154
</div>
166155
</div>

packages/component/src/Activity/SendStatus.js

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
import { Constants } from 'botframework-webchat-core';
2+
import classNames from 'classnames';
23
import PropTypes from 'prop-types';
34
import React, { useCallback } from 'react';
45

56
import connectToWebChat from '../connectToWebChat';
67
import ScreenReaderText from '../ScreenReaderText';
8+
import Timestamp from './Timestamp';
79
import useFocusSendBox from '../hooks/useFocusSendBox';
810
import useLocalize from '../hooks/useLocalize';
911
import usePostActivity from '../hooks/usePostActivity';
@@ -30,7 +32,7 @@ const connectSendStatus = (...selectors) =>
3032
...selectors
3133
);
3234

33-
const SendStatus = ({ activity }) => {
35+
const SendStatus = ({ activity, timestampClassName }) => {
3436
const [{ sendStatus: sendStatusStyleSet }] = useStyleSet();
3537
const focusSendBox = useFocusSendBox();
3638
const postActivity = usePostActivity();
@@ -56,11 +58,9 @@ const SendStatus = ({ activity }) => {
5658
);
5759

5860
const sendFailedRetryMatch = /\{Retry\}/u.exec(sendFailedText);
59-
const {
60-
channelData: { state }
61-
} = activity;
61+
const { channelData: { state } = {} } = activity;
6262

63-
return (
63+
return state === SENDING || state === SEND_FAILED ? (
6464
<React.Fragment>
6565
<ScreenReaderText text={localizedSendStatus + localizedSending} />
6666
<span aria-hidden={true} className={sendStatusStyleSet}>
@@ -85,6 +85,8 @@ const SendStatus = ({ activity }) => {
8585
)}
8686
</span>
8787
</React.Fragment>
88+
) : (
89+
<Timestamp activity={activity} aria-hidden={true} className={classNames('timestamp', timestampClassName)} />
8890
);
8991
};
9092

@@ -93,7 +95,8 @@ SendStatus.propTypes = {
9395
channelData: PropTypes.shape({
9496
state: PropTypes.string
9597
})
96-
}).isRequired
98+
}).isRequired,
99+
timestampClassName: PropTypes.string.isRequired
97100
};
98101

99102
export default SendStatus;

packages/component/src/Activity/StackedLayout.js

Lines changed: 2 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
/* eslint react/no-array-index-key: "off" */
22

3-
import { Constants } from 'botframework-webchat-core';
43
import { css } from 'glamor';
54
import classNames from 'classnames';
65
import PropTypes from 'prop-types';
@@ -13,18 +12,13 @@ import connectToWebChat from '../connectToWebChat';
1312
import ScreenReaderText from '../ScreenReaderText';
1413
import SendStatus from './SendStatus';
1514
import textFormatToContentType from '../Utils/textFormatToContentType';
16-
import Timestamp from './Timestamp';
1715
import useAvatarForBot from '../hooks/useAvatarForBot';
1816
import useAvatarForUser from '../hooks/useAvatarForUser';
1917
import useLocalize from '../hooks/useLocalize';
2018
import useLocalizeDate from '../hooks/useLocalizeDate';
2119
import useStyleOptions from '../hooks/useStyleOptions';
2220
import useStyleSet from '../hooks/useStyleSet';
2321

24-
const {
25-
ActivityClientState: { SENDING, SEND_FAILED }
26-
} = Constants;
27-
2822
const ROOT_CSS = css({
2923
display: 'flex',
3024

@@ -93,7 +87,7 @@ const StackedLayout = ({ activity, children, timestampClassName }) => {
9387

9488
const {
9589
attachments = [],
96-
channelData: { messageBack: { displayText: messageBackDisplayText } = {}, state } = {},
90+
channelData: { messageBack: { displayText: messageBackDisplayText } = {} } = {},
9791
from: { role } = {},
9892
text,
9993
textFormat,
@@ -103,7 +97,6 @@ const StackedLayout = ({ activity, children, timestampClassName }) => {
10397
const activityDisplayText = messageBackDisplayText || text;
10498
const fromUser = role === 'user';
10599
const initials = fromUser ? userInitials : botInitials;
106-
const showSendStatus = state === SENDING || state === SEND_FAILED;
107100
const plainText = remarkStripMarkdown(text);
108101
const indented = fromUser ? bubbleFromUserNubSize : bubbleNubSize;
109102

@@ -161,11 +154,7 @@ const StackedLayout = ({ activity, children, timestampClassName }) => {
161154
</div>
162155
))}
163156
<div className={classNames('webchat__row', { webchat__stacked_item_indented: indented })}>
164-
{showSendStatus ? (
165-
<SendStatus activity={activity} className="timestamp" />
166-
) : (
167-
<Timestamp activity={activity} aria-hidden={true} className={classNames('timestamp', timestampClassName)} />
168-
)}
157+
<SendStatus activity={activity} className="timestamp" timestampClassName={timestampClassName} />
169158
<div className="filler" />
170159
</div>
171160
</div>

packages/component/src/Activity/Timestamp.js

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,22 @@ import useStyleSet from '../hooks/useStyleSet';
99

1010
const Timestamp = ({ activity: { timestamp }, 'aria-hidden': ariaHidden, className }) => {
1111
const [{ timestampFormat }] = useStyleOptions();
12-
const [{ timestamp: timestampStyleSet }] = useStyleSet();
12+
const [{ timestamp: timestampStyleSet, sendStatus: sendStatusStyleSet }] = useStyleSet();
13+
14+
timestampStyleSet &&
15+
console.warn(
16+
'Web Chat: styleSet.timestamp is being deprecated. Please use styleSet.sendStatus. This deprecation migration will be removed on or after December 31, 2021.'
17+
);
1318

1419
if (!timestamp) {
1520
return false;
1621
}
1722

1823
return (
19-
<span aria-hidden={ariaHidden} className={classNames(timestampStyleSet + '', (className || '') + '')}>
24+
<span
25+
aria-hidden={ariaHidden}
26+
className={classNames((timestampStyleSet || sendStatusStyleSet) + '', (className || '') + '')}
27+
>
2028
{timestampFormat === 'relative' ? <RelativeTime value={timestamp} /> : <AbsoluteTime value={timestamp} />}
2129
</span>
2230
);

packages/component/src/Styles/StyleSet/Timestamp.js

Lines changed: 0 additions & 8 deletions
This file was deleted.

packages/component/src/Styles/createStyleSet.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@ import createSuggestedActionsStyle from './StyleSet/SuggestedActions';
2727
import createSuggestedActionsStyleSet from './StyleSet/SuggestedActionsStyleSet';
2828
import createSuggestedActionStyle from './StyleSet/SuggestedAction';
2929
import createTextContentStyle from './StyleSet/TextContent';
30-
import createTimestampStyle from './StyleSet/Timestamp';
3130
import createTypingAnimationStyle from './StyleSet/TypingAnimation';
3231
import createTypingIndicatorStyle from './StyleSet/TypingIndicator';
3332
import createUploadAttachmentStyle from './StyleSet/UploadAttachment';
@@ -201,7 +200,6 @@ export default function createStyleSet(options) {
201200
suggestedAction: createSuggestedActionStyle(options),
202201
suggestedActions: createSuggestedActionsStyle(options),
203202
textContent: createTextContentStyle(options),
204-
timestamp: createTimestampStyle(options),
205203
typingAnimation: createTypingAnimationStyle(options),
206204
typingIndicator: createTypingIndicatorStyle(options),
207205
uploadAttachment: createUploadAttachmentStyle(options),

packages/component/src/Utils/CroppedImage.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ CroppedImage.defaultProps = {
3535
CroppedImage.propTypes = {
3636
alt: PropTypes.string,
3737
className: PropTypes.string,
38-
height: PropTypes.number.isRequired,
38+
height: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired,
3939
src: PropTypes.string.isRequired,
4040
width: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired
4141
};

samples/01.getting-started/g.hybrid-react-npm/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
"name": "root",
33
"version": "1.0.0",
44
"description": "",
5+
"homepage": "https://microsoft.github.io/BotFramework-WebChat/01.getting-started/g.hybrid-react-npm/",
56
"main": "index.js",
67
"private": true,
78
"scripts": {

0 commit comments

Comments
 (0)