Updates

src/components/Parse/Emojis.tsx

@@ -13,61 +13,59 @@ export interface Props {
   fontBold?: boolean
 }
 
-const ParseEmojis: React.FC<Props> = ({
-  content,
-  emojis,
-  size = 'M',
-  fontBold = false
-}) => {
-  const { mode, theme } = useTheme()
-  const styles = useMemo(() => {
-    return StyleSheet.create({
-      text: {
-        color: theme.primary,
-        ...StyleConstants.FontStyle[size],
-        ...(fontBold && { fontWeight: StyleConstants.Font.Weight.Bold })
-      },
-      image: {
-        width: StyleConstants.Font.Size[size],
-        height: StyleConstants.Font.Size[size],
-        transform: [{ translateY: size === 'L' ? -3 : -1 }]
-      }
-    })
-  }, [mode])
+const ParseEmojis = React.memo(
+  ({ content, emojis, size = 'M', fontBold = false }: Props) => {
+    const { mode, theme } = useTheme()
+    const styles = useMemo(() => {
+      return StyleSheet.create({
+        text: {
+          color: theme.primary,
+          ...StyleConstants.FontStyle[size],
+          ...(fontBold && { fontWeight: StyleConstants.Font.Weight.Bold })
+        },
+        image: {
+          width: StyleConstants.Font.Size[size],
+          height: StyleConstants.Font.Size[size],
+          transform: [{ translateY: size === 'L' ? -3 : -1 }]
+        }
+      })
+    }, [mode])
 
-  return (
-    <Text style={styles.text}>
-      {emojis ? (
-        content
-          .split(regexEmoji)
-          .filter(f => f)
-          .map((str, i) => {
-            if (str.match(regexEmoji)) {
-              const emojiShortcode = str.split(regexEmoji)[1]
-              const emojiIndex = emojis.findIndex(emoji => {
-                return emojiShortcode === `:${emoji.shortcode}:`
-              })
-              return emojiIndex === -1 ? (
-                <Text key={i}>{emojiShortcode}</Text>
-              ) : (
-                <Text key={i}>
-                  {/* When emoji starts a paragraph, lineHeight will break */}
-                  {i === 0 ? <Text> </Text> : null}
-                  <FastImage
-                    source={{ uri: emojis[emojiIndex].url }}
-                    style={styles.image}
-                  />
-                </Text>
-              )
-            } else {
-              return <Text key={i}>{str}</Text>
-            }
-          })
-      ) : (
-        <Text>{content}</Text>
-      )}
-    </Text>
-  )
-}
+    return (
+      <Text style={styles.text}>
+        {emojis ? (
+          content
+            .split(regexEmoji)
+            .filter(f => f)
+            .map((str, i) => {
+              if (str.match(regexEmoji)) {
+                const emojiShortcode = str.split(regexEmoji)[1]
+                const emojiIndex = emojis.findIndex(emoji => {
+                  return emojiShortcode === `:${emoji.shortcode}:`
+                })
+                return emojiIndex === -1 ? (
+                  <Text key={i}>{emojiShortcode}</Text>
+                ) : (
+                  <Text key={i}>
+                    {/* When emoji starts a paragraph, lineHeight will break */}
+                    {i === 0 ? <Text> </Text> : null}
+                    <FastImage
+                      source={{ uri: emojis[emojiIndex].url }}
+                      style={styles.image}
+                    />
+                  </Text>
+                )
+              } else {
+                return <Text key={i}>{str}</Text>
+              }
+            })
+        ) : (
+          <Text>{content}</Text>
+        )}
+      </Text>
+    )
+  },
+  (prev, next) => prev.content === next.content
+)
 
-export default React.memo(ParseEmojis, () => true)
+export default ParseEmojis

src/components/Parse/HTML.tsx

@@ -30,8 +30,8 @@ const renderNode = ({
   theme: any
   node: any
   index: number
-  size: 'M' | 'L'
-  navigation: StackNavigationProp<Nav.LocalStackParamList>
+  size: 'S' | 'M' | 'L'
+  navigation: StackNavigationProp<Nav.TabLocalStackParamList>
   mentions?: Mastodon.Mention[]
   tags?: Mastodon.Tag[]
   showFullLink: boolean
@@ -145,7 +145,7 @@ const renderNode = ({
 
 export interface Props {
   content: string
-  size?: 'M' | 'L'
+  size?: 'S' | 'M' | 'L'
   emojis?: Mastodon.Emoji[]
   mentions?: Mastodon.Mention[]
   tags?: Mastodon.Tag[]
@@ -167,7 +167,7 @@ const ParseHTML: React.FC<Props> = ({
   disableDetails = false
 }) => {
   const navigation = useNavigation<
-    StackNavigationProp<Nav.LocalStackParamList>
+    StackNavigationProp<Nav.TabLocalStackParamList>
   >()
   const route = useRoute()
   const { theme } = useTheme()

src/components/Timelines/Timeline.tsx

@@ -82,11 +82,10 @@ const Timeline: React.FC<Props> = ({
   const navigation = useNavigation()
   useEffect(() => {
     const unsubscribe = navigation.addListener('focus', props => {
-      if (props.target && props.target.includes('Screen-Notifications-Root')) {
+      if (props.target && props.target.includes('Tab-Notifications-Root')) {
         if (flattenData.length) {
           dispatch(
             localUpdateNotification({
-              unread: false,
               latestTime: (flattenData[0] as Mastodon.Notification).created_at
             })
           )