Test #700

src/components/Timeline/Shared/Attachment.tsx

@@ -9,7 +9,6 @@ import { StackNavigationProp } from '@react-navigation/stack'
 import { RootStackParamList } from '@utils/navigation/navigators'
 import { usePreferencesQuery } from '@utils/queryHooks/preferences'
 import { StyleConstants } from '@utils/styles/constants'
-import layoutAnimation from '@utils/styles/layoutAnimation'
 import React, { useContext, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Pressable, View } from 'react-native'
@@ -207,7 +206,6 @@ const TimelineAttachment = () => {
               content={t('shared.attachment.sensitive.button')}
               overlay
               onPress={() => {
-                layoutAnimation()
                 setSensitiveShown(false)
                 haptics('Light')
               }}

src/components/Timeline/Shared/Attachment/Audio.tsx

@@ -7,7 +7,6 @@ import { useTheme } from '@utils/styles/ThemeManager'
 import { Audio } from 'expo-av'
 import React, { useCallback, useEffect, useRef, useState } from 'react'
 import { AppState, AppStateStatus, StyleSheet, View } from 'react-native'
-import { Blurhash } from 'react-native-blurhash'
 import AttachmentAltText from './AltText'
 import { aspectRatio } from './dimensions'
 
@@ -72,19 +71,23 @@ const AttachmentAudio: React.FC<Props> = ({ total, index, sensitiveShown, audio
       <View style={styles.overlay}>
         {sensitiveShown ? (
           audio.blurhash ? (
-            <Blurhash
-              blurhash={audio.blurhash}
+            <GracefullyImage
+              sources={{ blurhash: audio.blurhash }}
               style={{
                 width: '100%',
                 height: '100%'
               }}
+              dim
             />
           ) : null
         ) : (
           <>
             {audio.preview_url ? (
               <GracefullyImage
-                uri={{ original: audio.preview_url, remote: audio.preview_remote_url }}
+                sources={{
+                  default: { uri: audio.preview_url },
+                  remote: { uri: audio.preview_remote_url }
+                }}
                 style={styles.background}
                 dim
               />

src/components/Timeline/Shared/Attachment/Image.tsx

@@ -35,8 +35,11 @@ const AttachmentImage = ({
         <GracefullyImage
           accessibilityLabel={image.description}
           hidden={sensitiveShown}
-          uri={{ original: image.preview_url, remote: image.remote_url }}
-          blurhash={image.blurhash}
+          sources={{
+            default: { uri: image.preview_url },
+            remote: { uri: image.remote_url },
+            blurhash: image.blurhash
+          }}
           onPress={() => navigateToImagesViewer(image.id)}
           style={{ aspectRatio: aspectRatio({ total, index, ...image.meta?.original }) }}
           dim

src/components/Timeline/Shared/Attachment/Unsupported.tsx

@@ -1,4 +1,5 @@
 import Button from '@components/Button'
+import GracefullyImage from '@components/GracefullyImage'
 import openLink from '@components/openLink'
 import CustomText from '@components/Text'
 import { StyleConstants } from '@utils/styles/constants'
@@ -6,7 +7,6 @@ import { useTheme } from '@utils/styles/ThemeManager'
 import React from 'react'
 import { useTranslation } from 'react-i18next'
 import { View } from 'react-native'
-import { Blurhash } from 'react-native-blurhash'
 import AttachmentAltText from './AltText'
 import { aspectRatio } from './dimensions'
 
@@ -33,8 +33,8 @@ const AttachmentUnsupported: React.FC<Props> = ({ total, index, sensitiveShown,
       }}
     >
       {attachment.blurhash ? (
-        <Blurhash
-          blurhash={attachment.blurhash}
+        <GracefullyImage
+          sources={{ blurhash: attachment.blurhash }}
           style={{
             position: 'absolute',
             width: '100%',

src/components/Timeline/Shared/Attachment/Video.tsx

@@ -1,4 +1,5 @@
 import Button from '@components/Button'
+import GracefullyImage from '@components/GracefullyImage'
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
 import { connectMedia } from '@utils/api/helpers/connect'
 import { useAccountStorage, useGlobalStorage } from '@utils/storage/actions'
@@ -8,7 +9,6 @@ import { Platform } from 'expo-modules-core'
 import * as ScreenOrientation from 'expo-screen-orientation'
 import React, { useRef, useState } from 'react'
 import { Pressable, View } from 'react-native'
-import { Blurhash } from 'react-native-blurhash'
 import AttachmentAltText from './AltText'
 import { aspectRatio } from './dimensions'
 
@@ -120,7 +120,10 @@ const AttachmentVideo: React.FC<Props> = ({
       >
         {sensitiveShown ? (
           video.blurhash ? (
-            <Blurhash blurhash={video.blurhash} style={{ width: '100%', height: '100%' }} />
+            <GracefullyImage
+              sources={{ blurhash: video.blurhash }}
+              style={{ width: '100%', height: '100%' }}
+            />
           ) : null
         ) : !gifv || (gifv && (reduceMotionEnabled || !shouldAutoplayGifv)) ? (
           <Button

src/components/Timeline/Shared/Avatar.tsx

@@ -33,7 +33,10 @@ const TimelineAvatar: React.FC<Props> = ({ account }) => {
       onPress={() =>
         !disableOnPress && navigation.push('Tab-Shared-Account', { account: actualAccount })
       }
-      uri={{ original: actualAccount.avatar, static: actualAccount.avatar_static }}
+      sources={{
+        default: { uri: actualAccount.avatar },
+        static: { uri: actualAccount.avatar_static }
+      }}
       dimension={
         disableDetails || isConversation
           ? {

src/components/Timeline/Shared/Card.tsx

@@ -82,8 +82,7 @@ const TimelineCard: React.FC = () => {
       <>
         {status.card?.image ? (
           <GracefullyImage
-            uri={{ original: status.card.image }}
-            blurhash={status.card.blurhash}
+            sources={{ default: { uri: status.card.image }, blurhash: status.card.blurhash }}
             style={{ flexBasis: StyleConstants.Font.LineHeight.M * 5 }}
             imageStyle={{ borderTopLeftRadius: 6, borderBottomLeftRadius: 6 }}
             dim