Page MenuHomePhorge

D8575.1767379263.diff
No OneTemporary

Size
3 KB
Referenced Files
None
Subscribers
None

D8575.1767379263.diff

diff --git a/native/chat/inline-engagement.react.js b/native/chat/inline-engagement.react.js
--- a/native/chat/inline-engagement.react.js
+++ b/native/chat/inline-engagement.react.js
@@ -85,6 +85,28 @@
const repliesText = useInlineEngagementText(sidebarThreadInfo);
+ const sidebarStyle = React.useMemo(() => {
+ const stylesResult = [styles.sidebar];
+
+ if (!reactions || Object.keys(reactions).length === 0) {
+ return stylesResult;
+ }
+
+ if (isRight) {
+ stylesResult.push(styles.sidebarMarginLeft);
+ } else {
+ stylesResult.push(styles.sidebarMarginRight);
+ }
+
+ return stylesResult;
+ }, [
+ isRight,
+ reactions,
+ styles.sidebar,
+ styles.sidebarMarginLeft,
+ styles.sidebarMarginRight,
+ ]);
+
const sidebarItem = React.useMemo(() => {
if (!sidebarThreadInfo) {
return null;
@@ -93,7 +115,7 @@
<GestureTouchableOpacity
onPress={onPressSidebar}
activeOpacity={0.7}
- style={styles.sidebar}
+ style={sidebarStyle}
>
<CommIcon style={styles.icon} size={14} name="sidebar-filled" />
<Text style={repliesStyles}>{repliesText}</Text>
@@ -102,7 +124,7 @@
}, [
sidebarThreadInfo,
onPressSidebar,
- styles.sidebar,
+ sidebarStyle,
styles.icon,
repliesStyles,
repliesText,
@@ -115,6 +137,23 @@
});
}, [navigate, reactions]);
+ const reactionStyle = React.useMemo(() => {
+ const stylesResult = [styles.reactionsContainer];
+
+ if (isRight) {
+ stylesResult.push(styles.reactionsContainerMarginLeft);
+ } else {
+ stylesResult.push(styles.reactionsContainerMarginRight);
+ }
+
+ return stylesResult;
+ }, [
+ isRight,
+ styles.reactionsContainer,
+ styles.reactionsContainerMarginLeft,
+ styles.reactionsContainerMarginRight,
+ ]);
+
const reactionList = React.useMemo(() => {
if (!reactions || Object.keys(reactions).length === 0) {
return null;
@@ -124,7 +163,7 @@
const numOfReacts = reactions[reaction].users.length;
return (
<GestureTouchableOpacity
- style={styles.reactionsContainer}
+ style={reactionStyle}
onPress={onPressReactions}
activeOpacity={0.7}
key={reaction}
@@ -133,7 +172,7 @@
</GestureTouchableOpacity>
);
});
- }, [onPressReactions, reactions, styles.reaction, styles.reactionsContainer]);
+ }, [onPressReactions, reactionStyle, reactions, styles.reaction]);
const inlineEngagementPositionStyle = React.useMemo(() => {
const styleResult = [styles.inlineEngagement];
@@ -186,6 +225,12 @@
borderRadius: 8,
marginTop: inlineEngagementStyle.marginTop,
},
+ sidebarMarginLeft: {
+ marginLeft: 4,
+ },
+ sidebarMarginRight: {
+ marginRight: 4,
+ },
icon: {
color: 'inlineEngagementLabel',
marginRight: 4,
@@ -209,6 +254,12 @@
borderRadius: 8,
marginTop: inlineEngagementStyle.marginTop,
},
+ reactionsContainerMarginLeft: {
+ marginLeft: 4,
+ },
+ reactionsContainerMarginRight: {
+ marginRight: 4,
+ },
reaction: {
color: 'inlineEngagementLabel',
fontSize: 14,

File Metadata

Mime Type
text/plain
Expires
Fri, Jan 2, 6:41 PM (11 h, 47 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5877701
Default Alt Text
D8575.1767379263.diff (3 KB)

Event Timeline