Added autoFocus on Sds and MissionLog

apps/dispatch/app/_components/map/MissionMarkers.tsx

@@ -365,7 +365,9 @@ const MissionMarker = ({ mission }: { mission: Mission }) => {
 };
 
 export const MissionLayer = () => {
-	const dispatcherConnected = useDispatchConnectionStore((s) => s.status) === "connected";
+	const dispatchState = useDispatchConnectionStore((s) => s);
+	const dispatcherConnected = dispatchState.status === "connected";
+
 	const { data: missions = [] } = useQuery({
 		queryKey: ["missions"],
 		queryFn: () =>
@@ -377,10 +379,15 @@ export const MissionLayer = () => {
 
 	const filteredMissions = useMemo(() => {
 		if (!dispatcherConnected) {
-			return missions.filter((m: Mission) => m.state === "running");
+			return missions.filter((m: Mission) => {
+				m.state === "running";
+			});
+		}
+		if (dispatchState.hideDraftMissions) {
+			return missions.filter((m: Mission) => m.state !== "draft");
 		}
 		return missions;
-	}, [missions, dispatcherConnected]);
+	}, [missions, dispatcherConnected, dispatchState.hideDraftMissions]);
 
 	// IDEA:  Add Marker to Map Layer / LayerGroup
 	return (

apps/dispatch/app/_components/map/_components/AircraftMarkerTabs.tsx

@@ -334,6 +334,7 @@ const SDSTab = ({
 	const [isChatOpen, setIsChatOpen] = useState(false);
 	const [note, setNote] = useState("");
 	const queryClient = useQueryClient();
+	const textInputRef = React.useRef<HTMLInputElement>(null);
 
 	const dispatcherConnected = useDispatchConnectionStore((s) => s.status) === "connected";
 
@@ -352,13 +353,23 @@ const SDSTab = ({
 		},
 	});
 
-	const log =
-		(mission?.missionLog as unknown as MissionLog[])
-			?.slice()
-			.reverse()
-			.filter(
-				(entry) => entry.type === "sds-log" && entry.data.stationId === aircraft.Station.id,
-			) || [];
+	const log = useMemo(
+		() =>
+			(mission?.missionLog as unknown as MissionLog[])
+				?.slice()
+				.reverse()
+				.filter(
+					(entry) => entry.type === "sds-log" && entry.data.stationId === aircraft.Station.id,
+				) || [],
+		[mission?.missionLog, aircraft.Station.id],
+	);
+
+	useEffect(() => {
+		const interval = setInterval(() => {
+			textInputRef.current?.focus();
+		}, 100);
+		return () => clearInterval(interval);
+	});
 
 	return (
 		<div className="p-4">
@@ -377,11 +388,13 @@ const SDSTab = ({
 						) : (
 							<div className="flex items-center gap-2 w-full">
 								<input
+									autoFocus
 									type="text"
 									placeholder=""
 									className="input input-sm text-base-content flex-1"
 									value={note}
 									onChange={(e) => setNote(e.target.value)}
+									ref={textInputRef}
 								/>
 								<button
 									className="btn btn-sm btn-primary btn-outline"

apps/dispatch/app/_components/map/_components/MissionMarkerTabs.tsx

@@ -591,6 +591,7 @@ const FMSStatusHistory = ({ mission }: { mission: Mission }) => {
 	const [isAddingNote, setIsAddingNote] = useState(false);
 	const [note, setNote] = useState("");
 	const queryClient = useQueryClient();
+	const textInputRef = React.useRef<HTMLInputElement>(null);
 
 	const dispatcherConnected = useDispatchConnectionStore((s) => s.status) === "connected";
 
@@ -603,6 +604,13 @@ const FMSStatusHistory = ({ mission }: { mission: Mission }) => {
 		},
 	});
 
+	useEffect(() => {
+		const interval = setInterval(() => {
+			textInputRef.current?.focus();
+		}, 100);
+		return () => clearInterval(interval);
+	});
+
 	if (!session.data?.user) return null;
 	return (
 		<div className="p-4">
@@ -626,6 +634,7 @@ const FMSStatusHistory = ({ mission }: { mission: Mission }) => {
 									className="input input-sm text-base-content flex-1"
 									value={note}
 									onChange={(e) => setNote(e.target.value)}
+									ref={textInputRef}
 								/>
 								<button
 									className="btn btn-sm btn-primary btn-outline"