martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-05-04 23:45:21 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

setting message size

Browse Source
This commit is contained in:
balzack 2025-01-01 12:13:23 -08:00
parent c9cd468596
commit 6f9e2750c5
1 changed files with 21 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app/client/mobile/src/conversation/Conversation.tsx
View File

@ -3,7 +3,7 @@ import {KeyboardAvoidingView, Platform, SafeAreaView, Pressable, View, FlatList,
import {styles} from './Conversation.styled'; import {styles} from './Conversation.styled';
import {useConversation} from './useConversation.hook'; import {useConversation} from './useConversation.hook';
import {Message} from '../message/Message'; import {Message} from '../message/Message';
import {Surface, Icon, Text, TextInput, IconButton, Divider} from 'react-native-paper'; import {Surface, Icon, Text, TextInput, Menu, IconButton, Divider} from 'react-native-paper';
import { ActivityIndicator } from 'react-native-paper'; import { ActivityIndicator } from 'react-native-paper';
import { Colors } from '../constants/Colors'; import { Colors } from '../constants/Colors';
import { Confirm } from '../confirm/Confirm'; import { Confirm } from '../confirm/Confirm';
@ -24,12 +24,14 @@ export function Conversation({close}: {close: ()=>void}) {
const [ alert, setAlert ] = useState(false); const [ alert, setAlert ] = useState(false);
const [ sending, setSending ] = useState(false); const [ sending, setSending ] = useState(false);
const [ selected, setSelected ] = useState(null as null | string); const [ selected, setSelected ] = useState(null as null | string);
const [ sizeMenu, setSizeMenu ] = useState(false);
const thread = useRef(); const thread = useRef();
const scrolled = useRef(false); const scrolled = useRef(false);
const contentHeight = useRef(0); const contentHeight = useRef(0);
const contentLead = useRef(null); const contentLead = useRef(null);
const scrollOffset = useRef(0); const scrollOffset = useRef(0);
const busy = useRef(false);
const alertParams = { const alertParams = {
title: state.strings.error, title: state.strings.error,
prompt: state.strings.tryAgain, prompt: state.strings.tryAgain,
@ -42,8 +44,8 @@ export function Conversation({close}: {close: ()=>void}) {
}; };
const sendMessage = async () => { const sendMessage = async () => {
console.log("CALLING SEND MESSAGE"); if (!busy.current && (state.message || state.assets.length > 0)) {
if (!sending) { busy.current = true;
setSending(true); setSending(true);
try { try {
await actions.send(); await actions.send();
@ -52,6 +54,7 @@ console.log("CALLING SEND MESSAGE");
setAlert(true); setAlert(true);
} }
setSending(false); setSending(false);
busy.current = false;
} }
} }
@ -176,15 +179,27 @@ console.log("CALLING SEND MESSAGE");
<Pressable style={styles.control}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="file-outline" size={24} color={Colors.primary} /></Surface></Pressable> <Pressable style={styles.control}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="file-outline" size={24} color={Colors.primary} /></Surface></Pressable>
<Divider style={styles.separator} /> <Divider style={styles.separator} />
<Pressable style={styles.control}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="format-color-text" size={24} color={Colors.primary} /></Surface></Pressable> <Pressable style={styles.control}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="format-color-text" size={24} color={Colors.primary} /></Surface></Pressable>
<Pressable style={styles.control}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="format-size" size={24} color={Colors.primary} /></Surface></Pressable>
<Menu
visible={sizeMenu}
onDismiss={()=>setSizeMenu(false)}
anchor={<Pressable style={styles.control} onPress={()=>setSizeMenu(true)}><Surface style={styles.surface} elevation={2}><Icon style={styles.button} source="format-size" size={24} color={Colors.primary} /></Surface></Pressable>}>
<Menu.Item onPress={() => { actions.setTextSize(12); setSizeMenu(false) }} title={state.strings.textSmall} />
<Menu.Item onPress={() => { actions.setTextSize(16); setSizeMenu(false) }} title={state.strings.textMedium} />
<Menu.Item onPress={() => { actions.setTextSize(20); setSizeMenu(false) }} title={state.strings.textLarge} />
</Menu>
<View style={styles.end}> <View style={styles.end}>
<Pressable style={styles.control} onPress={sendMessage}><Surface style={styles.surface} elevation={2}> <Pressable style={styles.control} onPress={sendMessage}><Surface style={styles.surface} elevation={2}>
{ sending && ( { sending && (
<ActivityIndicator size="small" /> <ActivityIndicator size="small" />
)} )}
{ !sending && ( { !sending && (state.message || state.assets.length != 0) && (
<Icon style={styles.button} source="send" size={24} color={Colors.primary} /> <Icon style={styles.button} source="send" size={24} color={Colors.primary} />
)} )}
{ !sending && !state.message && state.assets.length == 0 && (
<Icon style={styles.button} source="send" size={24} color={Colors.placeholder} />
)}
</Surface></Pressable> </Surface></Pressable>
</View> </View>
</View> </View>