From ce2ffabe9bd56fbe0e1244524d2adbc6bcb35887 Mon Sep 17 00:00:00 2001
From: balzack <roland.osborne@gmail.com>
Date: Mon, 30 Dec 2024 13:01:05 -0800
Subject: [PATCH] rendering thread

---
 app/client/mobile/src/conversation/Conversation.tsx |  3 +++
 app/client/mobile/src/message/Message.styled.ts     |  3 +++
 app/client/mobile/src/message/Message.tsx           | 11 +++++------
 3 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/app/client/mobile/src/conversation/Conversation.tsx b/app/client/mobile/src/conversation/Conversation.tsx
index 5fed0276..4b5f062c 100644
--- a/app/client/mobile/src/conversation/Conversation.tsx
+++ b/app/client/mobile/src/conversation/Conversation.tsx
@@ -19,6 +19,7 @@ export type MediaAsset = {
 export function Conversation({close}: {close: ()=>void}) {
   const { state, actions } = useConversation();
   const [ more, setMore ] = useState(false);
+  const [ selected, setSelected ] = useState(null);
   const thread = useRef();
 
   const scrolled = useRef(false);
@@ -115,6 +116,8 @@ export function Conversation({close}: {close: ()=>void}) {
                 card={card}
                 profile={profile}
                 host={host}
+                select={(id: string)=>setSelected(id)}
+                selected={selected}
               />
             )
           }}
diff --git a/app/client/mobile/src/message/Message.styled.ts b/app/client/mobile/src/message/Message.styled.ts
index 32367c60..9839e129 100644
--- a/app/client/mobile/src/message/Message.styled.ts
+++ b/app/client/mobile/src/message/Message.styled.ts
@@ -55,6 +55,9 @@ export const styles = StyleSheet.create({
     fontStyle: 'italic',
     color: Colors.placeholder,
   },
+  text: {
+    fontSize: 16,
+  },
   timestamp: {
     fontSize: 12,
   },
diff --git a/app/client/mobile/src/message/Message.tsx b/app/client/mobile/src/message/Message.tsx
index fb913b4b..9fe11ed4 100644
--- a/app/client/mobile/src/message/Message.tsx
+++ b/app/client/mobile/src/message/Message.tsx
@@ -10,19 +10,18 @@ import { BinaryAsset } from './binaryAsset/BinaryAsset';
 import { useMessage } from './useMessage.hook';
 import {styles} from './Message.styled';
 
-export function Message({ topic, card, profile, host }: { topic: Topic, card: Card | null, profile: Profile | null, host: boolean }) {
+export function Message({ topic, card, profile, host, select, selected }: { topic: Topic, card: Card | null, profile: Profile | null, host: boolean, select: (id: string)=>void, selected: string }) {
   const { state, actions } = useMessage();
   const { locked, data, created, topicId, status, transform } = topic;
   const { name, handle, node } = profile || card || { name: null, handle: null, node: null }
   const { text, textColor, textSize, assets } = data || { text: null, textColor: null, textSize: null }
-  const textStyle = { color: textColor ? textColor : undefined, fontSize: textSize ? textSize : undefined };
+  const textStyle = textColor && textSize ? { fontSize: textSize, color: textColor } : textColor ? { color: textColor } : textSize ? { fontSize: textSize } : {}
   const logoUrl = profile ? profile.imageUrl : card ? card.imageUrl : avatar;
   const timestamp = actions.getTimestamp(created);
   const [message, setMessage] = useState('');
   const [editing, setEditing] = useState(false);
   const [editText, setEditText] = useState('');
   const [saving, setSaving] = useState(false);
-  const [options, setOptions] = useState(false);
 
   return (
     <View style={styles.message}>
@@ -30,7 +29,7 @@ export function Message({ topic, card, profile, host }: { topic: Topic, card: Ca
         <View style={styles.content}>
           <Image style={styles.logo} resizeMode={'contain'} source={{uri: logoUrl}} />
           <View style={styles.body}>
-            <Pressable style={styles.header} onPress={()=>setOptions(!options)}>
+            <Pressable style={styles.header} onPress={()=>select(topicId)}>
               <View style={styles.name}>
                 { name && (
                   <Text style={styles.handle}>{ name }</Text>
@@ -50,7 +49,7 @@ export function Message({ topic, card, profile, host }: { topic: Topic, card: Ca
                 </View>
               )}
               { !locked && status === 'confirmed' && text && !editing && (
-                  <Text style={styles.text}>{ text }</Text>
+                  <Text style={{ ...styles.text, ...textStyle }}>{ text }</Text>
               )}
               { !locked && status !== 'confirmed' && (
                 <View style={styles.unconfirmed}>
@@ -63,7 +62,7 @@ export function Message({ topic, card, profile, host }: { topic: Topic, card: Ca
           </View>
         </View>
       </View>
-      { options && (
+      { topicId === selected && (
         <Surface style={styles.options}>
           <IconButton style={styles.option} loading={false} compact="true"  mode="contained" icon="share-variant-outline" size={24} onPress={() => {}} />
           <IconButton style={styles.option} loading={false} compact="true"  mode="contained" icon="square-edit-outline" size={24} onPress={() => {}} />