diff --git a/app/mobile/src/session/channels/Channels.jsx b/app/mobile/src/session/channels/Channels.jsx index b7d75ce4..e07e583a 100644 --- a/app/mobile/src/session/channels/Channels.jsx +++ b/app/mobile/src/session/channels/Channels.jsx @@ -124,7 +124,9 @@ export function Channels({ cardId, channelId, navigation, openConversation }) { { state.busy && ( )} - Create + { !state.busy && ( + Create + )} diff --git a/app/mobile/src/session/details/Details.jsx b/app/mobile/src/session/details/Details.jsx index b7d32cce..e5e022d6 100644 --- a/app/mobile/src/session/details/Details.jsx +++ b/app/mobile/src/session/details/Details.jsx @@ -1,4 +1,4 @@ -import { KeyboardAvoidingView, FlatList, Alert, Modal, View, Text, Switch, TouchableOpacity, TextInput } from 'react-native'; +import { ActivityIndicator, KeyboardAvoidingView, FlatList, Alert, Modal, View, Text, Switch, TouchableOpacity, TextInput } from 'react-native'; import { styles } from './Details.styled'; import { useDetails } from './useDetails.hook'; import { Logo } from 'utils/Logo'; @@ -145,16 +145,31 @@ export function Details({ channel, clearConversation }) { { !state.hostId && ( - Delete Topic + { state.deleteBusy && ( + + )} + { !state.deleteBusy && ( + Delete Topic + )} )} { state.hostId && ( - Leave Topic + { state.deleteBusy && ( + + )} + { !state.deleteBusy && ( + Leave Topic + )} )} - Block Topic + { state.blockBusy && ( + + )} + { !state.blockBusy && ( + Block Topic + )} { state.hostId && ( diff --git a/app/mobile/src/session/details/Details.styled.js b/app/mobile/src/session/details/Details.styled.js index 81248d30..9ea9a773 100644 --- a/app/mobile/src/session/details/Details.styled.js +++ b/app/mobile/src/session/details/Details.styled.js @@ -57,14 +57,18 @@ export const styles = StyleSheet.create({ paddingTop: 16, }, button: { + display: 'flex', + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'center', width: 128, + height: 28, backgroundColor: Colors.primary, borderRadius: 4, margin: 8, + padding: 2, }, buttonText: { - width: '100%', - textAlign: 'center', color: Colors.white, padding: 4, }, diff --git a/app/mobile/src/session/details/useDetails.hook.js b/app/mobile/src/session/details/useDetails.hook.js index 6ae697c9..4fdb132c 100644 --- a/app/mobile/src/session/details/useDetails.hook.js +++ b/app/mobile/src/session/details/useDetails.hook.js @@ -26,6 +26,8 @@ export function useDetails() { count: 0, seals: null, sealKey: null, + deleteBusy: false, + blockBusy: false, }); const card = useContext(CardContext); @@ -139,10 +141,32 @@ export function useDetails() { } }, remove: async () => { - await conversation.actions.removeChannel(); + if (!state.deleteBusy) { + try { + updateState({ deleteBusy: true }); + await conversation.actions.removeChannel(); + updateState({ deleteBusy: false }); + } + catch(err) { + console.log(err); + updateState({ deleteBusy: false }); + throw new Error("delete failed"); + } + } }, block: async() => { - await conversation.actions.setChannelFlag(); + if (!state.deleteBusy) { + try { + updateState({ blockBusy: true }); + await conversation.actions.setChannelFlag(); + updateState({ blockBusy: false }); + } + catch(err) { + console.log(err); + updateState({ blockBusy: false }); + throw new Error("block failed"); + } + } }, report: async() => { await conversation.actions.addChannelAlert();