Page MenuHomePhabricator
Files F3294027

D9394.id31741.diff
No OneTemporary
Actions

D9394.id31741.diff
View Options

diff --git a/native/markdown/markdown-user-mention.react.js b/native/markdown/markdown-user-mention.react.js
new file mode 100644
--- /dev/null
+++ b/native/markdown/markdown-user-mention.react.js
@@ -0,0 +1,66 @@
+// @flow
+
+import { useFocusEffect } from '@react-navigation/native';
+import * as React from 'react';
+import { Text } from 'react-native';
+
+import { useMarkdownOnPressUtils } from './markdown-utils.js';
+import { getMarkdownStyles } from './styles.js';
+import { useNavigateToUserProfileBottomSheet } from '../user-profile/user-profile-utils.js';
+
+type TextProps = React.ElementConfig<typeof Text>;
+type Props = {
+ +children: React.Node,
+ +userID: string,
+ +useDarkStyle: boolean,
+ ...TextProps,
+};
+
+function MarkdownUserMention(props: Props): React.Node {
+ const { userID, useDarkStyle, ...rest } = props;
+
+ const { messageKey, isRevealed, onLongPressHandler, markdownContext } =
+ useMarkdownOnPressUtils();
+
+ const styles = getMarkdownStyles(useDarkStyle ? 'dark' : 'light');
+
+ const { setUserProfileBottomSheetActive } = markdownContext;
+
+ const navigateToUserProfileBottomSheet =
+ useNavigateToUserProfileBottomSheet();
+
+ useFocusEffect(
+ React.useCallback(() => {
+ if (!messageKey) {
+ return;
+ }
+
+ setUserProfileBottomSheetActive({ [messageKey]: false });
+ }, [messageKey, setUserProfileBottomSheetActive]),
+ );
+
+ const onPressUser = React.useCallback(() => {
+ if (!messageKey) {
+ return;
+ }
+
+ setUserProfileBottomSheetActive({ [messageKey]: true });
+ navigateToUserProfileBottomSheet(userID);
+ }, [
+ messageKey,
+ navigateToUserProfileBottomSheet,
+ setUserProfileBottomSheetActive,
+ userID,
+ ]);
+
+ return (
+ <Text
+ onPress={isRevealed ? onPressUser : null}
+ onLongPress={isRevealed ? onLongPressHandler : null}
+ style={styles.bold}
+ {...rest}
+ />
+ );
+}
+
+export default MarkdownUserMention;
diff --git a/native/markdown/rules.react.js b/native/markdown/rules.react.js
--- a/native/markdown/rules.react.js
+++ b/native/markdown/rules.react.js
@@ -17,6 +17,7 @@
import MarkdownLink from './markdown-link.react.js';
import MarkdownParagraph from './markdown-paragraph.react.js';
import MarkdownSpoiler from './markdown-spoiler.react.js';
+import MarkdownUserMention from './markdown-user-mention.react.js';
import { getMarkdownStyles } from './styles.js';
export type MarkdownRules = {
@@ -376,7 +377,6 @@
chatMentionCandidates: ChatMentionCandidates,
useDarkStyle: boolean,
): MarkdownRules {
- const styles = getMarkdownStyles(useDarkStyle ? 'dark' : 'light');
const baseRules = fullMarkdownRules(useDarkStyle);
const membersMap = SharedMarkdown.createMemberMapForUserMentions(members);
@@ -395,9 +395,13 @@
output: SharedMarkdown.Output<SharedMarkdown.ReactElement>,
state: SharedMarkdown.State,
) => (
- <Text key={state.key} style={styles.bold}>
+ <MarkdownUserMention
+ key={state.key}
+ userID={node.userID}
+ useDarkStyle={useDarkStyle}
+ >
{node.content}
- </Text>
+ </MarkdownUserMention>
),
},
chatMention: {

File Metadata

Mime Type
text/plain
Expires
Sun, Nov 17, 6:27 PM (19 h, 33 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2531080
Default Alt Text
D9394.id31741.diff (3 KB)

Event Timeline