martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-04-23 01:55:17 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

styling download button for assets

Browse Source
This commit is contained in:
Roland Osborne 2025-01-18 08:41:35 -08:00
parent 33d822397b
commit 370e6ca8de
8 changed files with 64 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
app/client/mobile/src/download.ts
View File

@ -11,8 +11,6 @@ export async function Download(uri: string, name: string, extension?: string) {
const type = extension ? extension : (await fileType(downloadPath))?.ext;
console.log(type, extension);
const dir = Platform.OS === 'ios' ? RNFS.DocumentDirectoryPath : RNFS.DownloadDirectoryPath;
const sharePath = `${dir}/${name}.${type}`;
if (await RNFS.exists(sharePath)) {
@ -20,6 +18,12 @@ console.log(type, extension);
}
await RNFS.moveFile(downloadPath, sharePath);
await Share.share({ url: sharePath });
if (Platform.OS === 'ios') {
await Share.share({ url: sharePath });
} else {
await RNFS.scanFile(sharePath);
}
await RNFS.unlink(sharePath);
}

1
app/client/mobile/src/message/audioAsset/AudioAsset.styled.ts
View File

@ -80,7 +80,6 @@ export const styles = StyleSheet.create({
},
closeIcon: {
flexShrink: 0,
backgroundColor: 'transparent',
},
progress: {
position: 'absolute',

15
app/client/mobile/src/message/audioAsset/AudioAsset.tsx
View File

@ -15,6 +15,7 @@ export function AudioAsset({ topicId, asset, loaded, show }: { topicId: string,
const opacity = useAnimatedValue(0);
const videoRef = useRef<VideoRef>(null as null | VideoRef);
const [status, setStatus] = useState('loading');
const [downloading, setDownloading] = useState(false);
useEffect(() => {
if (show) {
@ -56,6 +57,18 @@ export function AudioAsset({ topicId, asset, loaded, show }: { topicId: string,
}
}
const download = async () => {
if (!downloading) {
setDownloading(true);
try {
await actions.download();
} catch (err) {
console.log(err);
}
setDownloading(false);
}
}
return (
<View style={styles.audio}>
<Pressable onPress={showAudio}>
@ -100,7 +113,7 @@ export function AudioAsset({ topicId, asset, loaded, show }: { topicId: string,
)}
<SafeAreaView style={styles.close}>
{ state.dataUrl && (
<IconButton style={styles.closeIcon} icon="download" compact="true" mode="contained" size={28} onPress={actions.download} />
<IconButton style={styles.closeIcon} icon="download" loading={downloading} compact="true" mode="contained" size={28} onPress={download} />
)}
<Text style={styles.label} adjustsFontSizeToFit={true} numberOfLines={1}>{ asset.audio?.label || asset.encrypted?.label }</Text>
<IconButton style={styles.closeIcon} icon="close" compact="true" mode="contained" size={28} onPress={hideAudio} />

1
app/client/mobile/src/message/binaryAsset/BinaryAsset.styled.ts
View File

@ -85,7 +85,6 @@ export const styles = StyleSheet.create({
color: Colors.offsync,
},
closeIcon: {
backgroundColor: 'transparent',
},
progress: {
position: 'absolute',

17
app/client/mobile/src/message/binaryAsset/BinaryAsset.tsx
View File

@ -13,6 +13,7 @@ export function BinaryAsset({ topicId, asset, loaded, show }: { topicId: string,
const [modal, setModal] = useState(false);
const opacity = useAnimatedValue(0);
const [alert, setAlert] = useState('');
const [downloading, setDownloading] = useState(false);
useEffect(() => {
if (show) {
@ -45,8 +46,20 @@ export function BinaryAsset({ topicId, asset, loaded, show }: { topicId: string,
actions.cancelLoad();
}
const download = async () => {
if (!downloading) {
setDownloading(true);
try {
await actions.download();
} catch (err) {
console.log(err);
}
setDownloading(false);
}
}
return (
<View style={styles.audio}>
<View style={styles.binary}>
<Pressable onPress={showBinary}>
<Animated.View style={[styles.container,{opacity},]}>
<Image
@ -74,7 +87,7 @@ export function BinaryAsset({ topicId, asset, loaded, show }: { topicId: string,
/>
{ state.dataUrl && (
<View style={styles.button}>
<IconButton style={styles.control} size={64} icon="download-outline" onPress={share} />
<IconButton style={styles.control} size={64} icon="download-outline" loading={downloading} onPress={download} />
</View>
)}
</View>

15
app/client/mobile/src/message/imageAsset/ImageAsset.tsx
View File

@ -13,6 +13,7 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
const [modal, setModal] = useState(false);
const opacity = useAnimatedValue(0);
const [cleared, setCleared] = useState(false);
const [downloading, setDownloading] = useState(false);
useEffect(() => {
if (state.loaded && show) {
@ -38,6 +39,18 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
actions.cancelLoad();
}
const download = async () => {
if (!downloading) {
setDownloading(true);
try {
await actions.download();
} catch (err) {
console.log(err);
}
setDownloading(false);
}
}
return (
<View style={styles.image}>
{ state.thumbUrl && (
@ -81,7 +94,7 @@ export function ImageAsset({ topicId, asset, loaded, show }: { topicId: string,
)}
<SafeAreaView style={styles.close}>
{ state.dataUrl && (
<IconButton style={styles.closeIcon} icon="download" compact="true" mode="contained" size={28} onPress={actions.download} />
<IconButton style={styles.closeIcon} icon="download" loading={downloading} compact="true" mode="contained" size={28} onPress={download} />
)}
<View style={styles.spacer} />
<IconButton style={styles.closeIcon} icon="close" compact="true" mode="contained" size={28} onPress={hideImage} />

1
app/client/mobile/src/message/videoAsset/VideoAsset.styled.ts
View File

@ -53,7 +53,6 @@ export const styles = StyleSheet.create({
right: 0,
},
closeIcon: {
backgroundColor: 'transparent',
},
progress: {
position: 'absolute',

15
app/client/mobile/src/message/videoAsset/VideoAsset.tsx
View File

@ -16,6 +16,7 @@ export function VideoAsset({ topicId, asset, loaded, show }: { topicId: string,
const [status, setStatus] = useState('loading');
const [showControl, setShowControl] = useState(false);
const clear = useRef();
const [downloading, setDownloading] = useState(false);
useEffect(() => {
if (state.loaded && show) {
@ -68,6 +69,18 @@ export function VideoAsset({ topicId, asset, loaded, show }: { topicId: string,
}
}
const download = async () => {
if (!downloading) {
setDownloading(true);
try {
await actions.download();
} catch (err) {
console.log(err);
}
setDownloading(false);
}
}
return (
<View style={styles.video}>
{ state.thumbUrl && (
@ -112,7 +125,7 @@ export function VideoAsset({ topicId, asset, loaded, show }: { topicId: string,
)}
<SafeAreaView style={styles.close}>
{ state.dataUrl && (
<IconButton style={styles.closeIcon} icon="download" compact="true" mode="contained" size={28} onPress={actions.download} />
<IconButton style={styles.closeIcon} icon="download" loading={downloading} compact="true" mode="contained" size={28} onPress={download} />
)}
<View style={styles.spacer} />
<IconButton style={styles.closeIcon} icon="close" compact="true" mode="contained" size={28} onPress={hideVideo} />