+
+
+
+
+
+
+ setPendingPhotoUrl(null)}
+ isUploading={isUploading}
+ />
+
+ {/* hidden file input lives here */}
+ {
+ const f = e.target.files?.[0];
+ if (f) onFileChosen(f);
+ }}
+ />
+
+
+ );
+}
diff --git a/web/src/assets/react.svg b/web/src/assets/react.svg
new file mode 100644
index 0000000000000000000000000000000000000000..6c87de9bb3358469122cc991d5cf578927246184
--- /dev/null
+++ b/web/src/assets/react.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/web/src/components/ReportIcon.tsx b/web/src/components/ReportIcon.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..251597e38a537d3ac3f28b2031ded744a9dfaed5
--- /dev/null
+++ b/web/src/components/ReportIcon.tsx
@@ -0,0 +1,34 @@
+// components/ReportIcon.tsx
+import * as Lucide from "lucide-react";
+
+const pascal = (s: string) =>
+ s.replace(/(^\w|-\w)/g, (m) => m.replace("-", "").toUpperCase());
+
+export function ReportIcon({
+ name = "info",
+ size = 32,
+}: {
+ name?: string;
+ size?: number;
+}) {
+ const key = (name || "info").toLowerCase();
+
+ // 3D local PNGs: name like "3d:police-light"
+ if (key.startsWith("3d-")) {
+ const file = key; // "police-light"
+ return (
+ 
+ );
+ }
+
+ // fallback to your existing Lucide logic
+ const Comp = (Lucide as any)[pascal(key)] ?? (Lucide as any).Info;
+ return Assistant
+
+ {messages.length === 0 ? (
+
+
+
+ Try: “Flooded underpass here”, or “List reports near me”.
+
+ ) : (
+ messages.map((m, idx) => (
+
+ {isStreaming &&
+ !hasFirstToken &&
+ idx === messages.length - 1 &&
+ m.role === "assistant" ? (
+
+ ))
+ )}
+
+
+ ) : (
+ <>
+ {m.text}
+ {m.image && (
+
+ 
+
+ )}
+
+ )}
+
+ setDraft(e.target.value)}
+ onKeyDown={(e) => e.key === "Enter" && onSend()}
+ />
+
+ {pendingThumb && (
+
+
+ 
+
+
+ )}
+
+
+ {emoji}
+
+
+
+
+ );
+}
diff --git a/web/src/components/sidebar/UpdatesPanel.tsx b/web/src/components/sidebar/UpdatesPanel.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..01db739f0579a5a3a1d1c7ffadb2097c9cbcad35
--- /dev/null
+++ b/web/src/components/sidebar/UpdatesPanel.tsx
@@ -0,0 +1,133 @@
+import type { UpdateItem } from "../../lib/types";
+import { formatAgo } from "../../lib/utils";
+
+const isEmoji = (s: string) => !!s && /\p{Extended_Pictographic}/u.test(s);
+
+// Same slug cleaner used above
+const cleanTitle = (t?: string) => {
+ if (!t) return t;
+ return t
+ .replace(/^(?:[a-z0-9]+-){1,3}(?=[A-Z])/i, "")
+ .replace(/^(?:[a-z0-9]+-){1,3}\s+/i, "");
+};
+
+export default function UpdatesPanel({
+ activeTab,
+ setActiveTab,
+ localUpdates,
+ globalUpdates,
+ loadingLocal,
+ loadingGlobal,
+ selectedLL,
+ onView,
+}: {
+ activeTab: "local" | "global";
+ setActiveTab: (t: "local" | "global") => void;
+ localUpdates: UpdateItem[];
+ globalUpdates: UpdateItem[];
+ loadingLocal: boolean;
+ loadingGlobal: boolean;
+ selectedLL: [number, number] | null;
+ onView: (u: UpdateItem) => void;
+}) {
+ const renderList = (
+ list: UpdateItem[],
+ loading: boolean,
+ emptyMsg: string
+ ) => (
+ <>
+ {loading &&
+ {selectedLL ? (
+ <>
+
+
+ {showEmoji ? (
+
+ {showEmoji}
+
+ ) : null}
+ {displayTitle}
+
+
+ {selectedMeta?.subtitle && (
+ {selectedMeta.subtitle}
+ )}
+
+
+ {selectedLL[0].toFixed(4)}, {selectedLL[1].toFixed(4)}
+
+
+
+ {(selectedMeta?.category || selectedMeta?.raw?.category) && (
+
+
+ ) : (
+
+ Category:{" "}
+ {selectedMeta.category || selectedMeta.raw?.category}
+
+ )}
+ {(selectedMeta?.severity !== undefined ||
+ selectedMeta?.raw?.severity !== undefined) && (
+
+ Severity/Mag:{" "}
+ {String(
+ selectedMeta?.severity ?? selectedMeta?.raw?.severity
+ )}
+
+ )}
+
+ Confidence:{" "}
+ {(() => {
+ const k = selectedMeta?.kind;
+ const fromMeta =
+ selectedMeta?.confidence ?? selectedMeta?.raw?.confidence;
+ const official =
+ k && ["nws", "quake", "eonet", "fire"].includes(k);
+ const val = fromMeta ?? (official ? 1 : undefined);
+ return val !== undefined ? String(val) : "—";
+ })()}
+
+ {selectedMeta?.raw?.source ? (
+
+ Source: {selectedMeta.raw.source}
+
+ ) : selectedMeta?.kind &&
+ ["nws", "quake", "eonet", "fire"].includes(
+ selectedMeta.kind
+ ) ? (
+
+ Source: {selectedMeta.kind.toUpperCase()}
+
+ ) : null}
+ {selectedMeta?.sourceUrl && (
+
+
+ Source
+
+
+ )}
+ Use search, 📍, or click the map.
+ )}
+
+ {photoSrc && (
+
+ 
+
+ )}
+
+
+ Only one point is active. Drag 📍 to fine-tune; chat uses this point.
+
+
+ {selectedLL && (
+
+
+
+ )}
+ Loading…
}
+ {!loading && list.length === 0 && {emptyMsg}
}
+ {!loading &&
+ list.map((u, i) => {
+ // DEBUG: inspect each item
+ // eslint-disable-next-line no-console
+ console.debug("[UpdatesPanel] item:", u);
+
+ const showEmoji =
+ u.emoji && isEmoji(String(u.emoji)) ? u.emoji : null;
+ const title = cleanTitle(u.title) || u.title || "Update";
+
+ return (
+
+
+ );
+ })}
+
+ );
+
+ return (
+
+ {showEmoji ?
+ {showEmoji}
: null}
+
+
+
+ {title}
+
+ {formatAgo(u.time)} · {u.kind}
+ {u.severity ? <> · {String(u.severity)} : null}
+
+ {u.sourceUrl && (
+
+
+ Source
+
+
+ )}
+
+
+ );
+}
diff --git a/web/src/hooks/useChat.ts b/web/src/hooks/useChat.ts
new file mode 100644
index 0000000000000000000000000000000000000000..e63bf7553f199fc54423c1d50ec5b3250d5879a7
--- /dev/null
+++ b/web/src/hooks/useChat.ts
@@ -0,0 +1,127 @@
+import { useCallback, useRef, useState } from "react";
+import { CHAT_URL, UPLOAD_URL } from "../lib/constants";
+import type { Message } from "../lib/types";
+
+export function useChat(
+ sessionId: string,
+ selectedLL: [number, number] | null
+) {
+ const [messages, setMessages] = useState
+
+
+
+ e.stopPropagation()}
+ >
+ {activeTab === "local" ? (
+ selectedLL ? (
+ renderList(localUpdates, loadingLocal, "No recent updates here.")
+ ) : (
+
+
+ Pick a point (search/📍/click) to load local updates within 25
+ miles (last 48h).
+
+ )
+ ) : (
+ renderList(
+ globalUpdates,
+ loadingGlobal,
+ "No global updates right now."
+ )
+ )}
+