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

refactor(RegionMap.tsx): extract map interaction constants to improve code readability

Browse Source
This commit is contained in:
PhatPhuckDave
2025-08-11 19:26:35 +02:00
parent c55b3bd882
commit b0ad48985a
1 changed files with 19 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/components/RegionMap.tsx
View File

@@ -12,6 +12,17 @@ import { ListCharacters, StartESILogin, SetDestinationForAll, PostRouteForAllByN
import { toast } from '@/hooks/use-toast'; import { toast } from '@/hooks/use-toast';
import { getSystemsRegions } from '@/utils/systemApi'; import { getSystemsRegions } from '@/utils/systemApi';
// Interaction/indicator constants
const SELECT_HOLD_MS = 300;
const PAN_THRESHOLD_PX = 6;
const DRAG_SNAP_DISTANCE = 20;
const VIA_WAYPOINT_RING_RADIUS = 14;
const VIA_WAYPOINT_RING_COLOR = '#10b981';
const INDICATED_RING_RADIUS = 20;
const INDICATED_RING_COLOR = '#f59e0b';
const INDICATED_RING_ANIM_VALUES = '18;22;18';
const INDICATED_RING_ANIM_DUR = '1.2s';
interface RegionMapProps { interface RegionMapProps {
regionName: string; regionName: string;
focusSystem?: string; focusSystem?: string;
@@ -392,7 +403,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
const dx = system.x - x; const dx = system.x - x;
const dy = system.y - y; const dy = system.y - y;
const distance = Math.sqrt(dx * dx + dy * dy); const distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 20) { if (distance < DRAG_SNAP_DISTANCE) {
targetSystem = system; targetSystem = system;
} }
}); });
@@ -484,7 +495,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
} }
}; };
const PAN_THRESHOLD_PX = 6; // movement before starting pan // const PAN_THRESHOLD_PX = 6; // movement before starting pan
const handleMouseDown = useCallback((e: React.MouseEvent) => { const handleMouseDown = useCallback((e: React.MouseEvent) => {
if (!svgRef.current) return; if (!svgRef.current) return;
@@ -504,7 +515,7 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
clearSelectTimer(); clearSelectTimer();
selectTimerRef.current = window.setTimeout(() => { selectTimerRef.current = window.setTimeout(() => {
setIsSelecting(true); setIsSelecting(true);
}, 1000); }, SELECT_HOLD_MS);
}, [positions, systems]); }, [positions, systems]);
const handleMouseMove = useCallback((e: React.MouseEvent) => { const handleMouseMove = useCallback((e: React.MouseEvent) => {
@@ -859,9 +870,9 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
<circle <circle
cx={positions[name].x} cx={positions[name].x}
cy={positions[name].y} cy={positions[name].y}
r="14" r={VIA_WAYPOINT_RING_RADIUS}
fill="none" fill="none"
stroke="#10b981" stroke={VIA_WAYPOINT_RING_COLOR}
strokeWidth="3" strokeWidth="3"
opacity="0.9" opacity="0.9"
filter="url(#glow)" filter="url(#glow)"
@@ -876,14 +887,14 @@ export const RegionMap = ({ regionName, focusSystem, isCompact = false, isWormho
<circle <circle
cx={positions[indicatedSystem].x} cx={positions[indicatedSystem].x}
cy={positions[indicatedSystem].y} cy={positions[indicatedSystem].y}
r="20" r={INDICATED_RING_RADIUS}
fill="none" fill="none"
stroke="#f59e0b" stroke={INDICATED_RING_COLOR}
strokeWidth="3" strokeWidth="3"
opacity="0.9" opacity="0.9"
filter="url(#glow)" filter="url(#glow)"
> >
<animate attributeName="r" values="18;22;18" dur="1.2s" repeatCount="indefinite" /> <animate attributeName="r" values={INDICATED_RING_ANIM_VALUES} dur={INDICATED_RING_ANIM_DUR} repeatCount="indefinite" />
</circle> </circle>
</g> </g>
)} )}