dave/eve-signaler
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 5 Wiki Activity

feat: Add breadcrumb to region map and remove back button

Browse Source 
Adds breadcrumb navigation to the region map and removes the "Back to Galaxy" button for consistency.
This commit is contained in:
gpt-engineer-app[bot]
2025-06-14 20:14:07 +00:00
parent 9277f38377
commit 638f8f4a93
1 changed files with 34 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/components/RegionMap.tsx
View File

@@ -1,11 +1,18 @@
import React, { useState, useRef, useCallback, useEffect, useMemo } from 'react';
import { useNavigate } from 'react-router-dom';
import { MapNode } from './MapNode';
import { Connection } from './Connection';
import { Button } from '@/components/ui/button';
import { ArrowLeft } from 'lucide-react';
import { useQuery } from '@tanstack/react-query';
import { getSecurityColor } from '../utils/securityColors';
import {
Breadcrumb,
BreadcrumbItem,
BreadcrumbLink,
BreadcrumbList,
BreadcrumbPage,
BreadcrumbSeparator,
} from '@/components/ui/breadcrumb';
const pocketbaseUrl = `https://evebase.site.quack-lab.dev/api/collections/regionview/records`;
@@ -211,15 +218,6 @@ const RegionMap = ({ regionName, focusSystem, isCompact = false }: RegionMapProp
<div className="text-center">
<h1 className="text-4xl font-bold text-white mb-4">Error Loading Region</h1>
<p className="text-red-400 mb-6">Failed to load data for {regionName}</p>
{!isCompact && (
<Button
onClick={() => navigate('/')}
className="bg-purple-600 hover:bg-purple-700"
>
<ArrowLeft className="w-4 h-4 mr-2" />
Return to Galaxy Map
</Button>
)}
</div>
</div>
);
@@ -309,18 +307,31 @@ const RegionMap = ({ regionName, focusSystem, isCompact = false }: RegionMapProp
<div className="absolute inset-0 bg-[radial-gradient(ellipse_at_center,_var(--tw-gradient-stops))] from-purple-900/20 via-slate-900/40 to-black"></div>
<div className="relative z-10 p-8">
<div className="flex items-center justify-between mb-8">
<div>
<h1 className="text-4xl font-bold text-white mb-2">{regionName}</h1>
<p className="text-purple-200">Solar systems in this region</p>
</div>
<Button
onClick={() => navigate('/')}
className="bg-purple-600 hover:bg-purple-700"
>
<ArrowLeft className="w-4 h-4 mr-2" />
Back to Galaxy
</Button>
{/* Breadcrumb Navigation */}
<div className="mb-6">
<Breadcrumb>
<BreadcrumbList>
<BreadcrumbItem>
<BreadcrumbLink
onClick={() => navigate("/")}
className="text-purple-200 hover:text-white cursor-pointer"
>
Universe
</BreadcrumbLink>
</BreadcrumbItem>
<BreadcrumbSeparator className="text-slate-400" />
<BreadcrumbItem>
<BreadcrumbPage className="text-white font-semibold">
{regionName}
</BreadcrumbPage>
</BreadcrumbItem>
</BreadcrumbList>
</Breadcrumb>
</div>
<div className="mb-8">
<h1 className="text-4xl font-bold text-white mb-2">{regionName}</h1>
<p className="text-purple-200">Solar systems in this region</p>
</div>
<div className="w-full h-[calc(100vh-200px)] border border-purple-500/30 rounded-lg overflow-hidden bg-black/20 backdrop-blur-sm">