diff --git a/app/mobile/src/session/conversation/topicItem/audioAsset/AudioAsset.jsx b/app/mobile/src/session/conversation/topicItem/audioAsset/AudioAsset.jsx index 79685b57..72c678b6 100644 --- a/app/mobile/src/session/conversation/topicItem/audioAsset/AudioAsset.jsx +++ b/app/mobile/src/session/conversation/topicItem/audioAsset/AudioAsset.jsx @@ -1,4 +1,4 @@ -import { ActivityIndicator, Image, View, Text, TouchableOpacity } from 'react-native'; +import { ActivityIndicator, Platform, Image, View, Text, TouchableOpacity } from 'react-native'; import { useEffect, useRef } from 'react'; import Colors from 'constants/Colors'; import Video from 'react-native-video'; @@ -42,7 +42,12 @@ export function AudioAsset({ asset, dismiss }) { )} - { state.url && ( + { state.url && Platform.OS === 'ios' && ( + + + + )} + { state.url && Platform.OS !== 'ios' && ( { state.downloaded && ( diff --git a/app/mobile/src/session/conversation/topicItem/audioAsset/useAudioAsset.hook.js b/app/mobile/src/session/conversation/topicItem/audioAsset/useAudioAsset.hook.js index 1de7c18f..28c903b8 100644 --- a/app/mobile/src/session/conversation/topicItem/audioAsset/useAudioAsset.hook.js +++ b/app/mobile/src/session/conversation/topicItem/audioAsset/useAudioAsset.hook.js @@ -1,8 +1,9 @@ import { useState, useRef, useEffect, useContext } from 'react'; import { ConversationContext } from 'context/ConversationContext'; import { Image } from 'react-native'; -import { useWindowDimensions } from 'react-native'; +import { useWindowDimensions, Platform } from 'react-native'; import RNFS from "react-native-fs"; +import Share from 'react-native-share'; export function useAudioAsset(asset) { @@ -50,6 +51,19 @@ export function useAudioAsset(asset) { }, [asset]); const actions = { + share: async () => { + const path = RNFS.TemporaryDirectoryPath + "/databag.mp3"; + if (await RNFS.exists(path)) { + await RNFS.unlink(path); + } + if (state.url.substring(0, 7) === 'file://') { + await RNFS.copyFile(state.url.split('?')[0], path); + } + else { + await RNFS.downloadFile({ fromUrl: state.url, toFile: path }).promise; + } + Share.open({ url: path }); + }, download: async () => { if (!state.downloaded) { updateState({ downloaded: true }); diff --git a/app/mobile/src/session/conversation/topicItem/imageAsset/ImageAsset.jsx b/app/mobile/src/session/conversation/topicItem/imageAsset/ImageAsset.jsx index 23de1ff6..8916d257 100644 --- a/app/mobile/src/session/conversation/topicItem/imageAsset/ImageAsset.jsx +++ b/app/mobile/src/session/conversation/topicItem/imageAsset/ImageAsset.jsx @@ -31,7 +31,12 @@ export function ImageAsset({ asset, dismiss }) { )} - { state.loaded && state.controls && ( + { state.loaded && state.controls && Platform.OS === 'ios' && ( + + + + )} + { state.loaded && state.controls && Platform.OS !== 'ios' && ( { state.downloaded && ( diff --git a/app/mobile/src/session/conversation/topicItem/imageAsset/useImageAsset.hook.js b/app/mobile/src/session/conversation/topicItem/imageAsset/useImageAsset.hook.js index 0b419016..05a1f5c5 100644 --- a/app/mobile/src/session/conversation/topicItem/imageAsset/useImageAsset.hook.js +++ b/app/mobile/src/session/conversation/topicItem/imageAsset/useImageAsset.hook.js @@ -3,6 +3,7 @@ import { ConversationContext } from 'context/ConversationContext'; import { Image, Platform } from 'react-native'; import { useWindowDimensions } from 'react-native'; import RNFS from "react-native-fs"; +import Share from 'react-native-share'; export function useImageAsset(asset) { @@ -70,6 +71,41 @@ export function useImageAsset(asset) { const { width, height } = e.nativeEvent; updateState({ imageRatio: width / height }); }, + share: async () => { + const path = RNFS.TemporaryDirectoryPath + "/databag"; + if (await RNFS.exists(path)) { + await RNFS.unlink(path); + } + if (state.url.substring(0, 7) === 'file://') { + await RNFS.copyFile(state.url.split('?')[0], path); + } + else { + await RNFS.downloadFile({ fromUrl: state.url, toFile: path }).promise; + } + let ext = 'dat'; + const block = await RNFS.read(path, 8, 0, 'base64'); + if (block === '/9j/4AAQSkY=') { + ext = 'jpg'; + } + if (block === 'iVBORw0KGgo=') { + ext = 'png'; + } + if (block === 'UklGRphXAQA=') { + ext = 'webp'; + } + if (block === 'R0lGODlhIAM=') { + ext = 'gif'; + } + else if (block.startsWith('Qk')) { + ext = 'bmp'; + } + const fullPath = `${path}.${ext}` + if (await RNFS.exists(fullPath)) { + await RNFS.unlink(fullPath); + } + await RNFS.moveFile(path, fullPath) + Share.open({ url: fullPath }); + }, download: async () => { if (!state.downloaded) { updateState({ downloaded: true }); diff --git a/app/mobile/src/session/conversation/topicItem/videoAsset/VideoAsset.jsx b/app/mobile/src/session/conversation/topicItem/videoAsset/VideoAsset.jsx index b3cd790e..c82c4ffd 100644 --- a/app/mobile/src/session/conversation/topicItem/videoAsset/VideoAsset.jsx +++ b/app/mobile/src/session/conversation/topicItem/videoAsset/VideoAsset.jsx @@ -1,4 +1,4 @@ -import { ActivityIndicator, Image, Text, View, TouchableOpacity } from 'react-native'; +import { ActivityIndicator, Image, Text, View, TouchableOpacity, Platform } from 'react-native'; import Colors from 'constants/Colors'; import Video from 'react-native-video'; import { useVideoAsset } from './useVideoAsset.hook'; @@ -48,7 +48,12 @@ export function VideoAsset({ asset, dismiss }) { )} - { (state.controls || !state.playing) && state.videoLoaded && ( + { (state.controls || !state.playing) && state.videoLoaded && Platform.OS === 'ios' && ( + + + + )} + { (state.controls || !state.playing) && state.videoLoaded && Platform.OS !== 'ios' && ( { state.downloaded && ( diff --git a/app/mobile/src/session/conversation/topicItem/videoAsset/useVideoAsset.hook.js b/app/mobile/src/session/conversation/topicItem/videoAsset/useVideoAsset.hook.js index db3c15c3..57397f21 100644 --- a/app/mobile/src/session/conversation/topicItem/videoAsset/useVideoAsset.hook.js +++ b/app/mobile/src/session/conversation/topicItem/videoAsset/useVideoAsset.hook.js @@ -1,8 +1,9 @@ import { useState, useRef, useEffect, useContext } from 'react'; import { ConversationContext } from 'context/ConversationContext'; import { Image } from 'react-native'; -import { useWindowDimensions } from 'react-native'; +import { useWindowDimensions, Platform } from 'react-native'; import RNFS from "react-native-fs"; +import Share from 'react-native-share'; export function useVideoAsset(asset) { @@ -73,6 +74,19 @@ export function useVideoAsset(asset) { }, [asset]); const actions = { + share: async () => { + const path = RNFS.TemporaryDirectoryPath + "/databag.mp4"; + if (await RNFS.exists(path)) { + await RNFS.unlink(path); + } + if (state.url.substring(0, 7) === 'file://') { + await RNFS.copyFile(state.url.split('?')[0], path); + } + else { + await RNFS.downloadFile({ fromUrl: state.url, toFile: path }).promise; + } + Share.open({ url: path }); + }, download: async () => { if (!state.downloaded) { updateState({ downloaded: true });