display swarm members

frontend/src/App.svelte

@@ -40,7 +40,6 @@
 
   import logo from "./logo.png";
   import AccountCreation from "./AccountCreation.svelte";
-  import { SnackbarIn } from "m3-svelte/package/containers/Snackbar.svelte";
   import { goOffline } from "firebase/database";
 
   enum ReadyState {
@@ -62,13 +61,16 @@
 
   let showSwarmWarning = false;
   let showLogin = false;
-  let chosenTracker: keyof typeof TrackerList | undefined;
+  type TrackerID = keyof typeof TrackerList;
+  type Tracker = typeof TrackerList[TrackerID];
+
+  let chosenTracker: TrackerID | undefined;
 
   let showTrackerList = false;
 
   let createaccount = false;
 
-  let snackbar: (data: SnackbarIn) => void;
+  let snackbar: (data: any) => void;
 
   async function onTransportOpen() {
     console.log("Transport opened");
@@ -174,6 +176,19 @@
       console.log("onclose")
     );
   }
+
+  let trackerstatuses: Partial<Record<TrackerID, object | null>> = {};
+  for (let id in TrackerList) {
+    let tracker = TrackerList[id as TrackerID];
+    trackerstatuses[id as TrackerID] = null;
+
+    let url = new URL(`${tracker.tracker}/stats`);
+    url.protocol = "https://";
+    fetch(url).then(async (data) => {
+      trackerstatuses[id as TrackerID] = await data.json();
+      console.log(trackerstatuses);
+    });
+  }
 </script>
 
 {#if state == ReadyState.Connected}
@@ -261,8 +276,9 @@
         >
           <h2 class="text-4xl">Select a Tracker</h2>
           <h2 class="text-1xl">Trackers allow you to connect to Adrift</h2>
-          <div class="mt-5">
+          <div class="mt-5 space-y-3">
             {#each Object.keys(TrackerList) as tracker}
+              <Card type="outlined">
                 <label>
                   <div class="flex items-center">
                     <svelte:component this={RadioAnim3}>
@@ -274,14 +290,20 @@
                         bind:group={chosenTracker}
                       />
                     </svelte:component>
-                  <p class="m-3 text-xl">
+                    <p class="ml-3 text-xl">
                       {tracker}
                     </p>
                   </div>
                   <p>
                     {TrackerList[tracker].description}
                   </p>
+                  <p class="opacity-50">
+                    {trackerstatuses[tracker]
+                      ? trackerstatuses[tracker]?.members?.length
+                      : "loading"} swarm members
+                  </p>
                 </label>
+              </Card>
             {/each}
           </div>
           <div class="flex-1" />

pnpm-lock.yaml

@@ -363,9 +363,6 @@ importers:
       vite:
         specifier: ^4.4.9
         version: 4.4.9
-      vite-plugin-singlefile:
-        specifier: git://github.com/CoolElectronics/vite-plugin-singlefile.git
-        version: github.com/CoolElectronics/vite-plugin-singlefile/0d528cf28b80545b7423150252fd18e7efd8a5e3(rollup@3.28.0)(vite@4.4.9)
       vite-plugin-svelte:
         specifier: ^3.0.1
         version: 3.0.1(rollup@3.28.0)(svelte@4.2.0)(vite@4.4.9)
@@ -13362,20 +13359,3 @@ packages:
       srcset: 5.0.0
       tough-cookie: 4.1.3
     dev: false
-
-  github.com/CoolElectronics/vite-plugin-singlefile/0d528cf28b80545b7423150252fd18e7efd8a5e3(rollup@3.28.0)(vite@4.4.9):
-    resolution: {tarball: https://codeload.github.com/CoolElectronics/vite-plugin-singlefile/tar.gz/0d528cf28b80545b7423150252fd18e7efd8a5e3}
-    id: github.com/CoolElectronics/vite-plugin-singlefile/0d528cf28b80545b7423150252fd18e7efd8a5e3
-    name: vite-plugin-singlefile
-    version: 0.13.5
-    engines: {node: ^14.18.0 || >=16.0.0}
-    prepare: true
-    requiresBuild: true
-    peerDependencies:
-      rollup: '>=2.79.0'
-      vite: '>=3.2.0'
-    dependencies:
-      micromatch: 4.0.5
-      rollup: 3.28.0
-      vite: 4.4.9
-    dev: false

tracker/src/main.ts

@@ -21,6 +21,14 @@ const app = express() as unknown as expressWs.Application;
 expressWs(app);
 
 app.use(express.json());
+app.use((_req, res, next) => {
+  res.header("x-robots-tag", "noindex");
+  res.header("access-control-allow-headers", "*");
+  res.header("access-control-allow-origin", "*");
+  res.header("access-control-allow-methods", "*");
+  res.header("access-control-expose-headers", "*");
+  next();
+});
 
 
 admin.initializeApp({