···

       
1
       
-
       
a webapp and server that monitors the jetstream and tracks the different lexicons as they are created or deleted.

     

       
2
       
-
       
it shows you which collections are most active on the network.

     

       
0
       
 
       

     

       
3
       
 
       


     

       
4
       
 
       
for backend it uses rust with fjall as db, the frontend is built with sveltekit.

     

       
5
       
 
       


     

       
6
       
 
       
see [here](https://gaze.systems/nsid-tracker) for a hosted instance of it.

     

       
7
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
8
       
 
       
## running

     

       
9
       
 
       


     

       
10
       
 
       
### with nix

     

       
11
       
 
       


     

       
12
       
-
       
- run the server: `nix run git+https://tangled.sh/@poor.dog/nsid-tracker#server`

     

       
13
       
 
       
- build the client: `nix build git+https://tangled.sh/@poor.dog/nsid-tracker#client`

     

       
14
       
 
       


     

       
15
       
 
       
### manually

     

···

       
1
       
+
       
a webapp and server that monitors the jetstream and tracks the different

     

       
2
       
+
       
lexicons as they are created or deleted. it shows you which collections are most

     

       
3
       
+
       
active on the network.

     

       
4
       
 
       


     

       
5
       
 
       
for backend it uses rust with fjall as db, the frontend is built with sveltekit.

     

       
6
       
 
       


     

       
7
       
 
       
see [here](https://gaze.systems/nsid-tracker) for a hosted instance of it.

     

       
8
       
 
       


     

       
9
       
+
       
## performance / storage

     

       
10
       
+
       


     

       
11
       
+
       
it uses about 50MB of space for 620M recorded events (events being just

     

       
12
       
+
       
timestamp in seconds and deleted boolean for now). and around 50-60ms for

     

       
13
       
+
       
querying 300-400k events.

     

       
14
       
+
       


     

       
15
       
+
       
this is on a machine with AMD EPYC 7281 (32) @ 2.100GHz.

     

       
16
       
+
       


     

       
17
       
 
       
## running

     

       
18
       
 
       


     

       
19
       
 
       
### with nix

     

       
20
       
 
       


     

       
21
       
+
       
- build the server: `nix build git+https://tangled.sh/@poor.dog/nsid-tracker#server`

     

       
22
       
 
       
- build the client: `nix build git+https://tangled.sh/@poor.dog/nsid-tracker#client`

     

       
23
       
 
       


     

       
24
       
 
       
### manually

     

···

       
5
       
 
       
      "name": "nsid-tracker",

     

       
6
       
 
       
      "dependencies": {

     

       
7
       
 
       
        "@number-flow/svelte": "^0.3.9",

     

       
0
       
 
       

     

       
8
       
 
       
      },

     

       
9
       
 
       
      "devDependencies": {

     

       
10
       
 
       
        "@eslint/compat": "^1.2.5",

     
···

       
353
       
 
       


     

       
354
       
 
       
    "globals": ["globals@16.3.0", "", {}, "sha512-bqWEnJ1Nt3neqx2q5SFfGS8r/ahumIakg3HcwtNlrVlwXIeNumWn/c7Pn/wKzGhf6SaW6H6uWXLqC30STCMchQ=="],

     

       
355
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
356
       
 
       
    "graceful-fs": ["graceful-fs@4.2.11", "", {}, "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ=="],

     

       
357
       
 
       


     

       
358
       
 
       
    "graphemer": ["graphemer@1.4.0", "", {}, "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag=="],

     
···

       
511
       
 
       


     

       
512
       
 
       
    "svelte": ["svelte@5.36.8", "", { "dependencies": { "@ampproject/remapping": "^2.3.0", "@jridgewell/sourcemap-codec": "^1.5.0", "@sveltejs/acorn-typescript": "^1.0.5", "@types/estree": "^1.0.5", "acorn": "^8.12.1", "aria-query": "^5.3.1", "axobject-query": "^4.1.0", "clsx": "^2.1.1", "esm-env": "^1.2.1", "esrap": "^2.1.0", "is-reference": "^3.0.3", "locate-character": "^3.0.0", "magic-string": "^0.30.11", "zimmerframe": "^1.1.2" } }, "sha512-8JbZWQu96hMjH/oYQPxXW6taeC6Awl6muGHeZzJTxQx7NGRQ/J9wN1hkzRKLOlSDlbS2igiFg7p5xyTp5uXG3A=="],

     

       
513
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
514
       
 
       
    "svelte-check": ["svelte-check@4.3.0", "", { "dependencies": { "@jridgewell/trace-mapping": "^0.3.25", "chokidar": "^4.0.1", "fdir": "^6.2.0", "picocolors": "^1.0.0", "sade": "^1.7.4" }, "peerDependencies": { "svelte": "^4.0.0 || ^5.0.0-next.0", "typescript": ">=5.0.0" }, "bin": { "svelte-check": "bin/svelte-check" } }, "sha512-Iz8dFXzBNAM7XlEIsUjUGQhbEE+Pvv9odb9+0+ITTgFWZBGeJRRYqHUUglwe2EkLD5LIsQaAc4IUJyvtKuOO5w=="],

     

       
515
       
 
       


     

       
516
       
 
       
    "svelte-eslint-parser": ["svelte-eslint-parser@1.3.0", "", { "dependencies": { "eslint-scope": "^8.2.0", "eslint-visitor-keys": "^4.0.0", "espree": "^10.0.0", "postcss": "^8.4.49", "postcss-scss": "^4.0.9", "postcss-selector-parser": "^7.0.0" }, "peerDependencies": { "svelte": "^3.37.0 || ^4.0.0 || ^5.0.0" }, "optionalPeers": ["svelte"] }, "sha512-VCgMHKV7UtOGcGLGNFSbmdm6kEKjtzo5nnpGU/mnx4OsFY6bZ7QwRF5DUx+Hokw5Lvdyo8dpk8B1m8mliomrNg=="],

     
···

       
520
       
 
       
    "tapable": ["tapable@2.2.2", "", {}, "sha512-Re10+NauLTMCudc7T5WLFLAwDhQ0JWdrMK+9B2M8zR5hRExKmsRDCBA7/aV/pNJFltmBFO5BAMlQFi/vq3nKOg=="],

     

       
521
       
 
       


     

       
522
       
 
       
    "tar": ["tar@7.4.3", "", { "dependencies": { "@isaacs/fs-minipass": "^4.0.0", "chownr": "^3.0.0", "minipass": "^7.1.2", "minizlib": "^3.0.1", "mkdirp": "^3.0.1", "yallist": "^5.0.0" } }, "sha512-5S7Va8hKfV7W5U6g3aYxXmlPoZVAwUMy9AOKyF2fVuZa2UD3qZjg578OrLRt8PcNN1PleVaL/5/yYATNL0ICUw=="],

     

       
0
       
 
       

     

       
0
       
 
       

     

       
523
       
 
       


     

       
524
       
 
       
    "tinyglobby": ["tinyglobby@0.2.14", "", { "dependencies": { "fdir": "^6.4.4", "picomatch": "^4.0.2" } }, "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ=="],

     

       
525
       
 
       


     

···

       
5
       
 
       
      "name": "nsid-tracker",

     

       
6
       
 
       
      "dependencies": {

     

       
7
       
 
       
        "@number-flow/svelte": "^0.3.9",

     

       
8
       
+
       
        "svelte-adapter-bun": "^0.5.2",

     

       
9
       
 
       
      },

     

       
10
       
 
       
      "devDependencies": {

     

       
11
       
 
       
        "@eslint/compat": "^1.2.5",

     
···

       
354
       
 
       


     

       
355
       
 
       
    "globals": ["globals@16.3.0", "", {}, "sha512-bqWEnJ1Nt3neqx2q5SFfGS8r/ahumIakg3HcwtNlrVlwXIeNumWn/c7Pn/wKzGhf6SaW6H6uWXLqC30STCMchQ=="],

     

       
356
       
 
       


     

       
357
       
+
       
    "globalyzer": ["globalyzer@0.1.0", "", {}, "sha512-40oNTM9UfG6aBmuKxk/giHn5nQ8RVz/SS4Ir6zgzOv9/qC3kKZ9v4etGTcJbEl/NyVQH7FGU7d+X1egr57Md2Q=="],

     

       
358
       
+
       


     

       
359
       
+
       
    "globrex": ["globrex@0.1.2", "", {}, "sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg=="],

     

       
360
       
+
       


     

       
361
       
 
       
    "graceful-fs": ["graceful-fs@4.2.11", "", {}, "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ=="],

     

       
362
       
 
       


     

       
363
       
 
       
    "graphemer": ["graphemer@1.4.0", "", {}, "sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag=="],

     
···

       
516
       
 
       


     

       
517
       
 
       
    "svelte": ["svelte@5.36.8", "", { "dependencies": { "@ampproject/remapping": "^2.3.0", "@jridgewell/sourcemap-codec": "^1.5.0", "@sveltejs/acorn-typescript": "^1.0.5", "@types/estree": "^1.0.5", "acorn": "^8.12.1", "aria-query": "^5.3.1", "axobject-query": "^4.1.0", "clsx": "^2.1.1", "esm-env": "^1.2.1", "esrap": "^2.1.0", "is-reference": "^3.0.3", "locate-character": "^3.0.0", "magic-string": "^0.30.11", "zimmerframe": "^1.1.2" } }, "sha512-8JbZWQu96hMjH/oYQPxXW6taeC6Awl6muGHeZzJTxQx7NGRQ/J9wN1hkzRKLOlSDlbS2igiFg7p5xyTp5uXG3A=="],

     

       
518
       
 
       


     

       
519
       
+
       
    "svelte-adapter-bun": ["svelte-adapter-bun@0.5.2", "", { "dependencies": { "tiny-glob": "^0.2.9" } }, "sha512-xEtFgaal6UgrCwwkSIcapO9kopoFNUYCYqyKCikdqxX9bz2TDYnrWQZ7qBnkunMxi1HOIERUCvTcebYGiarZLA=="],

     

       
520
       
+
       


     

       
521
       
 
       
    "svelte-check": ["svelte-check@4.3.0", "", { "dependencies": { "@jridgewell/trace-mapping": "^0.3.25", "chokidar": "^4.0.1", "fdir": "^6.2.0", "picocolors": "^1.0.0", "sade": "^1.7.4" }, "peerDependencies": { "svelte": "^4.0.0 || ^5.0.0-next.0", "typescript": ">=5.0.0" }, "bin": { "svelte-check": "bin/svelte-check" } }, "sha512-Iz8dFXzBNAM7XlEIsUjUGQhbEE+Pvv9odb9+0+ITTgFWZBGeJRRYqHUUglwe2EkLD5LIsQaAc4IUJyvtKuOO5w=="],

     

       
522
       
 
       


     

       
523
       
 
       
    "svelte-eslint-parser": ["svelte-eslint-parser@1.3.0", "", { "dependencies": { "eslint-scope": "^8.2.0", "eslint-visitor-keys": "^4.0.0", "espree": "^10.0.0", "postcss": "^8.4.49", "postcss-scss": "^4.0.9", "postcss-selector-parser": "^7.0.0" }, "peerDependencies": { "svelte": "^3.37.0 || ^4.0.0 || ^5.0.0" }, "optionalPeers": ["svelte"] }, "sha512-VCgMHKV7UtOGcGLGNFSbmdm6kEKjtzo5nnpGU/mnx4OsFY6bZ7QwRF5DUx+Hokw5Lvdyo8dpk8B1m8mliomrNg=="],

     
···

       
527
       
 
       
    "tapable": ["tapable@2.2.2", "", {}, "sha512-Re10+NauLTMCudc7T5WLFLAwDhQ0JWdrMK+9B2M8zR5hRExKmsRDCBA7/aV/pNJFltmBFO5BAMlQFi/vq3nKOg=="],

     

       
528
       
 
       


     

       
529
       
 
       
    "tar": ["tar@7.4.3", "", { "dependencies": { "@isaacs/fs-minipass": "^4.0.0", "chownr": "^3.0.0", "minipass": "^7.1.2", "minizlib": "^3.0.1", "mkdirp": "^3.0.1", "yallist": "^5.0.0" } }, "sha512-5S7Va8hKfV7W5U6g3aYxXmlPoZVAwUMy9AOKyF2fVuZa2UD3qZjg578OrLRt8PcNN1PleVaL/5/yYATNL0ICUw=="],

     

       
530
       
+
       


     

       
531
       
+
       
    "tiny-glob": ["tiny-glob@0.2.9", "", { "dependencies": { "globalyzer": "0.1.0", "globrex": "^0.1.2" } }, "sha512-g/55ssRPUjShh+xkfx9UPDXqhckHEsHr4Vd9zX55oSdGZc/MD0m3sferOkwWtp98bv+kcVfEHtRJgBVJzelrzg=="],

     

       
532
       
 
       


     

       
533
       
 
       
    "tinyglobby": ["tinyglobby@0.2.14", "", { "dependencies": { "fdir": "^6.4.4", "picomatch": "^4.0.2" } }, "sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ=="],

     

       
534
       
 
       


     

···

       
31
       
 
       
  },

     

       
32
       
 
       
  "type": "module",

     

       
33
       
 
       
  "dependencies": {

     

       
34
       
-
       
    "@number-flow/svelte": "^0.3.9"

     

       
0
       
 
       

     

       
35
       
 
       
  }

     

       
36
       
 
       
}

     

···

       
31
       
 
       
  },

     

       
32
       
 
       
  "type": "module",

     

       
33
       
 
       
  "dependencies": {

     

       
34
       
+
       
    "@number-flow/svelte": "^0.3.9",

     

       
35
       
+
       
    "svelte-adapter-bun": "^0.5.2"

     

       
36
       
 
       
  }

     

       
37
       
 
       
}

     

···

       
28
       
 
       
    overflow-y: overlay;

     

       
29
       
 
       
    overflow-y: auto; /* Fallback for browsers that don't support overlay */

     

       
30
       
 
       
}

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
28
       
 
       
    overflow-y: overlay;

     

       
29
       
 
       
    overflow-y: auto; /* Fallback for browsers that don't support overlay */

     

       
30
       
 
       
}

     

       
31
       
+
       


     

       
32
       
+
       
.wsbadge {

     

       
33
       
+
       
    @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
34
       
+
       
}

     

···

       
1
       
 
       
<!doctype html>

     

       
2
       
 
       
<html lang="en">

     

       
3
       
-
       
	<head>

     

       
4
       
-
       
		<meta charset="utf-8" />

     

       
5
       
-
       
		<link rel="icon" href="%sveltekit.assets%/favicon.svg" />

     

       
6
       
-
       
		<meta name="viewport" content="width=device-width, initial-scale=1" />

     

       
7
       
-
       
		%sveltekit.head%

     

       
8
       
-
       
	</head>

     

       
9
       
-
       
	<body data-sveltekit-preload-data="hover">

     

       
10
       
-
       
		<div style="display: contents">%sveltekit.body%</div>

     

       
11
       
-
       
	</body>

     

       
12
       
 
       
</html>

     

···

       
1
       
 
       
<!doctype html>

     

       
2
       
 
       
<html lang="en">

     

       
3
       
+
       
    <head>

     

       
4
       
+
       
        <meta charset="utf-8" />

     

       
5
       
+
       
        <link rel="icon" href="%sveltekit.assets%/favicon.svg" />

     

       
6
       
+
       
        <meta name="viewport" content="width=device-width, initial-scale=1" />

     

       
7
       
+
       
        %sveltekit.head%

     

       
8
       
+
       
    </head>

     

       
9
       
+
       
    <body class="bg-white dark:bg-gray-900" data-sveltekit-preload-data="hover">

     

       
10
       
+
       
        <div style="display: contents">%sveltekit.body%</div>

     

       
11
       
+
       
    </body>

     

       
12
       
 
       
</html>

     

···

       
11
       
 
       
<!-- svelte-ignore a11y_no_static_element_interactions -->

     

       
12
       
 
       
<button

     

       
13
       
 
       
    onclick={onBskyToggle}

     

       
14
       
-
       
    class="wsbadge !mt-0 !font-normal bg-yellow-100 hover:bg-yellow-200 border-yellow-300"

     

       
15
       
 
       
>

     

       
16
       
 
       
    <input checked={dontShowBsky} type="checkbox" />

     

       
17
       
-
       
    <span class="ml-0.5"> hide app.bsky.* </span>

     

       
18
       
 
       
</button>

     

       
19
       
-
       


     

       
20
       
-
       
<style lang="postcss">

     

       
21
       
-
       
    @reference "../../app.css";

     

       
22
       
-
       
    .wsbadge {

     

       
23
       
-
       
        @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
24
       
-
       
    }

     

       
25
       
-
       
</style>

     

···

       
11
       
 
       
<!-- svelte-ignore a11y_no_static_element_interactions -->

     

       
12
       
 
       
<button

     

       
13
       
 
       
    onclick={onBskyToggle}

     

       
14
       
+
       
    class="wsbadge !mt-0 !font-normal bg-blue-100 dark:bg-blue-900 hover:bg-blue-200 dark:hover:bg-blue-800 border-blue-300 dark:border-blue-700"

     

       
15
       
 
       
>

     

       
16
       
 
       
    <input checked={dontShowBsky} type="checkbox" />

     

       
17
       
+
       
    <span class="ml-0.5 text-black dark:text-gray-200"> hide app.bsky.* </span>

     

       
18
       
 
       
</button>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
104
       
 
       
</script>

     

       
105
       
 
       


     

       
106
       
 
       
<div

     

       
107
       
-
       
    class="group flex flex-col gap-2 p-1.5 md:p-3 min-h-64 bg-white border border-gray-200 rounded-lg hover:shadow-lg md:hover:-translate-y-1 transition-all duration-200 transform"

     

       
108
       
 
       
    class:has-activity={isAnimating}

     

       
109
       
 
       
    style="--border-thickness: {borderThickness}px"

     

       
110
       
 
       
>

     

       
111
       
 
       
    <div class="flex items-start gap-2">

     

       
112
       
 
       
        <div

     

       
113
       
-
       
            class="text-sm font-bold text-blue-600 bg-blue-100 px-3 py-1 rounded-full"

     

       
114
       
 
       
        >

     

       
115
       
 
       
            #{index + 1}

     

       
116
       
 
       
        </div>

     

       
117
       
 
       
        <div

     

       
118
       
 
       
            title={event.nsid}

     

       
119
       
-
       
            class="font-mono text-sm text-gray-700 mt-0.5 leading-relaxed rounded-full text-nowrap text-ellipsis overflow-hidden group-hover:overflow-visible group-hover:bg-gray-50 border-gray-100 group-hover:border transition-all px-1"

     

       
120
       
 
       
        >

     

       
121
       
 
       
            {event.nsid}

     

       
122
       
 
       
        </div>

     
···

       
136
       
 
       
    </div>

     

       
137
       
 
       
</div>

     

       
138
       
 
       


     

       
139
       
-
       
<style>

     

       
140
       
 
       
    .has-activity {

     

       
141
       
 
       
        position: relative;

     

       
142
       
 
       
        transition: all 0.2s ease-out;

     

       
143
       
 
       
    }

     

       
144
       
 
       


     

       
145
       
 
       
    .has-activity::before {

     

       
0
       
 
       

     

       
0
       
 
       

     

       
146
       
 
       
        content: "";

     

       
147
       
 
       
        position: absolute;

     

       
148
       
 
       
        top: calc(-1 * var(--border-thickness));

     

       
149
       
 
       
        left: calc(-1 * var(--border-thickness));

     

       
150
       
 
       
        right: calc(-1 * var(--border-thickness));

     

       
151
       
 
       
        bottom: calc(-1 * var(--border-thickness));

     

       
152
       
-
       
        border: var(--border-thickness) solid rgba(59, 130, 246, 0.8);

     

       
0
       
 
       

     

       
153
       
 
       
        border-radius: calc(0.5rem + var(--border-thickness));

     

       
154
       
 
       
        pointer-events: none;

     

       
155
       
 
       
        transition: all 0.3s ease-out;

     

···

       
104
       
 
       
</script>

     

       
105
       
 
       


     

       
106
       
 
       
<div

     

       
107
       
+
       
    class="group flex flex-col gap-2 p-1.5 md:p-3 min-h-64 bg-white dark:bg-gray-800/50 border border-gray-200 dark:border-gray-950 rounded-lg hover:shadow-lg md:hover:-translate-y-1 transition-all duration-200 transform"

     

       
108
       
 
       
    class:has-activity={isAnimating}

     

       
109
       
 
       
    style="--border-thickness: {borderThickness}px"

     

       
110
       
 
       
>

     

       
111
       
 
       
    <div class="flex items-start gap-2">

     

       
112
       
 
       
        <div

     

       
113
       
+
       
            class="text-sm font-bold text-blue-600 bg-blue-100 dark:bg-indigo-950 px-3 py-1 rounded-full"

     

       
114
       
 
       
        >

     

       
115
       
 
       
            #{index + 1}

     

       
116
       
 
       
        </div>

     

       
117
       
 
       
        <div

     

       
118
       
 
       
            title={event.nsid}

     

       
119
       
+
       
            class="font-mono text-sm text-gray-700 dark:text-gray-300 mt-0.5 leading-relaxed rounded-full text-nowrap text-ellipsis overflow-hidden group-hover:overflow-visible group-hover:bg-gray-50 dark:group-hover:bg-gray-700 border-gray-100 dark:border-gray-900 group-hover:border transition-all px-1"

     

       
120
       
 
       
        >

     

       
121
       
 
       
            {event.nsid}

     

       
122
       
 
       
        </div>

     
···

       
136
       
 
       
    </div>

     

       
137
       
 
       
</div>

     

       
138
       
 
       


     

       
139
       
+
       
<style lang="postcss">

     

       
140
       
 
       
    .has-activity {

     

       
141
       
 
       
        position: relative;

     

       
142
       
 
       
        transition: all 0.2s ease-out;

     

       
143
       
 
       
    }

     

       
144
       
 
       


     

       
145
       
 
       
    .has-activity::before {

     

       
146
       
+
       
        @reference "../../app.css";

     

       
147
       
+
       
        @apply border-blue-500 dark:border-blue-800;

     

       
148
       
 
       
        content: "";

     

       
149
       
 
       
        position: absolute;

     

       
150
       
 
       
        top: calc(-1 * var(--border-thickness));

     

       
151
       
 
       
        left: calc(-1 * var(--border-thickness));

     

       
152
       
 
       
        right: calc(-1 * var(--border-thickness));

     

       
153
       
 
       
        bottom: calc(-1 * var(--border-thickness));

     

       
154
       
+
       
        border-width: var(--border-thickness);

     

       
155
       
+
       
        border-style: solid;

     

       
156
       
 
       
        border-radius: calc(0.5rem + var(--border-thickness));

     

       
157
       
 
       
        pointer-events: none;

     

       
158
       
 
       
        transition: all 0.3s ease-out;

     

···

       
8
       
 
       
</script>

     

       
9
       
 
       


     

       
10
       
 
       
<div

     

       
11
       
-
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-blue-100 hover:bg-blue-200 border-blue-300"

     

       
12
       
 
       
>

     

       
13
       
-
       
    <label for="filter-regex" class="text-blue-800 mr-1"> filter: </label>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
14
       
 
       
    <input

     

       
15
       
 
       
        id="filter-regex"

     

       
16
       
 
       
        value={filterRegex}

     

       
17
       
 
       
        oninput={(e) => onFilterChange((e.target as HTMLInputElement).value)}

     

       
18
       
 
       
        type="text"

     

       
19
       
 
       
        placeholder="regex..."

     

       
20
       
-
       
        class="bg-blue-50 text-blue-900 placeholder-blue-400 border border-blue-200 rounded-full px-1 outline-none focus:bg-white focus:border-blue-400 min-w-0 w-24"

     

       
21
       
 
       
    />

     

       
22
       
 
       
</div>

     

       
23
       
-
       


     

       
24
       
-
       
<style lang="postcss">

     

       
25
       
-
       
    @reference "../../app.css";

     

       
26
       
-
       
    .wsbadge {

     

       
27
       
-
       
        @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
28
       
-
       
    }

     

       
29
       
-
       
</style>

     

···

       
8
       
 
       
</script>

     

       
9
       
 
       


     

       
10
       
 
       
<div

     

       
11
       
+
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-blue-100 dark:bg-blue-900 hover:bg-blue-200 dark:hover:bg-blue-800 border-blue-300 dark:border-blue-700"

     

       
12
       
 
       
>

     

       
13
       
+
       
    <label for="filter-regex" class="text-blue-800 dark:text-gray-200 mr-1">

     

       
14
       
+
       
        filter:

     

       
15
       
+
       
    </label>

     

       
16
       
 
       
    <input

     

       
17
       
 
       
        id="filter-regex"

     

       
18
       
 
       
        value={filterRegex}

     

       
19
       
 
       
        oninput={(e) => onFilterChange((e.target as HTMLInputElement).value)}

     

       
20
       
 
       
        type="text"

     

       
21
       
 
       
        placeholder="regex..."

     

       
22
       
+
       
        class="bg-blue-50 dark:bg-blue-950 text-blue-900 dark:text-gray-400 placeholder-blue-400 dark:placeholder-blue-700 border border-blue-200 dark:border-blue-700 rounded-full px-1 outline-none focus:border-blue-400 min-w-0 w-24"

     

       
23
       
 
       
    />

     

       
24
       
 
       
</div>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
8
       
 
       
</script>

     

       
9
       
 
       


     

       
10
       
 
       
<div

     

       
11
       
-
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-green-100 hover:bg-green-200 border-green-300"

     

       
12
       
 
       
>

     

       
13
       
-
       
    <label for="refresh-rate" class="text-green-800 mr-1">refresh:</label>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
14
       
 
       
    <input

     

       
15
       
 
       
        id="refresh-rate"

     

       
16
       
 
       
        value={refreshRate}

     
···

       
24
       
 
       
        pattern="[0-9]*"

     

       
25
       
 
       
        min="0"

     

       
26
       
 
       
        placeholder="real-time"

     

       
27
       
-
       
        class="bg-green-50 text-green-900 placeholder-green-400 border border-green-200 rounded-full px-1 outline-none focus:bg-white focus:border-green-400 min-w-0 w-20"

     

       
28
       
 
       
    />

     

       
29
       
-
       
    <span class="text-green-700">s</span>

     

       
30
       
 
       
</div>

     

       
31
       
-
       


     

       
32
       
-
       
<style lang="postcss">

     

       
33
       
-
       
    @reference "../../app.css";

     

       
34
       
-
       
    .wsbadge {

     

       
35
       
-
       
        @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
36
       
-
       
    }

     

       
37
       
-
       
</style>

     

···

       
8
       
 
       
</script>

     

       
9
       
 
       


     

       
10
       
 
       
<div

     

       
11
       
+
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-lime-100 dark:bg-lime-900 dark:hover:bg-lime-800 hover:bg-lime-200 border-lime-300 dark:border-lime-700"

     

       
12
       
 
       
>

     

       
13
       
+
       
    <label for="refresh-rate" class="text-lime-800 dark:text-lime-200 mr-1"

     

       
14
       
+
       
        >refresh:</label

     

       
15
       
+
       
    >

     

       
16
       
 
       
    <input

     

       
17
       
 
       
        id="refresh-rate"

     

       
18
       
 
       
        value={refreshRate}

     
···

       
26
       
 
       
        pattern="[0-9]*"

     

       
27
       
 
       
        min="0"

     

       
28
       
 
       
        placeholder="real-time"

     

       
29
       
+
       
        class="bg-green-50 dark:bg-green-900 text-lime-900 dark:text-lime-200 placeholder-lime-600 dark:placeholder-lime-400 border border-lime-200 dark:border-lime-700 rounded-full px-1 outline-none focus:border-lime-400 min-w-0 w-20"

     

       
30
       
 
       
    />

     

       
31
       
+
       
    <span class="text-lime-800 dark:text-lime-200">s</span>

     

       
32
       
 
       
</div>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
1
       
+
       
<script lang="ts">

     

       
2
       
+
       
    import type { ShowOption } from "$lib/types";

     

       
3
       
+
       


     

       
4
       
+
       
    interface Props {

     

       
5
       
+
       
        show: ShowOption;

     

       
6
       
+
       
        onShowChange: (value: ShowOption) => void;

     

       
7
       
+
       
    }

     

       
8
       
+
       


     

       
9
       
+
       
    let { show, onShowChange }: Props = $props();

     

       
10
       
+
       


     

       
11
       
+
       
    const showOptions: ShowOption[] = ["server init", "stream start"];

     

       
12
       
+
       
</script>

     

       
13
       
+
       


     

       
14
       
+
       
<div

     

       
15
       
+
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-pink-100 dark:bg-pink-800 hover:bg-pink-200 dark:hover:bg-pink-700 border-pink-300 dark:border-pink-700"

     

       
16
       
+
       
>

     

       
17
       
+
       
    <label for="show" class="text-pink-800 dark:text-pink-100 mr-1">

     

       
18
       
+
       
        show since:

     

       
19
       
+
       
    </label>

     

       
20
       
+
       
    <select

     

       
21
       
+
       
        id="show"

     

       
22
       
+
       
        value={show}

     

       
23
       
+
       
        onchange={(e) =>

     

       
24
       
+
       
            onShowChange((e.target as HTMLSelectElement).value as ShowOption)}

     

       
25
       
+
       
        class="bg-pink-50 dark:bg-pink-900 text-pink-900 dark:text-pink-100 border border-pink-200 dark:border-pink-700 rounded-full px-1 outline-none focus:border-pink-400 min-w-0"

     

       
26
       
+
       
    >

     

       
27
       
+
       
        {#each showOptions as option}

     

       
28
       
+
       
            <option value={option}>{option}</option>

     

       
29
       
+
       
        {/each}

     

       
30
       
+
       
    </select>

     

       
31
       
+
       
</div>

     

···

       
17
       
 
       
</script>

     

       
18
       
 
       


     

       
19
       
 
       
<div

     

       
20
       
-
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-purple-100 hover:bg-purple-200 border-purple-300"

     

       
21
       
 
       
>

     

       
22
       
-
       
    <label for="sort-by" class="text-purple-800 mr-1"> sort by: </label>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
23
       
 
       
    <select

     

       
24
       
 
       
        id="sort-by"

     

       
25
       
 
       
        value={sortBy}

     

       
26
       
 
       
        onchange={(e) =>

     

       
27
       
 
       
            onSortChange((e.target as HTMLSelectElement).value as SortOption)}

     

       
28
       
-
       
        class="bg-purple-50 text-purple-900 border border-purple-200 rounded-full px-1 outline-none focus:bg-white focus:border-purple-400 min-w-0"

     

       
29
       
 
       
    >

     

       
30
       
 
       
        {#each sortOptions as option}

     

       
31
       
 
       
            <option value={option.value}>{option.label}</option>

     

       
32
       
 
       
        {/each}

     

       
33
       
 
       
    </select>

     

       
34
       
 
       
</div>

     

       
35
       
-
       


     

       
36
       
-
       
<style lang="postcss">

     

       
37
       
-
       
    @reference "../../app.css";

     

       
38
       
-
       
    .wsbadge {

     

       
39
       
-
       
        @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
40
       
-
       
    }

     

       
41
       
-
       
</style>

     

···

       
17
       
 
       
</script>

     

       
18
       
 
       


     

       
19
       
 
       
<div

     

       
20
       
+
       
    class="wsbadge !pl-2 !px-1 !mt-0 !font-normal bg-purple-100 dark:bg-purple-800 hover:bg-purple-200 dark:hover:bg-purple-700 border-purple-300 dark:border-purple-700"

     

       
21
       
 
       
>

     

       
22
       
+
       
    <label for="sort-by" class="text-purple-800 dark:text-purple-300 mr-1">

     

       
23
       
+
       
        sort by:

     

       
24
       
+
       
    </label>

     

       
25
       
 
       
    <select

     

       
26
       
 
       
        id="sort-by"

     

       
27
       
 
       
        value={sortBy}

     

       
28
       
 
       
        onchange={(e) =>

     

       
29
       
 
       
            onSortChange((e.target as HTMLSelectElement).value as SortOption)}

     

       
30
       
+
       
        class="bg-purple-50 dark:bg-purple-900 text-purple-900 dark:text-purple-300 border border-purple-200 dark:border-purple-700 rounded-full px-1 outline-none focus:border-purple-400 min-w-0"

     

       
31
       
 
       
    >

     

       
32
       
 
       
        {#each sortOptions as option}

     

       
33
       
 
       
            <option value={option.value}>{option.label}</option>

     

       
34
       
 
       
        {/each}

     

       
35
       
 
       
    </select>

     

       
36
       
 
       
</div>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
1
       
 
       
<script lang="ts">

     

       
2
       
 
       
    import { formatNumber } from "$lib/format";

     

       
3
       
-
       
    import NumberFlow from "@number-flow/svelte";

     

       
4
       
 
       


     

       
5
       
 
       
    const colorClasses = {

     

       
6
       
 
       
        green: {

     

       
7
       
-
       
            bg: "from-green-50 to-green-100",

     

       
8
       
-
       
            border: "border-green-200",

     

       
9
       
-
       
            titleText: "text-green-700",

     

       
10
       
-
       
            valueText: "text-green-900",

     

       
11
       
 
       
        },

     

       
12
       
 
       
        red: {

     

       
13
       
-
       
            bg: "from-red-50 to-red-100",

     

       
14
       
-
       
            border: "border-red-200",

     

       
15
       
-
       
            titleText: "text-red-700",

     

       
16
       
-
       
            valueText: "text-red-900",

     

       
17
       
 
       
        },

     

       
18
       
 
       
        turqoise: {

     

       
19
       
-
       
            bg: "from-teal-50 to-teal-100",

     

       
20
       
-
       
            border: "border-teal-200",

     

       
21
       
-
       
            titleText: "text-teal-700",

     

       
22
       
-
       
            valueText: "text-teal-900",

     

       
23
       
 
       
        },

     

       
24
       
 
       
        orange: {

     

       
25
       
-
       
            bg: "from-orange-50 to-orange-100",

     

       
26
       
-
       
            border: "border-orange-200",

     

       
27
       
-
       
            titleText: "text-orange-700",

     

       
28
       
-
       
            valueText: "text-orange-900",

     

       
29
       
 
       
        },

     

       
30
       
 
       
    };

     

       
31
       
 
       


     
···

       
45
       
 
       
        {title}

     

       
46
       
 
       
    </h3>

     

       
47
       
 
       
    <p class="text-xl md:text-2xl font-bold {colors.valueText}">

     

       
48
       
-
       
        <NumberFlow {value} />

     

       
49
       
 
       
    </p>

     

       
50
       
 
       
</div>

     

···

       
1
       
 
       
<script lang="ts">

     

       
2
       
 
       
    import { formatNumber } from "$lib/format";

     

       
0
       
 
       

     

       
3
       
 
       


     

       
4
       
 
       
    const colorClasses = {

     

       
5
       
 
       
        green: {

     

       
6
       
+
       
            bg: "from-green-50 to-green-100 dark:from-green-900 dark:to-green-800",

     

       
7
       
+
       
            border: "border-green-200 dark:border-green-800",

     

       
8
       
+
       
            titleText: "text-green-700 dark:text-green-400",

     

       
9
       
+
       
            valueText: "text-green-900 dark:text-green-200",

     

       
10
       
 
       
        },

     

       
11
       
 
       
        red: {

     

       
12
       
+
       
            bg: "from-red-50 to-red-100 dark:from-red-900 dark:to-red-800",

     

       
13
       
+
       
            border: "border-red-200 dark:border-red-800",

     

       
14
       
+
       
            titleText: "text-red-700 dark:text-red-400",

     

       
15
       
+
       
            valueText: "text-red-900 dark:text-red-200",

     

       
16
       
 
       
        },

     

       
17
       
 
       
        turqoise: {

     

       
18
       
+
       
            bg: "from-teal-50 to-teal-100 dark:from-teal-900 dark:to-teal-800",

     

       
19
       
+
       
            border: "border-teal-200 dark:border-teal-800",

     

       
20
       
+
       
            titleText: "text-teal-700 dark:text-teal-400",

     

       
21
       
+
       
            valueText: "text-teal-900 dark:text-teal-200",

     

       
22
       
 
       
        },

     

       
23
       
 
       
        orange: {

     

       
24
       
+
       
            bg: "from-orange-50 to-orange-100 dark:from-orange-900 dark:to-orange-800",

     

       
25
       
+
       
            border: "border-orange-200 dark:border-orange-800",

     

       
26
       
+
       
            titleText: "text-orange-700 dark:text-orange-400",

     

       
27
       
+
       
            valueText: "text-orange-900 dark:text-orange-200",

     

       
28
       
 
       
        },

     

       
29
       
 
       
    };

     

       
30
       
 
       


     
···

       
44
       
 
       
        {title}

     

       
45
       
 
       
    </h3>

     

       
46
       
 
       
    <p class="text-xl md:text-2xl font-bold {colors.valueText}">

     

       
47
       
+
       
        {formatNumber(value)}

     

       
48
       
 
       
    </p>

     

       
49
       
 
       
</div>

     

···

       
8
       
 
       
    const statusConfig = {

     

       
9
       
 
       
        connected: {

     

       
10
       
 
       
            text: "stream live",

     

       
11
       
-
       
            classes: "bg-green-100 text-green-800 border-green-200",

     

       
0
       
 
       

     

       
12
       
 
       
        },

     

       
13
       
 
       
        connecting: {

     

       
14
       
 
       
            text: "stream connecting",

     

       
15
       
-
       
            classes: "bg-yellow-100 text-yellow-800 border-yellow-200",

     

       
0
       
 
       

     

       
16
       
 
       
        },

     

       
17
       
 
       
        error: {

     

       
18
       
 
       
            text: "stream errored",

     

       
19
       
-
       
            classes: "bg-red-100 text-red-800 border-red-200",

     

       
0
       
 
       

     

       
20
       
 
       
        },

     

       
21
       
 
       
        disconnected: {

     

       
22
       
 
       
            text: "stream offline",

     

       
23
       
-
       
            classes: "bg-gray-100 text-gray-800 border-gray-200",

     

       
0
       
 
       

     

       
24
       
 
       
        },

     

       
25
       
 
       
    };

     

       
26
       
 
       


     

       
27
       
 
       
    const config = $derived(statusConfig[status]);

     

       
28
       
 
       
</script>

     

       
29
       
 
       


     

       
30
       
-
       
<span class="wsbadge {config.classes}">

     

       
31
       
-
       
    {config.text}

     

       
32
       
-
       
</span>

     

       
33
       
-
       


     

       
34
       
-
       
<style lang="postcss">

     

       
35
       
-
       
    @reference "../../app.css";

     

       
36
       
-
       
    .wsbadge {

     

       
37
       
-
       
        @apply text-sm font-semibold mt-1.5 px-2.5 py-0.5 rounded-full border;

     

       
38
       
-
       
    }

     

       
39
       
-
       
</style>

     

···

       
8
       
 
       
    const statusConfig = {

     

       
9
       
 
       
        connected: {

     

       
10
       
 
       
            text: "stream live",

     

       
11
       
+
       
            classes:

     

       
12
       
+
       
                "bg-green-100 dark:bg-green-900 text-green-800 dark:text-green-200 border-green-200 dark:border-green-800",

     

       
13
       
 
       
        },

     

       
14
       
 
       
        connecting: {

     

       
15
       
 
       
            text: "stream connecting",

     

       
16
       
+
       
            classes:

     

       
17
       
+
       
                "bg-yellow-100 dark:bg-yellow-900 text-yellow-800 dark:text-yellow-200 border-yellow-200 dark:border-yellow-800",

     

       
18
       
 
       
        },

     

       
19
       
 
       
        error: {

     

       
20
       
 
       
            text: "stream errored",

     

       
21
       
+
       
            classes:

     

       
22
       
+
       
                "bg-red-100 dark:bg-red-900 text-red-800 dark:text-red-200 border-red-200 dark:border-red-800",

     

       
23
       
 
       
        },

     

       
24
       
 
       
        disconnected: {

     

       
25
       
 
       
            text: "stream offline",

     

       
26
       
+
       
            classes:

     

       
27
       
+
       
                "bg-gray-100 dark:bg-gray-900 text-gray-800 dark:text-gray-200 border-gray-200 dark:border-gray-800",

     

       
28
       
 
       
        },

     

       
29
       
 
       
    };

     

       
30
       
 
       


     

       
31
       
 
       
    const config = $derived(statusConfig[status]);

     

       
32
       
 
       
</script>

     

       
33
       
 
       


     

       
34
       
+
       
<div class="flex flex-row items-center gap-2 wsbadge {config.classes}">

     

       
35
       
+
       
    <!-- connecting spinner -->

     

       
36
       
+
       
    {#if status === "connecting"}

     

       
37
       
+
       
        <div

     

       
38
       
+
       
            class="animate-spin rounded-full h-4 w-4 border-b-2 border-yellow-800 dark:border-yellow-200"

     

       
39
       
+
       
        ></div>

     

       
40
       
+
       
    {/if}

     

       
41
       
+
       
    <!-- status text -->

     

       
42
       
+
       
    <span>{config.text}</span>

     

       
43
       
+
       
</div>

     

···

       
2
       
 
       
  return num.toLocaleString();

     

       
3
       
 
       
};

     

       
4
       
 
       


     

       
0
       
 
       

     

       
5
       
 
       
export const formatTimestamp = (timestamp: number): string => {

     

       
6
       
-
       
  return new Date(timestamp / 1000).toLocaleString();

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
7
       
 
       
};

     

···

       
2
       
 
       
  return num.toLocaleString();

     

       
3
       
 
       
};

     

       
4
       
 
       


     

       
5
       
+
       
const isValidDate = (d: Date) => d instanceof Date && !isNaN(d.getTime());

     

       
6
       
 
       
export const formatTimestamp = (timestamp: number): string => {

     

       
7
       
+
       
  const date = new Date(timestamp * 1000);

     

       
8
       
+
       
  return isValidDate(date)

     

       
9
       
+
       
    ? date.toLocaleString()

     

       
10
       
+
       
    : new Date(timestamp / 1000).toLocaleString();

     

       
11
       
 
       
};

     

···

       
18
       
 
       
};

     

       
19
       
 
       


     

       
20
       
 
       
export type SortOption = "total" | "created" | "deleted" | "date";

     

       
0
       
 
       

     

···

       
18
       
 
       
};

     

       
19
       
 
       


     

       
20
       
 
       
export type SortOption = "total" | "created" | "deleted" | "date";

     

       
21
       
+
       
export type ShowOption = "server init" | "stream start";

     

···

       
1
       
-
       
export const prerender = true;

     

       
2
       
-
       
export const ssr = false;

     

       
0
       
 
       

     

···

       
1
       
+
       
export const prerender = false;

     

       
2
       
+
       
export const ssr = true;

     

       
3
       
+
       
export const csr = true;

     

···

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

···

       
1
       
+
       
import { fetchEvents, fetchTrackingSince } from "$lib/api";

     

       
2
       
+
       


     

       
3
       
+
       
export const load = async () => {

     

       
4
       
+
       
  const events = await fetchEvents();

     

       
5
       
+
       
  const trackingSince = await fetchTrackingSince();

     

       
6
       
+
       
  return { events, trackingSince };

     

       
7
       
+
       
};

     

···

       
1
       
 
       
<script lang="ts">

     

       
2
       
 
       
    import { dev } from "$app/environment";

     

       
3
       
-
       
    import type { EventRecord, NsidCount, SortOption } from "$lib/types";

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
4
       
 
       
    import { onMount, onDestroy } from "svelte";

     

       
5
       
-
       
    import { writable } from "svelte/store";

     

       
6
       
 
       
    import { PUBLIC_API_URL } from "$env/static/public";

     

       
7
       
 
       
    import { fetchEvents, fetchTrackingSince } from "$lib/api";

     

       
8
       
 
       
    import { createRegexFilter } from "$lib/filter";

     
···

       
14
       
 
       
    import BskyToggle from "$lib/components/BskyToggle.svelte";

     

       
15
       
 
       
    import RefreshControl from "$lib/components/RefreshControl.svelte";

     

       
16
       
 
       
    import { formatTimestamp } from "$lib/format";

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
17
       
 
       


     

       
18
       
-
       
    const events = writable(new Map<string, EventRecord>());

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
19
       
 
       
    const pendingUpdates = new Map<string, EventRecord>();

     

       
20
       
-
       
    let eventsList: NsidCount[] = $state([]);

     

       
21
       
 
       
    let updateTimer: NodeJS.Timeout | null = null;

     

       
22
       
-
       
    events.subscribe((value) => {

     

       
23
       
-
       
        eventsList = value

     

       
24
       
-
       
            .entries()

     

       
25
       
-
       
            .map(([nsid, event]) => ({

     

       
26
       
-
       
                nsid,

     

       
27
       
-
       
                ...event,

     

       
28
       
-
       
            }))

     

       
29
       
-
       
            .toArray();

     

       
30
       
-
       
    });

     

       
31
       
-
       
    let per_second = $state(0);

     

       
32
       
-
       
    let tracking_since = $state(0);

     

       
33
       
 
       


     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
34
       
 
       
    let all: EventRecord = $derived(

     

       
35
       
 
       
        eventsList.reduce(

     

       
36
       
 
       
            (acc, event) => {

     
···

       
50
       
 
       
            },

     

       
51
       
 
       
        ),

     

       
52
       
 
       
    );

     

       
53
       
-
       
    let error: string | null = $state(null);

     

       
54
       
-
       
    let filterRegex = $state("");

     

       
55
       
-
       
    let dontShowBsky = $state(false);

     

       
56
       
-
       
    let sortBy: SortOption = $state("total");

     

       
57
       
-
       
    let refreshRate = $state("");

     

       
58
       
-
       
    let changedByUser = $state(false);

     

       
59
       
 
       


     

       
60
       
 
       
    let websocket: WebSocket | null = null;

     

       
61
       
 
       
    let isStreamOpen = $state(false);

     
···

       
76
       
 
       
        };

     

       
77
       
 
       
        websocket.onmessage = async (event) => {

     

       
78
       
 
       
            const jsonData = JSON.parse(event.data);

     

       
79
       
-
       


     

       
80
       
-
       
            if (jsonData.per_second > 0) {

     

       
81
       
-
       
                per_second = jsonData.per_second;

     

       
82
       
-
       
            }

     

       
83
       
-
       


     

       
84
       
-
       
            // Store updates in pending map if refresh rate is set

     

       
85
       
 
       
            if (refreshRate) {

     

       
86
       
 
       
                for (const [nsid, event] of Object.entries(jsonData.events)) {

     

       
87
       
 
       
                    pendingUpdates.set(nsid, event as EventRecord);

     

       
88
       
 
       
                }

     

       
89
       
 
       
            } else {

     

       
90
       
-
       
                // Apply updates immediately if no refresh rate

     

       
91
       
-
       
                events.update((map) => {

     

       
92
       
-
       
                    for (const [nsid, event] of Object.entries(

     

       
93
       
-
       
                        jsonData.events,

     

       
94
       
-
       
                    )) {

     

       
95
       
-
       
                        map.set(nsid, event as EventRecord);

     

       
96
       
-
       
                    }

     

       
97
       
-
       
                    return map;

     

       
98
       
-
       
                });

     

       
99
       
 
       
            }

     

       
100
       
 
       
        };

     

       
101
       
 
       
        websocket.onerror = (error) => {

     
···

       
114
       
 
       
            error = null;

     

       
115
       
 
       
            const data = await fetchEvents();

     

       
116
       
 
       
            per_second = data.per_second;

     

       
117
       
-
       
            events.update((map) => {

     

       
118
       
-
       
                for (const [nsid, event] of Object.entries(data.events)) {

     

       
119
       
-
       
                    map.set(nsid, event);

     

       
120
       
-
       
                }

     

       
121
       
-
       
                return map;

     

       
122
       
-
       
            });

     

       
123
       
 
       
            tracking_since = (await fetchTrackingSince()).since;

     

       
124
       
 
       
        } catch (err) {

     

       
125
       
 
       
            error =

     
···

       
222
       
 
       
    />

     

       
223
       
 
       
</svelte:head>

     

       
224
       
 
       


     

       
225
       
-
       
<header class="border-gray-300 border-b mb-4 pb-2">

     

       
0
       
 
       

     

       
0
       
 
       

     

       
226
       
 
       
    <div

     

       
227
       
 
       
        class="px-2 md:ml-[19vw] mx-auto flex flex-wrap items-center text-center"

     

       
228
       
 
       
    >

     

       
229
       
-
       
        <h1 class="text-4xl font-bold mr-4 text-gray-900">lexicon tracker</h1>

     

       
230
       
-
       
        <p class="text-lg mt-1 text-gray-600">

     

       
0
       
 
       

     

       
0
       
 
       

     

       
231
       
 
       
            tracks lexicons seen on the jetstream {tracking_since === 0

     

       
232
       
 
       
                ? ""

     

       
233
       
 
       
                : `(since: ${formatTimestamp(tracking_since)})`}

     

       
234
       
 
       
        </p>

     

       
235
       
 
       
    </div>

     

       
236
       
 
       
</header>

     

       
237
       
-
       
<div class="md:max-w-[61vw] mx-auto p-2">

     

       
238
       
 
       
    <div class="min-w-fit grid grid-cols-2 xl:grid-cols-4 gap-2 2xl:gap-6 mb-8">

     

       
239
       
 
       
        <StatsCard

     

       
240
       
 
       
            title="total creation"

     
···

       
260
       
 
       


     

       
261
       
 
       
    {#if error}

     

       
262
       
 
       
        <div

     

       
263
       
-
       
            class="bg-red-100 border border-red-300 text-red-700 px-4 py-3 rounded-lg mb-6"

     

       
264
       
 
       
        >

     

       
265
       
 
       
            <p>Error: {error}</p>

     

       
266
       
 
       
        </div>

     
···

       
269
       
 
       
    {#if eventsList.length > 0}

     

       
270
       
 
       
        <div class="mb-8">

     

       
271
       
 
       
            <div class="flex flex-wrap items-center gap-3 mb-3">

     

       
272
       
-
       
                <h2 class="text-2xl font-bold text-gray-900">seen lexicons</h2>

     

       
0
       
 
       

     

       
0
       
 
       

     

       
273
       
 
       
                <StatusBadge status={websocketStatus} />

     

       
274
       
 
       
            </div>

     

       
275
       
 
       
            <div class="flex flex-wrap items-center gap-1.5 mb-6">

     
···

       
291
       
 
       
                            refreshRate = "";

     

       
292
       
 
       
                    }}

     

       
293
       
 
       
                />

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
294
       
 
       
                <RefreshControl

     

       
295
       
 
       
                    {refreshRate}

     

       
296
       
 
       
                    onRefreshChange={(value) => {

     
···

       
315
       
 
       
    {/if}

     

       
316
       
 
       
</div>

     

       
317
       
 
       


     

       
318
       
-
       
<footer class="py-2 border-t border-gray-200 text-center">

     

       
319
       
-
       
    <p class="text-gray-600 text-sm">

     

       
320
       
 
       
        source code <a

     

       
321
       
 
       
            href="https://tangled.sh/@poor.dog/nsid-tracker"

     

       
322
       
 
       
            target="_blank"

     

       
323
       
 
       
            rel="noopener noreferrer"

     

       
324
       
-
       
            class="text-blue-600 hover:text-blue-800 underline"

     

       
325
       
 
       
            >@poor.dog/nsid-tracker</a

     

       
326
       
 
       
        >

     

       
327
       
 
       
    </p>

     

···

       
1
       
 
       
<script lang="ts">

     

       
2
       
 
       
    import { dev } from "$app/environment";

     

       
3
       
+
       
    import type {

     

       
4
       
+
       
        EventRecord,

     

       
5
       
+
       
        Events,

     

       
6
       
+
       
        NsidCount,

     

       
7
       
+
       
        ShowOption,

     

       
8
       
+
       
        Since,

     

       
9
       
+
       
        SortOption,

     

       
10
       
+
       
    } from "$lib/types";

     

       
11
       
 
       
    import { onMount, onDestroy } from "svelte";

     

       
12
       
+
       
    import { get, writable } from "svelte/store";

     

       
13
       
 
       
    import { PUBLIC_API_URL } from "$env/static/public";

     

       
14
       
 
       
    import { fetchEvents, fetchTrackingSince } from "$lib/api";

     

       
15
       
 
       
    import { createRegexFilter } from "$lib/filter";

     
···

       
21
       
 
       
    import BskyToggle from "$lib/components/BskyToggle.svelte";

     

       
22
       
 
       
    import RefreshControl from "$lib/components/RefreshControl.svelte";

     

       
23
       
 
       
    import { formatTimestamp } from "$lib/format";

     

       
24
       
+
       
    import ShowControls from "$lib/components/ShowControls.svelte";

     

       
25
       
+
       


     

       
26
       
+
       
    type Props = {

     

       
27
       
+
       
        data: { events: Events; trackingSince: Since };

     

       
28
       
+
       
    };

     

       
29
       
 
       


     

       
30
       
+
       
    const { data }: Props = $props();

     

       
31
       
+
       


     

       
32
       
+
       
    const events = writable(

     

       
33
       
+
       
        new Map<string, EventRecord>(Object.entries(data.events.events)),

     

       
34
       
+
       
    );

     

       
35
       
+
       
    const eventsStart = new Map<string, EventRecord>(

     

       
36
       
+
       
        Object.entries(data.events.events),

     

       
37
       
+
       
    );

     

       
38
       
 
       
    const pendingUpdates = new Map<string, EventRecord>();

     

       
39
       
+
       


     

       
40
       
 
       
    let updateTimer: NodeJS.Timeout | null = null;

     

       
41
       
+
       
    let per_second = $state(data.events.per_second);

     

       
42
       
+
       
    let tracking_since = $state(data.trackingSince.since);

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
43
       
 
       


     

       
44
       
+
       
    const diffEvents = (

     

       
45
       
+
       
        oldEvents: Map<string, EventRecord>,

     

       
46
       
+
       
        newEvents: Map<string, EventRecord>,

     

       
47
       
+
       
    ): NsidCount[] => {

     

       
48
       
+
       
        const nsidCounts: NsidCount[] = [];

     

       
49
       
+
       
        for (const [nsid, event] of newEvents.entries()) {

     

       
50
       
+
       
            const oldEvent = oldEvents.get(nsid);

     

       
51
       
+
       
            if (oldEvent) {

     

       
52
       
+
       
                const counts = {

     

       
53
       
+
       
                    nsid,

     

       
54
       
+
       
                    count: event.count - oldEvent.count,

     

       
55
       
+
       
                    deleted_count: event.deleted_count - oldEvent.deleted_count,

     

       
56
       
+
       
                    last_seen: event.last_seen,

     

       
57
       
+
       
                };

     

       
58
       
+
       
                if (counts.count > 0 || counts.deleted_count > 0)

     

       
59
       
+
       
                    nsidCounts.push(counts);

     

       
60
       
+
       
            } else {

     

       
61
       
+
       
                nsidCounts.push({

     

       
62
       
+
       
                    nsid,

     

       
63
       
+
       
                    ...event,

     

       
64
       
+
       
                });

     

       
65
       
+
       
            }

     

       
66
       
+
       
        }

     

       
67
       
+
       
        return nsidCounts;

     

       
68
       
+
       
    };

     

       
69
       
+
       
    const applyEvents = (newEvents: Record<string, EventRecord>) => {

     

       
70
       
+
       
        events.update((map) => {

     

       
71
       
+
       
            for (const [nsid, event] of Object.entries(newEvents)) {

     

       
72
       
+
       
                map.set(nsid, event);

     

       
73
       
+
       
            }

     

       
74
       
+
       
            return map;

     

       
75
       
+
       
        });

     

       
76
       
+
       
    };

     

       
77
       
+
       


     

       
78
       
+
       
    let error: string | null = $state(null);

     

       
79
       
+
       
    let filterRegex = $state("");

     

       
80
       
+
       
    let dontShowBsky = $state(false);

     

       
81
       
+
       
    let sortBy: SortOption = $state("total");

     

       
82
       
+
       
    let refreshRate = $state("");

     

       
83
       
+
       
    let changedByUser = $state(false);

     

       
84
       
+
       
    let show: ShowOption = $state("server init");

     

       
85
       
+
       
    let eventsList: NsidCount[] = $state([]);

     

       
86
       
+
       
    let updateEventsList = $derived((value: Map<string, EventRecord>) => {

     

       
87
       
+
       
        switch (show) {

     

       
88
       
+
       
            case "server init":

     

       
89
       
+
       
                eventsList = value

     

       
90
       
+
       
                    .entries()

     

       
91
       
+
       
                    .map(([nsid, event]) => ({

     

       
92
       
+
       
                        nsid,

     

       
93
       
+
       
                        ...event,

     

       
94
       
+
       
                    }))

     

       
95
       
+
       
                    .toArray();

     

       
96
       
+
       
                break;

     

       
97
       
+
       
            case "stream start":

     

       
98
       
+
       
                eventsList = diffEvents(eventsStart, value);

     

       
99
       
+
       
                break;

     

       
100
       
+
       
        }

     

       
101
       
+
       
    });

     

       
102
       
+
       
    events.subscribe((value) => updateEventsList(value));

     

       
103
       
 
       
    let all: EventRecord = $derived(

     

       
104
       
 
       
        eventsList.reduce(

     

       
105
       
 
       
            (acc, event) => {

     
···

       
119
       
 
       
            },

     

       
120
       
 
       
        ),

     

       
121
       
 
       
    );

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
122
       
 
       


     

       
123
       
 
       
    let websocket: WebSocket | null = null;

     

       
124
       
 
       
    let isStreamOpen = $state(false);

     
···

       
139
       
 
       
        };

     

       
140
       
 
       
        websocket.onmessage = async (event) => {

     

       
141
       
 
       
            const jsonData = JSON.parse(event.data);

     

       
142
       
+
       
            per_second = jsonData.per_second;

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
143
       
 
       
            if (refreshRate) {

     

       
144
       
 
       
                for (const [nsid, event] of Object.entries(jsonData.events)) {

     

       
145
       
 
       
                    pendingUpdates.set(nsid, event as EventRecord);

     

       
146
       
 
       
                }

     

       
147
       
 
       
            } else {

     

       
148
       
+
       
                applyEvents(jsonData.events);

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
149
       
 
       
            }

     

       
150
       
 
       
        };

     

       
151
       
 
       
        websocket.onerror = (error) => {

     
···

       
164
       
 
       
            error = null;

     

       
165
       
 
       
            const data = await fetchEvents();

     

       
166
       
 
       
            per_second = data.per_second;

     

       
167
       
+
       
            applyEvents(data.events);

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
168
       
 
       
            tracking_since = (await fetchTrackingSince()).since;

     

       
169
       
 
       
        } catch (err) {

     

       
170
       
 
       
            error =

     
···

       
267
       
 
       
    />

     

       
268
       
 
       
</svelte:head>

     

       
269
       
 
       


     

       
270
       
+
       
<header

     

       
271
       
+
       
    class="bg-white dark:bg-gray-900 border-gray-300 dark:border-gray-950 border-b mb-4 pb-2"

     

       
272
       
+
       
>

     

       
273
       
 
       
    <div

     

       
274
       
 
       
        class="px-2 md:ml-[19vw] mx-auto flex flex-wrap items-center text-center"

     

       
275
       
 
       
    >

     

       
276
       
+
       
        <h1 class="text-4xl font-bold mr-4 text-gray-900 dark:text-gray-200">

     

       
277
       
+
       
            lexicon tracker

     

       
278
       
+
       
        </h1>

     

       
279
       
+
       
        <p class="text-lg mt-1 text-gray-600 dark:text-gray-300">

     

       
280
       
 
       
            tracks lexicons seen on the jetstream {tracking_since === 0

     

       
281
       
 
       
                ? ""

     

       
282
       
 
       
                : `(since: ${formatTimestamp(tracking_since)})`}

     

       
283
       
 
       
        </p>

     

       
284
       
 
       
    </div>

     

       
285
       
 
       
</header>

     

       
286
       
+
       
<div class="bg-white dark:bg-gray-900 md:max-w-[61vw] mx-auto p-2">

     

       
287
       
 
       
    <div class="min-w-fit grid grid-cols-2 xl:grid-cols-4 gap-2 2xl:gap-6 mb-8">

     

       
288
       
 
       
        <StatsCard

     

       
289
       
 
       
            title="total creation"

     
···

       
309
       
 
       


     

       
310
       
 
       
    {#if error}

     

       
311
       
 
       
        <div

     

       
312
       
+
       
            class="bg-red-100 dark:bg-red-900 border border-red-300 dark:border-red-700 text-red-700 dark:text-red-200 px-4 py-3 rounded-lg mb-6"

     

       
313
       
 
       
        >

     

       
314
       
 
       
            <p>Error: {error}</p>

     

       
315
       
 
       
        </div>

     
···

       
318
       
 
       
    {#if eventsList.length > 0}

     

       
319
       
 
       
        <div class="mb-8">

     

       
320
       
 
       
            <div class="flex flex-wrap items-center gap-3 mb-3">

     

       
321
       
+
       
                <h2 class="text-2xl font-bold text-gray-900 dark:text-gray-200">

     

       
322
       
+
       
                    seen lexicons

     

       
323
       
+
       
                </h2>

     

       
324
       
 
       
                <StatusBadge status={websocketStatus} />

     

       
325
       
 
       
            </div>

     

       
326
       
 
       
            <div class="flex flex-wrap items-center gap-1.5 mb-6">

     
···

       
342
       
 
       
                            refreshRate = "";

     

       
343
       
 
       
                    }}

     

       
344
       
 
       
                />

     

       
345
       
+
       
                <ShowControls

     

       
346
       
+
       
                    {show}

     

       
347
       
+
       
                    onShowChange={(value: ShowOption) => {

     

       
348
       
+
       
                        show = value;

     

       
349
       
+
       
                        updateEventsList(get(events));

     

       
350
       
+
       
                    }}

     

       
351
       
+
       
                />

     

       
352
       
 
       
                <RefreshControl

     

       
353
       
 
       
                    {refreshRate}

     

       
354
       
 
       
                    onRefreshChange={(value) => {

     
···

       
373
       
 
       
    {/if}

     

       
374
       
 
       
</div>

     

       
375
       
 
       


     

       
376
       
+
       
<footer class="py-2 border-t border-gray-200 dark:border-gray-800 text-center">

     

       
377
       
+
       
    <p class="text-gray-600 dark:text-gray-200 text-sm">

     

       
378
       
 
       
        source code <a

     

       
379
       
 
       
            href="https://tangled.sh/@poor.dog/nsid-tracker"

     

       
380
       
 
       
            target="_blank"

     

       
381
       
 
       
            rel="noopener noreferrer"

     

       
382
       
+
       
            class="text-blue-600 dark:text-blue-400 hover:text-blue-800 dark:hover:text-blue-600 underline"

     

       
383
       
 
       
            >@poor.dog/nsid-tracker</a

     

       
384
       
 
       
        >

     

       
385
       
 
       
    </p>

     

···

       
1
       
-
       
import adapter from "@sveltejs/adapter-static";

     

       
2
       
 
       
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";

     

       
3
       
 
       


     

       
4
       
 
       
/** @type {import('@sveltejs/kit').Config} */

     

···

       
1
       
+
       
import adapter from "svelte-adapter-bun";

     

       
2
       
 
       
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";

     

       
3
       
 
       


     

       
4
       
 
       
/** @type {import('@sveltejs/kit').Config} */

     

···

       
8
       
 
       


     

       
9
       
 
       
  src = ../client;

     

       
10
       
 
       


     

       
11
       
-
       
  outputHash = "sha256-t8PJFo+3XGkzmMNbw9Rf9cS5Ob5YtI8ucX3ay+u9a3M=";

     

       
12
       
 
       
  outputHashAlgo = "sha256";

     

       
13
       
 
       
  outputHashMode = "recursive";

     

       
14
       
 
       


     

···

       
8
       
 
       


     

       
9
       
 
       
  src = ../client;

     

       
10
       
 
       


     

       
11
       
+
       
  outputHash = "sha256-njwXk3u0NUsYWLv9EOdCltgQOjTVkcfu+D+0COSw/6I=";

     

       
12
       
 
       
  outputHashAlgo = "sha256";

     

       
13
       
 
       
  outputHashMode = "recursive";

     

       
14
       
 
       


     

···

       
1
       
 
       
{

     

       
0
       
 
       

     

       
2
       
 
       
  stdenv,

     

       
3
       
 
       
  makeBinaryWrapper,

     

       
4
       
 
       
  bun,

     
···

       
28
       
 
       
  '';

     

       
29
       
 
       
  buildPhase = ''

     

       
30
       
 
       
    runHook preBuild

     

       
31
       
-
       
    bun --prefer-offline run --bun build

     

       
32
       
 
       
    runHook postBuild

     

       
33
       
 
       
  '';

     

       
34
       
 
       
  installPhase = ''

     

       
35
       
 
       
    runHook preInstall

     

       
36
       
-
       
    mkdir -p $out

     

       
0
       
 
       

     

       
37
       
 
       
    cp -R ./build/* $out

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
38
       
 
       
    runHook postInstall

     

       
39
       
 
       
  '';

     

       
40
       
 
       
}

     

···

       
1
       
 
       
{

     

       
2
       
+
       
  lib,

     

       
3
       
 
       
  stdenv,

     

       
4
       
 
       
  makeBinaryWrapper,

     

       
5
       
 
       
  bun,

     
···

       
29
       
 
       
  '';

     

       
30
       
 
       
  buildPhase = ''

     

       
31
       
 
       
    runHook preBuild

     

       
32
       
+
       
    bun --prefer-offline run build

     

       
33
       
 
       
    runHook postBuild

     

       
34
       
 
       
  '';

     

       
35
       
 
       
  installPhase = ''

     

       
36
       
 
       
    runHook preInstall

     

       
37
       
+
       


     

       
38
       
+
       
    mkdir -p $out/bin

     

       
39
       
 
       
    cp -R ./build/* $out

     

       
40
       
+
       
    cp -R ./node_modules $out

     

       
41
       
+
       


     

       
42
       
+
       
    makeBinaryWrapper ${bun}/bin/bun $out/bin/website \

     

       
43
       
+
       
      --prefix PATH : ${lib.makeBinPath [ bun ]} \

     

       
44
       
+
       
      --add-flags "run --bun --no-install --cwd $out start"

     

       
45
       
+
       


     

       
46
       
 
       
    runHook postInstall

     

       
47
       
 
       
  '';

     

       
48
       
 
       
}

     

···

       
18
       
 
       
checksum = "320119579fcad9c21884f5c4861d16174d0e06250625266f50fe6898340abefa"

     

       
19
       
 
       


     

       
20
       
 
       
[[package]]

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
21
       
 
       
name = "aho-corasick"

     

       
22
       
 
       
version = "1.1.3"

     

       
23
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     
···

       
46
       
 
       
version = "1.0.98"

     

       
47
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
48
       
 
       
checksum = "e16d2d3311acee920a9eb8d33b8cbc1787ce4a264e85f964c2404b969bdcd487"

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
49
       
 
       


     

       
50
       
 
       
[[package]]

     

       
51
       
 
       
name = "async-compression"

     
···

       
307
       
 
       
version = "0.2.1"

     

       
308
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
309
       
 
       
checksum = "613afe47fcd5fac7ccf1db93babcb082c5994d996f20b8b159f2ad1658eb5724"

     

       
310
       
-
       


     

       
311
       
-
       
[[package]]

     

       
312
       
-
       
name = "cmake"

     

       
313
       
-
       
version = "0.1.54"

     

       
314
       
-
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
315
       
-
       
checksum = "e7caa3f9de89ddbe2c607f4101924c5abec803763ae9534e4f4d7d8f84aa81f0"

     

       
316
       
-
       
dependencies = [

     

       
317
       
-
       
 "cc",

     

       
318
       
-
       
]

     

       
319
       
 
       


     

       
320
       
 
       
[[package]]

     

       
321
       
 
       
name = "combine"

     
···

       
1552
       
 
       
name = "server"

     

       
1553
       
 
       
version = "0.1.0"

     

       
1554
       
 
       
dependencies = [

     

       
0
       
 
       

     

       
1555
       
 
       
 "anyhow",

     

       
0
       
 
       

     

       
1556
       
 
       
 "async-trait",

     

       
1557
       
 
       
 "axum",

     

       
1558
       
 
       
 "axum-tws",

     
···

       
1571
       
 
       
 "serde",

     

       
1572
       
 
       
 "serde_json",

     

       
1573
       
 
       
 "smol_str",

     

       
1574
       
-
       
 "snmalloc-rs",

     

       
1575
       
 
       
 "threadpool",

     

       
1576
       
 
       
 "tikv-jemallocator",

     

       
1577
       
 
       
 "tokio",

     
···

       
1643
       
 
       
dependencies = [

     

       
1644
       
 
       
 "borsh",

     

       
1645
       
 
       
 "serde",

     

       
1646
       
-
       
]

     

       
1647
       
-
       


     

       
1648
       
-
       
[[package]]

     

       
1649
       
-
       
name = "snmalloc-rs"

     

       
1650
       
-
       
version = "0.3.8"

     

       
1651
       
-
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
1652
       
-
       
checksum = "eb317153089fdfa4d8a2eec059d40a5a23c3bde43995ea23b19121c3f621e74a"

     

       
1653
       
-
       
dependencies = [

     

       
1654
       
-
       
 "snmalloc-sys",

     

       
1655
       
-
       
]

     

       
1656
       
-
       


     

       
1657
       
-
       
[[package]]

     

       
1658
       
-
       
name = "snmalloc-sys"

     

       
1659
       
-
       
version = "0.3.8"

     

       
1660
       
-
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
1661
       
-
       
checksum = "065fea53d32bb77bc36cca466cb191f2e5216ebfd0ed360b1d64889ee6e559ea"

     

       
1662
       
-
       
dependencies = [

     

       
1663
       
-
       
 "cmake",

     

       
1664
       
 
       
]

     

       
1665
       
 
       


     

       
1666
       
 
       
[[package]]

     
···

       
2406
       
 
       
version = "0.8.15"

     

       
2407
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
2408
       
 
       
checksum = "fdd20c5420375476fbd4394763288da7eb0cc0b8c11deed431a91562af7335d3"

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
2409
       
 
       


     

       
2410
       
 
       
[[package]]

     

       
2411
       
 
       
name = "zeroize"

     

···

       
18
       
 
       
checksum = "320119579fcad9c21884f5c4861d16174d0e06250625266f50fe6898340abefa"

     

       
19
       
 
       


     

       
20
       
 
       
[[package]]

     

       
21
       
+
       
name = "ahash"

     

       
22
       
+
       
version = "0.8.12"

     

       
23
       
+
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
24
       
+
       
checksum = "5a15f179cd60c4584b8a8c596927aadc462e27f2ca70c04e0071964a73ba7a75"

     

       
25
       
+
       
dependencies = [

     

       
26
       
+
       
 "cfg-if",

     

       
27
       
+
       
 "getrandom 0.3.3",

     

       
28
       
+
       
 "once_cell",

     

       
29
       
+
       
 "serde",

     

       
30
       
+
       
 "version_check",

     

       
31
       
+
       
 "zerocopy",

     

       
32
       
+
       
]

     

       
33
       
+
       


     

       
34
       
+
       
[[package]]

     

       
35
       
 
       
name = "aho-corasick"

     

       
36
       
 
       
version = "1.1.3"

     

       
37
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     
···

       
60
       
 
       
version = "1.0.98"

     

       
61
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
62
       
 
       
checksum = "e16d2d3311acee920a9eb8d33b8cbc1787ce4a264e85f964c2404b969bdcd487"

     

       
63
       
+
       


     

       
64
       
+
       
[[package]]

     

       
65
       
+
       
name = "arc-swap"

     

       
66
       
+
       
version = "1.7.1"

     

       
67
       
+
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
68
       
+
       
checksum = "69f7f8c3906b62b754cd5326047894316021dcfe5a194c8ea52bdd94934a3457"

     

       
69
       
 
       


     

       
70
       
 
       
[[package]]

     

       
71
       
 
       
name = "async-compression"

     
···

       
327
       
 
       
version = "0.2.1"

     

       
328
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
329
       
 
       
checksum = "613afe47fcd5fac7ccf1db93babcb082c5994d996f20b8b159f2ad1658eb5724"

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
330
       
 
       


     

       
331
       
 
       
[[package]]

     

       
332
       
 
       
name = "combine"

     
···

       
1563
       
 
       
name = "server"

     

       
1564
       
 
       
version = "0.1.0"

     

       
1565
       
 
       
dependencies = [

     

       
1566
       
+
       
 "ahash",

     

       
1567
       
 
       
 "anyhow",

     

       
1568
       
+
       
 "arc-swap",

     

       
1569
       
 
       
 "async-trait",

     

       
1570
       
 
       
 "axum",

     

       
1571
       
 
       
 "axum-tws",

     
···

       
1584
       
 
       
 "serde",

     

       
1585
       
 
       
 "serde_json",

     

       
1586
       
 
       
 "smol_str",

     

       
0
       
 
       

     

       
1587
       
 
       
 "threadpool",

     

       
1588
       
 
       
 "tikv-jemallocator",

     

       
1589
       
 
       
 "tokio",

     
···

       
1655
       
 
       
dependencies = [

     

       
1656
       
 
       
 "borsh",

     

       
1657
       
 
       
 "serde",

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
0
       
 
       

     

       
1658
       
 
       
]

     

       
1659
       
 
       


     

       
1660
       
 
       
[[package]]

     
···

       
2400
       
 
       
version = "0.8.15"

     

       
2401
       
 
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
2402
       
 
       
checksum = "fdd20c5420375476fbd4394763288da7eb0cc0b8c11deed431a91562af7335d3"

     

       
2403
       
+
       


     

       
2404
       
+
       
[[package]]

     

       
2405
       
+
       
name = "zerocopy"

     

       
2406
       
+
       
version = "0.8.26"

     

       
2407
       
+
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
2408
       
+
       
checksum = "1039dd0d3c310cf05de012d8a39ff557cb0d23087fd44cad61df08fc31907a2f"

     

       
2409
       
+
       
dependencies = [

     

       
2410
       
+
       
 "zerocopy-derive",

     

       
2411
       
+
       
]

     

       
2412
       
+
       


     

       
2413
       
+
       
[[package]]

     

       
2414
       
+
       
name = "zerocopy-derive"

     

       
2415
       
+
       
version = "0.8.26"

     

       
2416
       
+
       
source = "registry+https://github.com/rust-lang/crates.io-index"

     

       
2417
       
+
       
checksum = "9ecf5b4cc5364572d7f4c329661bcc82724222973f2cab6f050a4e5c22f75181"

     

       
2418
       
+
       
dependencies = [

     

       
2419
       
+
       
 "proc-macro2",

     

       
2420
       
+
       
 "quote",

     

       
2421
       
+
       
 "syn",

     

       
2422
       
+
       
]

     

       
2423
       
 
       


     

       
2424
       
 
       
[[package]]

     

       
2425
       
 
       
name = "zeroize"