ecency/ecency-mobile
1
1
Fork 0
mirror of https://github.com/ecency/ecency-mobile.git synced 2024-12-19 03:11:38 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

implementing progress bar

Browse Source
This commit is contained in:
noumantahir 2022-05-31 12:40:30 +05:00
parent 5597f53526
commit c95757aa92
4 changed files with 164 additions and 133 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/atoms/index.ts
View File

@ -1 +1,2 @@
export * from './optionsModal';
export * from './progressBar'

18
src/components/atoms/progressBar/container/progressBar.tsx Normal file
View File

@ -0,0 +1,18 @@
import React from 'react';
import { View } from "react-native"
export const ProgressBar = ({
progress
}) => {
return (
<View style={{height:16, flex:1, flexDirection:'row', color:'green'}}>
<View style={{flex:progress, color:'blue'}} />
<View style={{flex:100 - progress}} />
</View>
)
}

1
src/components/atoms/progressBar/index.ts Normal file
View File

@ -0,0 +1 @@
export * from './container/progressBar';

61
src/components/uploadsGalleryModal/uploadsGalleryModal.tsx
View File

@ -93,7 +93,7 @@ export const UploadsGalleryModal = forwardRef(({
await _getMediaUploads();
setIndices(new Map());
setIsLoading(false);
} catch(err){
} catch (err) {
console.warn("failed to remove image from gallery", err)
setIsLoading(false);
}
@ -102,23 +102,23 @@ export const UploadsGalleryModal = forwardRef(({
//fetch images from server
const _getMediaUploads = async () => {
try{
try {
if (username) {
setIsLoading(true);
console.log("getting images for: " + username )
console.log("getting images for: " + username)
const images = await getImages()
console.log("images received", images)
setMediaUploads(images);
setIsLoading(false);
}
}catch(err){
} catch (err) {
console.warn("Failed to get images")
setIsLoading(false);
}
}
//inserts media items in post body
const _insertMedia = async (selectedIndex?:number) => {
const _insertMedia = async (selectedIndex?: number) => {
const map = selectedIndex > -1 ? new Map([[selectedIndex, true]]) : indices;
const data = []
@ -127,8 +127,8 @@ export const UploadsGalleryModal = forwardRef(({
const item = mediaUploads[index]
data.push({
url:item.url,
hash:item.url.split('/').pop()
url: item.url,
hash: item.url.split('/').pop()
})
}
@ -139,7 +139,7 @@ export const UploadsGalleryModal = forwardRef(({
//renders footer with add snipept button and shows new snippet modal
const _renderFloatingPanel = () => {
if(!indices.size){
if (!indices.size) {
return null
}
@ -148,14 +148,14 @@ export const UploadsGalleryModal = forwardRef(({
_deleteMedia()
}
Alert.alert(
intl.formatMessage({id:'alert.delete'}),
intl.formatMessage({id:'alert.remove_alert'}),
intl.formatMessage({ id: 'alert.delete' }),
intl.formatMessage({ id: 'alert.remove_alert' }),
[{
text:intl.formatMessage({id:'alert.cancel'}),
style:'cancel'
},{
text:intl.formatMessage({id:'alert.confirm'}),
onPress:_onConfirm
text: intl.formatMessage({ id: 'alert.cancel' }),
style: 'cancel'
}, {
text: intl.formatMessage({ id: 'alert.confirm' }),
onPress: _onConfirm
}]
)
@ -171,7 +171,7 @@ export const UploadsGalleryModal = forwardRef(({
})}
/>
<MainButton
style={{ width: 136, marginLeft:12}}
style={{ width: 136, marginLeft: 12 }}
onPress={_insertMedia}
iconName="plus"
iconType="MaterialCommunityIcons"
@ -187,13 +187,13 @@ export const UploadsGalleryModal = forwardRef(({
//render list item for snippet and handle actions;
const _renderItem = ({ item, index }:{item:UploadedMedia, index:number}) => {
const _renderItem = ({ item, index }: { item: UploadedMedia, index: number }) => {
const _onCheckPress = () => {
//update selection indices
if(indices.has(index)){
if (indices.has(index)) {
indices.delete(index);
}else {
} else {
indices.set(index, true);
}
@ -202,9 +202,9 @@ export const UploadsGalleryModal = forwardRef(({
const _onPress = () => {
if(indices.size){
if (indices.size) {
_onCheckPress()
}else {
} else {
_insertMedia(index)
}
}
@ -214,7 +214,7 @@ export const UploadsGalleryModal = forwardRef(({
return (
<TouchableOpacity onPress={_onPress} onLongPress={_onCheckPress}>
<FastImage
source={{uri:thumbUrl}}
source={{ uri: thumbUrl }}
style={styles.mediaItem}
/>
<View style={styles.checkContainer}>
@ -234,18 +234,29 @@ export const UploadsGalleryModal = forwardRef(({
const _renderEmptyContent = () => {
return (
<>
<Text style={styles.title}>{intl.formatMessage({id:'uploads_modal.label_no_images'})}</Text>
<Text style={styles.title}>{intl.formatMessage({ id: 'uploads_modal.label_no_images' })}</Text>
</>
);
};
const _renderUploadProgress = () => {
return (
<View>
</View>
)
}
const _renderContent = (
<View style={styles.container}>
<View style={styles.bodyWrapper}>
{true && <ProgressBar progress={30} />}
<FlatList
data={mediaUploads}
keyExtractor={(item) => `item_${item.url}`}
@ -256,7 +267,7 @@ export const UploadsGalleryModal = forwardRef(({
numColumns={2}
refreshControl={
<RefreshControl
refreshing={isLoading}
refreshing={isLoading || isUploading}
onRefresh={_getMediaUploads}
/>
}
@ -275,7 +286,7 @@ export const UploadsGalleryModal = forwardRef(({
isCloseButton
presentationStyle="formSheet"
title={intl.formatMessage({
id:'uploads_modal.title'
id: 'uploads_modal.title'
})}
animationType="slide"
style={styles.modalStyle}