diff --git a/app/mobile/src/context/useConversationContext.hook.js b/app/mobile/src/context/useConversationContext.hook.js index 1f2d9d68..1646aedb 100644 --- a/app/mobile/src/context/useConversationContext.hook.js +++ b/app/mobile/src/context/useConversationContext.hook.js @@ -1,5 +1,6 @@ import { useState, useEffect, useRef, useContext } from 'react'; import { StoreContext } from 'context/StoreContext'; +import { UploadContext } from 'context/UploadContext'; import { CardContext } from 'context/CardContext'; import { ChannelContext } from 'context/ChannelContext'; import { ProfileContext } from 'context/ProfileContext'; @@ -16,8 +17,12 @@ export function useConversationContext() { created: null, host: null, init: false, + progress: null, + cardId: null, + channelId: null, }); const store = useContext(StoreContext); + const upload = useContext(UploadContext); const card = useContext(CardContext); const channel = useContext(ChannelContext); const profile = useContext(ProfileContext); @@ -34,6 +39,44 @@ export function useConversationContext() { setState((s) => ({ ...s, ...value })) } + useEffect(() => { + const { cardId, channelId } = state; + const key = cardId ? `${cardId}:${channelId}` : `:${channelId}` + const progress = upload.state.progress.get(key); + if (progress) { + let count = 0; + let complete = 0; + let active = 0; + let loaded = 0; + let total = 0; + let error = false; + progress.forEach(post => { + count += post.count; + complete += (post.index - 1); + if (post.active) { + active += 1; + loaded += post.active.loaded; + total += post.active.total; + } + if (post.error) { + error = true; + } + }); + percent = Math.floor(((((loaded / total) * active) + complete) / count) * 100); + updateState({ progress: percent, uploadError: error }); + + if (error) { + setTimeout(() => { + upload.actions.clearErrors(cardId, channelId); + updateState({ progress: null, uploadError: false }); + }, 2000); + } + } + else { + updateState({ progress: null }); + } + }, [upload, state.cardId, state.channelId]); + const getTopicItems = async (cardId, channelId) => { if (cardId) { return await card.actions.getChannelTopicItems(cardId, channelId); @@ -307,7 +350,8 @@ export function useConversationContext() { setView.current++; conversationId.current = selected; reset.current = true; - updateState({ subject: null, logo: null, contacts: [], topics: new Map(), init: false }); + updateState({ subject: null, logo: null, contacts: [], topics: new Map(), init: false, + cardId: selected.cardId, channelId: selected.channelId }); sync(); const { cardId, channelId, revision } = selected; if (cardId) { diff --git a/app/mobile/src/session/conversation/addTopic/AddTopic.jsx b/app/mobile/src/session/conversation/addTopic/AddTopic.jsx index 11f492f9..1ca5a0fb 100644 --- a/app/mobile/src/session/conversation/addTopic/AddTopic.jsx +++ b/app/mobile/src/session/conversation/addTopic/AddTopic.jsx @@ -111,6 +111,15 @@ export function AddTopic() { return ( + { !state.uploadError && state.progress && ( + + )} + { !state.uploadError && !state.progress && ( + + )} + { state.uploadError && ( + + )} { state.assets.length > 0 && ( ({ ...s, ...value })); } + useEffect(() => { + const { progress, uploadError } = conversation.state; + updateState({ progress, uploadError }); + }, [conversation]); + const actions = { setMessage: (message) => { updateState({ message });