Refine querying followed tags

src/components/Parse/HTML.tsx

@@ -4,15 +4,13 @@ import ParseEmojis from '@components/Parse/Emojis'
 import { useNavigation, useRoute } from '@react-navigation/native'
 import { StackNavigationProp } from '@react-navigation/stack'
 import { TabLocalStackParamList } from '@utils/navigation/navigators'
-import { useFollowedTagsQuery } from '@utils/queryHooks/tags'
-import { useGlobalStorage } from '@utils/storage/actions'
+import { useAccountStorage, useGlobalStorage } from '@utils/storage/actions'
 import { StyleConstants } from '@utils/styles/constants'
 import layoutAnimation from '@utils/styles/layoutAnimation'
 import { adaptiveScale } from '@utils/styles/scaling'
 import { useTheme } from '@utils/styles/ThemeManager'
 import { ChildNode } from 'domhandler'
 import { ElementType, parseDocument } from 'htmlparser2'
-import { isEqual } from 'lodash'
 import React, { useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Pressable, Text, TextStyleIOS, View } from 'react-native'
@@ -72,7 +70,7 @@ const ParseHTML: React.FC<Props> = ({
     numberOfLines = 4
   }
 
-  const followedTags = useFollowedTagsQuery()
+  const [followedTags] = useAccountStorage.object('followed_tags')
 
   const [totalLines, setTotalLines] = useState<number>()
   const [expanded, setExpanded] = useState(highlighted)
@@ -112,11 +110,11 @@ const ParseHTML: React.FC<Props> = ({
             const href = node.attribs.href
             if (classes) {
               if (classes.includes('hashtag')) {
-                const tag = href.match(new RegExp(/\/tags?\/(.*)/, 'i'))?.[1]
+                const tag = href.match(new RegExp(/\/tags?\/(.*)/, 'i'))?.[1].toLowerCase()
                 const paramsHashtag = (params as { hashtag: Mastodon.Tag['name'] } | undefined)
                   ?.hashtag
                 const sameHashtag = paramsHashtag === tag
-                const isFollowing = followedTags.data?.pages[0]?.body.find(t => t.name === tag)
+                const isFollowing = followedTags?.find(t => t.name === tag)
                 return (
                   <Text
                     key={index}

src/screens/Tabs/Me/Root/Collections.tsx

@@ -2,7 +2,6 @@ import { MenuContainer, MenuRow } from '@components/Menu'
 import { useNavigation } from '@react-navigation/native'
 import { useAnnouncementQuery } from '@utils/queryHooks/announcement'
 import { useListsQuery } from '@utils/queryHooks/lists'
-import { useFollowedTagsQuery } from '@utils/queryHooks/tags'
 import { useAccountStorage } from '@utils/storage/actions'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
@@ -13,12 +12,6 @@ const Collections: React.FC = () => {
 
   const [pageMe, setPageMe] = useAccountStorage.object('page_me')
 
-  useFollowedTagsQuery({
-    options: {
-      onSuccess: data =>
-        setPageMe({ ...pageMe, followedTags: { shown: !!data?.pages?.[0].body?.length } })
-    }
-  })
   useListsQuery({
     options: {
       onSuccess: data => setPageMe({ ...pageMe, lists: { shown: !!data?.length } })

src/screens/index.tsx

@@ -18,6 +18,7 @@ import { useFiltersQuery } from '@utils/queryHooks/filters'
 import { useInstanceQuery } from '@utils/queryHooks/instance'
 import { usePreferencesQuery } from '@utils/queryHooks/preferences'
 import { useProfileQuery } from '@utils/queryHooks/profile'
+import { useFollowedTagsQuery } from '@utils/queryHooks/tags'
 import { setAccount, setGlobalStorage, useGlobalStorage } from '@utils/storage/actions'
 import { useTheme } from '@utils/styles/ThemeManager'
 import { themes } from '@utils/styles/themes'
@@ -88,6 +89,7 @@ const Screens: React.FC<Props> = ({ localCorrupt }) => {
   usePreferencesQuery({ options: { enabled: !!accountActive } })
   useFiltersQuery({ options: { enabled: !!accountActive } })
   useEmojisQuery({ options: { enabled: !!accountActive } })
+  useFollowedTagsQuery({ options: { enabled: !!accountActive } })
 
   // Callbacks
   const navigationContainerOnStateChange = () => {

src/utils/queryHooks/tags.ts

@@ -10,6 +10,7 @@ import {
 import { PagedResponse } from '@utils/api/helpers'
 import apiInstance from '@utils/api/instance'
 import { featureCheck } from '@utils/helpers/featureCheck'
+import { setAccountStorage } from '@utils/storage/actions'
 import { AxiosError } from 'axios'
 import { infinitePageParams } from './utils'
 
@@ -40,7 +41,21 @@ const useFollowedTagsQuery = (
       staleTime: Infinity,
       cacheTime: Infinity,
       ...params?.options,
-      ...infinitePageParams
+      ...infinitePageParams,
+      onSuccess: data => {
+        setAccountStorage([
+          {
+            key: 'followed_tags',
+            value: data.pages[0].body.map(tag => ({
+              name: tag.name.toLowerCase(),
+              following: tag.following
+            }))
+          }
+        ])
+        if (params?.options?.onSuccess) {
+          params.options.onSuccess(data)
+        }
+      }
     }
   )
 }

src/utils/storage/account/v0.ts

@@ -27,6 +27,7 @@ export type AccountV0 = {
   // boolean
   // object
   preferences?: Mastodon.Preferences
+  followed_tags?: Pick<Mastodon.Tag, 'name' | 'following'>[]
   notifications: PushNotification
   push: {
     global: boolean