Fetch historical message data (#114)

Fetch historical message data in Groups

README.md

@@ -125,6 +125,7 @@ being awesome contributors to this project. **We'd like to take a moment to reco
 [<img src="https://avatars.githubusercontent.com/u/33717111?v=4?size=72" alt="mjovanc" width="72">](https://github.com/mjovanc)
 [<img src="https://avatars.githubusercontent.com/u/3246908?v=4?size=72" alt="f-r00t" width="72">](https://github.com/f-r00t)
 [<img src="https://avatars.githubusercontent.com/u/24655747?v=4size=72" alt="appelskrutt34" width="72">](https://github.com/appelskrutt34)
+[<img src="https://github.com/TechyGuy17.png?size=72" alt="TechyGuy17" width="72">](https://github.com/TechyGuy17)
 
 # License
 

src/backend/electron.cjs

@@ -81,6 +81,7 @@ const {
     CryptoNote,
 } = require('kryptokrona-utils')
 
+
 const { newBeam, endBeam, sendBeamMessage, addLocalFile, requestDownload, removeLocalFile } = require("./beam.cjs")
 const { newSwarm, sendSwarmMessage, endSwarm} = require("./swarm.cjs")
 const Store = require('electron-store');
@@ -98,6 +99,7 @@ const dev = !app.isPackaged
 
 const DHT = require('@hyperswarm/dht')
 
+
 let mainWindow
 let daemon
 let nodeUrl
@@ -1653,7 +1655,6 @@ async function load_file(path) {
                 stream.on('data', (data) => { 
                     imgArray.push(data)
                 })
-
                 stream.on('error', (data) => {
                     return "File not found"
                 })
@@ -1671,6 +1672,31 @@ async function load_file(path) {
     }    
 }
 
+async function syncGroupHistory(timeframe, recommended_api = undefined, key=false, page=1) {
+    fetch(`${recommended_api.url}/api/v1/posts-encrypted-group?from=${timeframe}&to=${Date.now() / 1000}&size=50&page=` + page)
+    .then((response) => response.json())
+    .then(async (json) => {
+        console.log(timeframe + " " + key)
+        const items = json.encrypted_group_posts;
+
+        for (message in items) {   
+            try {
+                    let tx = {}
+                    tx.sb = items[message].tx_sb
+                    tx.t = items[message].tx_timestamp
+                    await decryptGroupMessage(tx, items[message].tx_hash, key)
+
+                }
+                 catch {
+                }
+        }
+        if(json.current_page != json.total_pages) {
+            syncGroupHistory(timeframe, recommended_api, key, page+1)
+        }
+    })
+}
+
+
 function get_sdp(data) 
 {
     if (data.type == 'offer') 
@@ -1795,6 +1821,11 @@ ipcMain.on('removeGroup', async (e, grp) => {
     removeGroup(grp)
 })
 
+ipcMain.on('fetchHistory', async (e, settings) => { 
+    let timeframe = Date.now() / 1000 - settings.timeframe * 86400
+    await syncGroupHistory(timeframe, settings.recommended_api)
+})
+
 
 //BOARDS
 

src/lib/components/popups/NodeSelector.svelte

@@ -21,9 +21,9 @@
   let node_requests = [];
   let ssl_nodes =[];
   if (ssl) {
-      ssl_nodes = $nodelist.filter(node => {return node.ssl});
+      ssl_nodes = $nodelist.nodes.filter(node => {return node.ssl});
   } else {
-      ssl_nodes =  $nodelist.filter(node => {return !node.ssl});
+      ssl_nodes =  $nodelist.nodes.filter(node => {return !node.ssl});
   }
 
   ssl_nodes = ssl_nodes.sort((a, b) => 0.5 - Math.random());
@@ -88,7 +88,7 @@ if (recommended_node == undefined) {
     <h1>Pick a node</h1>
     <input spellcheck="false" type="text" placeholder="Enter url & port" bind:value="{nodeInput}"/>
     <div class="node-list">
-        {#each $nodelist as node, i}
+        {#each $nodelist.nodes as node, i}
             <div
                     class="node-card"
                     class:selected="{selectedNode === i}"

src/lib/stores/nodes.js

@@ -119,7 +119,7 @@ const fetchNodes = async () => {
     if (result.nodes.length === 0) {
         nodelist.set(standard.nodes)
     }
-    nodelist.set(result.nodes)
+    nodelist.set(result)
     } catch(e) {
         nodelist.set(standard.nodes)
     }

src/lib/stores/user.js

@@ -31,7 +31,8 @@ export const groups = writable({
     thisGroup: {key: "SEKReYU57DLLvUjNzmjVhaK7jqc8SdZZ3cyKJS5f4gWXK4NQQYChzKUUwzCGhgqUPkWQypeR94rqpgMPjXWG9ijnZKNw2LWXnZU1", chat: false},
     groupArray: [],
     blockList: [],
-    activeHugins: []
+    activeHugins: [],
+    historyTimeframe: 0
 })
 
 export const rtc_groups = writable({

src/routes/groups/+page.svelte

@@ -13,6 +13,7 @@ import BlockContact from '$lib/components/chat/BlockContact.svelte'
 import { containsOnlyEmojis, sleep } from '$lib/utils/utils'
 import Loader from '$lib/components/popups/Loader.svelte'
 import GroupHugins from '$lib/components/chat/GroupHugins.svelte'
+import { nodelist } from '$lib/stores/nodes.js'
 
 let replyto = ''
 let reply_exit_icon = 'x'
@@ -248,6 +249,11 @@ const addNewGroup = async (e) => {
     }
     $groupMessages = []
     window.api.addGroup(add)
+    await sleep(100)
+    let settings = {}
+    settings.timeframe = 14
+    settings.recommended_api = await getBestApi()
+    window.api.send('fetchHistory', settings)
     await sleep(200)
     printGroup(group)
 }
@@ -408,6 +414,31 @@ function addHash(data) {
         console.log("Active channel messages",  $swarm.activeChannelMessages)
         //await checkReactions(channel)
     }
+    async function getBestApi() {
+    let apis = $nodelist.apis
+    let recommended_api = undefined
+
+
+    apis = apis.sort((a, b) => 0.5 - Math.random())
+
+    for(const item in apis) {
+        let this_api = apis[item]
+        let apiURL = `${this_api.url}/api/v1/posts-encrypted-group`
+        try {
+            const resp = await fetch(apiURL, {
+               method: 'GET'
+            }, 1000);
+           if (resp.ok) {
+             console.log("selecting " + this_api )
+             recommended_api = this_api;
+             return(this_api);
+           }
+        } catch (e) {
+          console.log(e);
+        }
+    }
+  
+  }
 
 </script>
 

src/routes/settings/messagesettings/+page.svelte

@@ -1,12 +1,50 @@
 <script>
     import { fade } from "svelte/transition"
-    import { messageWallet } from '$lib/stores/user.js'
+    import { messageWallet, groups } from '$lib/stores/user.js'
+    import { nodelist } from '$lib/stores/nodes.js'
     import Button from "$lib/components/buttons/Button.svelte"
 
     const optimizeMessages = () => {
         window.api.send('optimize')
     }
 
+    let timeframeDays;
+
+   async function getBestApi() {
+    let apis = $nodelist.apis
+    let recommended_api = undefined
+
+
+    apis = apis.sort((a, b) => 0.5 - Math.random())
+
+    for(const item in apis) {
+        let this_api = apis[item]
+        let apiURL = `${this_api.url}/api/v1/posts-encrypted-group`
+        try {
+            const resp = await fetch(apiURL, {
+               method: 'GET'
+            }, 1000);
+           if (resp.ok) {
+             console.log("selecting " + this_api )
+             recommended_api = this_api;
+             return(this_api);
+           }
+        } catch (e) {
+          console.log(e);
+        }
+    }
+  
+  }
+
+    const fetchHistory = async () => {
+        let settings = {}
+        settings.timeframe = timeframeDays
+        settings.recommended_api = await getBestApi()
+        window.api.send('fetchHistory', settings)
+    }
+
+ 
+
     </script>
 
     <h2>Messages</h2>
@@ -28,7 +66,23 @@
              Press the button <b>Optimize inputs</b> to create more.</p>
         <br>
     </div>
-
+    <h2>Message History</h2>
+    <div class="history">
+        <input spellcheck="false" type="number" placeholder="Enter amount of days" bind:value="{timeframeDays}"/>
+        <Button
+        text="Fetch history"
+        disabled="{false}"
+        on:click="{fetchHistory}"
+    />
+    </div>
+       <div class="settings" in:fade>
+        <p>Here you can set the timeframe of message history you want to fetch. 
+            <br>
+            This will fetch the data from a Hugin API.</p>
+            <br>
+        <p>This might cause added bandwith and storage usage.
+        <br>
+    </div>
     <style>
     
     .settings {
@@ -43,5 +97,26 @@
     .optimize {
         margin-left: -15px;
     }
+    .history {
+        margin-left: -15px;
+        margin-top: 2rem;
+    }
+    input {
+    /* margin: 0 auto; */
+    margin-left: 15px;
+    max-width: 300px;
+    width: 100%;
+    height: 48px;
+    padding: 0 15px;
+    border-radius: 0.5rem;
+    transition: 200ms ease-in-out;
+    background-color: var(--card-background);
+    border: 1px solid var(--card-border);
+    color: var(--text-color);
+    font-size: 1.1rem;
 
-    </style>
+    /* &:focus {
+      outline: none;
+    } */
+    }
+</style>