mirror of
https://github.com/vinliao/nashboard-old.git
synced 2025-12-17 04:35:15 +01:00
add count and pie
This commit is contained in:
@@ -27,6 +27,7 @@
|
||||
},
|
||||
"type": "module",
|
||||
"dependencies": {
|
||||
"svelte-chartjs": "^1.1.4",
|
||||
"timeago.js": "^4.0.2",
|
||||
"underscore": "^1.13.2",
|
||||
"ws": "^8.5.0"
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="rounded-md shadow p-3 bg-white">
|
||||
<div class="rounded-md p-3 bg-white">
|
||||
<span class="block text-center pb-3 text-sm text-neutral-400 font-mono"
|
||||
>NETWORK ACTIVITY (24H, UTC)</span
|
||||
>
|
||||
|
||||
20
src/lib/Count.svelte
Normal file
20
src/lib/Count.svelte
Normal file
@@ -0,0 +1,20 @@
|
||||
<script>
|
||||
export let count1h;
|
||||
export let count24h;
|
||||
</script>
|
||||
|
||||
<div class="rounded-md shadow p-3 bg-white">
|
||||
<span class="block text-center pb-3 text-sm text-neutral-400 font-mono"
|
||||
>NOSTR NETWORK'S EVENT COUNT</span
|
||||
>
|
||||
<div class="flex">
|
||||
<div class="flex-1 text-center">
|
||||
<span class="text-2xl">{count1h}</span>
|
||||
<span class="text-neutral-400">last 1h</span>
|
||||
</div>
|
||||
<div class="flex-1 text-center">
|
||||
<span class="text-2xl">{count24h}</span>
|
||||
<span class="text-neutral-400">last 24h</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
40
src/lib/Pie.svelte
Normal file
40
src/lib/Pie.svelte
Normal file
@@ -0,0 +1,40 @@
|
||||
<script>
|
||||
import Pie from "svelte-chartjs/src/Pie.svelte";
|
||||
export let kinds = {};
|
||||
const kindArr = [0, 0, 0, 0, 0, 0];
|
||||
for (let i = 0; i < kindArr.length; i++) {
|
||||
kindArr[i] = kinds[i] || 0;
|
||||
}
|
||||
|
||||
let data = {
|
||||
labels: [
|
||||
"metadata",
|
||||
"tweet",
|
||||
"relay share",
|
||||
"contact list",
|
||||
"encrypted msg",
|
||||
"other",
|
||||
],
|
||||
datasets: [
|
||||
{
|
||||
label: "Event types",
|
||||
data: kindArr,
|
||||
backgroundColor: [
|
||||
"hsl(326, 85%, 90%)",
|
||||
"hsl(267, 85%, 90%)",
|
||||
"hsl(207, 85%, 90%)",
|
||||
"hsl(147, 85%, 90%)",
|
||||
"hsl(87, 85%, 90%)",
|
||||
"hsl(27, 85%, 90%)",
|
||||
],
|
||||
},
|
||||
],
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="rounded-md shadow p-3 bg-white">
|
||||
<span class="block text-center pb-3 text-sm text-neutral-400 font-mono"
|
||||
>EVENT TYPES (24H)</span
|
||||
>
|
||||
<Pie {data} />
|
||||
</div>
|
||||
@@ -15,6 +15,8 @@
|
||||
<script>
|
||||
export let data = {};
|
||||
import Activity from "$lib/Activity.svelte";
|
||||
import Count from "$lib/Count.svelte";
|
||||
import Pie from "$lib/Pie.svelte";
|
||||
import Relay from "$lib/Relay.svelte";
|
||||
import Tweet from "$lib/Tweet.svelte";
|
||||
|
||||
@@ -23,6 +25,8 @@
|
||||
console.log(data);
|
||||
</script>
|
||||
|
||||
<Count count1h={data.count1h} count24h={data.count24h} />
|
||||
<Pie kinds={data.kinds} />
|
||||
<Relay relayData={data.relays} />
|
||||
<Activity networkActivity={data.utc} />
|
||||
|
||||
|
||||
12
yarn.lock
12
yarn.lock
@@ -345,6 +345,11 @@ chalk@^4.0.0, chalk@^4.1.2:
|
||||
ansi-styles "^4.1.0"
|
||||
supports-color "^7.1.0"
|
||||
|
||||
chart.js@^3.5.0:
|
||||
version "3.7.1"
|
||||
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-3.7.1.tgz#0516f690c6a8680c6c707e31a4c1807a6f400ada"
|
||||
integrity sha512-8knRegQLFnPQAheZV8MjxIXc5gQEfDFD897BJgv/klO/vtIyFFmgMXrNfgrXpbTr/XbTturxRgxIXx/Y+ASJBA==
|
||||
|
||||
chokidar@^3.5.3:
|
||||
version "3.5.3"
|
||||
resolved "https://registry.yarnpkg.com/chokidar/-/chokidar-3.5.3.tgz#1cf37c8707b932bd1af1ae22c0432e2acd1903bd"
|
||||
@@ -1478,6 +1483,13 @@ supports-preserve-symlinks-flag@^1.0.0:
|
||||
resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
|
||||
integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
|
||||
|
||||
svelte-chartjs@^1.1.4:
|
||||
version "1.1.4"
|
||||
resolved "https://registry.yarnpkg.com/svelte-chartjs/-/svelte-chartjs-1.1.4.tgz#468868aec8a2469ba3480628f77c81ae992ac2de"
|
||||
integrity sha512-G+G3h1yDFKNTamwq1iDSK1nthStVpEKaCh8K17cUlMPRX1bFF14sK2kWNv0tPj+OGWDTJgDM3X18EU0o3/kH5Q==
|
||||
dependencies:
|
||||
chart.js "^3.5.0"
|
||||
|
||||
svelte-hmr@^0.14.11:
|
||||
version "0.14.11"
|
||||
resolved "https://registry.yarnpkg.com/svelte-hmr/-/svelte-hmr-0.14.11.tgz#63d532dc9c2c849ab708592f034765fa2502e568"
|
||||
|
||||
Reference in New Issue
Block a user