martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 20:49:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixing disconnected indicator

Browse Source
This commit is contained in:
Roland Osborne 2022-10-19 11:15:01 -07:00
parent fc53b9e7c9
commit 83869c7e5e
3 changed files with 26 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/mobile/src/context/useAppContext.hook.js
View File

@ -21,6 +21,7 @@ export function useAppContext() {
const profile = useContext(ProfileContext); const profile = useContext(ProfileContext);
const card = useContext(CardContext); const card = useContext(CardContext);
const channel = useContext(ChannelContext); const channel = useContext(ChannelContext);
const count = useRef(0);
const ws = useRef(null); const ws = useRef(null);
@ -101,14 +102,17 @@ export function useAppContext() {
catch(err) { catch(err) {
console.log(err); console.log(err);
} }
updateState({ disconnected: 0 }); count.current = 0;
updateState({ disconnected: count.current });
} }
catch (err) { catch (err) {
console.log(err); console.log(err);
} }
} }
ws.current.onclose = (e) => { ws.current.onclose = (e) => {
updateState({ disconnected: state.disconnected + 1 }); count.current += 1;
console.log("CURRENT1: ", count.current);
updateState({ disconnected: count.current });
console.log(e) console.log(e)
setTimeout(() => { setTimeout(() => {
if (ws.current != null) { if (ws.current != null) {
@ -124,7 +128,9 @@ export function useAppContext() {
ws.current.send(JSON.stringify({ AppToken: token })) ws.current.send(JSON.stringify({ AppToken: token }))
} }
ws.current.error = (e) => { ws.current.error = (e) => {
updateState({ disconnected: state.disconnected + 1 }); count.current += 1;
console.log("CURRENT2: ", count.current);
updateState({ disconnected: count.current });
console.log(e) console.log(e)
} }
} }

10
app/mobile/src/session/conversation/topicItem/imageAsset/ImageAsset.jsx
View File

@ -8,8 +8,14 @@ export function ImageAsset({ topicId, asset, dismiss }) {
return ( return (
<TouchableOpacity style={styles.container} activeOpacity={1} onPress={dismiss}> <TouchableOpacity style={styles.container} activeOpacity={1} onPress={dismiss}>
<Image source={{ uri: state.url }} onLoad={actions.loaded} style={{ borderRadius: 4, width: state.imageWidth, height: state.imageHeight }} resizeMode={'cover'} /> <Image source={{ uri: state.url }} onLoad={actions.loaded} onError={actions.failed}
{ !state.loaded && ( style={{ borderRadius: 4, width: state.imageWidth, height: state.imageHeight }} resizeMode={'cover'} />
{ state.failed && (
<View style={styles.loading}>
<ActivityIndicator color={Colors.alert} size="large" />
</View>
)}
{ !state.loaded && !state.failed && (
<View style={styles.loading}> <View style={styles.loading}>
<ActivityIndicator color={Colors.white} size="large" /> <ActivityIndicator color={Colors.white} size="large" />
</View> </View>

17
app/mobile/src/session/conversation/topicItem/imageAsset/useImageAsset.hook.js
View File

@ -13,6 +13,7 @@ export function useImageAsset(topicId, asset) {
imageHeight: 1, imageHeight: 1,
url: null, url: null,
loaded: false, loaded: false,
failed: false,
}); });
const conversation = useContext(ConversationContext); const conversation = useContext(ConversationContext);
@ -44,17 +45,17 @@ export function useImageAsset(topicId, asset) {
useEffect(() => { useEffect(() => {
const url = conversation.actions.getTopicAssetUrl(topicId, asset.full); const url = conversation.actions.getTopicAssetUrl(topicId, asset.full);
if (url) { updateState({ url });
Image.getSize(url, (width, height) => {
updateState({ url, imageRatio: width / height });
});
}
}, [topicId, conversation, asset]); }, [topicId, conversation, asset]);
const actions = { const actions = {
loaded: () => { loaded: (e) => {
updateState({ loaded: true }); const { width, height } = e.nativeEvent.source;
} updateState({ loaded: true, imageRatio: width / height });
},
failed: () => {
updateState({ failed: true });
},
}; };
return { state, actions }; return { state, actions };