Merge branch 'main' into candidate

.yarn/patches/react-native-fast-image-npm-8.6.3-03ee2d23c0.patch

@@ -21,3 +21,343 @@ index 5b21cd59c40a5754f5d19c77e2a0eb0229925911..19d82f826e88125c5e6d87ee7c348fac
      annotationProcessor "com.github.bumptech.glide:compiler:${glideVersion}"
 +    implementation 'com.github.penfeizhou.android.animation:glide-plugin:2.12.0'
  }
+diff --git a/android/src/main/java/com/dylanvann/fastimage/FastImageEnterTransition.java b/android/src/main/java/com/dylanvann/fastimage/FastImageEnterTransition.java
+new file mode 100644
+index 0000000000000000000000000000000000000000..55e3b4e0d463654f62d942ba05c2a5e51ae9d6d7
+--- /dev/null
++++ b/android/src/main/java/com/dylanvann/fastimage/FastImageEnterTransition.java
+@@ -0,0 +1,6 @@
++package com.dylanvann.fastimage;
++
++public enum FastImageEnterTransition {
++    TRANSITION_NONE,
++    FADE_IN
++}
+diff --git a/android/src/main/java/com/dylanvann/fastimage/FastImageTransitions.java b/android/src/main/java/com/dylanvann/fastimage/FastImageTransitions.java
+new file mode 100644
+index 0000000000000000000000000000000000000000..d764cc4b8d110f087120a4f0dc5d986754806dec
+--- /dev/null
++++ b/android/src/main/java/com/dylanvann/fastimage/FastImageTransitions.java
+@@ -0,0 +1,20 @@
++package com.dylanvann.fastimage;
++
++import com.bumptech.glide.load.resource.drawable.DrawableTransitionOptions;
++import com.bumptech.glide.TransitionOptions;
++import com.facebook.react.bridge.JSApplicationIllegalArgumentException;
++import android.view.animation.DecelerateInterpolator;
++
++public class FastImageTransitions {
++    static final DecelerateInterpolator mInterpolator = new DecelerateInterpolator();
++
++    public static TransitionOptions getEnterTransition(FastImageEnterTransition transition, int duration) {
++        switch (transition) {
++            case FADE_IN:
++                return DrawableTransitionOptions.withCrossFade(duration);
++
++            default:
++                throw new JSApplicationIllegalArgumentException("FastImage, invalid enterTransition argument");
++        }
++    }
++}
+\ No newline at end of file
+diff --git a/android/src/main/java/com/dylanvann/fastimage/FastImageViewConverter.java b/android/src/main/java/com/dylanvann/fastimage/FastImageViewConverter.java
+index 86ca00d018d7ded0edff733373d80976c8dbb961..e6220f57b38a3fe3ae9d5a75228f791e0ec978bb 100644
+--- a/android/src/main/java/com/dylanvann/fastimage/FastImageViewConverter.java
++++ b/android/src/main/java/com/dylanvann/fastimage/FastImageViewConverter.java
+@@ -50,6 +50,12 @@ class FastImageViewConverter {
+                 put("center", ScaleType.CENTER_INSIDE);
+             }};
+ 
++    private static final Map<String, FastImageEnterTransition> FAST_IMAGE_ENTER_TRANSITION_MAP =
++            new HashMap<String, FastImageEnterTransition>() {{
++                put("none", FastImageEnterTransition.TRANSITION_NONE);
++                put("fadeIn", FastImageEnterTransition.FADE_IN);
++            }};
++
+     // Resolve the source uri to a file path that android understands.
+     static @Nullable
+     FastImageSource getImageSource(Context context, @Nullable ReadableMap source) {
+@@ -125,6 +131,10 @@ class FastImageViewConverter {
+         return getValueFromSource("cache", "immutable", FAST_IMAGE_CACHE_CONTROL_MAP, source);
+     }
+ 
++    static FastImageEnterTransition getEnterTransition(String propValue) {
++        return getValue("enterTransition", "none", FAST_IMAGE_ENTER_TRANSITION_MAP, propValue);
++    }
++
+     private static Priority getPriority(ReadableMap source) {
+         return getValueFromSource("priority", "normal", FAST_IMAGE_PRIORITY_MAP, source);
+     }
+diff --git a/android/src/main/java/com/dylanvann/fastimage/FastImageViewManager.java b/android/src/main/java/com/dylanvann/fastimage/FastImageViewManager.java
+index c7a795471c8f8b48163c778836406bc5ead75dab..53b481547b44224e7791a8d3f39815c9c9a4be59 100644
+--- a/android/src/main/java/com/dylanvann/fastimage/FastImageViewManager.java
++++ b/android/src/main/java/com/dylanvann/fastimage/FastImageViewManager.java
+@@ -83,6 +83,17 @@ class FastImageViewManager extends SimpleViewManager<FastImageViewWithUrl> imple
+         view.setScaleType(scaleType);
+     }
+ 
++    @ReactProp(name = "enterTransition")
++    public void setEnterTransition(FastImageViewWithUrl view, String enterTransition) {
++        final FastImageEnterTransition transition = FastImageViewConverter.getEnterTransition(enterTransition);
++        view.setEnterTransition(transition);
++    }
++
++    @ReactProp(name = "transitionDuration")
++    public void setTransitionDuration(FastImageViewWithUrl view, int transitionDuration) {
++        view.setTransitionDuration(transitionDuration);
++    }
++
+     @Override
+     public void onDropViewInstance(@NonNull FastImageViewWithUrl view) {
+         // This will cancel existing requests.
+diff --git a/android/src/main/java/com/dylanvann/fastimage/FastImageViewWithUrl.java b/android/src/main/java/com/dylanvann/fastimage/FastImageViewWithUrl.java
+index 34fcf898d17d82fd52375e9028b71ad815b9b15b..fd57ac68de093d2a8ee53aeede45328c8d52aa39 100644
+--- a/android/src/main/java/com/dylanvann/fastimage/FastImageViewWithUrl.java
++++ b/android/src/main/java/com/dylanvann/fastimage/FastImageViewWithUrl.java
+@@ -30,6 +30,8 @@ class FastImageViewWithUrl extends AppCompatImageView {
+     private boolean mNeedsReload = false;
+     private ReadableMap mSource = null;
+     private Drawable mDefaultSource = null;
++    private FastImageEnterTransition mEnterTransition = FastImageEnterTransition.TRANSITION_NONE;
++    private int mTransitionDuration = 350;
+ 
+     public GlideUrl glideUrl;
+ 
+@@ -47,6 +49,14 @@ class FastImageViewWithUrl extends AppCompatImageView {
+         mDefaultSource = source;
+     }
+ 
++    public void setEnterTransition(@Nullable FastImageEnterTransition transition) {
++        mEnterTransition = transition;
++    }
++
++    public void setTransitionDuration(int duration) {
++        mTransitionDuration = duration == 0 ? 350 : duration;
++    }
++
+     private boolean isNullOrEmpty(final String url) {
+         return url == null || url.trim().isEmpty();
+     }
+@@ -147,6 +157,10 @@ class FastImageViewWithUrl extends AppCompatImageView {
+             if (key != null)
+                 builder.listener(new FastImageRequestListener(key));
+ 
++            if (mEnterTransition != FastImageEnterTransition.TRANSITION_NONE) {
++                builder.transition(FastImageTransitions.getEnterTransition(mEnterTransition, mTransitionDuration));
++            }
++
+             builder.into(this);
+         }
+     }
+diff --git a/dist/index.cjs.js b/dist/index.cjs.js
+index 2df6a29769978d8d947dfb50b422e1f56bd97fb6..f3904e20edac5f19cc26f41a4ff02eecd73ac627 100644
+--- a/dist/index.cjs.js
++++ b/dist/index.cjs.js
+@@ -9,6 +9,10 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
+ var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+ 
++const enterTransition = {
++  none: 'none',
++  fadeIn: 'fadeIn'
++}
+ const resizeMode = {
+   contain: 'contain',
+   cover: 'cover',
+@@ -115,6 +119,7 @@ const FastImageComponent = /*#__PURE__*/React.forwardRef((props, ref) => /*#__PU
+ }, props)));
+ FastImageComponent.displayName = 'FastImage';
+ const FastImage = FastImageComponent;
++FastImage.enterTransition = enterTransition
+ FastImage.resizeMode = resizeMode;
+ FastImage.cacheControl = cacheControl;
+ FastImage.priority = priority;
+diff --git a/dist/index.d.ts b/dist/index.d.ts
+index 5abb7c98b767cd0709b53f5ab2dd50c752a9377b..2da22817e3136673d40a177ae8c9fc2209f143d8 100644
+--- a/dist/index.d.ts
++++ b/dist/index.d.ts
+@@ -1,5 +1,10 @@
+ import React from 'react';
+ import { FlexStyle, LayoutChangeEvent, ShadowStyleIOS, StyleProp, TransformsStyle, ImageRequireSource, AccessibilityProps, ViewProps, ColorValue } from 'react-native';
++export declare type EnterTransition = 'none' | 'fadeIn';
++declare const enterTransition: {
++    readonly none: "none";
++    readonly fadeIn: "fadeIn";
++};
+ export declare type ResizeMode = 'contain' | 'cover' | 'stretch' | 'center';
+ declare const resizeMode: {
+     readonly contain: "contain";
+@@ -57,6 +62,16 @@ export interface FastImageProps extends AccessibilityProps, ViewProps {
+     defaultSource?: ImageRequireSource;
+     resizeMode?: ResizeMode;
+     fallback?: boolean;
++    /**
++     * Transition durations.
++     * @default none
++     */
++    enterTransition?: EnterTransition
++    /**
++     * Enter transition duration in ms.
++     * @default 500ms
++     */
++    transitionDuration?: number
+     onLoadStart?(): void;
+     onProgress?(event: OnProgressEvent): void;
+     onLoad?(event: OnLoadEvent): void;
+@@ -91,6 +106,7 @@ export interface FastImageProps extends AccessibilityProps, ViewProps {
+     children?: React.ReactNode;
+ }
+ export interface FastImageStaticProperties {
++    enterTransition: typeof enterTransition;
+     resizeMode: typeof resizeMode;
+     priority: typeof priority;
+     cacheControl: typeof cacheControl;
+diff --git a/dist/index.js b/dist/index.js
+index 58e0308bd44836aad3e4979b5c1151083956c295..5853b3b2fd05c91be8c70819fe6fc45606f26f8d 100644
+--- a/dist/index.js
++++ b/dist/index.js
+@@ -2,6 +2,10 @@ import _extends from '@babel/runtime/helpers/extends';
+ import React, { forwardRef, memo } from 'react';
+ import { NativeModules, StyleSheet, requireNativeComponent, Image, View, Platform } from 'react-native';
+ 
++const enterTransition = {
++  none: 'none',
++  fadeIn: 'fadeIn'
++}
+ const resizeMode = {
+   contain: 'contain',
+   cover: 'cover',
+@@ -57,6 +61,8 @@ function FastImageBase({
+   children,
+   // eslint-disable-next-line no-shadow
+   resizeMode = 'cover',
++  enterTransition = 'none',
++  transitionDuration = 350,
+   forwardedRef,
+   ...props
+ }) {
+@@ -79,7 +85,9 @@ function FastImageBase({
+       onLoad: onLoad,
+       onError: onError,
+       onLoadEnd: onLoadEnd,
+-      resizeMode: resizeMode
++      resizeMode: resizeMode,
++      enterTransition: enterTransition,
++      transitionDuration: transitionDuration
+     })), children);
+   }
+ 
+@@ -98,7 +106,9 @@ function FastImageBase({
+     onFastImageLoad: onLoad,
+     onFastImageError: onError,
+     onFastImageLoadEnd: onLoadEnd,
+-    resizeMode: resizeMode
++    resizeMode: resizeMode,
++    enterTransition: enterTransition,
++    transitionDuration: transitionDuration
+   })), children);
+ }
+ 
+@@ -108,6 +118,7 @@ const FastImageComponent = /*#__PURE__*/forwardRef((props, ref) => /*#__PURE__*/
+ }, props)));
+ FastImageComponent.displayName = 'FastImage';
+ const FastImage = FastImageComponent;
++FastImage.enterTransition = enterTransition
+ FastImage.resizeMode = resizeMode;
+ FastImage.cacheControl = cacheControl;
+ FastImage.priority = priority;
+diff --git a/ios/FastImage/FFFastImageView.h b/ios/FastImage/FFFastImageView.h
+index e52fca79882ad2a678487a46b2fe158427e06f3a..6c9c41b0b1a3c967a3715a24bb692447b76ef365 100644
+--- a/ios/FastImage/FFFastImageView.h
++++ b/ios/FastImage/FFFastImageView.h
+@@ -7,6 +7,7 @@
+ #import <React/RCTResizeMode.h>
+ 
+ #import "FFFastImageSource.h"
++#import "FFFastImageViewManager.h"
+ 
+ @interface FFFastImageView : SDAnimatedImageView
+ 
+@@ -16,6 +17,8 @@
+ @property (nonatomic, copy) RCTDirectEventBlock onFastImageLoad;
+ @property (nonatomic, copy) RCTDirectEventBlock onFastImageLoadEnd;
+ @property (nonatomic, assign) RCTResizeMode resizeMode;
++@property (nonatomic, assign) FFFEnterTransition enterTransition;
++@property (nonatomic, assign) NSTimeInterval transitionDuration;
+ @property (nonatomic, strong) FFFastImageSource *source;
+ @property (nonatomic, strong) UIImage *defaultSource;
+ @property (nonatomic, strong) UIColor *imageColor;
+diff --git a/ios/FastImage/FFFastImageView.m b/ios/FastImage/FFFastImageView.m
+index f7100815e652539b29b1fa70ff1477c5f5db08dc..ecb79eafe566fe52090adada3cdf16eb10a67513 100644
+--- a/ios/FastImage/FFFastImageView.m
++++ b/ios/FastImage/FFFastImageView.m
+@@ -71,6 +71,18 @@ - (void) setImageColor: (UIColor*)imageColor {
+     }
+ }
+ 
++- (void) setTransitionDuration: (NSTimeInterval)transitionDuration {
++   self.sd_imageTransition.duration = transitionDuration;
++}
++
++- (void) setEnterTransition: (FFFEnterTransition)enterTransition {
++    switch (enterTransition) {
++        case FFFFadeIn:
++            self.sd_imageTransition = SDWebImageTransition.fadeTransition;
++            break;
++    }
++}
++
+ - (UIImage*) makeImage: (UIImage*)image withTint: (UIColor*)color {
+     UIImage* newImage = [image imageWithRenderingMode: UIImageRenderingModeAlwaysTemplate];
+     UIGraphicsBeginImageContextWithOptions(image.size, NO, newImage.scale);
+diff --git a/ios/FastImage/FFFastImageViewManager.h b/ios/FastImage/FFFastImageViewManager.h
+index 8ba6020e2c6e5757ed778d00e3f43a6ff4c1d50a..a269669301ea00ef3c2714123d17e822094635d6 100644
+--- a/ios/FastImage/FFFastImageViewManager.h
++++ b/ios/FastImage/FFFastImageViewManager.h
+@@ -1,5 +1,10 @@
+ #import <React/RCTViewManager.h>
+ 
++typedef NS_ENUM(NSInteger, FFFEnterTransition) {
++    FFFTransitionNone,
++    FFFFadeIn,
++};
++
+ @interface FFFastImageViewManager : RCTViewManager
+ 
+ @end
+diff --git a/ios/FastImage/FFFastImageViewManager.m b/ios/FastImage/FFFastImageViewManager.m
+index 84ca94e26e546d4d139dabca6c3efd0a890eda63..2184bac31f0d547e6119356bb4fc7931be87446d 100644
+--- a/ios/FastImage/FFFastImageViewManager.m
++++ b/ios/FastImage/FFFastImageViewManager.m
+@@ -13,6 +13,8 @@ - (FFFastImageView*)view {
+ }
+ 
+ RCT_EXPORT_VIEW_PROPERTY(source, FFFastImageSource)
++RCT_EXPORT_VIEW_PROPERTY(enterTransition, FFFEnterTransition)
++RCT_EXPORT_VIEW_PROPERTY(transitionDuration, NSTimeInterval)
+ RCT_EXPORT_VIEW_PROPERTY(defaultSource, UIImage)
+ RCT_EXPORT_VIEW_PROPERTY(resizeMode, RCTResizeMode)
+ RCT_EXPORT_VIEW_PROPERTY(onFastImageLoadStart, RCTDirectEventBlock)
+diff --git a/ios/FastImage/RCTConvert+FFFastImage.m b/ios/FastImage/RCTConvert+FFFastImage.m
+index 43f8922157655a7497f56a3909ef6b2a886f07d8..0705f8e05f44f3053e7239fcc9a30d986e7aaab7 100644
+--- a/ios/FastImage/RCTConvert+FFFastImage.m
++++ b/ios/FastImage/RCTConvert+FFFastImage.m
+@@ -1,5 +1,6 @@
+ #import "RCTConvert+FFFastImage.h"
+ #import "FFFastImageSource.h"
++#import "FFFastImageViewManager.h"
+ 
+ @implementation RCTConvert (FFFastImage)
+ 
+@@ -15,6 +16,11 @@ @implementation RCTConvert (FFFastImage)
+                                        @"cacheOnly": @(FFFCacheControlCacheOnly),
+                                        }), FFFCacheControlImmutable, integerValue);
+ 
++RCT_ENUM_CONVERTER(FFFEnterTransition, (@{
++                                          @"none": @(FFFTransitionNone),
++                                          @"fadeIn": @(FFFFadeIn),
++                                          }), FFFTransitionNone, integerValue);
++
+ + (FFFastImageSource *)FFFastImageSource:(id)json {
+     if (!json) {
+         return nil;

fastlane/metadata/en-US/name.txt

@@ -1 +1 @@
-tooot - multilingual Mastodon app
+tooot - fediverse and Mastodon

package.json

@@ -1,6 +1,6 @@
 {
   "name": "tooot",
-  "version": "4.8.6",
+  "version": "4.8.7",
   "description": "tooot for Mastodon",
   "author": "xmflsct <me@xmflsct.com>",
   "license": "GPL-3.0-or-later",

src/components/Emojis/List.tsx

@@ -2,7 +2,7 @@ import { emojis } from '@components/Emojis'
 import Icon from '@components/Icon'
 import CustomText from '@components/Text'
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { StorageAccount } from '@utils/storage/account'
 import { getAccountStorage, setAccountStorage } from '@utils/storage/actions'
 import { StyleConstants } from '@utils/styles/constants'
@@ -130,11 +130,13 @@ const EmojisList = () => {
               style={{ padding: StyleConstants.Spacing.S }}
             >
               <FastImage
+                enterTransition='fadeIn'
+                transitionDuration={100}
                 accessibilityLabel={t('common:customEmoji.accessibilityLabel', {
                   emoji: emoji.shortcode
                 })}
                 accessibilityHint={t('screenCompose:content.root.footer.emojis.accessibilityHint')}
-                source={connectImage({ uri })}
+                source={connectMedia({ uri })}
                 style={{ width: 32, height: 32 }}
               />
             </Pressable>

src/components/GracefullyImage.tsx

@@ -1,5 +1,5 @@
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { useTheme } from '@utils/styles/ThemeManager'
 import React, { useEffect, useState } from 'react'
 import {
@@ -93,12 +93,16 @@ const GracefullyImage = ({
     >
       {uri.preview && !imageLoaded ? (
         <FastImage
-          source={connectImage({ uri: uri.preview })}
+          source={connectMedia({ uri: uri.preview })}
+          enterTransition='fadeIn'
+          transitionDuration={100}
           style={[styles.placeholder, { backgroundColor: colors.shimmerDefault }]}
         />
       ) : null}
       <FastImage
-        source={connectImage(source)}
+        source={connectMedia(source)}
+        enterTransition='fadeIn'
+        transitionDuration={100}
         style={[{ flex: 1 }, imageStyle]}
         onLoad={() => {
           setImageLoaded(true)

src/components/Parse/Emojis.tsx

@@ -1,6 +1,6 @@
 import CustomText from '@components/Text'
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { useGlobalStorage } from '@utils/storage/actions'
 import { StyleConstants } from '@utils/styles/constants'
 import { adaptiveScale } from '@utils/styles/scaling'
@@ -78,7 +78,7 @@ const ParseEmojis: React.FC<Props> = ({
                   <CustomText key={emojiShortcode + i}>
                     {i === 0 ? ' ' : undefined}
                     <FastImage
-                      source={connectImage({ uri: uri.trim() })}
+                      source={connectMedia({ uri: uri.trim() })}
                       style={{
                         width: adaptedFontsize,
                         height: adaptedFontsize,

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

@@ -1,6 +1,7 @@
 import Button from '@components/Button'
 import GracefullyImage from '@components/GracefullyImage'
 import { Slider } from '@sharcoux/slider'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { StyleConstants } from '@utils/styles/constants'
 import { useTheme } from '@utils/styles/ThemeManager'
 import { Audio } from 'expo-av'
@@ -26,7 +27,7 @@ const AttachmentAudio: React.FC<Props> = ({ total, index, sensitiveShown, audio
   const playAudio = useCallback(async () => {
     if (!audioPlayer) {
       const { sound } = await Audio.Sound.createAsync(
-        { uri: audio.url },
+        connectMedia({ uri: audio.url }) as { uri: string },
         {},
         // @ts-ignore
         props => setAudioPosition(props.positionMillis)

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

@@ -1,5 +1,6 @@
 import Button from '@components/Button'
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { useAccountStorage, useGlobalStorage } from '@utils/storage/actions'
 import { StyleConstants } from '@utils/styles/constants'
 import { ResizeMode, Video, VideoFullscreenUpdate } from 'expo-av'
@@ -41,7 +42,7 @@ const AttachmentVideo: React.FC<Props> = ({
   const playOnPress = async () => {
     setVideoLoading(true)
     if (!videoLoaded) {
-      await videoPlayer.current?.loadAsync({ uri: video.url })
+      await videoPlayer.current?.loadAsync(connectMedia({ uri: video.url }) as { uri: string })
     }
     setVideoLoading(false)
 
@@ -71,10 +72,10 @@ const AttachmentVideo: React.FC<Props> = ({
               shouldPlay: reduceMotionEnabled || !shouldAutoplayGifv ? false : true,
               isMuted: true,
               isLooping: true,
-              source: { uri: video.url }
+              source: connectMedia({ uri: video.url }) as { uri: string }
             }
           : {
-              posterSource: { uri: video.preview_url },
+              posterSource: connectMedia({ uri: video.preview_url }),
               posterStyle: { resizeMode: ResizeMode.COVER }
             })}
         useNativeControls={false}

src/screens/Announcements.tsx

@@ -6,7 +6,7 @@ import RelativeTime from '@components/RelativeTime'
 import CustomText from '@components/Text'
 import { BlurView } from '@react-native-community/blur'
 import { useAccessibility } from '@utils/accessibility/AccessibilityManager'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { RootStackScreenProps } from '@utils/navigation/navigators'
 import { useAnnouncementMutation, useAnnouncementQuery } from '@utils/queryHooks/announcement'
 import { StyleConstants } from '@utils/styles/constants'
@@ -140,7 +140,7 @@ const ScreenAnnouncements: React.FC<RootStackScreenProps<'Screen-Announcements'>
               >
                 {reaction.url ? (
                   <FastImage
-                    source={connectImage({
+                    source={connectMedia({
                       uri: reduceMotionEnabled ? reaction.static_url : reaction.url
                     })}
                     style={{

src/screens/Compose/DraftsList.tsx

@@ -3,7 +3,7 @@ import Icon from '@components/Icon'
 import { SwipeToActions } from '@components/SwipeToActions'
 import CustomText from '@components/Text'
 import HeaderSharedCreated from '@components/Timeline/Shared/HeaderShared/Created'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import apiInstance from '@utils/api/instance'
 import { ScreenComposeStackScreenProps } from '@utils/navigation/navigators'
 import { getAccountStorage, setAccountStorage, useAccountStorage } from '@utils/storage/actions'
@@ -158,7 +158,7 @@ const ComposeDraftsList: React.FC<ScreenComposeStackScreenProps<'Screen-Compose-
                         source={
                           attachment.local?.thumbnail
                             ? { uri: attachment.local?.thumbnail }
-                            : connectImage({ uri: attachment.remote?.preview_url })
+                            : connectMedia({ uri: attachment.remote?.preview_url })
                         }
                       />
                     ))}

src/screens/Compose/Root/Footer/Attachments.tsx

@@ -6,7 +6,7 @@ import { MAX_MEDIA_ATTACHMENTS } from '@components/mediaSelector'
 import CustomText from '@components/Text'
 import { useActionSheet } from '@expo/react-native-action-sheet'
 import { useNavigation } from '@react-navigation/native'
-import { connectImage } from '@utils/api/helpers/connect'
+import { connectMedia } from '@utils/api/helpers/connect'
 import { featureCheck } from '@utils/helpers/featureCheck'
 import { StyleConstants } from '@utils/styles/constants'
 import layoutAnimation from '@utils/styles/layoutAnimation'
@@ -105,11 +105,13 @@ const ComposeAttachments: React.FC<Props> = ({ accessibleRefAttachments }) => {
         }}
       >
         <FastImage
+          enterTransition='fadeIn'
+          transitionDuration={100}
           style={{ width: '100%', height: '100%' }}
           source={
             item.local?.thumbnail
               ? { uri: item.local?.thumbnail }
-              : connectImage({ uri: item.remote?.preview_url })
+              : connectMedia({ uri: item.remote?.preview_url })
           }
         />
         {item.remote?.meta?.original?.duration ? (

src/screens/Tabs/Me/Settings/App.tsx

@@ -11,6 +11,7 @@ import * as Localization from 'expo-localization'
 import React, { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Linking, Platform } from 'react-native'
+import FastImage from 'react-native-fast-image'
 import { GLOBAL } from '../../../../App'
 import { mapFontsizeToName } from '../SettingsFontsize'
 
@@ -43,6 +44,8 @@ const SettingsApp: React.FC = () => {
       })
   }, [])
 
+  const [clearingCache, setClearingCache] = useState(false)
+
   return (
     <MenuContainer>
       <MenuRow
@@ -181,6 +184,17 @@ const SettingsApp: React.FC = () => {
           }}
         />
       ) : null}
+      <MenuRow
+        title='Clear cache'
+        iconBack='chevron-right'
+        loading={clearingCache}
+        onPress={() => {
+          setClearingCache(true)
+          FastImage.clearDiskCache()
+            .then(() => setClearingCache(false))
+            .catch(() => setClearingCache(false))
+        }}
+      />
     </MenuContainer>
   )
 }

src/utils/api/helpers/connect.ts

@@ -71,51 +71,17 @@ const list = [
   'brhxw45vd5',
   'vtnvlsrn1z',
   '0q5w0hhzb5',
-  'vq2rz02ayf',
-  'hml3igfwkq',
-  '39qs7vhenl',
-  '5vcv775rug',
-  'kjom5gr7i3',
-  't2kmaoeb5x',
-  'ni6ow1z11b',
-  'yvgtoc3d88',
-  'iax04eatnz',
-  'esxyu9zujg',
-  '73xa28n278',
-  '5x63a8l24k',
-  'dy1trb0b3sj',
-  'd4c31j23m8',
-  'ho76046l0j',
-  'sw8lj5u2ef',
-  'z5cn21mew5',
-  'wxj73nmqwa',
-  'gdj00dlx98',
-  '0v76xag64i',
-  'j35104qduhj',
-  'l63r7h0ss6',
-  'e5xdv7t1q0h',
-  '4icoh8t4c8',
-  'nbk36jt4sq',
-  'zi0n0cv4tk',
-  'o7qkfp3rxu',
-  'xd2wefzd27',
-  'rg7e6tsacx',
-  '9lrq3s4vfm',
-  'srs9p21lxoh',
-  'n8xymau42t',
-  'q5cik283fg',
-  '68ye9feqs5',
-  'xjc5anubnv'
+  'vq2rz02ayf'
 ]
 
-export const CONNECT_DOMAIN = () =>
+export const CONNECT_DOMAIN = (index?: number) =>
   mapEnvironment({
-    release: `${list[Math.floor(Math.random() * (100 - 0) + 0)]}.tooot.app`,
+    release: `${list[index || Math.floor(Math.random() * list.length)]}.tooot.app`,
     candidate: 'connect-candidate.tooot.app',
     development: 'connect-development.tooot.app'
   })
 
-export const connectImage = ({
+export const connectMedia = ({
   uri
 }: {
   uri?: string
@@ -123,7 +89,19 @@ export const connectImage = ({
   if (GLOBAL.connect) {
     if (uri) {
       const host = parse(uri).host
-      return { uri: uri.replace(host, CONNECT_DOMAIN()), headers: { 'x-tooot-domain': host } }
+      return {
+        uri: uri.replace(
+          host,
+          CONNECT_DOMAIN(
+            uri
+              .split('')
+              .map(i => i.charCodeAt(0))
+              .reduce((a, b) => a + b, 0) %
+              (list.length + 1)
+          )
+        ),
+        headers: { 'x-tooot-domain': host }
+      }
     } else {
       return { uri }
     }

yarn.lock

@@ -9653,11 +9653,11 @@ __metadata:
 
 "react-native-fast-image@patch:react-native-fast-image@npm%3A8.6.3#./.yarn/patches/react-native-fast-image-npm-8.6.3-03ee2d23c0.patch::locator=tooot%40workspace%3A.":
   version: 8.6.3
-  resolution: "react-native-fast-image@patch:react-native-fast-image@npm%3A8.6.3#./.yarn/patches/react-native-fast-image-npm-8.6.3-03ee2d23c0.patch::version=8.6.3&hash=65bdbb&locator=tooot%40workspace%3A."
+  resolution: "react-native-fast-image@patch:react-native-fast-image@npm%3A8.6.3#./.yarn/patches/react-native-fast-image-npm-8.6.3-03ee2d23c0.patch::version=8.6.3&hash=1a9a6d&locator=tooot%40workspace%3A."
   peerDependencies:
     react: ^17 || ^18
     react-native: ">=0.60.0"
-  checksum: 09d7ccebd6075b85fc06d60093edf2611d97a6571b5bcd7d915df0316866a09d3bf9a74960a64aa75ac8901c9840f78b70aac58ff8b6ac627968259151109328
+  checksum: 4b2c6b2d6fc461f26936ff5033acccf7aef15f9d176ea835d09c87bee83accbb6c2b98a2435ad019a305c0751aa43040c153a6d5735664ace31e64aad0b2bc61
   languageName: node
   linkType: hard