feat(geo): EA2-backed attendance sites + versioned seed scripts
Closes Oracle deferred caveats:
- raw-SQL persona promotion (now qa/seeds/001_personas.mjs, idempotent)
- no scripted multi-persona interaction (now qa/seeds/002_persona_
interactions.mjs - HR onboarding tx, CEO budget tx, IT provisioning
tx + 3 cross-persona chat threads, verified end-to-end)
- geo-attendance mock data (now src/lib/attendanceApi.ts pulls 8 sites
via flow.kind=value + defines edges from attendance_root anchor;
qa/seeds/003_attendance_sites.mjs seeds them idempotently)
Each site is a flow.kind=value doc with config.attendance = { lat,
lng, kind, status, who, city, label }. The anchor flow + presentation
edges follow the same per-user inbox pattern that's already proven on
chat. No hardcoded JS array left in src/scenes/GeoAttendance.tsx.
This commit is contained in:
@@ -4,6 +4,7 @@ import L from "leaflet";
|
||||
import "leaflet/dist/leaflet.css";
|
||||
import { useApp } from "../state/store";
|
||||
import { Pulse } from "../components/icons";
|
||||
import { attendanceApi, type AttendanceSite } from "../lib/attendanceApi";
|
||||
|
||||
L.Marker.prototype.options.icon = L.icon({
|
||||
iconUrl: "https://unpkg.com/leaflet@1.9.4/dist/images/marker-icon.png",
|
||||
@@ -15,35 +16,13 @@ L.Marker.prototype.options.icon = L.icon({
|
||||
shadowSize: [41, 41],
|
||||
});
|
||||
|
||||
interface Site {
|
||||
id: string;
|
||||
label: string;
|
||||
kind: "store" | "office" | "warehouse";
|
||||
lat: number;
|
||||
lng: number;
|
||||
status: "checked_in" | "checked_out" | "late";
|
||||
who: string;
|
||||
city: string;
|
||||
}
|
||||
|
||||
const SITES: Site[] = [
|
||||
{ id: "hq-london", label: "HQ · London", kind: "office", lat: 51.5074, lng: -0.1278, status: "checked_in", who: "Mariana Cole (CEO) — on-site", city: "London" },
|
||||
{ id: "store-204", label: "Store 204 · Manchester", kind: "store", lat: 53.4808, lng: -2.2426, status: "checked_in", who: "Manager Priya Sahota — opened 08:02", city: "Manchester" },
|
||||
{ id: "store-118", label: "Store 118 · Birmingham", kind: "store", lat: 52.4862, lng: -1.8904, status: "late", who: "Manager Tom Reilly — late check-in 09:24", city: "Birmingham" },
|
||||
{ id: "store-052", label: "Store 052 · Edinburgh", kind: "store", lat: 55.9533, lng: -3.1883, status: "checked_in", who: "Manager Iona MacDonald — opened 07:58", city: "Edinburgh" },
|
||||
{ id: "office-berlin", label: "Office · Berlin", kind: "office", lat: 52.52, lng: 13.405, status: "checked_in", who: "Aisha Khan (HR Director) — remote-on", city: "Berlin" },
|
||||
{ id: "warehouse-rotterdam", label: "Warehouse · Rotterdam", kind: "warehouse", lat: 51.9244, lng: 4.4777, status: "checked_in", who: "Shift A — 24 staff on-floor", city: "Rotterdam" },
|
||||
{ id: "office-bangalore", label: "Office · Bangalore", kind: "office", lat: 12.9716, lng: 77.5946, status: "checked_in", who: "Rohan Patel (IT Director) — on-site", city: "Bangalore" },
|
||||
{ id: "store-088", label: "Store 088 · Cardiff", kind: "store", lat: 51.4816, lng: -3.1791, status: "checked_out", who: "Manager Daniel Owens — closed 21:14 yesterday", city: "Cardiff" },
|
||||
];
|
||||
|
||||
function statusTag(s: Site["status"]) {
|
||||
function statusTag(s: AttendanceSite["status"]) {
|
||||
if (s === "checked_in") return "ON-SITE";
|
||||
if (s === "late") return "LATE";
|
||||
return "OFF";
|
||||
}
|
||||
|
||||
function FitToSites({ sites }: { sites: Site[] }) {
|
||||
function FitToSites({ sites }: { sites: AttendanceSite[] }) {
|
||||
const map = useMap();
|
||||
useEffect(() => {
|
||||
if (!sites.length) return;
|
||||
@@ -55,9 +34,20 @@ function FitToSites({ sites }: { sites: Site[] }) {
|
||||
|
||||
export default function GeoAttendance() {
|
||||
const setScene = useApp((s) => s.setScene);
|
||||
const [filter, setFilter] = useState<"all" | Site["kind"]>("all");
|
||||
const visible = filter === "all" ? SITES : SITES.filter((s) => s.kind === filter);
|
||||
const stats = SITES.reduce(
|
||||
const pushToast = useApp((s) => s.pushToast);
|
||||
const [filter, setFilter] = useState<"all" | AttendanceSite["kind"]>("all");
|
||||
const [sites, setSites] = useState<AttendanceSite[] | null>(null);
|
||||
useEffect(() => {
|
||||
let cancelled = false;
|
||||
attendanceApi
|
||||
.listSites()
|
||||
.then((rows) => !cancelled && setSites(rows))
|
||||
.catch((err) => !cancelled && pushToast("err", `Sites failed: ${err.message}`));
|
||||
return () => { cancelled = true; };
|
||||
}, []);
|
||||
const allSites = sites || [];
|
||||
const visible = filter === "all" ? allSites : allSites.filter((s) => s.kind === filter);
|
||||
const stats = allSites.reduce(
|
||||
(acc, s) => ({
|
||||
onSite: acc.onSite + (s.status === "checked_in" ? 1 : 0),
|
||||
late: acc.late + (s.status === "late" ? 1 : 0),
|
||||
@@ -69,11 +59,14 @@ export default function GeoAttendance() {
|
||||
return (
|
||||
<div className="geo-scene">
|
||||
<header className="geo-head">
|
||||
<div className="mc-hero-eyebrow"><Pulse size={12} /> Attendance map · preview</div>
|
||||
<div className="mc-hero-eyebrow"><Pulse size={12} /> Attendance map</div>
|
||||
<h2 className="mc-hero-title">Where your people are</h2>
|
||||
<p className="geo-intro">
|
||||
Preview of the manager attendance view. Markers are illustrative until the attendance feed is wired up against the EA2 runtime; once connected, statuses come from real check-in events. Tiles are served by OpenStreetMap.
|
||||
Live sites and check-in statuses sourced from EA2. Add a site by inserting an attendance flow doc (kind=value, source_context=CANVAS_ATTENDANCE_SITE) and linking it to flow/attendance_root via a defines edge with role=presentation. Tiles are served by OpenStreetMap.
|
||||
</p>
|
||||
{sites !== null && allSites.length === 0 && (
|
||||
<p className="geo-empty">No sites configured yet. Seed `qa/seeds/003_attendance_sites.mjs` to add the default canvas attendance roster.</p>
|
||||
)}
|
||||
<div className="geo-stats">
|
||||
<span className="geo-stat geo-stat-ok">{stats.onSite} on-site</span>
|
||||
<span className="geo-stat geo-stat-late">{stats.late} late</span>
|
||||
@@ -101,7 +94,7 @@ export default function GeoAttendance() {
|
||||
/>
|
||||
<FitToSites sites={visible} />
|
||||
{visible.map((s) => (
|
||||
<Marker key={s.id} position={[s.lat, s.lng]}>
|
||||
<Marker key={s._key} position={[s.lat, s.lng]}>
|
||||
<Popup>
|
||||
<strong>{s.label}</strong>
|
||||
<br />
|
||||
|
||||
Reference in New Issue
Block a user