diff --git a/apps/dispatch/app/_store/aircraftsStore.ts b/apps/dispatch/app/_store/aircraftsStore.ts index 7c9a0462..f3f2721c 100644 --- a/apps/dispatch/app/_store/aircraftsStore.ts +++ b/apps/dispatch/app/_store/aircraftsStore.ts @@ -4,6 +4,7 @@ export interface Aircraft { id: string; bosName: string; bosNameShort: string; + bosNutzung: string; fmsStatus: string; fmsLog: { status: string; @@ -35,8 +36,9 @@ export const useAircraftsStore = create((set) => ({ aircrafts: [ { id: "1", - bosName: "Aircraft 1", - bosNameShort: "A1", + bosName: "Christoph 31", + bosNameShort: "CHX31", + bosNutzung: "RTH", fmsStatus: "1", fmsLog: [], location: { @@ -49,8 +51,9 @@ export const useAircraftsStore = create((set) => ({ }, { id: "2", - bosName: "Aircraft 2", - bosNameShort: "A2", + bosName: "Christoph Berlin", + bosNameShort: "CHX83", + bosNutzung: "ITH", fmsStatus: "2", fmsLog: [], location: { @@ -63,9 +66,10 @@ export const useAircraftsStore = create((set) => ({ }, { id: "3", - bosName: "Aircraft 3", - bosNameShort: "A3", - fmsStatus: "3", + bosName: "Christoph 100", + bosNameShort: "CHX100", + bosNutzung: "RTH", + fmsStatus: "7", fmsLog: [], location: { lat: 52.497519717230155, @@ -77,8 +81,9 @@ export const useAircraftsStore = create((set) => ({ }, { id: "4", - bosName: "Aircraft 4", + bosName: "Christophorus 1", bosNameShort: "A4", + bosNutzung: "RTH", fmsStatus: "6", fmsLog: [], location: { diff --git a/apps/dispatch/app/dispatch/_components/map/AircraftMarker.tsx b/apps/dispatch/app/dispatch/_components/map/AircraftMarker.tsx index 26bd8475..5ed8559e 100644 --- a/apps/dispatch/app/dispatch/_components/map/AircraftMarker.tsx +++ b/apps/dispatch/app/dispatch/_components/map/AircraftMarker.tsx @@ -1,5 +1,5 @@ import { Aircraft, useAircraftsStore } from "_store/aircraftsStore"; -import { Marker, Popup, useMap } from "react-leaflet"; +import { Marker, useMap } from "react-leaflet"; import { DivIcon, Marker as LMarker, Popup as LPopup } from "leaflet"; import { useMapStore } from "_store/mapStore"; import { @@ -13,13 +13,14 @@ import { import { cn } from "helpers/cn"; import { ChevronsRightLeft, - Cross, House, MessageSquareText, Minimize2, - Route, } from "lucide-react"; import { SmartPopup, useConflict, useSmartPopup } from "_components/SmartPopup"; +import FMSStatusHistory, { + FMSStatusSelector, +} from "./_components/AircraftMarkerTabs"; export const FMS_STATUS_COLORS: { [key: string]: string } = { "0": "rgb(126,0,5)", @@ -66,9 +67,9 @@ const AircraftPopupContent = ({ aircraft }: { aircraft: Aircraft }) => { const renderTabContent = useMemo(() => { switch (currentTab) { case "home": - return
Home Content
; + return ; case "fms": - return
FMS Content
; + return ; case "aircraft": return
Aircraft Content
; case "mission": @@ -76,9 +77,9 @@ const AircraftPopupContent = ({ aircraft }: { aircraft: Aircraft }) => { case "chat": return
Chat Content
; default: - return
Default Content
; + return Error; } - }, [currentTab]); + }, [currentTab, aircraft]); const setOpenAircraftMarker = useMapStore( (state) => state.setOpenAircraftMarker, @@ -162,9 +163,9 @@ const AircraftPopupContent = ({ aircraft }: { aircraft: Aircraft }) => { onClick={() => handleTabChange("aircraft")} > - Christophorus 1 + {aircraft.bosName}
- RTH + {aircraft.bosNutzung}
{ closeOnClick={false} autoPan={false} wrapperClassName="relative" - className="w-[502px] h-[220px]" + className="w-[502px]" > - +
+ +
)} diff --git a/apps/dispatch/app/dispatch/_components/map/_components/AircraftMarkerTabs.tsx b/apps/dispatch/app/dispatch/_components/map/_components/AircraftMarkerTabs.tsx new file mode 100644 index 00000000..106a68d3 --- /dev/null +++ b/apps/dispatch/app/dispatch/_components/map/_components/AircraftMarkerTabs.tsx @@ -0,0 +1,71 @@ +"use client"; +import React, { useState } from "react"; +import { FMS_STATUS_COLORS, FMS_STATUS_TEXT_COLORS } from "../AircraftMarker"; +import { Aircraft } from "_store/aircraftsStore"; + +const FMSStatusHistory = () => { + const dummyData = [ + { status: "3", time: "12:00" }, + { status: "4", time: "12:30" }, + { status: "7", time: "14:54" }, + { status: "8", time: "13:30" }, + { status: "1", time: "13:30" }, + ]; + + return ( +
+
    + {dummyData.map((entry, index) => ( +
  • + + {entry.status} + + {entry.time} +
  • + ))} +
+
+ ); +}; + +const FMSStatusSelector = ({ aircraft }: { aircraft: Aircraft }) => { + const [hoveredStatus, setHoveredStatus] = useState(null); + + return ( +
+ {Array.from({ length: 9 }, (_, i) => (i + 1).toString()).map((status) => ( +
setHoveredStatus(status)} + onMouseLeave={() => setHoveredStatus(null)} + onClick={() => { + // Handle status change logic here + console.log( + `Status changed to: ${status} for aircraft ${aircraft.id}`, + ); + }} + > + {status} +
+ ))} +
+ ); +}; + +export { FMSStatusSelector }; +export default FMSStatusHistory; diff --git a/apps/hub/app/page.tsx b/apps/hub/app/page.tsx deleted file mode 100644 index e69de29b..00000000