🍡🪨 ↝ [GP-43]: Create some snippets and adjust components for pulling …

…data based on active anomaly
Signal-K · Jun 28, 2024 · 61bff5c · 61bff5c
1 parent d5faf11
commit 61bff5c
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 3 deletions.
diff --git a/Classifications/ClassificationForm.tsx b/Classifications/ClassificationForm.tsx
@@ -416,6 +416,13 @@ export function CreateFirstBaseClassification(assetMentioned: any) { // FIRST MI
                 className="grow p-3 h-24 rounded-xl" 
                 placeholder={"What do you think about this anomaly/planet"} 
             />
+                     <label className="flex gap-1 items-center cursor-pointer">
+    <input type="file" className="hidden" onChange={addMedia} />
+    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth={1.5} stroke="currentColor" className="w-6 h-6">
+        <path strokeLinecap="round" strokeLinejoin="round" d="M18.375 12.739l-7.693 7.693a4.5 4.5 0 01-6.364-6.364l10.94-10.94A3 3 0 1119.5 7.372L8.552 18.32m.009-.01l-.01.01m5.699-9.941l-7.81 7.81a1.5 1.5 0 002.112 2.13" />
+    </svg>
+      <span className="hidden md:block">Media</span>
+      </label>
             {isUploading && (
                 <div className="text-center">
                     <p>Uploading...</p>

diff --git a/components/Gameplay/Inventory/Structures/Telescopes/Telescopes.tsx b/components/Gameplay/Inventory/Structures/Telescopes/Telescopes.tsx
@@ -225,7 +225,7 @@ export const TransitingTelescopeStructureModal: React.FC<TransitingTelescopeStru
 
     if (!isOpen) return null;
     const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
-    const imageUrl = `${supabaseUrl}/storage/v1/object/public/citiAnomalies/${activePlanet?.id}/ActivePlanet.png`;
+    const imageUrl = `${supabaseUrl}/storage/v1/object/public/anomalies/${activePlanet?.id}/phased.png`;
 
     return (
         <div className="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-50">
@@ -238,7 +238,7 @@ export const TransitingTelescopeStructureModal: React.FC<TransitingTelescopeStru
             </div>
             <div className="flex flex-col items-center mt-4">
               <img src={structure.icon_url} alt={structure.name} className="w-32 h-32 mb-2" />
-              <img src="http://127.0.0.1:54321/storage/v1/object/sign/avatars/download.png?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJhdmF0YXJzL2Rvd25sb2FkLnBuZyIsImlhdCI6MTcxODkyNzMzOCwiZXhwIjoxNzE5NTMyMTM4fQ.9PvBRH7829oTleom8vHIUJ5g7u1lPjY74QEkvNrW0TM&t=2024-06-20T23%3A48%3A58.462Z" className="w-32 h-32 mb-2" />
+              {/* <img src="http://127.0.0.1:54321/storage/v1/object/sign/avatars/download.png?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJhdmF0YXJzL2Rvd25sb2FkLnBuZyIsImlhdCI6MTcxODkyNzMzOCwiZXhwIjoxNzE5NTMyMTM4fQ.9PvBRH7829oTleom8vHIUJ5g7u1lPjY74QEkvNrW0TM&t=2024-06-20T23%3A48%3A58.462Z" className="w-32 h-32 mb-2" /> */}
               <p>ID: {ownedItem.id}</p>
               <p>{ownedItem.notes}</p>
               <p>Description: {structure.description}</p>

diff --git a/components/Gameplay/Inventory/Structures/Telescopes/Terrestrial.tsx b/components/Gameplay/Inventory/Structures/Telescopes/Terrestrial.tsx
@@ -34,13 +34,52 @@ interface MeteorologyToolModalProps {
 };
 
 export const MeteorologyToolModal: React.FC<MeteorologyToolModalProps> = ({ isOpen, onClose, ownedItem, structure }) => {
+    const supabase = useSupabaseClient();
+
     const { activePlanet } = useActivePlanet();
     const [isActionDone, setIsActionDone] = useState(false);
 
     if (!isOpen) return null;
 
     const supabaseUrl = process.env.NEXT_PUBLIC_SUPABASE_URL;
-    const imageUrl = "http://127.0.0.1:54321/storage/v1/object/sign/avatars/1.png?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1cmwiOiJhdmF0YXJzLzEucG5nIiwiaWF0IjoxNzE5MDc3Mjk3LCJleHAiOjE3MTk2ODIwOTd9.xvqjHtq2BwXJNIFWGwWoYuHx7nHMm2B7qBo98imSyDQ&t=2024-06-22T17%3A28%3A17.058Z";
+    const [imageUrl, setImageUrl] = useState<string | null>(null);
+
+    useEffect(() => {
+      if (isOpen && activePlanet?.id) {
+          const fetchRandomImage = async () => {
+              try {
+                  const { data, error } = await supabase.storage
+                      .from('anomalies')
+                      .list(`${activePlanet.id}/clouds`, {
+                          limit: 100,
+                      });
+
+                  if (error) {
+                      console.error('Error fetching image list:', error);
+                      return;
+                  }
+
+                  if (data && data.length > 0) {
+                      const randomFile = data[Math.floor(Math.random() * data.length)];
+                      const { data: publicUrlData, error: publicUrlError } = supabase.storage
+                          .from('anomalies')
+                          .getPublicUrl(`${activePlanet.id}/clouds/${randomFile.name}`);
+
+                      if (publicUrlError) {
+                          console.error('Error getting public URL:', publicUrlError);
+                          return;
+                      }
+
+                      setImageUrl(publicUrlData.publicUrl);
+                  }
+              } catch (error) {
+                  console.error('Error fetching random image:', error);
+              }
+          };
+
+          fetchRandomImage();
+      }
+  }, [isOpen, activePlanet?.id]);
     //   const imageUrl = `${supabaseUrl}/storage/v1/object/public/citiCloud/${activePlanet?.id}/cloud.png`;
     //   const imageUrl = `${supabaseUrl}/storage/v1/object/public/citiAnomalies/${activePlanet?.id}/cloud.png`;