From e5e436f3252de21acf8260efdc9775d4a32748e7 Mon Sep 17 00:00:00 2001
From: Scott Murray <scott@murray.kiwi>
Date: Fri, 12 Jan 2024 11:53:56 +1300
Subject: [PATCH] add and display satellite types

---
 src/components/SatelliteMap.tsx   |  1 +
 src/components/SatellitePopup.tsx | 17 ++++++++++++--
 src/lib/satellite-client.ts       | 38 ++++++++++++++++++++-----------
 3 files changed, 41 insertions(+), 15 deletions(-)

diff --git a/src/components/SatelliteMap.tsx b/src/components/SatelliteMap.tsx
index 222ed88..07bf6b2 100644
--- a/src/components/SatelliteMap.tsx
+++ b/src/components/SatelliteMap.tsx
@@ -57,6 +57,7 @@ const SatelliteMap: React.FC = () => {
             longitude={satellite.longitude}
             altitude={satellite.altitude}
             birthday={satellite.age}
+            type={satellite.type}
           >
             <Satellite
               rotation={rotation}
diff --git a/src/components/SatellitePopup.tsx b/src/components/SatellitePopup.tsx
index beaeaf2..6d45f36 100644
--- a/src/components/SatellitePopup.tsx
+++ b/src/components/SatellitePopup.tsx
@@ -8,6 +8,8 @@ import {
   DrawerTitle,
   DrawerTrigger,
 } from "../shadcn/ui/drawer";
+import { SatelliteType } from "../lib/satellite-client";
+import { read } from "fs";
 
 type SatellitePopupProps = {
   name: string;
@@ -15,6 +17,7 @@ type SatellitePopupProps = {
   longitude: number;
   altitude: number;
   birthday: Date;
+  type: SatelliteType;
   children: React.ReactNode;
 };
 
@@ -24,9 +27,19 @@ const SatellitePopup: React.FC<SatellitePopupProps> = ({
   longitude,
   altitude,
   birthday,
+  type,
   children,
 }) => {
   const age = calculateAge(birthday);
+  let readableType = "";
+  switch (type) {
+    case SatelliteType.WeatherStation:
+      readableType = "Weather Station";
+      break;
+    default:
+      readableType = type[0].toUpperCase() + type.slice(1);
+  }
+
   return (
     <Drawer>
       <DrawerTrigger>{children}</DrawerTrigger>
@@ -37,8 +50,8 @@ const SatellitePopup: React.FC<SatellitePopupProps> = ({
           </DrawerHeader>
           <div className="table">
             <div className="table-row mx-auto my-auto">
-              <div className="table-cell w-1/2 align-top pt-5">
-                <DrawerDescription>Type: Weather Station</DrawerDescription>
+              <div className="table-cell w-1/2 align-top pt-5 text-center">
+                <DrawerDescription>Type: {readableType}</DrawerDescription>
                 <DrawerDescription>Latitude: {latitude}</DrawerDescription>
                 <DrawerDescription>Longitude: {longitude}</DrawerDescription>
                 <DrawerDescription>Altitude: {altitude}km</DrawerDescription>
diff --git a/src/lib/satellite-client.ts b/src/lib/satellite-client.ts
index ae53b2f..e6de580 100644
--- a/src/lib/satellite-client.ts
+++ b/src/lib/satellite-client.ts
@@ -4,8 +4,19 @@ export type SatelliteInfo = {
   longitude: number;
   age: Date;
   altitude: number;
+  type: SatelliteType;
 };
 
+export enum SatelliteType {
+  WeatherStation = "weatherstation",
+  ISS = "iss",
+  Iridium = "iridium",
+  Starlink = "starlink",
+  TV = "tv",
+  Brightest = "brightest",
+  Celestis = "celestis",
+}
+
 export class SatelliteClient {
   baseUrl: string;
 
@@ -13,11 +24,11 @@ export class SatelliteClient {
     this.baseUrl = baseUrl;
   }
 
-  private async fetchSatellites(endpoint: string): Promise<SatelliteInfo[]> {
+  private async fetchSatellites(type: string): Promise<SatelliteInfo[]> {
     try {
-      const response = await fetch(`${this.baseUrl}/${endpoint}`);
+      const response = await fetch(`${this.baseUrl}/${type}`);
       if (!response.ok) {
-        throw new Error(`Error fetching ${endpoint}: ${response.statusText}`);
+        throw new Error(`Error fetching ${type}: ${response.statusText}`);
       }
       const satellites = await response.json();
       const typedResponse: SatelliteInfo[] = [];
@@ -28,27 +39,28 @@ export class SatelliteClient {
           longitude: s.longitude,
           age: new Date(s.age),
           altitude: s.altitude,
+          type: type as SatelliteType,
         });
       });
 
       return typedResponse;
     } catch (error) {
-      console.error(`Error fetching ${endpoint}:`, error);
+      console.error(`Error fetching ${type}:`, error);
       return [];
     }
   }
 
   async getSatellites(): Promise<SatelliteInfo[]> {
-    const endpoints = [
-      "weatherstations",
-      "iss",
-      "iridiums",
-      "starlinks",
-      "tv",
-      "brightest",
-      "celestis",
+    const types = [
+      SatelliteType.WeatherStation,
+      SatelliteType.ISS,
+      SatelliteType.Iridium,
+      SatelliteType.Starlink,
+      SatelliteType.TV,
+      SatelliteType.Brightest,
+      SatelliteType.Celestis,
     ];
-    const promises = endpoints.map((endpoint) =>
+    const promises = types.map((endpoint) =>
       this.fetchSatellites(endpoint),
     );
     const results = await Promise.all(promises);