remove blurcomponent, fix the blur style in image.tsx, minor tweak video function name
This commit is contained in:
parent
7108e35ae7
commit
d3c87a19eb
|
@ -1,27 +0,0 @@
|
|||
import React from 'react';
|
||||
import { BlurView } from '@react-native-community/blur';
|
||||
import { View, ViewStyle } from 'react-native';
|
||||
|
||||
import RCActivityIndicator from '../../ActivityIndicator';
|
||||
import { CustomIcon } from '../../CustomIcon';
|
||||
import { useTheme } from '../../../theme';
|
||||
|
||||
const BlurComponent = ({ loading = false, style }: { loading: boolean; style: ViewStyle }) => {
|
||||
const { theme, colors } = useTheme();
|
||||
|
||||
return (
|
||||
<>
|
||||
<BlurView
|
||||
style={[style, { position: 'absolute', borderWidth: 0, top: 0, left: 0, bottom: 0, right: 0 }]}
|
||||
blurType={theme === 'light' ? 'light' : 'dark'}
|
||||
blurAmount={10}
|
||||
reducedTransparencyFallbackColor='white'
|
||||
/>
|
||||
<View style={[style, { position: 'absolute', justifyContent: 'center', alignItems: 'center', borderWidth: 0 }]}>
|
||||
{loading ? <RCActivityIndicator /> : <CustomIcon color={colors.buttonText} name='arrow-down-circle' size={54} />}
|
||||
</View>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default BlurComponent;
|
|
@ -5,6 +5,7 @@ import { dequal } from 'dequal';
|
|||
import { createImageProgress } from 'react-native-image-progress';
|
||||
import * as Progress from 'react-native-progress';
|
||||
import * as FileSystem from 'expo-file-system';
|
||||
import { BlurView } from '@react-native-community/blur';
|
||||
|
||||
import Touchable from './Touchable';
|
||||
import Markdown from '../markdown';
|
||||
|
@ -17,7 +18,8 @@ import { TSupportedThemes, useTheme } from '../../theme';
|
|||
import { formatAttachmentUrl } from '../../lib/methods/helpers/formatAttachmentUrl';
|
||||
import { MediaTypes, downloadMediaFile, searchMediaFileAsync } from '../../lib/methods/handleMediaDownload';
|
||||
import { isAutoDownloadEnabled } from './helpers/mediaDownload/autoDownloadPreference';
|
||||
import BlurComponent from './Components/BlurComponent';
|
||||
import RCActivityIndicator from '../ActivityIndicator';
|
||||
import { CustomIcon } from '../CustomIcon';
|
||||
|
||||
interface IMessageButton {
|
||||
children: React.ReactElement;
|
||||
|
@ -50,6 +52,24 @@ const Button = React.memo(({ children, onPress, disabled, theme }: IMessageButto
|
|||
</Touchable>
|
||||
));
|
||||
|
||||
const BlurComponent = ({ loading = false }: { loading: boolean }) => {
|
||||
const { theme, colors } = useTheme();
|
||||
|
||||
return (
|
||||
<>
|
||||
<BlurView
|
||||
style={[styles.image, styles.imageBlur]}
|
||||
blurType={theme === 'light' ? 'light' : 'dark'}
|
||||
blurAmount={10}
|
||||
reducedTransparencyFallbackColor='white'
|
||||
/>
|
||||
<View style={[styles.image, styles.imageIndicator]}>
|
||||
{loading ? <RCActivityIndicator /> : <CustomIcon color={colors.buttonText} name='arrow-down-circle' size={54} />}
|
||||
</View>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export const MessageImage = React.memo(
|
||||
({ imgUri, toDownload, loading }: { imgUri: string; toDownload: boolean; loading: boolean }) => {
|
||||
const { colors } = useTheme();
|
||||
|
@ -65,7 +85,7 @@ export const MessageImage = React.memo(
|
|||
color: colors.actionTintColor
|
||||
}}
|
||||
/>
|
||||
{toDownload ? <BlurComponent style={styles.image} loading={loading} /> : null}
|
||||
{toDownload ? <BlurComponent loading={loading} /> : null}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -151,7 +151,7 @@ const Video = React.memo(
|
|||
}
|
||||
|
||||
if (!isIOS && file.video_url) {
|
||||
await downloadVideo(video);
|
||||
await downloadVideoToGallery(video);
|
||||
return;
|
||||
}
|
||||
EventEmitter.emit(LISTENER, { message: I18n.t('Unsupported_format') });
|
||||
|
@ -165,7 +165,7 @@ const Video = React.memo(
|
|||
}
|
||||
};
|
||||
|
||||
const downloadVideo = async (uri: string) => {
|
||||
const downloadVideoToGallery = async (uri: string) => {
|
||||
setLoading(true);
|
||||
const fileDownloaded = await fileDownload(uri, file);
|
||||
setLoading(false);
|
||||
|
|
|
@ -170,5 +170,19 @@ export default StyleSheet.create({
|
|||
threadDetails: {
|
||||
flex: 1,
|
||||
marginLeft: 12
|
||||
},
|
||||
imageBlur: {
|
||||
position: 'absolute',
|
||||
borderWidth: 0,
|
||||
top: 0,
|
||||
left: 0,
|
||||
bottom: 0,
|
||||
right: 0
|
||||
},
|
||||
imageIndicator: {
|
||||
position: 'absolute',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
borderWidth: 0
|
||||
}
|
||||
});
|
||||
|
|
|
@ -1 +0,0 @@
|
|||
export NODE_BINARY="/Users/reinaldoneto/.nvm/versions/node/v14.19.3/bin/node"
|
Loading…
Reference in New Issue