Add tip message

src/backend/database.cjs

@@ -181,6 +181,12 @@ const groupMessageTable = () => {
               hash TEXT UNIQUE,
               sent BOOLEAN
             )`
+
+            try {
+               const update = `ALTER TABLE groupmessages ADD tip TEXT`
+                database.prepare(update).run()
+            } catch(e) {
+            }
     return new Promise(
         (resolve, reject) => {
             database.prepare(groupTable).run()
@@ -423,6 +429,12 @@ const saveGroupMsg = async (msg, offchain, channels = false) => {
         msg.name = 'Anonymous'
     }
 
+    let tip = ""
+
+    if (msg.tip) {
+        tip = JSON.stringify(msg.tip)
+    }
+
     msg.sent = changeBool(msg.sent)
 
     try {
@@ -436,17 +448,18 @@ const saveGroupMsg = async (msg, offchain, channels = false) => {
     name,
     reply,
     hash,
-    sent
+    sent,
+    tip
           )
        VALUES
-           (? ,?, ?, ?, ?, ?, ?, ?, ?)`
+           (? ,?, ?, ?, ?, ?, ?, ?, ?, ?)`
 
-    ).run(msg.message, msg.address, '', msg.group, msg.time, msg.name, msg.reply, msg.hash, msg.sent)
+    ).run(msg.message, msg.address, '', msg.group, msg.time, msg.name, msg.reply, msg.hash, msg.sent, tip)
 
         } catch(a) {
             console.log("Sql lite", a)
         }
-
+    
     return msg
 }
 
@@ -724,7 +737,8 @@ const printGroup = async (group, page) => {
           name,
           reply,
           hash,
-          sent
+          sent,
+          tip
         FROM
             groupmessages
         WHERE grp = ?

src/backend/preload.cjs

@@ -169,7 +169,7 @@ const WINDOW_API = {
     },
 
     sendTransaction: async (tx) => {
-        ipcRenderer.send('send-tx', tx)
+        return await ipcRenderer.invoke('send-tx', tx)
     },
 
     addGroup: async (grp) => {

src/backend/swarm.cjs

@@ -449,6 +449,7 @@ const check_data_message = async (data, connection, topic, peer) => {
                     return true
                 }
                 if (INC_PEERS && active.peers.toString() !== data?.peers.toString()) {
+                    if (data.peers?.length > 100) return "Ban"
                     find_missing_peers(active, data?.peers);
                 }
                 const missing = await check_missed_messages(data.hashes, con.address, topic)
@@ -562,7 +563,8 @@ const process_request = async (messages, key, live = false) => {
                 g: m?.grp ? m?.grp : m?.room,
                 r: m?.reply,
                 n: m?.name ? m?.name : m?.nickname,
-                hash: m?.hash
+                hash: m?.hash,
+                tip: m?.tip
             }
             if (await roomMessageExists(inc.hash)) continue
             const message = sanitize_group_message(inc, false)

src/backend/utils.cjs

@@ -204,7 +204,7 @@ const sanitize_join_swarm_data = (data) => {
     if (typeof screenshare !== 'boolean') return false;
     // if (typeof data?.avatar !== 'string') return false
     let avatar = ""
-    if (data.avatar !== undefined) {
+    if (data.avatar !== undefined || data.avatar?.length > 0) {
         avatar = Buffer.from(data.avatar, 'base64')
         if (avatar.length > 200000) {
         console.log("Avatar too big")
@@ -256,6 +256,13 @@ const sanitize_join_swarm_data = (data) => {
     if (nick?.length > 50 || data.n === undefined) return false;
     let txHash = sanitizeHtml(data.hash);
     if (txHash?.length > 128 || data.hash === undefined) return false;
+
+    let tip = false;
+    if (data.tip) {
+        if (typeof data.tip.amount !== 'number' || data.tip.amount?.length > 100) return false;
+        if (typeof data.tip.receiver !== 'string' || data.tip.receiver?.length > 100) return false;
+        tip = {amount: data.tip.amount, receiver: sanitizeHtml(data.tip.receiver)}
+    }
 
     const clean_object = {
       message: text,
@@ -269,6 +276,7 @@ const sanitize_join_swarm_data = (data) => {
       sent: sent,
       channel: 'channel',
       hash: txHash,
+      tip
     };
 
     return clean_object;
@@ -298,7 +306,7 @@ const sanitize_join_swarm_data = (data) => {
     if (typeof screenshare !== 'boolean') return false;
 
     let avatar = ""
-    if (data.avatar !== undefined) {
+    if (data.avatar !== undefined || data.avatar?.length > 0) {
         const base64 = /^[A-Za-z0-9+/]+={0,2}$/;
         if (!base64.test(data.avatar)) {
             return false

src/backend/wallet.cjs

@@ -35,8 +35,8 @@ ipcMain.on('switch-node', (e, node) => {
     pickNode(node) 
 })
 
-ipcMain.on('send-tx', (e, tx) => {
-    sendTx(tx)
+ipcMain.handle('send-tx', async (e, tx) => {
+    return await sendTx(tx)
 })
 
 ipcMain.handle('verify-pass', async (e, pass) => {
@@ -459,6 +459,7 @@ async function sendTx(tx) {
             key: tx.to,
         }
         sender('sent_tx', sent)
+        return true
     } else {
         console.log(`Failed to send transaction: ${result.error.toString()}`)
         let error = {
@@ -467,6 +468,7 @@ async function sendTx(tx) {
             hash: Date.now(),
         }
       sender('error_msg', error)
+      return false
     }
 }
 

src/lib/components/chat/GroupMessage.svelte

@@ -21,6 +21,7 @@ import { roomMessages } from '$lib/stores/roommsgs'
 import { groupMessages } from '$lib/stores/groupmsgs'
 import UserOptions from '/src/routes/rooms/components/UserOptions.svelte'
 import PayIcon from '../icons/PayIcon.svelte'
+import Tip from './Tip.svelte'
 
 export let msg
 export let msgFrom
@@ -37,6 +38,16 @@ export let joined = false
 export let file = false
 export let room = false
 export let admin = false
+export let tip = false
+
+$: tipMessage = ""
+$: if (tip !== "") {
+    try {
+        tipMessage = JSON.parse(tip)
+    } catch(e) {
+        tipMessage = tip
+    }
+}
 
 $: positionEmojiContainer(openEmoji);
 
@@ -278,6 +289,7 @@ const check_avatar = (address) => {
 }
 
 const sendMoney = () => {
+    $rooms.replyTo.reply = false
     $transactions.tip = true
     $transactions.send = {
         to: msgFrom,
@@ -325,7 +337,7 @@ const sendMoney = () => {
                 <div style="display: flex; align-items: center; margin-left: -10px">
                     {#await check_avatar(msgFrom)}
                     {:then avatar}
-                     {#if avatar}
+                     {#if avatar && room}
                         <img
                             class="custom-avatar"
                             src="{avatar}"
@@ -384,6 +396,8 @@ const sendMoney = () => {
                 <DownloadFile file={file} group={true} rtc={rtc}/>
             {:else if file && myMsg}
                 <UploadFile file={file} group={true} rtc={rtc}/>
+            {:else if tip && tipMessage}
+                <Tip tip={tipMessage}/>
             {:else}
                 <p class:rtc class:joined={joined} style="user-select: text;">{msg}</p>
             {/if}

src/lib/components/chat/Tip.svelte

@@ -0,0 +1,65 @@
+<script>
+    import { onMount } from 'svelte';
+    import { tweened } from 'svelte/motion';
+    import { cubicOut, linear } from 'svelte/easing';
+    import { prettyNumbers } from '$lib/utils/utils'
+
+    export let tip;
+  
+    let rotation = tweened(0, {
+      duration: 600,
+      easing: linear,
+    });
+  
+    let rotateX = '80deg';
+    let opacity = 0;
+  
+    onMount(() => {
+      rotation.set(1); // Start animation
+    });
+  
+    $: {
+      rotateX = `${80 - 80 * $rotation}deg`; // Interpolate rotation
+      opacity = $rotation; // Interpolate opacity
+    }
+  </script>
+
+  <style>
+    .cardContainer {
+        border-radius: 12px;
+        width: fit-content;
+        opacity: 0;
+        margin: 0px;
+    }
+  
+    .insetBorder {
+        flex: 1;
+        border-radius: 8px;
+        border-width: 1px;
+        padding: 4px;
+        border-color: var(--backgound-color);
+    }
+
+    p {
+        color: black;
+        font-family: Montserrat;
+        font-size: 15px;
+        padding-right: 10px;
+        padding-left: 10px;
+    }
+  </style>
+
+  <div
+    class="cardContainer"
+    style="
+      background-color: #f5f5f5;
+      transform: rotateX({rotateX});
+      opacity: {opacity};
+    "
+  >
+    <div class="insetBorder">
+      <p style="color: black; font-family: Montserrat">
+        Sent {prettyNumbers(tip.amount)} to {tip.receiver}! 💸
+      </p>
+    </div>
+  </div>