WIP: Enable dynamic AIS stream handling based on user location and map focus.

- Prevent AIS stream from starting immediately; start upon user interaction.
- Add `ais_stream_started` state for WebSocket management.
- Extend `useRealAISProvider` with `userLocationLoaded` and `mapFocused` to control stream.
- Update frontend components to handle geolocation and map focus.
- Exclude test files from compilation

Introduce WebSocket integration for AIS services

- Added WebSocket-based `useRealAISProvider` React hook for real-time AIS vessel data.
- Created various tests including unit, integration, and browser tests to validate WebSocket functionality.
- Added `ws` dependency to enable WebSocket communication.
- Implemented vessel data mapping and bounding box handling for dynamic updates.
This commit is contained in:
geoffsee
2025-07-20 22:27:39 -04:00
parent e029ef48fc
commit 7528b2117b
23 changed files with 5134 additions and 28 deletions

View File

@@ -0,0 +1,42 @@
import * as React from 'react';
interface VesselMarkerProps {
size?: number;
color?: string;
heading?: number;
}
const vesselStyle = {
cursor: 'pointer',
stroke: '#fff',
strokeWidth: 2
};
function VesselMarker({ size = 12, color = '#0066cc', heading = 0 }: VesselMarkerProps) {
return (
<svg
height={size}
width={size}
viewBox="0 0 24 24"
style={{
...vesselStyle,
transform: `rotate(${heading}deg)`,
transformOrigin: 'center'
}}
>
<circle
cx="12"
cy="12"
r="10"
fill={color}
/>
{/* Small arrow to indicate heading */}
<path
d="M12 4 L16 12 L12 10 L8 12 Z"
fill="#fff"
/>
</svg>
);
}
export default React.memo(VesselMarker);