Scanner improvements (#3331)

app/features/scanner/components/EventCard.tsx

@@ -26,6 +26,14 @@ import {
 	OBJECTIVE_EVENT_TYPE,
 	type ObjectiveData,
 } from "../core/detectors/objective/index";
+import {
+	PLAYER_STATUS_EVENT_TYPE,
+	type PlayerStatusData,
+} from "../core/detectors/objective/player-status";
+import {
+	STRIP_WEAPONS_EVENT_TYPE,
+	type StripWeaponsData,
+} from "../core/detectors/objective/strip-weapons";
 import type { ScoreboardData } from "../core/detectors/scoreboard/index";
 import {
 	SCOREBOARD_OWN_EVENT_TYPE,
@@ -35,13 +43,16 @@ import { scannerSearchParams } from "../scanner-search-params";
 import type { SendStatus } from "../store/events";
 import { newInspectKey, putInspectFrame } from "../store/inspect";
 import { DeathCard } from "./DeathCard";
+import styles from "./EventCard.module.css";
 import type { FixtureData } from "./fixture-export";
 import { useEventTimeFormatter } from "./format";
 import { MapStartCard } from "./MapStartCard";
 import { MinimapCard } from "./MinimapCard";
 import { ObjectiveCard } from "./ObjectiveCard";
+import { PlayerStatusCard } from "./PlayerStatusCard";
 import { ScoreboardCard } from "./ScoreboardCard";
 import { ScoreboardOwnCard } from "./ScoreboardOwnCard";
+import { StripWeaponsCard } from "./StripWeaponsCard";
 
 export type GetFrame = () => Promise<Blob | null | undefined>;
 
@@ -84,7 +95,7 @@ export function EventCard(props: {
 	const card = renderCard(type, data, shared, props.abilities);
 	if (!props.send && !props.onSend) return card;
 	return (
-		<div className="send-wrap">
+		<div className={styles.sendWrap}>
 			{card}
 			<SendStrip send={props.send} onSend={props.onSend} />
 		</div>
@@ -109,12 +120,14 @@ function SendStrip({
 	const state = send?.state;
 	const formatSentAt = useEventTimeFormatter();
 	return (
-		<div className={clsx("send-strip", state ?? "unsent")}>
+		<div className={clsx(styles.sendStrip, state ? styles[state] : null)}>
 			<span>
 				sendou.ink: {state ? SEND_LABELS[state] : "not sent"}
 				{state === "sent" && send ? ` ${formatSentAt(send.at)}` : null}
 			</span>
-			{send?.error ? <span className="error">{send.error}</span> : null}
+			{send?.error ? (
+				<span className={styles.sendError}>{send.error}</span>
+			) : null}
 			{onSend && state !== "sent" && state !== "sending" ? (
 				<button type="button" onClick={onSend}>
 					{state === "failed" ? "Retry" : "Send"}
@@ -147,6 +160,10 @@ function renderCard(
 		<MinimapCard {...shared} data={data as MinimapData} />
 	) : type === OBJECTIVE_EVENT_TYPE ? (
 		<ObjectiveCard {...shared} data={data as ObjectiveData} />
+	) : type === PLAYER_STATUS_EVENT_TYPE ? (
+		<PlayerStatusCard {...shared} data={data as PlayerStatusData} />
+	) : type === STRIP_WEAPONS_EVENT_TYPE ? (
+		<StripWeaponsCard {...shared} data={data as StripWeaponsData} />
 	) : (
 		<ScoreboardCard
 			{...shared}