🍸🐼 ↝ [SSP-47]: Planet Ids from PH classifications now showing in P4/A…

…I4M projects
Signal-K · Jan 9, 2025 · d310b01 · d310b01
1 parent 29bfb4d
commit d310b01
Show file tree

Hide file tree

Showing 6 changed files with 120 additions and 70 deletions.
diff --git a/app/tests/page.tsx b/app/tests/page.tsx
@@ -1,11 +1,13 @@
 "use client";
 
+import PlanetFour from "@/components/Structures/Missions/Astronomers/SatellitePhotos/P4/PlanetFour";
 import React, { useState } from "react";
 
 export default function TestPage() {
     return (
         // <StarnetLayout>
           <>
+            <PlanetFour />
           </>
         // {/* </StarnetLayout> */}
     );

diff --git a/components/Projects/Auto/AI4Mars.tsx b/components/Projects/Auto/AI4Mars.tsx
@@ -6,6 +6,7 @@ import { useActivePlanet } from "@/context/ActivePlanet";
 import ClassificationForm from "../(classifications)/PostForm";
 import { Anomaly } from "../Zoodex/ClassifyOthersAnimals";
 import ImageAnnotator from "../(classifications)/Annotating/Annotator";
+import PreferredTerrestrialClassifications from "@/components/Structures/Missions/PickPlanet";
 
 interface Props {
     anomalyid: number | bigint;
@@ -139,12 +140,18 @@ export function StarterAiForMars({ anomalyid }: Props) {
                         </div>
                     </>
                 )}
-            </div>
+            </div> 
         </div>
     );
 };
 
-export function AiForMarsProject() {
+interface SelectedAnomProps {
+    anomalyid?: number;
+}; 
+
+export function AiForMarsProject({
+    anomalyid
+}: SelectedAnomProps) {
     const supabase = useSupabaseClient();
     const session = useSession();
     const { activePlanet } = useActivePlanet();
@@ -183,33 +190,60 @@ export function AiForMarsProject() {
         checkTutorialMission();
     }, [session, supabase]);
 
+    const fetchAnomaly = async () => {
+        if (!session) {
+            setLoading(false);
+            return;
+        };
+
+        try {
+            const { data: anomalyData, error: anomalyError } = await supabase
+                .from("anomalies")
+                .select("*")
+                .eq("anomalySet", "automaton-aiForMars");
+
+            if (anomalyError) throw anomalyError;
+
+            const randomAnomaly = anomalyData[Math.floor(Math.random() * anomalyData.length)] as Anomaly;
+            setAnomaly(randomAnomaly);
+            setImageUrl(
+                `${process.env.NEXT_PUBLIC_SUPABASE_URL}/storage/v1/object/public/telescope/automaton-aiForMars/${randomAnomaly.id}.jpeg`
+            );
+        } catch (error: any) {
+            console.error("Error fetching anomaly", error.message);
+            setAnomaly(null);
+        } finally {
+            setLoading(false);
+        };
+    };
+
     useEffect(() => {
-        async function fetchAnomaly() {
-            if (!session) {
-                setLoading(false);
-                return;
-            }
+        // async function fetchAnomaly() {
+        //     if (!session) {
+        //         setLoading(false);
+        //         return;
+        //     };
 
-            try {
-                const { data: anomalyData, error: anomalyError } = await supabase
-                    .from("anomalies")
-                    .select("*")
-                    .eq("anomalySet", "automaton-aiForMars");
-
-                if (anomalyError) throw anomalyError;
-
-                const randomAnomaly = anomalyData[Math.floor(Math.random() * anomalyData.length)] as Anomaly;
-                setAnomaly(randomAnomaly);
-                setImageUrl(
-                    `${process.env.NEXT_PUBLIC_SUPABASE_URL}/storage/v1/object/public/telescope/automaton-aiForMars/${randomAnomaly.id}.jpeg`
-                );
-            } catch (error: any) {
-                console.error("Error fetching anomaly", error.message);
-                setAnomaly(null);
-            } finally {
-                setLoading(false);
-            }
-        }
+        //     try {
+        //         const { data: anomalyData, error: anomalyError } = await supabase
+        //             .from("anomalies")
+        //             .select("*")
+        //             .eq("anomalySet", "automaton-aiForMars");
+
+        //         if (anomalyError) throw anomalyError;
+
+        //         const randomAnomaly = anomalyData[Math.floor(Math.random() * anomalyData.length)] as Anomaly;
+        //         setAnomaly(randomAnomaly);
+        //         setImageUrl(
+        //             `${process.env.NEXT_PUBLIC_SUPABASE_URL}/storage/v1/object/public/telescope/automaton-aiForMars/${randomAnomaly.id}.jpeg`
+        //         );
+        //     } catch (error: any) {
+        //         console.error("Error fetching anomaly", error.message);
+        //         setAnomaly(null);
+        //     } finally {
+        //         setLoading(false);
+        //     }
+        // }
 
         fetchAnomaly();
     }, [session, supabase]);
@@ -254,6 +288,7 @@ export function AiForMarsProject() {
                             /> */}
                         </>
                     )}
+                    <p>Selected Anomaly ID: {anomalyid}</p>
                     <button
                         onClick={startTutorial}
                         className="mt-4 px-4 py-2 bg-[#85DDA2] text-[#2C3A4A] rounded-md shadow-md"
@@ -264,4 +299,17 @@ export function AiForMarsProject() {
             )}
         </div>
     );
+};
+
+export function AI4MWrapper() {
+    const [selectedAnomaly, setSelectedAnomaly] = useState<number | null>(null);
+
+    return (
+        <div className="space-y-8">
+            <PreferredTerrestrialClassifications onSelectAnomaly={setSelectedAnomaly} />
+            {selectedAnomaly && 
+                <AiForMarsProject anomalyid={selectedAnomaly}
+            />}
+        </div>
+    );
 };
diff --git a/components/Projects/Satellite/PlanetFour.tsx b/components/Projects/Satellite/PlanetFour.tsx
@@ -157,43 +157,43 @@ export function PlanetFourProject({ anomalyid }: SelectedAnomProps) {
     const handleShowTutorial = () => {
         setShowTutorial(true);
     };
-    
-    useEffect(() => {
-        const fetchAnomaly = async () => {
-            if (!hasMission20000005 || !session) return;
-
-            try {
-                const { data: anomalyData, error: anomalyError } = await supabase
-                    .from('anomalies')
-                    .select('*')
-                    .eq('anomalySet', 'satellite-planetFour');
-
-                if (anomalyError) throw anomalyError;
-    
-                const randomAnomaly = anomalyData[Math.floor(Math.random() * anomalyData.length)] as Anomaly;
-                setAnomaly(randomAnomaly);
-                setImageUrl(`${supabaseUrl}/storage/v1/object/public/telescope/satellite-planetFour/${randomAnomaly.id}.jpeg`);
-            } catch (error: any) {
-                console.error("Error fetching anomaly", error.message);
-                setAnomaly(null);
-            } finally {
-                setLoading(false); 
-            }
+
+    const fetchAnomaly = async () => {
+        if (!anomalyid || !session) return; 
+
+        setLoading(true); 
+
+        try {
+            const { data: anomalyData, error: anomalyError } = await supabase
+                .from('anomalies')
+                .select('*')
+                .eq('id', anomalyid)  
+                .single();  
+
+            if (anomalyError) throw anomalyError;
+
+            setAnomaly(anomalyData);
+            setImageUrl(`${supabaseUrl}/storage/v1/object/public/telescope/satellite-planetFour/${anomalyData.id}.jpeg`);
+        } catch (error: any) {
+            console.error("Error fetching anomaly", error.message);
+            setAnomaly(null);
+        } finally {
+            setLoading(false); 
         };
-
-        if (hasMission20000005 && session) {
-            fetchAnomaly();
-        }
-    }, [session, supabase, supabaseUrl, hasMission20000005]);
-    
+    };
+
+    useEffect(() => {
+        fetchAnomaly();
+    }, [anomalyid, session, supabase, supabaseUrl]);
+
     if (loading) {
         return <div><p>Loading...</p></div>;
     };
-    
+
     if (!anomaly) {
-        return <div><p>No anomaly found.</p></div>;
+        return <div><p>No anomaly found with ID {anomalyid}</p></div>;
     };
-    
+
     return (
         <div className="flex flex-col items-start gap-4 pb-4 relative w-full max-w-lg overflow-y-auto max-h-[90vh] rounded-lg">
             {!showTutorial ? (
@@ -206,7 +206,7 @@ export function PlanetFourProject({ anomalyid }: SelectedAnomProps) {
                     </Button>
                     {imageUrl && (
                         <ImageAnnotator
-                            anomalyId={anomaly?.id.toString() || ""}
+                            anomalyId={anomaly.id.toString()}
                             anomalyType="satellite-planetFour"
                             missionNumber={200000052}
                             assetMentioned={imageUrl}
@@ -218,10 +218,10 @@ export function PlanetFourProject({ anomalyid }: SelectedAnomProps) {
                 </>
             ) : (
                 <div>
-                    <StarterPlanetFour anomalyid={anomaly?.id} />
+                    <StarterPlanetFour anomalyid={anomaly.id} />
                 </div>
             )}
-            {anomalyid && <p>Selected Anomaly: {anomalyid}</p>}
+            <p>Selected Anomaly ID: {anomalyid}</p>
         </div>
     );
 };    

diff --git a/components/Structures/Missions/Astronomers/SatellitePhotos/AI4M/AIForMars.tsx b/components/Structures/Missions/Astronomers/SatellitePhotos/AI4M/AIForMars.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import { useSupabaseClient, useSession } from "@supabase/auth-helpers-react";
 import MissionShell from "../../../BasePlate";
 import { CloudCogIcon, FolderCog, PaintBucket, Vote } from "lucide-react";
-import { AiForMarsProject } from "@/components/Projects/Auto/AI4Mars";
+import { AI4MWrapper, AiForMarsProject } from "@/components/Projects/Auto/AI4Mars";
 import VoteAI4MClassifications from "./AI4MVote";
 
 interface Mission {
@@ -40,7 +40,7 @@ const AI4M = () => {
                 icon: CloudCogIcon,
                 points: 2,
                 completedCount: 0,
-                internalComponent: () => <AiForMarsProject />,
+                internalComponent: () => <AI4MWrapper />,
                 color: "text-blue-500",
             },
             {

diff --git a/components/Structures/Missions/Astronomers/SatellitePhotos/P4/PlanetFour.tsx b/components/Structures/Missions/Astronomers/SatellitePhotos/P4/PlanetFour.tsx
@@ -19,7 +19,7 @@ interface Mission {
 
 interface MissionPoints {
     [key: number]: number;
-};
+}; 
 
 const PlanetFour = () => {
     const supabase = useSupabaseClient();

diff --git a/components/Structures/Missions/PickPlanet.tsx b/components/Structures/Missions/PickPlanet.tsx
@@ -18,7 +18,7 @@ interface Classification {
 
 interface PreferredTerrestrialClassificationsProps {
     onSelectAnomaly: (anomalyId: number | null) => void;
-  }
+  };
 
   export default function PreferredTerrestrialClassifications({
     onSelectAnomaly,
@@ -46,7 +46,7 @@ interface PreferredTerrestrialClassificationsProps {
         if (classificationIds.length === 0) {
           setClassifications([]);
           return;
-        }
+        };
 
         const { data: classificationsData, error: classificationsError } = await supabase
           .from("classifications")
@@ -62,8 +62,8 @@ interface PreferredTerrestrialClassificationsProps {
               images = classification.media.filter((url: any) => typeof url === "string");
             } else if (typeof classification.media === "object" && classification.media.uploadUrl) {
               images.push(classification.media.uploadUrl);
-            }
-          }
+            };
+          };
           return { ...classification, images };
         });
 
@@ -72,7 +72,7 @@ interface PreferredTerrestrialClassificationsProps {
         setError("An unexpected error occurred.");
       } finally {
         setLoading(false);
-      }
+      };
     };
 
     useEffect(() => {
@@ -98,7 +98,7 @@ interface PreferredTerrestrialClassificationsProps {
                 votes={0}
                 category="Terrestrial"
                 tags={["Preferred", "Planet"]}
-                images={classification.images || []}
+                images={classification.media || []}
                 anomalyId={classification.anomaly?.toString() || "N/A"}
                 classificationType="planet"
                 classificationConfig={classification.classificationConfiguration}