Page MenuHomePhorge

D5048.1765059603.diff
No OneTemporary

Size
4 KB
Referenced Files
None
Subscribers
None

D5048.1765059603.diff

diff --git a/native/chat/inner-text-message.react.js b/native/chat/inner-text-message.react.js
--- a/native/chat/inner-text-message.react.js
+++ b/native/chat/inner-text-message.react.js
@@ -70,7 +70,6 @@
const boundColors = useColors();
const messageStyle = {};
- const textStyle = {};
let darkColor;
if (isViewer) {
const threadColor = item.threadInfo.color;
@@ -81,9 +80,6 @@
messageStyle.backgroundColor = boundColors.listChatBubble;
darkColor = activeTheme === 'dark';
}
- textStyle.color = darkColor
- ? colors.dark.listForegroundLabel
- : colors.light.listForegroundLabel;
const cornerStyle = getRoundedContainerStyle(filterCorners(allCorners, item));
@@ -95,6 +91,19 @@
const rules = useTextMessageMarkdownRules(darkColor);
+ const textStyle = React.useMemo(
+ () => ({
+ color: darkColor
+ ? colors.dark.listForegroundLabel
+ : colors.light.listForegroundLabel,
+ }),
+ [darkColor],
+ );
+
+ const markdownStyles = React.useMemo(() => [styles.text, textStyle], [
+ textStyle,
+ ]);
+
const message = (
<TouchableWithoutFeedback>
<View>
@@ -105,7 +114,11 @@
style={[styles.message, cornerStyle]}
animatedStyle={messageStyle}
>
- <Markdown style={[styles.text, textStyle]} rules={rules}>
+ <Markdown
+ style={markdownStyles}
+ rules={rules}
+ threadColor={item.threadInfo.color}
+ >
{text}
</Markdown>
</GestureTouchableOpacity>
diff --git a/native/markdown/markdown.react.js b/native/markdown/markdown.react.js
--- a/native/markdown/markdown.react.js
+++ b/native/markdown/markdown.react.js
@@ -5,9 +5,11 @@
import { View, Text, StyleSheet } from 'react-native';
import type { TextStyle as FlattenedTextStyle } from 'react-native/Libraries/StyleSheet/StyleSheet';
import * as SimpleMarkdown from 'simple-markdown';
+import tinycolor from 'tinycolor2';
import { onlyEmojiRegex } from 'lib/shared/emojis';
+import { useColors } from '../themes/colors';
import type { TextStyle } from '../types/styles';
import type { MarkdownRules } from './rules.react';
@@ -15,11 +17,14 @@
+style: TextStyle,
+children: string,
+rules: MarkdownRules,
+ +threadColor?: string,
};
function Markdown(props: Props): React.Node {
- const { style, children, rules } = props;
+ const { style, children, rules, threadColor } = props;
const { simpleMarkdownRules, emojiOnlyFactor, container } = rules;
+ const boundColors = useColors();
+
const parser = React.useMemo(
() => SimpleMarkdown.parserFor(simpleMarkdownRules),
[simpleMarkdownRules],
@@ -61,10 +66,20 @@
return { ...flattened, fontSize: fontSize * emojiOnlyFactor };
}, [emojiOnly, style, emojiOnlyFactor]);
- const renderedOutput = React.useMemo(
- () => output(ast, { textStyle, container }),
- [ast, output, textStyle, container],
- );
+ const renderedOutput = React.useMemo(() => {
+ let color = boundColors.listChatBubble;
+ if (threadColor) {
+ color = tinycolor(threadColor).darken(20).toString();
+ }
+ return output(ast, { textStyle, container, color });
+ }, [
+ ast,
+ output,
+ textStyle,
+ container,
+ threadColor,
+ boundColors.listChatBubble,
+ ]);
if (container === 'Text') {
return <Text>{renderedOutput}</Text>;
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
@@ -23,6 +23,7 @@
// View, and Views can't be nested inside Texts without explicit height and
// width
+container: 'View' | 'Text',
+ +color?: string,
};
// Entry requires a seamless transition between Markdown and TextInput
@@ -233,11 +234,16 @@
node: SharedMarkdown.SingleASTNode,
output: SharedMarkdown.Output<SharedMarkdown.ReactElement>,
state: SharedMarkdown.State,
- ) => (
- <View key={state.key} style={styles.blockQuote}>
- {output(node.content, state)}
- </View>
- ),
+ ) => {
+ return (
+ <View
+ key={state.key}
+ style={{ ...styles.blockQuote, backgroundColor: state.color }}
+ >
+ {output(node.content, state)}
+ </View>
+ );
+ },
},
codeBlock: {
...SimpleMarkdown.defaultRules.codeBlock,
diff --git a/native/markdown/styles.js b/native/markdown/styles.js
--- a/native/markdown/styles.js
+++ b/native/markdown/styles.js
@@ -60,9 +60,7 @@
fontWeight: 'bold',
},
blockQuote: {
- backgroundColor: 'blockQuoteBackground',
- borderLeftColor: 'blockQuoteBorder',
- borderLeftWidth: 5,
+ borderRadius: 8,
padding: 10,
marginBottom: 6,
marginVertical: 6,

File Metadata

Mime Type
text/plain
Expires
Sat, Dec 6, 10:20 PM (17 h, 16 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5840695
Default Alt Text
D5048.1765059603.diff (4 KB)

Event Timeline