properly sort recent events

package.json

@@ -28,6 +28,8 @@
 	"dependencies": {
 		"@fontsource/fira-mono": "^4.5.0",
 		"@lukeed/uuid": "^2.0.0",
-		"cookie": "^0.4.1"
+		"cookie": "^0.4.1",
+		"timeago.js": "^4.0.2",
+		"underscore": "^1.13.2"
 	}
 }

src/routes/index.svelte

@@ -7,13 +7,22 @@
 	import Average from '$lib/Average.svelte';
 	import Unique from '$lib/Unique.svelte';
 	import Dots from '$lib/Dots.svelte';
+	import Kind from '$lib/Kind.svelte';
+	import Tweet from '$lib/Tweet.svelte';
 
-	import { onMount } from 'svelte';
+	import { onMount } from "svelte";
+	import _ from "underscore";
+
+	let events = [];
 
 	let eventCount24h = 0;
 	let eventCount1h = 0;
 	let networkActivity = Array(24).fill(0); // array index is hour
 
+	let kind1 = 0;
+	let kind4 = 0;
+	let kindOther = 0;
+
 	const unixTime = Math.floor(Date.now() / 1000);
 	const unixTimeMinus24h = unixTime - 60 * 60 * 24;
 	const unixTimeMinus1h = unixTime - 60 * 60;
@@ -39,7 +48,6 @@
 	// only do it on front end
 	onMount(() => {
 		relays.forEach((url, relayIndex) => {
-		// let url = 'wss://nostr-pub.wellorder.net';
 			let socket = new WebSocket(url);
 
 			socket.onopen = function (event) {
@@ -51,6 +59,8 @@
 
 			// // take data and parse here
 			socket.onmessage = function (incomingPayload) {
+				// spits out lots of error when parsing
+				// Uncaught SyntaxError: Unexpected token P in JSON at position 0
 				const payload = JSON.parse(incomingPayload.data);
 				const event = payload[2];
 				const eventDate = new Date(event.created_at * 1000);
@@ -59,14 +69,26 @@
 				eventCount24h++;
 				if (event.created_at > unixTimeMinus1h) eventCount1h++;
 
+				// count kinds
+				if(event.kind == "1") kind1++;
+				else if(event.kind == "4") kind4++;
+				else kindOther++;
+
 				// count peak event
 				const eventHour = eventDate.getUTCHours();
 				networkActivity[eventHour]++;
 
 				// count relay activity
 				relayActivity[relayIndex]++;
+
+				// show tweets
+				let tweet = {"message": event.content, "time": parseInt(event.created_at), "id": event.id, "pubkey": event.pubkey};
+				events.push(tweet);
+				const uniqueEvents = _.uniq(events);
+				const sortedEvents = _.sortBy(uniqueEvents, "time");
+				events = sortedEvents.reverse().slice(0, 20);
 			};
-		})
+		});
 	});
 </script>
 
@@ -74,14 +96,23 @@
 	<div class="m-2">
 		<Count {eventCount1h} {eventCount24h} />
 		<div class="mb-3" />
+		<Kind {kind1} {kind4} {kindOther}/>
+		<div class="mb-3" />
 		<!-- <Average/>
 		<div class="mb-3"></div> -->
 		<Activity {networkActivity} />
 		<div class="mb-3" />
 		<Relay {relays} {relayActivity}/>
 		<Dots />
-		<Latest />
-		<div class="mb-3" />
-		<Unique />
+
+		<div class="rounded-md shadow border p-3">
+			<span class="block text-center pb-3 text-xs text-neutral-400">NOSTR NETWORK'S LATEST EVENTS</span>
+			<div class="flex flex-col">
+				{#each events as tweet}
+					<Tweet time={tweet.time} pubkey={tweet.pubkey} message={tweet.message}/>
+				{/each}
+			</div>
+		</div>
+
 	</div>
 </section>

yarn.lock

@@ -1660,6 +1660,11 @@ text-table@^0.2.0:
   resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
   integrity sha1-f17oI66AUgfACvLfSoTsP8+lcLQ=
 
+timeago.js@^4.0.2:
+  version "4.0.2"
+  resolved "https://registry.yarnpkg.com/timeago.js/-/timeago.js-4.0.2.tgz#724e8c8833e3490676c7bb0a75f5daf20e558028"
+  integrity sha512-a7wPxPdVlQL7lqvitHGGRsofhdwtkoSXPGATFuSOA2i1ZNQEPLrGnj68vOp2sOJTCFAQVXPeNMX/GctBaO9L2w==
+
 tiny-glob@^0.2.9:
   version "0.2.9"
   resolved "https://registry.yarnpkg.com/tiny-glob/-/tiny-glob-0.2.9.tgz#2212d441ac17928033b110f8b3640683129d31e2"
@@ -1687,6 +1692,11 @@ type-fest@^0.20.2:
   resolved "https://registry.yarnpkg.com/type-fest/-/type-fest-0.20.2.tgz#1bf207f4b28f91583666cb5fbd327887301cd5f4"
   integrity sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==
 
+underscore@^1.13.2:
+  version "1.13.2"
+  resolved "https://registry.yarnpkg.com/underscore/-/underscore-1.13.2.tgz#276cea1e8b9722a8dbed0100a407dda572125881"
+  integrity sha512-ekY1NhRzq0B08g4bGuX4wd2jZx5GnKz6mKSqFL4nqBlfyMGiG10gDFhDTMEfYmDL6Jy0FUIZp7wiRB+0BP7J2g==
+
 uri-js@^4.2.2:
   version "4.4.1"
   resolved "https://registry.yarnpkg.com/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"