Skip to content

Commit 3718f1b

Browse files
GizmotronnGizmotronn
committed
🕙🌔 ↝ Some UI changes, then integrating new microservices
1 parent 0b88920 commit 3718f1b

File tree

7 files changed

+207
-158
lines changed

7 files changed

+207
-158
lines changed

‎components/Content/Inventory/ArchivedInventory.tsx ‎components/Content/Archive/ArchivedInventory.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import React from "react";
22
import { useSession, useSupabaseClient } from "@supabase/auth-helpers-react";
33
import Layout from "../../Section/Layout";
4-
import OwnedPlanetsList from "../Archive/UserOwnedPlanets"; // Potentially this should be in a lists component dir
5-
import OwnedItemsList from "./UserOwnedItems";
6-
import MySpaceships from "./Vehicles/MySpaceships";
4+
import OwnedPlanetsList from "./UserOwnedPlanets"; // Potentially this should be in a lists component dir
5+
import OwnedItemsList from "../Inventory/UserOwnedItems";
6+
import MySpaceships from "../Inventory/Vehicles/MySpaceships";
77

88
export default function V1Inventory() { // Inventory items for v1 of public schema, see notes below
99
const supabase = useSupabaseClient();

‎components/Content/Planets/Activities/SectorSetup.tsx

+153-104
Original file line numberDiff line numberDiff line change
@@ -4,127 +4,176 @@ import React, { useEffect, useState } from "react";
44

55
export default function CreateBasePlanetSector() {
66
const supabase = useSupabaseClient();
7-
const session = useSession();
7+
const session = useSession();
88

9-
const [userPlanet, setUserPlanet] = useState(null);
9+
const [userPlanet, setUserPlanet] = useState(null);
1010

11-
// Get the planet that the user owns
11+
// Get the planet that the user owns
12+
useEffect(() => {
1213
const fetchUserPlanet = async () => {
13-
if (!session) {
14-
return;
15-
};
14+
if (!session) return;
1615

17-
try {
18-
const { data, error } = await supabase
19-
.from('profiles')
20-
.select('*')
21-
.eq('id', session?.user?.id)
22-
.single();
16+
try {
17+
const { data, error } = await supabase
18+
.from('profiles')
19+
.select('*')
20+
.eq('id', session?.user?.id)
21+
.single();
2322

24-
if (data) {
25-
setUserPlanet(data.location);
26-
};
23+
if (data) {
24+
setUserPlanet(data.location);
25+
}
2726

28-
if (error) {
29-
throw error;
30-
};
31-
} catch (error: any) {
32-
console.error(error.message);
33-
};
27+
if (error) {
28+
throw error;
29+
}
30+
} catch (error) {
31+
console.error(error.message);
32+
}
3433
};
3534

3635
fetchUserPlanet();
37-
38-
const createSector = async () => {
39-
if (session) {
40-
fetchUserPlanet();
41-
42-
// Map resource names to corresponding inventoryITEMS ids
43-
const resourceToIdMap = {
44-
"Silicates": 13,
45-
"Alloy": 12,
46-
"Iron": 11,
47-
"Fuel": 10,
48-
"Water": 9,
49-
"Coal": 11,
50-
};
51-
52-
// Choose between Silicates and Coal for testing
53-
const depositResource = Math.random() < 0.5 ? "Silicates" : "Coal";
54-
55-
// Get the corresponding id from the map
56-
const depositRowId = resourceToIdMap[depositResource];
57-
58-
const response = await supabase.from('basePlanetSectors').upsert([
59-
{
60-
anomaly: userPlanet,
61-
owner: session?.user?.id,
62-
deposit: depositRowId, // Use the id instead of the resource name
63-
coverUrl: "https://mars.nasa.gov/mars2020-raw-images/pub/ods/surface/sol/00090/ids/edr/browse/edl/EBE_0090_0674952393_193ECM_N0040048EDLC00090_0030LUJ01_1200.jpg",
64-
explored: false,
65-
},
66-
]);
67-
68-
if (response.error) {
69-
console.error(response.error);
70-
} else {
71-
// Handle success
72-
}
73-
}
74-
};
75-
76-
return (
77-
<div>
78-
<pre>{userPlanet}</pre>
79-
<button onClick={createSector}>Create sector</button>
80-
</div>
81-
);
36+
}, [session, supabase]);
37+
38+
const createSector = async () => {
39+
if (session) {
40+
// Map resource names to corresponding inventoryITEMS ids
41+
const resourceToIdMap = {
42+
"Silicates": 13,
43+
"Alloy": 12,
44+
"Iron": 11,
45+
"Fuel": 10,
46+
"Water": 9,
47+
"Coal": 11,
48+
};
49+
50+
// Choose between Silicates and Coal for testing
51+
const depositResource = Math.random() < 0.5 ? "Silicates" : "Coal";
52+
53+
// Get the corresponding id from the map
54+
const depositRowId = resourceToIdMap[depositResource];
55+
56+
const response = await supabase.from('basePlanetSectors').upsert([
57+
{
58+
anomaly: userPlanet,
59+
owner: session?.user?.id,
60+
deposit: depositRowId, // Use the id instead of the resource name
61+
coverUrl: "https://mars.nasa.gov/mars2020-raw-images/pub/ods/surface/sol/00090/ids/edr/browse/edl/EBE_0090_0674952393_193ECM_N0040048EDLC00090_0030LUJ01_1200.jpg",
62+
explored: false,
63+
},
64+
]);
65+
66+
if (response.error) {
67+
console.error(response.error);
68+
} else {
69+
// Handle success
70+
}
71+
}
72+
};
73+
74+
return (
75+
<div className="mt-4">
76+
<button
77+
onClick={createSector}
78+
className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
79+
>
80+
Create Sector
81+
</button>
82+
</div>
83+
);
8284
};
8385

8486
export function UserOwnedSectorGrid() {
8587
const supabase = useSupabaseClient();
8688
const session = useSession();
87-
89+
8890
const [sectorData, setSectorData] = useState([]);
89-
91+
9092
useEffect(() => {
91-
const fetchUserSectorImages = async () => {
92-
if (session) {
93-
try {
94-
const { data, error } = await supabase
95-
.from("basePlanetSectors")
96-
.select('id, coverUrl')
97-
.eq('owner', session?.user?.id);
98-
99-
if (data) {
100-
setSectorData(data);
101-
};
102-
103-
if (error) {
104-
throw error;
105-
};
106-
} catch (error) {
107-
console.error(error.message);
108-
};
109-
};
110-
};
111-
112-
fetchUserSectorImages();
93+
const fetchUserSectorImages = async () => {
94+
if (session) {
95+
try {
96+
const { data, error } = await supabase
97+
.from("basePlanetSectors")
98+
.select('id, coverUrl')
99+
.eq('owner', session?.user?.id);
100+
101+
if (data) {
102+
setSectorData(data);
103+
}
104+
105+
if (error) {
106+
throw error;
107+
}
108+
} catch (error) {
109+
console.error(error.message);
110+
}
111+
}
112+
};
113+
114+
fetchUserSectorImages();
113115
}, [session, supabase]);
114-
116+
115117
return (
116-
<div className="grid grid-cols-4 gap-2 p-4">
117-
{sectorData.map((item) => (
118-
<Link href={`/planets/sector/${item.id}`}><div
119-
key={item.id}
120-
className="relative overflow-hidden bg-center bg-cover"
121-
style={{
122-
backgroundImage: `url(${item.coverUrl})`,
123-
paddingBottom: '100%',
124-
// backgroundPosition: `-${(index % 4) * 25}% -${Math.floor(index / 4) * 25}%`,
125-
}}
126-
></div></Link>
127-
))}
128-
</div>
118+
<div className="grid grid-cols-4 gap-4">
119+
{sectorData.map((item) => (
120+
<Link legacyBehavior key={item.id} href={`/planets/sector/${item.id}`} passHref>
121+
<a className="block aspect-w-3 aspect-h-2 bg-gray-200 hover:bg-gray-300">
122+
<img
123+
src={item.coverUrl}
124+
alt="Sector"
125+
className="object-cover w-full h-full"
126+
/>
127+
</a>
128+
</Link>
129+
))}
130+
</div>
129131
);
132+
};
133+
134+
export function AllSectors() {
135+
const supabase = useSupabaseClient();
136+
const session = useSession();
137+
138+
const [sectorData, setSectorData] = useState([]);
139+
140+
useEffect(() => {
141+
const fetchSectorContent = async () => {
142+
if (session) {
143+
try {
144+
const { data, error } = await supabase
145+
.from("basePlanetSectors")
146+
.select('id, coverUrl');
147+
148+
if (data) {
149+
setSectorData(data);
150+
}
151+
152+
if (error) {
153+
throw error;
154+
}
155+
} catch (error) {
156+
console.error(error.message);
157+
}
158+
}
159+
};
160+
161+
fetchSectorContent();
162+
}, [session, supabase]);
163+
164+
return (
165+
<div className="grid grid-cols-4 gap-4">
166+
{sectorData.map((item) => (
167+
<Link legacyBehavior key={item.id} href={`/planets/sector/${item.id}`} passHref>
168+
<a className="block aspect-w-3 aspect-h-2 bg-gray-200 hover:bg-gray-300">
169+
<img
170+
src={item.coverUrl}
171+
alt="Sector"
172+
className="object-cover w-full h-full"
173+
/>
174+
</a>
175+
</Link>
176+
))}
177+
</div>
178+
);
130179
};

‎components/Content/Planets/Activities/StructureCreate.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ interface Structure {
55
id: number;
66
name: string;
77
description: string;
8-
icon_url: string;
8+
icon_url: string;
99
};
1010

1111
interface StructureSelectionProps {

‎components/Content/Planets/Base/BasePlanetAllSectors.tsx

+42-42
Original file line numberDiff line numberDiff line change
@@ -80,46 +80,46 @@ export default function BasePlanetSectors({ planetId }: { planetId: string }) {
8080
);
8181
}
8282

83-
return (
84-
<>
85-
<Card noPadding={false}>
86-
<div
87-
className="flex-col justify-center mt-[-80px] bg-cover bg-center rounded-15"
88-
style={{
89-
backgroundImage:
90-
'url("https://images.unsplash.com/photo-1578309756042-b445687e326c?q=80&w=2980&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D")',
91-
}}
92-
>
93-
<div className="h-[80vh] flex flex-col items-center justify-center relative">
94-
<h1 className="text-center text-slate-300 text-opacity-100 font-['Inter'] tracking-[3.48px] mt-[-50px] mb-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-5xl lg:text-6xl dark:text-white text-gray-400">
95-
Test
96-
</h1>
97-
<div className="w-full flex items-center justify-center">
98-
</div>
99-
<div className="flex items-start gap-8 mt-20">
100-
<div className="flex flex-col items-center justify-start gap-4">
101-
<div className="text-center text-slate-300 text-opacity-70 text-[21.73px] font-medium font-['Inter'] tracking-[3.48px]">
102-
Planet {planetId} sector list
103-
</div>
104-
</div>
105-
</div>
106-
</div>
107-
{/* {deposit && typeof deposit === "string" ? (
108-
<div>{deposit}</div>
109-
) : (
110-
<div>{JSON.stringify(deposit)}</div>
111-
)} */}
112-
</div>
113-
</Card>
114-
<div>
115-
<Card noPadding={false}>
116-
{Object.keys(sectorsData).map((key) => (
117-
<div key={key}>
118-
<strong>{key}:</strong> {JSON.stringify(sectorsData[key])}
119-
</div>
120-
))}
121-
</Card>
122-
</div>
123-
</>
124-
);
83+
return (
84+
<>
85+
<Card noPadding={false}>
86+
<div
87+
className="flex-col justify-center mt-[-80px] bg-cover bg-center rounded-15"
88+
style={{
89+
backgroundImage:
90+
'url("https://images.unsplash.com/photo-1578309756042-b445687e326c?q=80&w=2980&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D")',
91+
}}
92+
>
93+
<div className="h-[80vh] flex flex-col items-center justify-center relative">
94+
<h1 className="text-center text-slate-300 text-opacity-100 font-['Inter'] tracking-[3.48px] mt-[-50px] mb-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-5xl lg:text-6xl dark:text-white text-gray-400">
95+
Test
96+
</h1>
97+
<div className="w-full flex items-center justify-center">
98+
</div>
99+
<div className="flex items-start gap-8 mt-20">
100+
<div className="flex flex-col items-center justify-start gap-4">
101+
<div className="text-center text-slate-300 text-opacity-70 text-[21.73px] font-medium font-['Inter'] tracking-[3.48px]">
102+
Planet {planetId} sector list
103+
</div>
104+
</div>
105+
</div>
106+
</div>
107+
{/* {deposit && typeof deposit === "string" ? (
108+
<div>{deposit}</div>
109+
) : (
110+
<div>{JSON.stringify(deposit)}</div>
111+
)} */}
112+
</div>
113+
</Card>
114+
<div>
115+
<Card noPadding={false}>
116+
{Object.keys(sectorsData).map((key) => (
117+
<div key={key}>
118+
<strong>{key}:</strong> {JSON.stringify(sectorsData[key])}
119+
</div>
120+
))}
121+
</Card>
122+
</div>
123+
</>
124+
);
125125
};

‎components/Content/Planets/Base/IndividualBasePlanetSector.tsx ‎components/Content/Planets/Base/BasePlanetSector.tsx

File renamed without changes.

0 commit comments

Comments
 (0)