diff --git a/native/markdown/markdown-link.react.js b/native/markdown/markdown-link.react.js
--- a/native/markdown/markdown-link.react.js
+++ b/native/markdown/markdown-link.react.js
@@ -8,6 +8,7 @@
import { TextMessageMarkdownContext } from '../chat/text-message-markdown-context';
import { MarkdownContext, type MarkdownContextType } from './markdown-context';
+import { MarkdownSpoilerContext } from './markdown-spoiler-context';
function useDisplayLinkPrompt(
inputURL: string,
@@ -55,6 +56,10 @@
const markdownContext = React.useContext(MarkdownContext);
invariant(markdownContext, 'MarkdownContext should be set');
+ const markdownSpoilerContext = React.useContext(MarkdownSpoilerContext);
+ const spoilerContainsUnrevealedLink =
+ markdownSpoilerContext?.spoilerContainsUnrevealedLink;
+
const textMessageMarkdownContext = React.useContext(
TextMessageMarkdownContext,
);
@@ -62,7 +67,12 @@
const onPressLink = useDisplayLinkPrompt(target, markdownContext, messageKey);
- return ;
+ return (
+
+ );
}
export default MarkdownLink;
diff --git a/native/markdown/markdown-spoiler-context.js b/native/markdown/markdown-spoiler-context.js
new file mode 100644
--- /dev/null
+++ b/native/markdown/markdown-spoiler-context.js
@@ -0,0 +1,13 @@
+// @flow
+
+import * as React from 'react';
+
+export type MarkdownSpoilerContextType = {
+ +spoilerContainsUnrevealedLink: boolean,
+};
+
+const MarkdownSpoilerContext: React.Context = React.createContext(
+ null,
+);
+
+export { MarkdownSpoilerContext };
diff --git a/native/markdown/markdown-spoiler.react.js b/native/markdown/markdown-spoiler.react.js
--- a/native/markdown/markdown-spoiler.react.js
+++ b/native/markdown/markdown-spoiler.react.js
@@ -9,6 +9,7 @@
import { TextMessageMarkdownContext } from '../chat/text-message-markdown-context';
import { useStyles } from '../themes/colors';
import { MarkdownContext } from './markdown-context';
+import { MarkdownSpoilerContext } from './markdown-spoiler-context';
type MarkdownSpoilerProps = {
+spoilerIdentifier: string | number | void,
@@ -45,6 +46,20 @@
return styles.spoilerHidden;
}, [isRevealed, styles.spoilerHidden]);
+ const containsUnrevealedLink = React.useMemo(() => {
+ if (text[0].props?.target && !isRevealed) {
+ return true;
+ }
+ return false;
+ }, [text, isRevealed]);
+
+ const markdownSpoilerContextValue = React.useMemo(
+ () => ({
+ spoilerContainsUnrevealedLink: containsUnrevealedLink,
+ }),
+ [containsUnrevealedLink],
+ );
+
const onSpoilerClick = React.useCallback(() => {
if (isRevealed) {
return;
@@ -69,11 +84,18 @@
const memoizedSpoiler = React.useMemo(() => {
return (
-
- {text}
-
+
+
+ {text}
+
+
);
- }, [onSpoilerClick, styleBasedOnSpoilerState, text]);
+ }, [
+ markdownSpoilerContextValue,
+ onSpoilerClick,
+ styleBasedOnSpoilerState,
+ text,
+ ]);
return memoizedSpoiler;
}
diff --git a/native/markdown/styles.js b/native/markdown/styles.js
--- a/native/markdown/styles.js
+++ b/native/markdown/styles.js
@@ -8,7 +8,6 @@
const unboundStyles = {
link: {
- color: 'markdownLink',
textDecorationLine: 'underline',
},
italics: {
diff --git a/native/themes/colors.js b/native/themes/colors.js
--- a/native/themes/colors.js
+++ b/native/themes/colors.js
@@ -43,7 +43,6 @@
listSearchIcon: '#8E8D92',
listSeparator: '#EEEEEE',
listSeparatorLabel: '#555555',
- markdownLink: '#000000',
mintButton: '#44CC99',
modalBackground: '#EEEEEE',
modalBackgroundLabel: '#333333',
@@ -118,7 +117,6 @@
listSearchIcon: '#AAAAAA',
listSeparator: '#3A3A3C',
listSeparatorLabel: '#EEEEEE',
- markdownLink: '#FFFFFF',
mintButton: '#44CC99',
modalBackground: '#0A0A0A',
modalBackgroundLabel: '#CCCCCC',