@pega/cosmos-react-social 2.0.0-dev.18.0 → 2.0.0-dev.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/components/Chat/Chat.js +4 -4
- package/lib/components/Chat/Chat.js.map +1 -1
- package/lib/components/Chat/ChatBody.js +2 -2
- package/lib/components/Chat/ChatBody.js.map +1 -1
- package/lib/components/Chat/ChatComposer.js +12 -12
- package/lib/components/Chat/ChatComposer.js.map +1 -1
- package/lib/components/Chat/ChatHeader.js +3 -3
- package/lib/components/Chat/ChatHeader.js.map +1 -1
- package/lib/components/Chat/ChatTranscript.js +5 -5
- package/lib/components/Chat/ChatTranscript.js.map +1 -1
- package/lib/components/Chat/Message.js +13 -13
- package/lib/components/Chat/Message.js.map +1 -1
- package/lib/components/Chat/MessageList.js +7 -7
- package/lib/components/Chat/MessageList.js.map +1 -1
- package/lib/components/Chat/RepeatingView.js +5 -5
- package/lib/components/Chat/RepeatingView.js.map +1 -1
- package/lib/components/Chat/SuggestedReplyPicker.js +9 -9
- package/lib/components/Chat/SuggestedReplyPicker.js.map +1 -1
- package/lib/components/Chat/SystemMessage.js +2 -2
- package/lib/components/Chat/SystemMessage.js.map +1 -1
- package/lib/components/Chat/TranscriptMessage.js +3 -3
- package/lib/components/Chat/TranscriptMessage.js.map +1 -1
- package/lib/components/Chat/TypeIndicator.js +1 -1
- package/lib/components/Chat/TypeIndicator.js.map +1 -1
- package/lib/components/Email/Email.js +23 -23
- package/lib/components/Email/Email.js.map +1 -1
- package/lib/components/Email/Email.types.d.ts +26 -31
- package/lib/components/Email/Email.types.d.ts.map +1 -1
- package/lib/components/Email/Email.types.js.map +1 -1
- package/lib/components/Email/EmailComposer.d.ts +4 -4
- package/lib/components/Email/EmailComposer.d.ts.map +1 -1
- package/lib/components/Email/EmailComposer.js +132 -120
- package/lib/components/Email/EmailComposer.js.map +1 -1
- package/lib/components/Email/EmailConversation.js +5 -5
- package/lib/components/Email/EmailConversation.js.map +1 -1
- package/lib/components/Email/EmailEntity.d.ts.map +1 -1
- package/lib/components/Email/EmailEntity.js +10 -2
- package/lib/components/Email/EmailEntity.js.map +1 -1
- package/lib/components/Email/EmailSelector.d.ts +14 -0
- package/lib/components/Email/EmailSelector.d.ts.map +1 -0
- package/lib/components/Email/EmailSelector.js +62 -0
- package/lib/components/Email/EmailSelector.js.map +1 -0
- package/lib/components/Email/EmailShell.js +9 -9
- package/lib/components/Email/EmailShell.js.map +1 -1
- package/lib/components/Email/EmailSummaryItem.js +4 -4
- package/lib/components/Email/EmailSummaryItem.js.map +1 -1
- package/lib/components/Email/EmailSummaryList.js +7 -7
- package/lib/components/Email/EmailSummaryList.js.map +1 -1
- package/lib/components/Feed/Feed.js +5 -5
- package/lib/components/Feed/Feed.js.map +1 -1
- package/lib/components/Feed/FeedAttachments.js +4 -4
- package/lib/components/Feed/FeedAttachments.js.map +1 -1
- package/lib/components/Feed/FeedContent.js +1 -1
- package/lib/components/Feed/FeedContent.js.map +1 -1
- package/lib/components/Feed/FeedModalList.js +1 -1
- package/lib/components/Feed/FeedModalList.js.map +1 -1
- package/lib/components/Feed/FeedNewPost.js +4 -4
- package/lib/components/Feed/FeedNewPost.js.map +1 -1
- package/lib/components/Feed/FeedNewPostTypeMenu.js +9 -9
- package/lib/components/Feed/FeedNewPostTypeMenu.js.map +1 -1
- package/lib/components/Feed/FeedPost.d.ts.map +1 -1
- package/lib/components/Feed/FeedPost.js +26 -16
- package/lib/components/Feed/FeedPost.js.map +1 -1
- package/lib/components/Feed/FeedReply.d.ts.map +1 -1
- package/lib/components/Feed/FeedReply.js +18 -12
- package/lib/components/Feed/FeedReply.js.map +1 -1
- package/lib/components/Feed/FeedReplyInput.js +5 -5
- package/lib/components/Feed/FeedReplyInput.js.map +1 -1
- package/lib/components/Feed/FeedRichText.js +2 -2
- package/lib/components/Feed/FeedRichText.js.map +1 -1
- package/lib/components/HashtagButton/HashtagButton.js +1 -1
- package/lib/components/HashtagButton/HashtagButton.js.map +1 -1
- package/lib/components/MentionButton/MentionButton.d.ts.map +1 -1
- package/lib/components/MentionButton/MentionButton.js +1 -1
- package/lib/components/MentionButton/MentionButton.js.map +1 -1
- package/package.json +5 -5
- package/lib/components/Feed/utils.d.ts +0 -3
- package/lib/components/Feed/utils.d.ts.map +0 -1
- package/lib/components/Feed/utils.js +0 -19
- package/lib/components/Feed/utils.js.map +0 -1
|
@@ -6,6 +6,7 @@ import { StyledRichTextEditor } from '@pega/cosmos-react-rte';
|
|
|
6
6
|
import BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';
|
|
7
7
|
import * as arrowMicroDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-down.icon';
|
|
8
8
|
import * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';
|
|
9
|
+
import { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils/utils';
|
|
9
10
|
import FeedButton from './FeedButton';
|
|
10
11
|
import FeedAttachments from './FeedAttachments';
|
|
11
12
|
import { StyledFeedReplyContainer } from './FeedReply';
|
|
@@ -14,7 +15,6 @@ import FeedReplyInput from './FeedReplyInput';
|
|
|
14
15
|
import { FeedContext, FeedReplyContext } from './Feed.context';
|
|
15
16
|
import FeedRichText from './FeedRichText';
|
|
16
17
|
import FeedModalList from './FeedModalList';
|
|
17
|
-
import { generateFeedLabel } from './utils';
|
|
18
18
|
registerIcon(arrowMicroDownIcon, caretLeftIcon);
|
|
19
19
|
const defaultProps = {
|
|
20
20
|
info: {
|
|
@@ -102,10 +102,14 @@ const FeedPost = (props) => {
|
|
|
102
102
|
const numReplies = replyCount || replies?.length;
|
|
103
103
|
const postTypeAttributes = useMemo(() => {
|
|
104
104
|
if (postType === 'private') {
|
|
105
|
+
const recipientsList = recipients.map(x => x.primary);
|
|
105
106
|
return {
|
|
106
107
|
icon: 'users-solid',
|
|
107
|
-
ariaLabel: `${t('feed_private_post')} t('feed_recipients')} ${
|
|
108
|
-
label:
|
|
108
|
+
ariaLabel: `${t('feed_private_post')} t('feed_recipients')} ${formatListToLocaleString(recipientsList, t, locale, { count: recipientsCount })}`,
|
|
109
|
+
label: formatListToLocaleString(recipientsList, t, locale, {
|
|
110
|
+
count: recipientsCount,
|
|
111
|
+
separator: '\n'
|
|
112
|
+
})
|
|
109
113
|
};
|
|
110
114
|
}
|
|
111
115
|
return {
|
|
@@ -115,9 +119,15 @@ const FeedPost = (props) => {
|
|
|
115
119
|
};
|
|
116
120
|
}, [postType, recipients, recipientsCount]);
|
|
117
121
|
const likesAttributes = useMemo(() => {
|
|
122
|
+
const likesList = likes.map(x => x.primary.toString());
|
|
118
123
|
return {
|
|
119
|
-
ariaLabel: `${t('feed_liked_by')} ${
|
|
120
|
-
|
|
124
|
+
ariaLabel: `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {
|
|
125
|
+
count: likeCount
|
|
126
|
+
})}`,
|
|
127
|
+
label: formatListToLocaleString(likesList, t, locale, {
|
|
128
|
+
count: likeCount,
|
|
129
|
+
separator: '\n'
|
|
130
|
+
})
|
|
121
131
|
};
|
|
122
132
|
}, [likes, likeCount]);
|
|
123
133
|
const handleEdit = () => {
|
|
@@ -129,15 +139,15 @@ const FeedPost = (props) => {
|
|
|
129
139
|
setEditMode(false);
|
|
130
140
|
}
|
|
131
141
|
};
|
|
132
|
-
return (_jsx(FeedReplyContext.Provider,
|
|
142
|
+
return (_jsx(FeedReplyContext.Provider, { value: { onShowReplyInput: () => setReplyInputOpen(true) }, children: _jsxs(Card, { ...restProps, as: StyledFeedPost, onMouseEnter: () => {
|
|
133
143
|
onMouseEnter?.({ postId: id });
|
|
134
144
|
}, onMouseLeave: () => {
|
|
135
145
|
onMouseLeave?.({ postId: id });
|
|
136
|
-
}
|
|
146
|
+
}, children: [_jsx(CardHeader, { children: _jsx(SummaryItem, { as: FullWidthSummaryItem, visual: onUserClick ? (_jsx(BareButton, { onClick: (event) => {
|
|
137
147
|
onUserClick?.({ postId: id, username }, event);
|
|
138
|
-
}
|
|
148
|
+
}, children: userVisual }, void 0)) : (userVisual), primary: _jsxs("div", { children: [onUserClick ? (_jsx(Button, { variant: 'text', onClick: (event) => {
|
|
139
149
|
onUserClick?.({ postId: id, username }, event);
|
|
140
|
-
}
|
|
150
|
+
}, children: _jsx(Text, { variant: 'h3', children: fullname }, void 0) }, void 0)) : (_jsx(Text, { variant: 'h3', children: fullname }, void 0)), postContext && _jsxs(Text, { variant: 'primary', children: [" ", t('feed_context', [postContext])] }, void 0)] }, void 0), secondary: _jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Button, { variant: 'text', icon: true, onClick: recipients.length
|
|
141
151
|
? () => {
|
|
142
152
|
if (recipientsCount > 10) {
|
|
143
153
|
recipientsModalRef.current = create(FeedModalList, {
|
|
@@ -148,7 +158,7 @@ const FeedPost = (props) => {
|
|
|
148
158
|
});
|
|
149
159
|
}
|
|
150
160
|
}
|
|
151
|
-
: onRecipientInteraction, onFocus: onRecipientInteraction, onMouseOver: onRecipientInteraction, "aria-label": postTypeAttributes.ariaLabel, label: postTypeAttributes.label
|
|
161
|
+
: onRecipientInteraction, onFocus: onRecipientInteraction, onMouseOver: onRecipientInteraction, "aria-label": postTypeAttributes.ariaLabel, label: postTypeAttributes.label, children: _jsx(Icon, { name: postTypeAttributes.icon }, void 0) }, void 0), _jsx(MetaList, { items: edited ? [timeElapsed, t('edited')] : [timeElapsed] }, void 0)] }, void 0), actions: menuItems ? (_jsx(MenuButton, { text: 'More', menu: {
|
|
152
162
|
items: onEditSubmit &&
|
|
153
163
|
typeof content === 'string' &&
|
|
154
164
|
username === loggedInUser.username
|
|
@@ -160,15 +170,15 @@ const FeedPost = (props) => {
|
|
|
160
170
|
}
|
|
161
171
|
])
|
|
162
172
|
: menuItems
|
|
163
|
-
}, icon: 'more', iconOnly: true, variant: 'simple' }, void 0)) : undefined }, void 0) }, void 0), _jsxs(CardContent, { children: [editMode ? (_jsxs(_Fragment, { children: [_jsx(StyledPostEdit,
|
|
173
|
+
}, icon: 'more', iconOnly: true, variant: 'simple' }, void 0)) : undefined }, void 0) }, void 0), _jsxs(CardContent, { children: [editMode ? (_jsxs(_Fragment, { children: [_jsx(StyledPostEdit, { ref: editTextAreaRef, children: _jsx(FeedRichText, { onChange: () => {
|
|
164
174
|
setEmptyEditText(rteRef.current?.getPlainText().trim() === '');
|
|
165
175
|
setPostModified(rteRef.current?.getPlainText() !== content);
|
|
166
|
-
}, autoFocus: true, onSubmit: handleEdit, defaultValue: content, ref: rteRef }, void 0) }
|
|
176
|
+
}, autoFocus: true, onSubmit: handleEdit, defaultValue: content, ref: rteRef }, void 0) }, void 0), _jsxs(Flex, { container: { justify: 'between', pad: [2, 0, 0] }, children: [_jsx(Button, { onClick: () => setEditMode(false), "aria-label": `${t('cancel')} ${t('edit')} ${id}`, children: t('cancel') }, void 0), _jsx(Button, { variant: 'primary', disabled: emptyEditText || !postModified, onClick: handleEdit, "aria-label": `${t('update')} ${t('edit')} ${id}`, children: t('update') }, void 0)] }, void 0)] }, void 0)) : (_jsx(FeedContent, { maxContentHeight: maxContentHeight, children: content }, void 0)), _jsx(FeedAttachments, { attachments: attachments }, void 0), _jsxs(Flex, { as: StyledPostFooter, container: { justify: 'between', wrap: 'wrap', gap: 1 }, children: [interactionsEnabled ? (_jsxs(Flex, { container: { gap: 2 }, children: [_jsxs(Button, { variant: 'text', as: FeedButton, onClick: () => {
|
|
167
177
|
onCommentClick?.({ postId: id });
|
|
168
178
|
if (!replyInputOpen) {
|
|
169
179
|
setReplyInputOpen(true);
|
|
170
180
|
}
|
|
171
|
-
}
|
|
181
|
+
}, children: [_jsx(Icon, { name: 'chat' }, void 0), _jsx(Text, { children: commentLabel }, void 0), numReplies > 0 && _jsx(Count, { children: numReplies }, void 0)] }, void 0), _jsxs(Flex, { container: { gap: 0.5 }, children: [_jsxs(Button, { variant: 'text', as: FeedButton, onClick: () => onLikeClick({
|
|
172
182
|
postId: id,
|
|
173
183
|
user: {
|
|
174
184
|
id: loggedInUser.username,
|
|
@@ -176,7 +186,7 @@ const FeedPost = (props) => {
|
|
|
176
186
|
secondary: loggedInUser.meta ? (_jsx(MetaList, { items: loggedInUser.meta }, void 0)) : undefined,
|
|
177
187
|
visual: (_jsx(Avatar, { size: 'l', imageSrc: loggedInUser.avatarSrc, name: loggedInUser.fullname }, void 0))
|
|
178
188
|
}
|
|
179
|
-
}), emphasized: liked
|
|
189
|
+
}), emphasized: liked, children: [_jsx(Icon, { name: liked ? 'thumbs-up-solid' : 'thumbs-up' }, void 0), _jsx(Text, { children: likeLabel }, void 0)] }, void 0), likeCount > 0 && (_jsxs(_Fragment, { children: [_jsx(BareButton, { ref: setCountEl, onClick: likes.length
|
|
180
190
|
? () => {
|
|
181
191
|
if (likeCount > 10) {
|
|
182
192
|
likesModalRef.current = create(FeedModalList, {
|
|
@@ -187,12 +197,12 @@ const FeedPost = (props) => {
|
|
|
187
197
|
});
|
|
188
198
|
}
|
|
189
199
|
}
|
|
190
|
-
: onLikeCountInteraction, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel
|
|
200
|
+
: onLikeCountInteraction, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel, children: _jsx(Count, { children: likeCount }, void 0) }, void 0), _jsx(Tooltip, { target: countEl, showDelay: 'none', hideDelay: 'none', children: likesAttributes.label }, void 0)] }, void 0))] }, void 0)] }, void 0)) : (_jsx("div", {}, void 0)), (onShowLessReplies || onShowMoreReplies) && (_jsxs(Flex, { container: { gap: 0.5 }, children: [replies.length !== numReplies && (_jsxs(_Fragment, { children: [_jsx(Text, { children: t('showing_num_of_num', [replies.length, numReplies]) }, void 0), _jsx("span", { children: "\u2022" }, void 0)] }, void 0)), onShowMoreReplies && replies.length < numReplies && (_jsx(Button, { variant: 'link', onClick: () => onShowMoreReplies({ postId: id }), children: t('show_more') }, void 0)), repliesLoading && _jsx(Progress, { placement: 'inline' }, void 0)] }, void 0))] }, void 0)] }, void 0), !!replies?.length && _jsx(StyledReplies, { children: replies }, void 0), replyInputShown || replyInputOpen ? (_jsx(CardContent, { children: _jsx(FeedReplyInput, { onSetInputRef: ({ ref }) => {
|
|
191
201
|
setReplyInputRef(ref);
|
|
192
202
|
}, id: id, commentLabel: replyInput.commentLabel, attachments: replyInput.attachments, placeholder: replyInput.placeholder, onFilesAdded: replyInput.onFilesAdded, onSubmit: e => {
|
|
193
203
|
setReplyInputOpen(false);
|
|
194
204
|
replyInput.onSubmit(e);
|
|
195
|
-
} }, void 0) }, void 0)) : null, onShowLessReplies && !!replies.length && (_jsxs(Flex,
|
|
205
|
+
} }, void 0) }, void 0)) : null, onShowLessReplies && !!replies.length && (_jsxs(Flex, { container: { justify: 'center', pad: [0, 0, 1], gap: 1 }, children: [_jsx(Button, { variant: 'link', onClick: () => onShowLessReplies({ postId: id }), children: t('show_less') }, void 0), repliesLoading && _jsx(Progress, { placement: 'inline' }, void 0)] }, void 0))] }, void 0) }, void 0));
|
|
196
206
|
};
|
|
197
207
|
FeedPost.defaultProps = defaultProps;
|
|
198
208
|
export default FeedPost;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedPost.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedPost.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactElement,\n useState,\n useEffect,\n MutableRefObject,\n MouseEvent,\n useRef,\n useContext,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n AvatarProps,\n Button,\n Count,\n Card,\n CardContent,\n CardHeader,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n SummaryItem,\n Text,\n defaultThemeProp,\n ForwardProps,\n useElement,\n useI18n,\n Progress,\n useOuterEvent,\n MenuItemProps,\n MetaList,\n Tooltip,\n ModalManagerContext,\n SummaryListItem,\n ModalMethods,\n StyledVisual,\n useConfiguration\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport * as arrowMicroDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-down.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\n\nimport FeedButton from './FeedButton';\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport { StyledFeedReplyContainer } from './FeedReply';\nimport FeedContent, { FeedContentProps } from './FeedContent';\nimport FeedReplyInput, { FeedReplyInputProps } from './FeedReplyInput';\nimport { FeedContext, FeedReplyContext } from './Feed.context';\nimport FeedRichText from './FeedRichText';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\nimport { generateFeedLabel } from './utils';\n\nregisterIcon(arrowMicroDownIcon, caretLeftIcon);\n\nexport interface FeedPostProps {\n /** Unique ID for this activity */\n id: string;\n /** All of the information used to fill text portions, and avatar info */\n info: {\n avatarSrc?: string;\n fullname: string;\n username: string;\n timeElapsed: string;\n content: ReactElement | string;\n postType?: 'public' | 'private';\n recipients?: MenuItemProps[];\n recipientsCount?: number;\n attachments?: AttachedFiles[];\n liked?: boolean;\n icon?: string;\n postContext?: ReactElement | string;\n userStatus?: AvatarProps['status'];\n };\n maxContentHeight?: FeedContentProps['maxContentHeight'];\n /** Button labels for accessibility purposes. */\n interactionInfo: {\n likeLabel: string;\n likes?: SummaryListItem[];\n likeCount?: number;\n commentLabel: string;\n /**\n * @default true\n */\n interactionsEnabled?: boolean;\n };\n /** Callback that runs when the mouse pointer hovers over the Activity. */\n onMouseEnter?: (event: { postId: string }) => void;\n /** Callback that runs when the mouse pointer leaves the Activity. */\n onMouseLeave?: (event: { postId: string }) => void;\n /** Callback that runs when the comment button has been clicked */\n onCommentClick?: (event: { postId: string }) => void;\n /** Callback that runs when the like button has been clicked */\n onLikeClick: (event: { postId: string; user: SummaryListItem }) => void;\n /** Callback that runs when the like count on a post is hovered, focused, or clicked. */\n onLikeCountInteraction?: () => void;\n /** Callback that runs when the bottom of the extended like list Modal is reached, allowing for more likes to be loaded. */\n onLoadMoreLikes?: () => void;\n /** Callback that runs when the private recipient icon on a post is hovered, focused, or clicked. */\n onRecipientInteraction?: () => void;\n /** Callback that runs when the bottom of the extended private recipient list Modal is reached, allowing for more recipients to be loaded. */\n onLoadMoreRecipients?: () => void;\n /** Callback that runs when the user name or visual button has been clicked */\n onUserClick?: (event: { postId: string; username: string }, clickEvent?: MouseEvent) => void;\n /** MenuItems that will populate the three dot menu button */\n menuItems?: MenuItemProps[];\n /** Callback that updates the post after being edited. If undefined, the post will not be editable. */\n onEditSubmit?: (event: { postId: string; value: string }) => void;\n /**\n * Flag that indicates if a post has been previously edited.\n * @default false\n */\n edited?: boolean;\n /** Props that will be passed into the reply input, see FeedReplyInput for more information */\n replyInput: Pick<FeedReplyInputProps, 'onSubmit' | 'placeholder' | 'onFilesAdded'> & {\n commentLabel: FeedReplyInputProps['commentLabel'];\n attachments: FeedReplyInputProps['attachments'];\n };\n /** The default visibility for the reply input */\n replyInputShown?: boolean;\n /** An array to hold FeedReply's inside of this Activity */\n replies?: ReactElement[];\n /** A total count of all replies. */\n replyCount?: number;\n /** Callback that runs when the user clicks Show more button. */\n onShowMoreReplies?: (event: { postId: string }) => void;\n /** Callback that runs when the user clicks Show less button. */\n onShowLessReplies?: (event: { postId: string }) => void;\n /** A loading indicator for the replies. */\n repliesLoading?: boolean;\n}\n\nconst defaultProps: Partial<FeedPostProps> = {\n info: {\n avatarSrc: '',\n fullname: '',\n username: '',\n timeElapsed: '',\n content: ''\n }\n};\n\nexport const StyledFeedPost = styled.div(\n ({ theme }) => css`\n ${StyledFeedReplyContainer}:not(:last-child) {\n margin-block-end: calc(2 * ${theme.base.spacing});\n }\n `\n);\n\nStyledFeedPost.defaultProps = defaultThemeProp;\n\nexport const StyledPostEdit = styled.div(\n ({ theme }) => css`\n ${StyledRichTextEditor} {\n padding: calc(0.5 * ${theme.base.spacing});\n }\n `\n);\n\nStyledPostEdit.defaultProps = defaultThemeProp;\n\nexport const StyledReplies = styled.div(\n ({ theme }) => css`\n border-top: 0.0625rem solid ${theme.base.palette['border-line']};\n padding: calc(1.25 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing});\n `\n);\n\nStyledReplies.defaultProps = defaultThemeProp;\n\nexport const StyledPostFooter = styled.div(\n ({ theme }) => css`\n margin-block-start: ${theme.base.spacing};\n `\n);\n\nStyledPostFooter.defaultProps = defaultThemeProp;\n\nconst FullWidthSummaryItem = styled.div`\n width: 100%;\n\n ${StyledVisual} {\n align-self: start;\n }\n`;\n\nconst FeedPost: FC<ForwardProps & FeedPostProps> = (props: ForwardProps & FeedPostProps) => {\n const {\n id,\n info,\n interactionInfo,\n maxContentHeight = Infinity,\n onMouseEnter,\n onMouseLeave,\n onCommentClick,\n onLikeClick,\n onLikeCountInteraction,\n onLoadMoreLikes,\n onRecipientInteraction,\n onLoadMoreRecipients,\n onUserClick,\n onShowMoreClick,\n newReplyField,\n menuItems,\n onEditSubmit,\n edited = false,\n replies = [],\n replyInput,\n replyInputShown,\n replyCount,\n repliesLoading,\n onShowLessReplies,\n onShowMoreReplies,\n ...restProps\n } = props;\n const {\n avatarSrc,\n fullname,\n username,\n timeElapsed,\n content,\n postType = 'public',\n recipients = [],\n recipientsCount = 0,\n attachments,\n liked,\n icon,\n postContext,\n userStatus\n } = info;\n const {\n likeLabel,\n likes = [],\n likeCount = 0,\n commentLabel,\n interactionsEnabled = true\n } = interactionInfo;\n const loggedInUser = useContext(FeedContext).userInfo;\n\n const t = useI18n();\n const { locale } = useConfiguration();\n const [countEl, setCountEl] = useElement<HTMLButtonElement>();\n const rteRef = useRef<RichTextEditorState>();\n const [editMode, setEditMode] = useState(false);\n const editTextAreaRef = useRef<HTMLDivElement>(null);\n const [emptyEditText, setEmptyEditText] = useState(false);\n const [postModified, setPostModified] = useState(false);\n const [replyInputOpen, setReplyInputOpen] = useState(false);\n const [replyInputRef, setReplyInputRef] = useState<MutableRefObject<\n RichTextEditorState | undefined\n > | null>(null);\n const { create } = useContext(ModalManagerContext);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n const recipientsModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes]);\n\n useEffect(() => {\n if (recipients.length) {\n recipientsModalRef.current?.update({\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients as SummaryListItem[],\n onLoadMore: onLoadMoreRecipients\n });\n }\n }, [recipientsCount, recipients, onLoadMoreRecipients]);\n\n useOuterEvent('mousedown', [editTextAreaRef], () => {\n if (emptyEditText) setEditMode(false);\n });\n\n useEffect(() => {\n if ((replyInputOpen || replyInputShown) && replyInputRef) {\n replyInputRef.current?.focus();\n }\n }, [replyInputOpen, replyInputShown, replyInputRef]);\n\n const userVisual = icon ? (\n <Icon name={icon} />\n ) : (\n <Avatar name={fullname} size='l' imageSrc={avatarSrc} status={userStatus} />\n );\n\n const numReplies = replyCount || replies?.length;\n\n const postTypeAttributes = useMemo(() => {\n if (postType === 'private') {\n return {\n icon: 'users-solid',\n ariaLabel: `${t('feed_private_post')} t('feed_recipients')} ${generateFeedLabel(\n t,\n locale,\n recipients as SummaryListItem[],\n recipientsCount\n )}`,\n label: generateFeedLabel(t, locale, recipients as SummaryListItem[], recipientsCount, '\\n')\n };\n }\n\n return {\n icon: 'globe',\n ariaLabel: t('feed_public_post'),\n label: t('feed_public_post')\n };\n }, [postType, recipients, recipientsCount]);\n\n const likesAttributes = useMemo(() => {\n return {\n ariaLabel: `${t('feed_liked_by')} ${generateFeedLabel(t, locale, likes, likeCount)}`,\n label: generateFeedLabel(t, locale, likes, likeCount, '\\n')\n };\n }, [likes, likeCount]);\n\n const handleEdit = () => {\n if (!emptyEditText && postModified) {\n onEditSubmit?.({\n postId: id,\n value: rteRef.current?.getPlainText() || ''\n });\n setEditMode(false);\n }\n };\n\n return (\n <FeedReplyContext.Provider value={{ onShowReplyInput: () => setReplyInputOpen(true) }}>\n <Card\n {...restProps}\n as={StyledFeedPost}\n onMouseEnter={() => {\n onMouseEnter?.({ postId: id });\n }}\n onMouseLeave={() => {\n onMouseLeave?.({ postId: id });\n }}\n >\n <CardHeader>\n <SummaryItem\n as={FullWidthSummaryItem}\n visual={\n onUserClick ? (\n <BareButton\n onClick={(event: MouseEvent) => {\n onUserClick?.({ postId: id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )\n }\n primary={\n <div>\n {onUserClick ? (\n <Button\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ postId: id, username }, event);\n }}\n >\n <Text variant='h3'>{fullname}</Text>\n </Button>\n ) : (\n <Text variant='h3'>{fullname}</Text>\n )}\n {postContext && <Text variant='primary'> {t('feed_context', [postContext])}</Text>}\n </div>\n }\n secondary={\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Button\n variant='text'\n icon\n onClick={\n recipients.length\n ? () => {\n if (recipientsCount > 10) {\n recipientsModalRef.current = create(FeedModalList, {\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients as SummaryListItem[],\n onLoadMore: onLoadMoreRecipients\n });\n }\n }\n : onRecipientInteraction\n }\n onFocus={onRecipientInteraction}\n onMouseOver={onRecipientInteraction}\n aria-label={postTypeAttributes.ariaLabel}\n label={postTypeAttributes.label}\n >\n <Icon name={postTypeAttributes.icon} />\n </Button>\n <MetaList items={edited ? [timeElapsed, t('edited')] : [timeElapsed]} />\n </Flex>\n }\n actions={\n menuItems ? (\n <MenuButton\n text='More'\n menu={{\n items:\n onEditSubmit &&\n typeof content === 'string' &&\n username === loggedInUser.username\n ? menuItems.concat([\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n }\n ])\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined\n }\n />\n </CardHeader>\n <CardContent>\n {editMode ? (\n <>\n <StyledPostEdit ref={editTextAreaRef}>\n <FeedRichText\n onChange={() => {\n setEmptyEditText(rteRef.current?.getPlainText().trim() === '');\n setPostModified(rteRef.current?.getPlainText() !== content);\n }}\n autoFocus\n onSubmit={handleEdit}\n defaultValue={content}\n ref={rteRef}\n />\n </StyledPostEdit>\n <Flex container={{ justify: 'between', pad: [2, 0, 0] }}>\n <Button\n onClick={() => setEditMode(false)}\n aria-label={`${t('cancel')} ${t('edit')} ${id}`}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n disabled={emptyEditText || !postModified}\n onClick={handleEdit}\n aria-label={`${t('update')} ${t('edit')} ${id}`}\n >\n {t('update')}\n </Button>\n </Flex>\n </>\n ) : (\n <FeedContent maxContentHeight={maxContentHeight}>{content}</FeedContent>\n )}\n <FeedAttachments attachments={attachments} />\n <Flex as={StyledPostFooter} container={{ justify: 'between', wrap: 'wrap', gap: 1 }}>\n {interactionsEnabled ? (\n <Flex container={{ gap: 2 }}>\n <Button\n variant='text'\n as={FeedButton}\n onClick={() => {\n onCommentClick?.({ postId: id });\n if (!replyInputOpen) {\n setReplyInputOpen(true);\n }\n }}\n >\n <Icon name='chat' />\n <Text>{commentLabel}</Text>\n {numReplies > 0 && <Count>{numReplies}</Count>}\n </Button>\n <Flex container={{ gap: 0.5 }}>\n <Button\n variant='text'\n as={FeedButton}\n onClick={() =>\n onLikeClick({\n postId: id,\n user: {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? (\n <MetaList items={loggedInUser.meta} />\n ) : undefined,\n visual: (\n <Avatar\n size='l'\n imageSrc={loggedInUser.avatarSrc}\n name={loggedInUser.fullname}\n />\n )\n }\n })\n }\n emphasized={liked}\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n <Text>{likeLabel}</Text>\n </Button>\n {likeCount > 0 && (\n <>\n <BareButton\n ref={setCountEl}\n onClick={\n likes.length\n ? () => {\n if (likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }\n }\n : onLikeCountInteraction\n }\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n >\n <Count>{likeCount}</Count>\n </BareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label}\n </Tooltip>\n </>\n )}\n </Flex>\n </Flex>\n ) : (\n <div />\n )}\n {(onShowLessReplies || onShowMoreReplies) && (\n <Flex container={{ gap: 0.5 }}>\n {replies.length !== numReplies && (\n <>\n <Text>{t('showing_num_of_num', [replies.length, numReplies])}</Text>\n <span>•</span>\n </>\n )}\n {onShowMoreReplies && replies.length < numReplies && (\n <Button variant='link' onClick={() => onShowMoreReplies({ postId: id })}>\n {t('show_more')}\n </Button>\n )}\n {repliesLoading && <Progress placement='inline' />}\n </Flex>\n )}\n </Flex>\n </CardContent>\n {!!replies?.length && <StyledReplies>{replies}</StyledReplies>}\n {replyInputShown || replyInputOpen ? (\n <CardContent>\n <FeedReplyInput\n onSetInputRef={({ ref }) => {\n setReplyInputRef(ref);\n }}\n id={id}\n commentLabel={replyInput.commentLabel}\n attachments={replyInput.attachments}\n placeholder={replyInput.placeholder}\n onFilesAdded={replyInput.onFilesAdded}\n onSubmit={e => {\n setReplyInputOpen(false);\n replyInput.onSubmit(e);\n }}\n />\n </CardContent>\n ) : null}\n {onShowLessReplies && !!replies.length && (\n <Flex container={{ justify: 'center', pad: [0, 0, 1], gap: 1 }}>\n <Button variant='link' onClick={() => onShowLessReplies({ postId: id })}>\n {t('show_less')}\n </Button>\n {repliesLoading && <Progress placement='inline' />}\n </Flex>\n )}\n </Card>\n </FeedReplyContext.Provider>\n );\n};\n\nFeedPost.defaultProps = defaultProps;\n\nexport default FeedPost;\n"]}
|
|
1
|
+
{"version":3,"file":"FeedPost.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedPost.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactElement,\n useState,\n useEffect,\n MutableRefObject,\n MouseEvent,\n useRef,\n useContext,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n AvatarProps,\n Button,\n Count,\n Card,\n CardContent,\n CardHeader,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n SummaryItem,\n Text,\n defaultThemeProp,\n ForwardProps,\n useElement,\n useI18n,\n Progress,\n useOuterEvent,\n MenuItemProps,\n MetaList,\n Tooltip,\n ModalManagerContext,\n SummaryListItem,\n ModalMethods,\n StyledVisual,\n useConfiguration\n} from '@pega/cosmos-react-core';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport * as arrowMicroDownIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-down.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils/utils';\n\nimport FeedButton from './FeedButton';\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport { StyledFeedReplyContainer } from './FeedReply';\nimport FeedContent, { FeedContentProps } from './FeedContent';\nimport FeedReplyInput, { FeedReplyInputProps } from './FeedReplyInput';\nimport { FeedContext, FeedReplyContext } from './Feed.context';\nimport FeedRichText from './FeedRichText';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\n\nregisterIcon(arrowMicroDownIcon, caretLeftIcon);\n\nexport interface FeedPostProps {\n /** Unique ID for this activity */\n id: string;\n /** All of the information used to fill text portions, and avatar info */\n info: {\n avatarSrc?: string;\n fullname: string;\n username: string;\n timeElapsed: string;\n content: ReactElement | string;\n postType?: 'public' | 'private';\n recipients?: MenuItemProps[];\n recipientsCount?: number;\n attachments?: AttachedFiles[];\n liked?: boolean;\n icon?: string;\n postContext?: ReactElement | string;\n userStatus?: AvatarProps['status'];\n };\n maxContentHeight?: FeedContentProps['maxContentHeight'];\n /** Button labels for accessibility purposes. */\n interactionInfo: {\n likeLabel: string;\n likes?: SummaryListItem[];\n likeCount?: number;\n commentLabel: string;\n /**\n * @default true\n */\n interactionsEnabled?: boolean;\n };\n /** Callback that runs when the mouse pointer hovers over the Activity. */\n onMouseEnter?: (event: { postId: string }) => void;\n /** Callback that runs when the mouse pointer leaves the Activity. */\n onMouseLeave?: (event: { postId: string }) => void;\n /** Callback that runs when the comment button has been clicked */\n onCommentClick?: (event: { postId: string }) => void;\n /** Callback that runs when the like button has been clicked */\n onLikeClick: (event: { postId: string; user: SummaryListItem }) => void;\n /** Callback that runs when the like count on a post is hovered, focused, or clicked. */\n onLikeCountInteraction?: () => void;\n /** Callback that runs when the bottom of the extended like list Modal is reached, allowing for more likes to be loaded. */\n onLoadMoreLikes?: () => void;\n /** Callback that runs when the private recipient icon on a post is hovered, focused, or clicked. */\n onRecipientInteraction?: () => void;\n /** Callback that runs when the bottom of the extended private recipient list Modal is reached, allowing for more recipients to be loaded. */\n onLoadMoreRecipients?: () => void;\n /** Callback that runs when the user name or visual button has been clicked */\n onUserClick?: (event: { postId: string; username: string }, clickEvent?: MouseEvent) => void;\n /** MenuItems that will populate the three dot menu button */\n menuItems?: MenuItemProps[];\n /** Callback that updates the post after being edited. If undefined, the post will not be editable. */\n onEditSubmit?: (event: { postId: string; value: string }) => void;\n /**\n * Flag that indicates if a post has been previously edited.\n * @default false\n */\n edited?: boolean;\n /** Props that will be passed into the reply input, see FeedReplyInput for more information */\n replyInput: Pick<FeedReplyInputProps, 'onSubmit' | 'placeholder' | 'onFilesAdded'> & {\n commentLabel: FeedReplyInputProps['commentLabel'];\n attachments: FeedReplyInputProps['attachments'];\n };\n /** The default visibility for the reply input */\n replyInputShown?: boolean;\n /** An array to hold FeedReply's inside of this Activity */\n replies?: ReactElement[];\n /** A total count of all replies. */\n replyCount?: number;\n /** Callback that runs when the user clicks Show more button. */\n onShowMoreReplies?: (event: { postId: string }) => void;\n /** Callback that runs when the user clicks Show less button. */\n onShowLessReplies?: (event: { postId: string }) => void;\n /** A loading indicator for the replies. */\n repliesLoading?: boolean;\n}\n\nconst defaultProps: Partial<FeedPostProps> = {\n info: {\n avatarSrc: '',\n fullname: '',\n username: '',\n timeElapsed: '',\n content: ''\n }\n};\n\nexport const StyledFeedPost = styled.div(\n ({ theme }) => css`\n ${StyledFeedReplyContainer}:not(:last-child) {\n margin-block-end: calc(2 * ${theme.base.spacing});\n }\n `\n);\n\nStyledFeedPost.defaultProps = defaultThemeProp;\n\nexport const StyledPostEdit = styled.div(\n ({ theme }) => css`\n ${StyledRichTextEditor} {\n padding: calc(0.5 * ${theme.base.spacing});\n }\n `\n);\n\nStyledPostEdit.defaultProps = defaultThemeProp;\n\nexport const StyledReplies = styled.div(\n ({ theme }) => css`\n border-top: 0.0625rem solid ${theme.base.palette['border-line']};\n padding: calc(1.25 * ${theme.base.spacing}) calc(2 * ${theme.base.spacing});\n `\n);\n\nStyledReplies.defaultProps = defaultThemeProp;\n\nexport const StyledPostFooter = styled.div(\n ({ theme }) => css`\n margin-block-start: ${theme.base.spacing};\n `\n);\n\nStyledPostFooter.defaultProps = defaultThemeProp;\n\nconst FullWidthSummaryItem = styled.div`\n width: 100%;\n\n ${StyledVisual} {\n align-self: start;\n }\n`;\n\nconst FeedPost: FC<ForwardProps & FeedPostProps> = (props: ForwardProps & FeedPostProps) => {\n const {\n id,\n info,\n interactionInfo,\n maxContentHeight = Infinity,\n onMouseEnter,\n onMouseLeave,\n onCommentClick,\n onLikeClick,\n onLikeCountInteraction,\n onLoadMoreLikes,\n onRecipientInteraction,\n onLoadMoreRecipients,\n onUserClick,\n onShowMoreClick,\n newReplyField,\n menuItems,\n onEditSubmit,\n edited = false,\n replies = [],\n replyInput,\n replyInputShown,\n replyCount,\n repliesLoading,\n onShowLessReplies,\n onShowMoreReplies,\n ...restProps\n } = props;\n const {\n avatarSrc,\n fullname,\n username,\n timeElapsed,\n content,\n postType = 'public',\n recipients = [],\n recipientsCount = 0,\n attachments,\n liked,\n icon,\n postContext,\n userStatus\n } = info;\n const {\n likeLabel,\n likes = [],\n likeCount = 0,\n commentLabel,\n interactionsEnabled = true\n } = interactionInfo;\n const loggedInUser = useContext(FeedContext).userInfo;\n\n const t = useI18n();\n const { locale } = useConfiguration();\n const [countEl, setCountEl] = useElement<HTMLButtonElement>();\n const rteRef = useRef<RichTextEditorState>();\n const [editMode, setEditMode] = useState(false);\n const editTextAreaRef = useRef<HTMLDivElement>(null);\n const [emptyEditText, setEmptyEditText] = useState(false);\n const [postModified, setPostModified] = useState(false);\n const [replyInputOpen, setReplyInputOpen] = useState(false);\n const [replyInputRef, setReplyInputRef] = useState<MutableRefObject<\n RichTextEditorState | undefined\n > | null>(null);\n const { create } = useContext(ModalManagerContext);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n const recipientsModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes]);\n\n useEffect(() => {\n if (recipients.length) {\n recipientsModalRef.current?.update({\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients as SummaryListItem[],\n onLoadMore: onLoadMoreRecipients\n });\n }\n }, [recipientsCount, recipients, onLoadMoreRecipients]);\n\n useOuterEvent('mousedown', [editTextAreaRef], () => {\n if (emptyEditText) setEditMode(false);\n });\n\n useEffect(() => {\n if ((replyInputOpen || replyInputShown) && replyInputRef) {\n replyInputRef.current?.focus();\n }\n }, [replyInputOpen, replyInputShown, replyInputRef]);\n\n const userVisual = icon ? (\n <Icon name={icon} />\n ) : (\n <Avatar name={fullname} size='l' imageSrc={avatarSrc} status={userStatus} />\n );\n\n const numReplies = replyCount || replies?.length;\n\n const postTypeAttributes = useMemo(() => {\n if (postType === 'private') {\n const recipientsList = recipients.map(x => x.primary);\n return {\n icon: 'users-solid',\n ariaLabel: `${t('feed_private_post')} t('feed_recipients')} ${formatListToLocaleString(\n recipientsList,\n t,\n locale,\n { count: recipientsCount }\n )}`,\n label: formatListToLocaleString(recipientsList, t, locale, {\n count: recipientsCount,\n separator: '\\n'\n })\n };\n }\n\n return {\n icon: 'globe',\n ariaLabel: t('feed_public_post'),\n label: t('feed_public_post')\n };\n }, [postType, recipients, recipientsCount]);\n\n const likesAttributes = useMemo(() => {\n const likesList = likes.map(x => x.primary.toString());\n return {\n ariaLabel: `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {\n count: likeCount\n })}`,\n label: formatListToLocaleString(likesList, t, locale, {\n count: likeCount,\n separator: '\\n'\n })\n };\n }, [likes, likeCount]);\n\n const handleEdit = () => {\n if (!emptyEditText && postModified) {\n onEditSubmit?.({\n postId: id,\n value: rteRef.current?.getPlainText() || ''\n });\n setEditMode(false);\n }\n };\n\n return (\n <FeedReplyContext.Provider value={{ onShowReplyInput: () => setReplyInputOpen(true) }}>\n <Card\n {...restProps}\n as={StyledFeedPost}\n onMouseEnter={() => {\n onMouseEnter?.({ postId: id });\n }}\n onMouseLeave={() => {\n onMouseLeave?.({ postId: id });\n }}\n >\n <CardHeader>\n <SummaryItem\n as={FullWidthSummaryItem}\n visual={\n onUserClick ? (\n <BareButton\n onClick={(event: MouseEvent) => {\n onUserClick?.({ postId: id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )\n }\n primary={\n <div>\n {onUserClick ? (\n <Button\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ postId: id, username }, event);\n }}\n >\n <Text variant='h3'>{fullname}</Text>\n </Button>\n ) : (\n <Text variant='h3'>{fullname}</Text>\n )}\n {postContext && <Text variant='primary'> {t('feed_context', [postContext])}</Text>}\n </div>\n }\n secondary={\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Button\n variant='text'\n icon\n onClick={\n recipients.length\n ? () => {\n if (recipientsCount > 10) {\n recipientsModalRef.current = create(FeedModalList, {\n count: recipientsCount,\n heading: t('feed_recipients'),\n listItems: recipients as SummaryListItem[],\n onLoadMore: onLoadMoreRecipients\n });\n }\n }\n : onRecipientInteraction\n }\n onFocus={onRecipientInteraction}\n onMouseOver={onRecipientInteraction}\n aria-label={postTypeAttributes.ariaLabel}\n label={postTypeAttributes.label}\n >\n <Icon name={postTypeAttributes.icon} />\n </Button>\n <MetaList items={edited ? [timeElapsed, t('edited')] : [timeElapsed]} />\n </Flex>\n }\n actions={\n menuItems ? (\n <MenuButton\n text='More'\n menu={{\n items:\n onEditSubmit &&\n typeof content === 'string' &&\n username === loggedInUser.username\n ? menuItems.concat([\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n }\n ])\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined\n }\n />\n </CardHeader>\n <CardContent>\n {editMode ? (\n <>\n <StyledPostEdit ref={editTextAreaRef}>\n <FeedRichText\n onChange={() => {\n setEmptyEditText(rteRef.current?.getPlainText().trim() === '');\n setPostModified(rteRef.current?.getPlainText() !== content);\n }}\n autoFocus\n onSubmit={handleEdit}\n defaultValue={content}\n ref={rteRef}\n />\n </StyledPostEdit>\n <Flex container={{ justify: 'between', pad: [2, 0, 0] }}>\n <Button\n onClick={() => setEditMode(false)}\n aria-label={`${t('cancel')} ${t('edit')} ${id}`}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n disabled={emptyEditText || !postModified}\n onClick={handleEdit}\n aria-label={`${t('update')} ${t('edit')} ${id}`}\n >\n {t('update')}\n </Button>\n </Flex>\n </>\n ) : (\n <FeedContent maxContentHeight={maxContentHeight}>{content}</FeedContent>\n )}\n <FeedAttachments attachments={attachments} />\n <Flex as={StyledPostFooter} container={{ justify: 'between', wrap: 'wrap', gap: 1 }}>\n {interactionsEnabled ? (\n <Flex container={{ gap: 2 }}>\n <Button\n variant='text'\n as={FeedButton}\n onClick={() => {\n onCommentClick?.({ postId: id });\n if (!replyInputOpen) {\n setReplyInputOpen(true);\n }\n }}\n >\n <Icon name='chat' />\n <Text>{commentLabel}</Text>\n {numReplies > 0 && <Count>{numReplies}</Count>}\n </Button>\n <Flex container={{ gap: 0.5 }}>\n <Button\n variant='text'\n as={FeedButton}\n onClick={() =>\n onLikeClick({\n postId: id,\n user: {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? (\n <MetaList items={loggedInUser.meta} />\n ) : undefined,\n visual: (\n <Avatar\n size='l'\n imageSrc={loggedInUser.avatarSrc}\n name={loggedInUser.fullname}\n />\n )\n }\n })\n }\n emphasized={liked}\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n <Text>{likeLabel}</Text>\n </Button>\n {likeCount > 0 && (\n <>\n <BareButton\n ref={setCountEl}\n onClick={\n likes.length\n ? () => {\n if (likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }\n }\n : onLikeCountInteraction\n }\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n >\n <Count>{likeCount}</Count>\n </BareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label}\n </Tooltip>\n </>\n )}\n </Flex>\n </Flex>\n ) : (\n <div />\n )}\n {(onShowLessReplies || onShowMoreReplies) && (\n <Flex container={{ gap: 0.5 }}>\n {replies.length !== numReplies && (\n <>\n <Text>{t('showing_num_of_num', [replies.length, numReplies])}</Text>\n <span>•</span>\n </>\n )}\n {onShowMoreReplies && replies.length < numReplies && (\n <Button variant='link' onClick={() => onShowMoreReplies({ postId: id })}>\n {t('show_more')}\n </Button>\n )}\n {repliesLoading && <Progress placement='inline' />}\n </Flex>\n )}\n </Flex>\n </CardContent>\n {!!replies?.length && <StyledReplies>{replies}</StyledReplies>}\n {replyInputShown || replyInputOpen ? (\n <CardContent>\n <FeedReplyInput\n onSetInputRef={({ ref }) => {\n setReplyInputRef(ref);\n }}\n id={id}\n commentLabel={replyInput.commentLabel}\n attachments={replyInput.attachments}\n placeholder={replyInput.placeholder}\n onFilesAdded={replyInput.onFilesAdded}\n onSubmit={e => {\n setReplyInputOpen(false);\n replyInput.onSubmit(e);\n }}\n />\n </CardContent>\n ) : null}\n {onShowLessReplies && !!replies.length && (\n <Flex container={{ justify: 'center', pad: [0, 0, 1], gap: 1 }}>\n <Button variant='link' onClick={() => onShowLessReplies({ postId: id })}>\n {t('show_less')}\n </Button>\n {repliesLoading && <Progress placement='inline' />}\n </Flex>\n )}\n </Card>\n </FeedReplyContext.Provider>\n );\n};\n\nFeedPost.defaultProps = defaultProps;\n\nexport default FeedPost;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedReply.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedReply.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EACF,YAAY,EAEZ,UAAU,EAKX,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,WAAW,EAQX,YAAY,EACZ,aAAa,EAMb,eAAe,EAIhB,MAAM,yBAAyB,CAAC;
|
|
1
|
+
{"version":3,"file":"FeedReply.d.ts","sourceRoot":"","sources":["../../../src/components/Feed/FeedReply.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,EAAE,EACF,YAAY,EAEZ,UAAU,EAKX,MAAM,OAAO,CAAC;AAGf,OAAO,EAEL,WAAW,EAQX,YAAY,EACZ,aAAa,EAMb,eAAe,EAIhB,MAAM,yBAAyB,CAAC;AASjC,OAAwB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAUnE,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE;QACJ,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,WAAW,EAAE,MAAM,CAAC;QACpB,OAAO,EAAE,YAAY,GAAG,MAAM,CAAC;QAC/B,WAAW,CAAC,EAAE,aAAa,EAAE,CAAC;QAC9B,QAAQ,EAAE,MAAM,CAAC;QACjB,QAAQ,EAAE,MAAM,CAAC;QACjB,aAAa,EAAE,MAAM,CAAC;QACtB,KAAK,CAAC,EAAE,OAAO,CAAC;QAChB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,UAAU,CAAC,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;KACpC,CAAC;IACF,eAAe,EAAE;QACf,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;QAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,CAAC;QAClB,YAAY,EAAE,MAAM,CAAC;QACrB;;WAEG;QACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;KAC/B,CAAC;IACF;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,sDAAsD;IACtD,SAAS,CAAC,EAAE,aAAa,EAAE,CAAC;IAC5B,wGAAwG;IACxG,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACnE;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpD,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACpD,cAAc,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IACvE,WAAW,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,eAAe,CAAA;KAAE,KAAK,IAAI,CAAC;IACzE,wFAAwF;IACxF,sBAAsB,CAAC,EAAE,MAAM,IAAI,CAAC;IACpC,2HAA2H;IAC3H,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,OAAO,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,EAAE,UAAU,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;CAC/F;AACD,eAAO,MAAM,sBAAsB,yGAQjC,CAAC;AAIH,eAAO,MAAM,mBAAmB,4GAO9B,CAAC;AAIH,eAAO,MAAM,kBAAkB,4GAE9B,CAAC;AAEF,eAAO,MAAM,wBAAwB,yGA2BnC,CAAC;AAIH,QAAA,MAAM,SAAS,EAAE,EAAE,CAAC,YAAY,GAAG,cAAc,CAmRhD,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
|
@@ -8,6 +8,7 @@ import { StyledRichTextEditor } from '@pega/cosmos-react-rte';
|
|
|
8
8
|
import * as chatIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat.icon';
|
|
9
9
|
import * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';
|
|
10
10
|
import * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';
|
|
11
|
+
import { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils/utils';
|
|
11
12
|
import FeedAttachments from './FeedAttachments';
|
|
12
13
|
import FeedButton from './FeedButton';
|
|
13
14
|
import FeedContent from './FeedContent';
|
|
@@ -15,7 +16,6 @@ import { FeedContext, FeedReplyContext } from './Feed.context';
|
|
|
15
16
|
import FeedRichText from './FeedRichText';
|
|
16
17
|
import { StyledFeedReply } from './FeedReplyInput';
|
|
17
18
|
import FeedModalList from './FeedModalList';
|
|
18
|
-
import { generateFeedLabel } from './utils';
|
|
19
19
|
registerIcon(chatIcon, thumbsUpSolidIcon, thumbsUpIcon);
|
|
20
20
|
export const StyledFeedReplyContent = styled.div(props => {
|
|
21
21
|
const { theme } = props;
|
|
@@ -94,9 +94,15 @@ const FeedReply = (props) => {
|
|
|
94
94
|
setEditMode(false);
|
|
95
95
|
});
|
|
96
96
|
const likesAttributes = useMemo(() => {
|
|
97
|
+
const likesList = likes.map(x => x.primary.toString());
|
|
97
98
|
return {
|
|
98
|
-
ariaLabel: `${t('feed_liked_by')} ${
|
|
99
|
-
|
|
99
|
+
ariaLabel: `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {
|
|
100
|
+
count: likeCount
|
|
101
|
+
})}`,
|
|
102
|
+
label: formatListToLocaleString(likesList, t, locale, {
|
|
103
|
+
count: likeCount,
|
|
104
|
+
separator: '\n'
|
|
105
|
+
})
|
|
100
106
|
};
|
|
101
107
|
}, [likes, likeCount]);
|
|
102
108
|
const handleEdit = () => {
|
|
@@ -109,18 +115,18 @@ const FeedReply = (props) => {
|
|
|
109
115
|
}
|
|
110
116
|
};
|
|
111
117
|
const userVisual = icon ? (_jsx(Icon, { name: icon }, void 0)) : (_jsx(Avatar, { name: fullname, size: 'm', imageSrc: avatarSrc, status: userStatus }, void 0));
|
|
112
|
-
return (_jsxs(Flex,
|
|
118
|
+
return (_jsxs(Flex, { container: true, as: StyledFeedReplyContainer, onMouseEnter: () => {
|
|
113
119
|
onMouseEnter?.({ replyId: id });
|
|
114
120
|
}, onMouseLeave: () => {
|
|
115
121
|
onMouseLeave?.({ replyId: id });
|
|
116
|
-
}
|
|
122
|
+
}, ...restProps, children: [onUserClick ? (_jsx(BareButton, { as: StyledVisualButton, onClick: (event) => {
|
|
117
123
|
onUserClick?.({ replyId: id, username }, event);
|
|
118
|
-
}
|
|
124
|
+
}, children: userVisual }, void 0)) : (userVisual), _jsxs(Flex, { container: { direction: 'column' }, item: { grow: 1 }, children: [editMode ? (_jsxs(_Fragment, { children: [_jsx(StyledFeedReply, { children: _jsx(FeedRichText, { onChange: () => {
|
|
119
125
|
setEmptyEditText(rteRef.current?.getPlainText().trim() === '');
|
|
120
126
|
setReplyModified(rteRef.current?.getPlainText() !== content);
|
|
121
|
-
}, autoFocus: true, onSubmit: handleEdit, defaultValue: content, ref: rteRef }, void 0) }, void 0), _jsxs(Flex,
|
|
127
|
+
}, autoFocus: true, onSubmit: handleEdit, defaultValue: content, ref: rteRef }, void 0) }, void 0), _jsxs(Flex, { container: { justify: 'between', pad: [2, 0, 1] }, children: [_jsx(Button, { onClick: () => setEditMode(false), "aria-label": `${t('cancel')} ${t('edit')} ${id}`, children: t('cancel') }, void 0), _jsx(Button, { variant: 'primary', disabled: emptyEditText || !replyModified, onClick: handleEdit, "aria-label": `${t('update')} ${t('edit')} ${id}`, children: t('update') }, void 0)] }, void 0)] }, void 0)) : (_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, item: { grow: 1 }, children: [_jsxs(Flex, { item: { grow: 1 }, as: StyledFeedReplyContent, children: [_jsxs(Flex, { container: { direction: 'column', gap: 0.5 }, children: [_jsx("div", { children: _jsx(Button, { as: StyledFeedReplyUser, variant: 'text', onClick: (event) => {
|
|
122
128
|
onUserClick?.({ replyId: id, username }, event);
|
|
123
|
-
}, "aria-label": fullnameLabel
|
|
129
|
+
}, "aria-label": fullnameLabel, children: fullname }, void 0) }, void 0), _jsx(FeedContent, { maxContentHeight: maxContentHeight, children: content }, void 0)] }, void 0), _jsx(FeedAttachments, { attachments: attachments }, void 0)] }, void 0), menuItems ? (_jsx(MenuButton, { text: 'More', menu: {
|
|
124
130
|
items: onEditSubmit &&
|
|
125
131
|
typeof content === 'string' &&
|
|
126
132
|
username === loggedInUser.username
|
|
@@ -132,10 +138,10 @@ const FeedReply = (props) => {
|
|
|
132
138
|
}
|
|
133
139
|
])
|
|
134
140
|
: menuItems
|
|
135
|
-
}, icon: 'more', iconOnly: true, variant: 'simple' }, void 0)) : undefined] }
|
|
141
|
+
}, icon: 'more', iconOnly: true, variant: 'simple' }, void 0)) : undefined] }, void 0)), _jsxs(Flex, { container: { alignItems: 'center', gap: 2 }, children: [interactionsEnabled && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: 'text', icon: true, as: FeedButton, onClick: () => {
|
|
136
142
|
onCommentClick({ replyId: id, username });
|
|
137
143
|
onShowReplyInput?.();
|
|
138
|
-
}, label: commentLabel
|
|
144
|
+
}, label: commentLabel, children: _jsx(Icon, { name: 'chat' }, void 0) }, void 0), _jsxs(Flex, { container: { itemGap: 0.5 }, children: [_jsx(Button, { as: FeedButton, variant: 'text', onClick: () => onLikeClick({
|
|
139
145
|
replyId: id,
|
|
140
146
|
user: {
|
|
141
147
|
id: loggedInUser.username,
|
|
@@ -143,7 +149,7 @@ const FeedReply = (props) => {
|
|
|
143
149
|
secondary: loggedInUser.meta ? (_jsx(MetaList, { items: loggedInUser.meta }, void 0)) : undefined,
|
|
144
150
|
visual: (_jsx(Avatar, { size: 'l', imageSrc: loggedInUser.avatarSrc, name: loggedInUser.fullname }, void 0))
|
|
145
151
|
}
|
|
146
|
-
}), emphasized: liked, label: likeLabel, icon: true
|
|
152
|
+
}), emphasized: liked, label: likeLabel, icon: true, children: _jsx(Icon, { name: liked ? 'thumbs-up-solid' : 'thumbs-up' }, void 0) }, void 0), likeCount > 0 && (_jsxs(_Fragment, { children: [_jsx(BareButton, { ref: setCountEl, onClick: likes.length
|
|
147
153
|
? () => {
|
|
148
154
|
if (likeCount > 10) {
|
|
149
155
|
likesModalRef.current = create(FeedModalList, {
|
|
@@ -154,7 +160,7 @@ const FeedReply = (props) => {
|
|
|
154
160
|
});
|
|
155
161
|
}
|
|
156
162
|
}
|
|
157
|
-
: onLikeCountInteraction, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel
|
|
163
|
+
: onLikeCountInteraction, onFocus: onLikeCountInteraction, onMouseOver: onLikeCountInteraction, "aria-label": likesAttributes.ariaLabel, children: _jsx(Count, { children: likeCount }, void 0) }, void 0), _jsx(Tooltip, { target: countEl, showDelay: 'none', hideDelay: 'none', children: likesAttributes.label }, void 0)] }, void 0))] }, void 0)] }, void 0)), _jsx(MetaList, { items: edited ? [timeElapsed, t('edited')] : [timeElapsed] }, void 0)] }, void 0)] }, void 0)] }, void 0));
|
|
158
164
|
};
|
|
159
165
|
export default FeedReply;
|
|
160
166
|
//# sourceMappingURL=FeedReply.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FeedReply.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedReply.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactElement,\n useContext,\n MouseEvent,\n useState,\n useRef,\n useEffect,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n AvatarProps,\n Count,\n Button,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n defaultThemeProp,\n ForwardProps,\n MenuItemProps,\n MetaList,\n useI18n,\n useOuterEvent,\n Tooltip,\n useElement,\n SummaryListItem,\n ModalMethods,\n ModalManagerContext,\n useConfiguration\n} from '@pega/cosmos-react-core';\nimport { StyledAvatar } from '@pega/cosmos-react-core/lib/components/Avatar/Avatar';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport * as chatIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';\n\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport FeedButton from './FeedButton';\nimport FeedContent from './FeedContent';\nimport { FeedContext, FeedReplyContext } from './Feed.context';\nimport FeedRichText from './FeedRichText';\nimport { StyledFeedReply } from './FeedReplyInput';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\nimport { generateFeedLabel } from './utils';\n\nregisterIcon(chatIcon, thumbsUpSolidIcon, thumbsUpIcon);\n\nexport interface FeedReplyProps {\n id: string;\n info: {\n avatarSrc?: string;\n timeElapsed: string;\n content: ReactElement | string;\n attachments?: AttachedFiles[];\n username: string;\n fullname: string;\n fullnameLabel: string;\n liked?: boolean;\n icon?: string;\n userStatus?: AvatarProps['status'];\n };\n interactionInfo: {\n likes?: SummaryListItem[];\n likeCount?: number;\n likeLabel: string;\n commentLabel: string;\n /**\n * @default true\n */\n interactionsEnabled?: boolean;\n };\n /**\n * A maximum height in pixels to display post content within before prompting to expand the post.\n * @default Infinity\n */\n maxContentHeight?: number;\n /** A set of menu options for actions on the reply. */\n menuItems?: MenuItemProps[];\n /** Callback that updates the reply after being edited. If undefined, the reply will not be editable. */\n onEditSubmit?: (event: { replyId: string; value: string }) => void;\n /**\n * Flag that indicates if a reply has been previously edited.\n * @default false\n */\n edited?: boolean;\n onMouseEnter?: (event: { replyId: string }) => void;\n onMouseLeave?: (event: { replyId: string }) => void;\n onCommentClick: (event: { replyId: string; username: string }) => void;\n onLikeClick: (event: { replyId: string; user: SummaryListItem }) => void;\n /** Callback that runs when the like count on a post is hovered, focused, or clicked. */\n onLikeCountInteraction?: () => void;\n /** Callback that runs when the bottom of the extended like list Modal is reached, allowing for more likes to be loaded. */\n onLoadMoreLikes?: () => void;\n onUserClick?: (event: { replyId: string; username: string }, clickEvent?: MouseEvent) => void;\n}\n\nexport const StyledFeedReplyContent = styled.div(props => {\n const { theme } = props;\n\n return css`\n background-color: ${theme.base.palette['secondary-background']};\n border-radius: calc(2 * ${theme.base['border-radius']});\n padding: calc(1.5 * ${theme.base.spacing});\n `;\n});\n\nStyledFeedReplyContent.defaultProps = defaultThemeProp;\n\nexport const StyledFeedReplyUser = styled.button(props => {\n const { theme } = props;\n\n return css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n margin-inline-end: ${theme.base.spacing};\n `;\n});\n\nStyledFeedReplyUser.defaultProps = defaultThemeProp;\n\nexport const StyledVisualButton = styled.button`\n height: min-content;\n`;\n\nexport const StyledFeedReplyContainer = styled.div(props => {\n const { theme } = props;\n\n return css`\n ${StyledAvatar} {\n margin-inline-end: ${theme.base.spacing};\n }\n\n ${StyledFeedReplyContent} {\n margin-bottom: calc(0.5 * ${theme.base.spacing});\n }\n\n ${StyledFeedReply} {\n &:focus-within {\n border-color: ${theme.base.palette.interactive};\n }\n }\n\n ${StyledRichTextEditor} {\n padding-top: calc(0.5 * ${theme.base.spacing});\n padding-bottom: ${theme.base.spacing};\n\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledFeedReplyContainer.defaultProps = defaultThemeProp;\n\nconst FeedReply: FC<ForwardProps & FeedReplyProps> = (props: ForwardProps & FeedReplyProps) => {\n const {\n id,\n info,\n interactionInfo,\n maxContentHeight = Infinity,\n menuItems,\n onEditSubmit,\n edited = false,\n onMouseEnter,\n onMouseLeave,\n onCommentClick,\n onLikeClick,\n onLikeCountInteraction,\n onLoadMoreLikes,\n onUserClick,\n ...restProps\n } = props;\n const {\n avatarSrc,\n timeElapsed,\n content,\n attachments,\n username,\n fullname,\n fullnameLabel,\n liked,\n icon,\n userStatus\n } = info;\n const {\n likes = [],\n likeCount = 0,\n likeLabel,\n commentLabel,\n interactionsEnabled = true\n } = interactionInfo;\n const loggedInUser = useContext(FeedContext).userInfo;\n\n const t = useI18n();\n const { locale } = useConfiguration();\n const [countEl, setCountEl] = useElement<HTMLButtonElement>();\n const rteRef = useRef<RichTextEditorState>();\n const [editMode, setEditMode] = useState(false);\n const editTextAreaRef = useRef<HTMLDivElement>(null);\n const [emptyEditText, setEmptyEditText] = useState(false);\n const [replyModified, setReplyModified] = useState(false);\n const { onShowReplyInput } = useContext(FeedReplyContext);\n const { create } = useContext(ModalManagerContext);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes]);\n\n useOuterEvent('mousedown', [editTextAreaRef], () => {\n if (emptyEditText) setEditMode(false);\n });\n\n const likesAttributes = useMemo(() => {\n return {\n ariaLabel: `${t('feed_liked_by')} ${generateFeedLabel(t, locale, likes, likeCount)}`,\n label: generateFeedLabel(t, locale, likes, likeCount, '\\n')\n };\n }, [likes, likeCount]);\n\n const handleEdit = () => {\n if (!emptyEditText && replyModified) {\n onEditSubmit?.({\n replyId: id,\n value: rteRef.current?.getPlainText() || ''\n });\n setEditMode(false);\n }\n };\n\n const userVisual = icon ? (\n <Icon name={icon} />\n ) : (\n <Avatar name={fullname} size='m' imageSrc={avatarSrc} status={userStatus} />\n );\n\n return (\n <Flex\n container\n as={StyledFeedReplyContainer}\n onMouseEnter={() => {\n onMouseEnter?.({ replyId: id });\n }}\n onMouseLeave={() => {\n onMouseLeave?.({ replyId: id });\n }}\n {...restProps}\n >\n {onUserClick ? (\n <BareButton\n as={StyledVisualButton}\n onClick={(event: MouseEvent) => {\n onUserClick?.({ replyId: id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )}\n <Flex container={{ direction: 'column' }} item={{ grow: 1 }}>\n {editMode ? (\n <>\n <StyledFeedReply>\n <FeedRichText\n onChange={() => {\n setEmptyEditText(rteRef.current?.getPlainText().trim() === '');\n setReplyModified(rteRef.current?.getPlainText() !== content);\n }}\n autoFocus\n onSubmit={handleEdit}\n defaultValue={content}\n ref={rteRef}\n />\n </StyledFeedReply>\n <Flex container={{ justify: 'between', pad: [2, 0, 1] }}>\n <Button\n onClick={() => setEditMode(false)}\n aria-label={`${t('cancel')} ${t('edit')} ${id}`}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n disabled={emptyEditText || !replyModified}\n onClick={handleEdit}\n aria-label={`${t('update')} ${t('edit')} ${id}`}\n >\n {t('update')}\n </Button>\n </Flex>\n </>\n ) : (\n <Flex container={{ gap: 1, alignItems: 'center' }} item={{ grow: 1 }}>\n <Flex item={{ grow: 1 }} as={StyledFeedReplyContent}>\n <Flex container={{ direction: 'column', gap: 0.5 }}>\n <div>\n <Button\n as={StyledFeedReplyUser}\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ replyId: id, username }, event);\n }}\n aria-label={fullnameLabel}\n >\n {fullname}\n </Button>\n </div>\n <FeedContent maxContentHeight={maxContentHeight}>{content}</FeedContent>\n </Flex>\n <FeedAttachments attachments={attachments} />\n </Flex>\n {menuItems ? (\n <MenuButton\n text='More'\n menu={{\n items:\n onEditSubmit &&\n typeof content === 'string' &&\n username === loggedInUser.username\n ? menuItems.concat([\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n }\n ])\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined}\n </Flex>\n )}\n\n <Flex container={{ alignItems: 'center', gap: 2 }}>\n {interactionsEnabled && (\n <>\n <Button\n variant='text'\n icon\n as={FeedButton}\n onClick={() => {\n onCommentClick({ replyId: id, username });\n onShowReplyInput?.();\n }}\n label={commentLabel}\n >\n <Icon name='chat' />\n </Button>\n <Flex container={{ itemGap: 0.5 }}>\n <Button\n as={FeedButton}\n variant='text'\n onClick={() =>\n onLikeClick({\n replyId: id,\n user: {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? (\n <MetaList items={loggedInUser.meta} />\n ) : undefined,\n visual: (\n <Avatar\n size='l'\n imageSrc={loggedInUser.avatarSrc}\n name={loggedInUser.fullname}\n />\n )\n }\n })\n }\n emphasized={liked}\n label={likeLabel}\n icon\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n </Button>\n {likeCount > 0 && (\n <>\n <BareButton\n ref={setCountEl}\n onClick={\n likes.length\n ? () => {\n if (likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }\n }\n : onLikeCountInteraction\n }\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n >\n <Count>{likeCount}</Count>\n </BareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label}\n </Tooltip>\n </>\n )}\n </Flex>\n </>\n )}\n <MetaList items={edited ? [timeElapsed, t('edited')] : [timeElapsed]} />\n </Flex>\n </Flex>\n </Flex>\n );\n};\n\nexport default FeedReply;\n"]}
|
|
1
|
+
{"version":3,"file":"FeedReply.js","sourceRoot":"","sources":["../../../src/components/Feed/FeedReply.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FC,\n ReactElement,\n useContext,\n MouseEvent,\n useState,\n useRef,\n useEffect,\n useMemo\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Avatar,\n AvatarProps,\n Count,\n Button,\n Flex,\n Icon,\n registerIcon,\n MenuButton,\n defaultThemeProp,\n ForwardProps,\n MenuItemProps,\n MetaList,\n useI18n,\n useOuterEvent,\n Tooltip,\n useElement,\n SummaryListItem,\n ModalMethods,\n ModalManagerContext,\n useConfiguration\n} from '@pega/cosmos-react-core';\nimport { StyledAvatar } from '@pega/cosmos-react-core/lib/components/Avatar/Avatar';\nimport BareButton from '@pega/cosmos-react-core/lib/components/Button/BareButton';\nimport { RichTextEditorState, StyledRichTextEditor } from '@pega/cosmos-react-rte';\nimport * as chatIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsUpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up.icon';\nimport { formatListToLocaleString } from '@pega/cosmos-react-core/lib/utils/utils';\n\nimport FeedAttachments, { AttachedFiles } from './FeedAttachments';\nimport FeedButton from './FeedButton';\nimport FeedContent from './FeedContent';\nimport { FeedContext, FeedReplyContext } from './Feed.context';\nimport FeedRichText from './FeedRichText';\nimport { StyledFeedReply } from './FeedReplyInput';\nimport FeedModalList, { FeedModalListProps } from './FeedModalList';\n\nregisterIcon(chatIcon, thumbsUpSolidIcon, thumbsUpIcon);\n\nexport interface FeedReplyProps {\n id: string;\n info: {\n avatarSrc?: string;\n timeElapsed: string;\n content: ReactElement | string;\n attachments?: AttachedFiles[];\n username: string;\n fullname: string;\n fullnameLabel: string;\n liked?: boolean;\n icon?: string;\n userStatus?: AvatarProps['status'];\n };\n interactionInfo: {\n likes?: SummaryListItem[];\n likeCount?: number;\n likeLabel: string;\n commentLabel: string;\n /**\n * @default true\n */\n interactionsEnabled?: boolean;\n };\n /**\n * A maximum height in pixels to display post content within before prompting to expand the post.\n * @default Infinity\n */\n maxContentHeight?: number;\n /** A set of menu options for actions on the reply. */\n menuItems?: MenuItemProps[];\n /** Callback that updates the reply after being edited. If undefined, the reply will not be editable. */\n onEditSubmit?: (event: { replyId: string; value: string }) => void;\n /**\n * Flag that indicates if a reply has been previously edited.\n * @default false\n */\n edited?: boolean;\n onMouseEnter?: (event: { replyId: string }) => void;\n onMouseLeave?: (event: { replyId: string }) => void;\n onCommentClick: (event: { replyId: string; username: string }) => void;\n onLikeClick: (event: { replyId: string; user: SummaryListItem }) => void;\n /** Callback that runs when the like count on a post is hovered, focused, or clicked. */\n onLikeCountInteraction?: () => void;\n /** Callback that runs when the bottom of the extended like list Modal is reached, allowing for more likes to be loaded. */\n onLoadMoreLikes?: () => void;\n onUserClick?: (event: { replyId: string; username: string }, clickEvent?: MouseEvent) => void;\n}\nexport const StyledFeedReplyContent = styled.div(props => {\n const { theme } = props;\n\n return css`\n background-color: ${theme.base.palette['secondary-background']};\n border-radius: calc(2 * ${theme.base['border-radius']});\n padding: calc(1.5 * ${theme.base.spacing});\n `;\n});\n\nStyledFeedReplyContent.defaultProps = defaultThemeProp;\n\nexport const StyledFeedReplyUser = styled.button(props => {\n const { theme } = props;\n\n return css`\n font-weight: ${theme.base['font-weight']['semi-bold']};\n margin-inline-end: ${theme.base.spacing};\n `;\n});\n\nStyledFeedReplyUser.defaultProps = defaultThemeProp;\n\nexport const StyledVisualButton = styled.button`\n height: min-content;\n`;\n\nexport const StyledFeedReplyContainer = styled.div(props => {\n const { theme } = props;\n\n return css`\n ${StyledAvatar} {\n margin-inline-end: ${theme.base.spacing};\n }\n\n ${StyledFeedReplyContent} {\n margin-bottom: calc(0.5 * ${theme.base.spacing});\n }\n\n ${StyledFeedReply} {\n &:focus-within {\n border-color: ${theme.base.palette.interactive};\n }\n }\n\n ${StyledRichTextEditor} {\n padding-top: calc(0.5 * ${theme.base.spacing});\n padding-bottom: ${theme.base.spacing};\n\n &:focus-within {\n box-shadow: none;\n }\n }\n `;\n});\n\nStyledFeedReplyContainer.defaultProps = defaultThemeProp;\n\nconst FeedReply: FC<ForwardProps & FeedReplyProps> = (props: ForwardProps & FeedReplyProps) => {\n const {\n id,\n info,\n interactionInfo,\n maxContentHeight = Infinity,\n menuItems,\n onEditSubmit,\n edited = false,\n onMouseEnter,\n onMouseLeave,\n onCommentClick,\n onLikeClick,\n onLikeCountInteraction,\n onLoadMoreLikes,\n onUserClick,\n ...restProps\n } = props;\n const {\n avatarSrc,\n timeElapsed,\n content,\n attachments,\n username,\n fullname,\n fullnameLabel,\n liked,\n icon,\n userStatus\n } = info;\n const {\n likes = [],\n likeCount = 0,\n likeLabel,\n commentLabel,\n interactionsEnabled = true\n } = interactionInfo;\n const loggedInUser = useContext(FeedContext).userInfo;\n\n const t = useI18n();\n const { locale } = useConfiguration();\n const [countEl, setCountEl] = useElement<HTMLButtonElement>();\n const rteRef = useRef<RichTextEditorState>();\n const [editMode, setEditMode] = useState(false);\n const editTextAreaRef = useRef<HTMLDivElement>(null);\n const [emptyEditText, setEmptyEditText] = useState(false);\n const [replyModified, setReplyModified] = useState(false);\n const { onShowReplyInput } = useContext(FeedReplyContext);\n const { create } = useContext(ModalManagerContext);\n const likesModalRef = useRef<ModalMethods<FeedModalListProps>>();\n\n useEffect(() => {\n likesModalRef.current?.update({\n count: likeCount,\n heading: likeLabel,\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }, [likeCount, likeLabel, likes, onLoadMoreLikes]);\n\n useOuterEvent('mousedown', [editTextAreaRef], () => {\n if (emptyEditText) setEditMode(false);\n });\n\n const likesAttributes = useMemo(() => {\n const likesList = likes.map(x => x.primary.toString());\n return {\n ariaLabel: `${t('feed_liked_by')} ${formatListToLocaleString(likesList, t, locale, {\n count: likeCount\n })}`,\n label: formatListToLocaleString(likesList, t, locale, {\n count: likeCount,\n separator: '\\n'\n })\n };\n }, [likes, likeCount]);\n\n const handleEdit = () => {\n if (!emptyEditText && replyModified) {\n onEditSubmit?.({\n replyId: id,\n value: rteRef.current?.getPlainText() || ''\n });\n setEditMode(false);\n }\n };\n\n const userVisual = icon ? (\n <Icon name={icon} />\n ) : (\n <Avatar name={fullname} size='m' imageSrc={avatarSrc} status={userStatus} />\n );\n\n return (\n <Flex\n container\n as={StyledFeedReplyContainer}\n onMouseEnter={() => {\n onMouseEnter?.({ replyId: id });\n }}\n onMouseLeave={() => {\n onMouseLeave?.({ replyId: id });\n }}\n {...restProps}\n >\n {onUserClick ? (\n <BareButton\n as={StyledVisualButton}\n onClick={(event: MouseEvent) => {\n onUserClick?.({ replyId: id, username }, event);\n }}\n >\n {userVisual}\n </BareButton>\n ) : (\n userVisual\n )}\n <Flex container={{ direction: 'column' }} item={{ grow: 1 }}>\n {editMode ? (\n <>\n <StyledFeedReply>\n <FeedRichText\n onChange={() => {\n setEmptyEditText(rteRef.current?.getPlainText().trim() === '');\n setReplyModified(rteRef.current?.getPlainText() !== content);\n }}\n autoFocus\n onSubmit={handleEdit}\n defaultValue={content}\n ref={rteRef}\n />\n </StyledFeedReply>\n <Flex container={{ justify: 'between', pad: [2, 0, 1] }}>\n <Button\n onClick={() => setEditMode(false)}\n aria-label={`${t('cancel')} ${t('edit')} ${id}`}\n >\n {t('cancel')}\n </Button>\n <Button\n variant='primary'\n disabled={emptyEditText || !replyModified}\n onClick={handleEdit}\n aria-label={`${t('update')} ${t('edit')} ${id}`}\n >\n {t('update')}\n </Button>\n </Flex>\n </>\n ) : (\n <Flex container={{ gap: 1, alignItems: 'center' }} item={{ grow: 1 }}>\n <Flex item={{ grow: 1 }} as={StyledFeedReplyContent}>\n <Flex container={{ direction: 'column', gap: 0.5 }}>\n <div>\n <Button\n as={StyledFeedReplyUser}\n variant='text'\n onClick={(event: MouseEvent) => {\n onUserClick?.({ replyId: id, username }, event);\n }}\n aria-label={fullnameLabel}\n >\n {fullname}\n </Button>\n </div>\n <FeedContent maxContentHeight={maxContentHeight}>{content}</FeedContent>\n </Flex>\n <FeedAttachments attachments={attachments} />\n </Flex>\n {menuItems ? (\n <MenuButton\n text='More'\n menu={{\n items:\n onEditSubmit &&\n typeof content === 'string' &&\n username === loggedInUser.username\n ? menuItems.concat([\n {\n primary: t('edit'),\n id: 'edit',\n onClick: () => setEditMode(true)\n }\n ])\n : menuItems\n }}\n icon='more'\n iconOnly\n variant='simple'\n />\n ) : undefined}\n </Flex>\n )}\n\n <Flex container={{ alignItems: 'center', gap: 2 }}>\n {interactionsEnabled && (\n <>\n <Button\n variant='text'\n icon\n as={FeedButton}\n onClick={() => {\n onCommentClick({ replyId: id, username });\n onShowReplyInput?.();\n }}\n label={commentLabel}\n >\n <Icon name='chat' />\n </Button>\n <Flex container={{ itemGap: 0.5 }}>\n <Button\n as={FeedButton}\n variant='text'\n onClick={() =>\n onLikeClick({\n replyId: id,\n user: {\n id: loggedInUser.username,\n primary: loggedInUser.fullname,\n secondary: loggedInUser.meta ? (\n <MetaList items={loggedInUser.meta} />\n ) : undefined,\n visual: (\n <Avatar\n size='l'\n imageSrc={loggedInUser.avatarSrc}\n name={loggedInUser.fullname}\n />\n )\n }\n })\n }\n emphasized={liked}\n label={likeLabel}\n icon\n >\n <Icon name={liked ? 'thumbs-up-solid' : 'thumbs-up'} />\n </Button>\n {likeCount > 0 && (\n <>\n <BareButton\n ref={setCountEl}\n onClick={\n likes.length\n ? () => {\n if (likeCount > 10) {\n likesModalRef.current = create(FeedModalList, {\n count: likeCount,\n heading: t('feed_likes'),\n listItems: likes,\n onLoadMore: onLoadMoreLikes\n });\n }\n }\n : onLikeCountInteraction\n }\n onFocus={onLikeCountInteraction}\n onMouseOver={onLikeCountInteraction}\n aria-label={likesAttributes.ariaLabel}\n >\n <Count>{likeCount}</Count>\n </BareButton>\n <Tooltip target={countEl} showDelay='none' hideDelay='none'>\n {likesAttributes.label}\n </Tooltip>\n </>\n )}\n </Flex>\n </>\n )}\n <MetaList items={edited ? [timeElapsed, t('edited')] : [timeElapsed]} />\n </Flex>\n </Flex>\n </Flex>\n );\n};\n\nexport default FeedReply;\n"]}
|
|
@@ -76,7 +76,7 @@ const FeedReplyInput = (props) => {
|
|
|
76
76
|
});
|
|
77
77
|
}
|
|
78
78
|
};
|
|
79
|
-
return (_jsxs(Flex,
|
|
79
|
+
return (_jsxs(Flex, { container: true, as: StyledReplyInputContainer, ...restProps, children: [_jsx(Avatar, { name: fullname, size: 'm', imageSrc: avatarSrc }, void 0), _jsxs(Flex, { container: { alignItems: 'start' }, item: { grow: 1 }, as: StyledFeedReply, onClick: (event) => {
|
|
80
80
|
if (attachmentListRef.current &&
|
|
81
81
|
event.target !== attachmentListRef.current &&
|
|
82
82
|
attachmentListRef.current.contains(event.target)) {
|
|
@@ -87,9 +87,9 @@ const FeedReplyInput = (props) => {
|
|
|
87
87
|
return;
|
|
88
88
|
}
|
|
89
89
|
rteRef.current?.focus();
|
|
90
|
-
}
|
|
90
|
+
}, children: [_jsxs(Flex, { as: StyledFeedReplyInput, container: { direction: 'column' }, item: { grow: 1 }, children: [_jsx(FeedRichText, { ref: rteRef, placeholder: placeholder, onChange: () => {
|
|
91
91
|
setEmptyText(rteRef.current?.getPlainText().trim() === '');
|
|
92
|
-
}, onSubmit: handleSubmit }, void 0), _jsx(FeedAttachments, { ref: attachmentListRef, attachments: attachments }, void 0)] }
|
|
92
|
+
}, onSubmit: handleSubmit }, void 0), _jsx(FeedAttachments, { ref: attachmentListRef, attachments: attachments }, void 0)] }, void 0), onFilesAdded && (_jsxs(_Fragment, { children: [_jsx(HiddenFileInput, { ref: hiddenInputRef, type: 'file', multiple: true, onChange: () => {
|
|
93
93
|
if (hiddenInputRef.current?.files) {
|
|
94
94
|
onFilesAdded?.(Array.from(hiddenInputRef.current?.files));
|
|
95
95
|
}
|
|
@@ -97,10 +97,10 @@ const FeedReplyInput = (props) => {
|
|
|
97
97
|
// Must trick input to believe there is no value when activated so that the same file may be added consecutively.
|
|
98
98
|
onClick: (event) => {
|
|
99
99
|
event.target.value = '';
|
|
100
|
-
} }, void 0), _jsx(Button,
|
|
100
|
+
} }, void 0), _jsx(Button, { ref: attachmentsButtonRef, as: FeedButton, variant: 'simple', forwardedAs: ReplyFeedButton, onClick: () => {
|
|
101
101
|
setShowSearchResults?.(false);
|
|
102
102
|
hiddenInputRef.current?.click();
|
|
103
|
-
}, icon: true, label: t('attachment')
|
|
103
|
+
}, icon: true, label: t('attachment'), children: _jsx(Icon, { name: 'paper-clip' }, void 0) }, void 0)] }, void 0)), _jsx(Button, { ref: submitButtonRef, as: FeedButton, disabled: emptyText && attachments.length === 0, variant: 'simple', forwardedAs: ReplyFeedButton, onClick: handleSubmit, icon: true, label: commentLabel, children: _jsx(Icon, { name: 'send' }, void 0) }, void 0)] }, void 0)] }, void 0));
|
|
104
104
|
};
|
|
105
105
|
export default FeedReplyInput;
|
|
106
106
|
//# sourceMappingURL=FeedReplyInput.js.map
|