pumping upload progress to uploads modal

This commit is contained in:
noumantahir 2022-05-31 12:39:40 +05:00
parent cc97375634
commit 5597f53526
4 changed files with 43 additions and 22 deletions

View File

@ -61,7 +61,7 @@ const MarkdownEditorView = ({
isPreviewActive, isPreviewActive,
isReply, isReply,
isLoading, isLoading,
isUploading,
initialFields, initialFields,
onChange, onChange,
handleOnTextChange, handleOnTextChange,
@ -78,6 +78,7 @@ const MarkdownEditorView = ({
autoFocusText, autoFocusText,
sharedSnippetText, sharedSnippetText,
onLoadDraftPress, onLoadDraftPress,
uploadProgress,
}) => { }) => {
const dispatch = useDispatch(); const dispatch = useDispatch();
@ -550,6 +551,8 @@ const MarkdownEditorView = ({
username={currentAccount.username} username={currentAccount.username}
handleOnSelect={_handleOnMediaSelect} handleOnSelect={_handleOnMediaSelect}
uploadedImage={uploadedImage} uploadedImage={uploadedImage}
isUploading={isUploading}
uploadProgress={uploadProgress}
/> />
<InsertLinkModal <InsertLinkModal

View File

@ -1,13 +1,14 @@
import { proxifyImageSrc } from '@ecency/render-helper';
import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react'; import React, { forwardRef, useEffect, useImperativeHandle, useState } from 'react';
import { useIntl } from 'react-intl'; import { useIntl } from 'react-intl';
import {Text, View, FlatList, RefreshControl, TouchableOpacity, Alert, Platform } from 'react-native'; import { Alert, FlatList, Platform, RefreshControl, Text, TouchableOpacity, View } from 'react-native';
import FastImage from 'react-native-fast-image'; import FastImage from 'react-native-fast-image';
import { CheckBox, MainButton, TextButton } from '..'; import { CheckBox, MainButton, TextButton } from '..';
import { UploadedMedia } from '../../models'; import { UploadedMedia } from '../../models';
import { addImage, deleteImage, getImages } from '../../providers/ecency/ecency'; import { addImage, deleteImage, getImages } from '../../providers/ecency/ecency';
import { ProgressBar } from '../atoms';
import Modal from '../modal'; import Modal from '../modal';
import styles from './uploadsGalleryModalStyles'; import styles from './uploadsGalleryModalStyles';
import { proxifyImageSrc } from '@ecency/render-helper';
export interface UploadsGalleryModalRef { export interface UploadsGalleryModalRef {
@ -23,9 +24,18 @@ interface UploadsGalleryModalProps {
username: string; username: string;
handleOnSelect: (data: Array<MediaInsertData>) => void; handleOnSelect: (data: Array<MediaInsertData>) => void;
uploadedImage: MediaInsertData; uploadedImage: MediaInsertData;
isUploading: boolean;
uploadProgress: number
} }
export const UploadsGalleryModal = forwardRef(({username, handleOnSelect, uploadedImage}: UploadsGalleryModalProps, ref) => { export const UploadsGalleryModal = forwardRef(({
username,
handleOnSelect,
uploadedImage,
isUploading,
uploadProgress,
}: UploadsGalleryModalProps, ref) => {
const intl = useIntl(); const intl = useIntl();
const [mediaUploads, setMediaUploads] = useState([]); const [mediaUploads, setMediaUploads] = useState([]);

View File

@ -470,7 +470,11 @@ class EditorContainer extends Component <any, any> {
// TODO: extend this to show realtime upload progress to user on sceen // TODO: extend this to show realtime upload progress to user on sceen
_showUploadProgress = (event) => { _showUploadProgress = (event) => {
const progress = Math.round((100 * event.loaded) / event.total); const progress = Math.round((100 * event.loaded) / event.total);
console.log('progress : ', progress); console.log('progress : ', progress);
this.setState({
uploadProgress:progress
})
} }
_handleMediaOnSelectFailure = (error) => { _handleMediaOnSelectFailure = (error) => {
@ -1191,7 +1195,8 @@ class EditorContainer extends Component <any, any> {
community, community,
sharedSnippetText, sharedSnippetText,
onLoadDraftPress, onLoadDraftPress,
thumbIndex thumbIndex,
uploadProgress,
} = this.state; } = this.state;
const tags = navigation.state.params && navigation.state.params.tags; const tags = navigation.state.params && navigation.state.params.tags;
@ -1230,6 +1235,7 @@ class EditorContainer extends Component <any, any> {
onLoadDraftPress={onLoadDraftPress} onLoadDraftPress={onLoadDraftPress}
thumbIndex={thumbIndex} thumbIndex={thumbIndex}
setThumbIndex={this._handleSetThumbIndex} setThumbIndex={this._handleSetThumbIndex}
uploadProgress={uploadProgress}
/> />
); );
} }

View File

@ -380,6 +380,7 @@ class EditorScreen extends Component {
sharedSnippetText, sharedSnippetText,
onLoadDraftPress, onLoadDraftPress,
thumbIndex, thumbIndex,
uploadProgress,
} = this.props; } = this.props;
const rightButtonText = intl.formatMessage({ const rightButtonText = intl.formatMessage({
@ -472,6 +473,7 @@ console.log('quickReplyText : ', quickReplyText);
autoFocusText={autoFocusText} autoFocusText={autoFocusText}
sharedSnippetText={sharedSnippetText} sharedSnippetText={sharedSnippetText}
onLoadDraftPress={onLoadDraftPress} onLoadDraftPress={onLoadDraftPress}
uploadProgress={uploadProgress}
/> />
</PostForm> </PostForm>
{_renderCommunityModal()} {_renderCommunityModal()}