OpenCode/SpaceWanderer
2
0
Fork 0
Code Issues Pull Requests Actions Activity

ui: LOCAL SYSTEM list staggers moons under their parent planet (v0.2.2)
CI / build + unit + e2e (pull_request) Successful in 2m42s
Details

Browse Source
This commit is contained in:
kamilkrzywda
2026-09-28 21:03:14 +00:00
parent 0573e6d719
commit 7f48fd0e5e
3 changed files with 34 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/mission-control.tsx
+30 -17
View File
@@ -72,11 +72,16 @@ const worldMapEdges: NodeGraphEdge[] = [
// LOCAL SYSTEM — explorable worlds of the current system (regenerated per save after each jump, later).
const explorablePlanets = [
{ name: 'AURELLE', type: 'TERRESTRIAL // OCEAN CONTINENTS', state: 'UNEXPLORED' as const },
{ name: 'BRIMSTONE', type: 'GAS GIANT // CLOUD DECKS', state: 'SCANNED' as const },
{ name: 'ASHFALL (MOON)', type: 'VOLCANIC MOON // SULFUR VEINS', state: 'UNEXPLORED' as const },
{ name: 'CINDERROCK', type: 'ROCKY // IRON RICH', state: 'UNEXPLORED' as const },
{ name: 'DRIFTBAND', type: 'ASTEROID FIELD // HAZARD', state: 'HAZARD' as const },
{
name: 'AURELLE', type: 'TERRESTRIAL // OCEAN CONTINENTS', state: 'UNEXPLORED' as const,
moons: [{ name: 'PALEMOON', type: 'ICE MOON // FROST PLAINS', state: 'UNEXPLORED' as const }],
},
{
name: 'BRIMSTONE', type: 'GAS GIANT // CLOUD DECKS', state: 'SCANNED' as const,
moons: [{ name: 'ASHFALL', type: 'VOLCANIC MOON // SULFUR VEINS', state: 'UNEXPLORED' as const }],
},
{ name: 'CINDERROCK', type: 'ROCKY // IRON RICH', state: 'UNEXPLORED' as const, moons: [] },
{ name: 'DRIFTBAND', type: 'ASTEROID FIELD // HAZARD', state: 'HAZARD' as const, moons: [] },
]
const crew = [
@@ -389,31 +394,39 @@ export function MissionControl() {
>
EXPLORABLE WORLDS // FIND THINGS HERE (PLACEHOLDER)
</div>
{explorablePlanets.map((planet, i) => (
{explorablePlanets.flatMap((planet) => [
{ name: planet.name, type: planet.type, state: planet.state, depth: 0 },
...planet.moons.map((moon) => ({
name: moon.name,
type: moon.type,
state: moon.state,
depth: 1,
})),
]).map((row, i, rows) => (
<div
key={planet.name}
key={row.name}
style={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
gap: '0.5rem',
padding: '0.6rem 0.75rem',
padding: row.depth
? '0.6rem 0.75rem 0.6rem 1.75rem'
: '0.6rem 0.75rem',
borderBottom:
i < explorablePlanets.length - 1
? '1px solid var(--border)'
: 'none',
i < rows.length - 1 ? '1px solid var(--border)' : 'none',
}}
>
<div style={{ overflow: 'hidden' }}>
<div
style={{
fontSize: '0.68rem',
color: 'var(--text-secondary)',
color: row.depth ? 'var(--text-muted)' : 'var(--text-secondary)',
letterSpacing: '0.04em',
textTransform: 'uppercase',
}}
>
{planet.name}
{row.name}
</div>
<div
style={{
@@ -423,19 +436,19 @@ export function MissionControl() {
marginTop: '2px',
}}
>
{planet.type}
{row.type}
</div>
</div>
<Badge
variant={
planet.state === 'UNEXPLORED'
row.state === 'UNEXPLORED'
? 'SCANNING'
: planet.state === 'HAZARD'
: row.state === 'HAZARD'
? 'WARNING'
: 'ACTIVE'
}
>
{planet.state}
{row.state}
</Badge>
</div>
))}