// screen_floor.jsx — isometric Floor View; rooms route to screens via the hash router.
// Placed before app.jsx so its window.Screens.floor wins the stub forEach's `if(!Screens[id])` guard.
(function () {
  const h = React.createElement;
  const { PageHeader, Button, Icon } = window;
  window.Screens = window.Screens || {};

  // floor room id -> dashboard screen hash (spec §3 / C13)
  const ROOM_TO_SCREEN = {
    desk: "approvals", training: "training", files: "files",
    mail: "connectors", roof: "roi", hire: "employees",
  };
  // quick-dock: room id -> { screen, label, icon } (labels authored EN; dict-mapped).
  // roof label reuses "Roof · ROI" (PC-6: 頂樓儀表板 already keyed there; no new dict entry).
  const DOCK = [
    { room: "desk", label: "My Desk", icon: "inbox" },
    { room: "training", label: "Task Library", icon: "graduation" },
    { room: "files", label: "Files", icon: "folder" },
    { room: "mail", label: "Apps", icon: "mail" },
    { room: "roof", label: "Value", icon: "trending" },
    { room: "hire", label: "Add employees", icon: "users" },
  ];
  window.FLOOR_ROOM_TO_SCREEN = ROOM_TO_SCREEN;

  function FloorView({ ctx }) {
    const office = ctx.office;                 // live OFFICE (roleById rebuilt at runtime — C14)
    const pending = office.inbox.length;

    // onOpen(roomId) — roomId may be a compound like "training:clerk" or "hire"
    function onOpen(roomId) {
      const [room, arg] = String(roomId).split(":");
      // A hired desk click arrives as "training:<roleId>" (the Training Room object and the
      // dock button send a bare "training" with no arg). The core verb on a desk is "give a
      // task", so route a hired desk straight to its brief screen — not the skill-setup room.
      const deskRole = arg && office.roleById && office.roleById[arg];
      if (room === "training" && deskRole && deskRole.hired) { ctx.openPage("employee", arg); return; }
      const screen = ROOM_TO_SCREEN[room] || room;  // "hire" -> employees handled by map
      ctx.openPage(screen, arg || null);
    }

    return h("div", null,
      h(PageHeader, {
        eyebrow: "Floor",
        title: "Floor View",
        sub: "Click a room or desk to open it. Use the list when you are in a hurry.",
        right: [
	          h(Button, { key: "skip", sm: true, variant: "ghost", iconRight: "arrowRight", "data-floor-action": "skip-to-list", "data-floor-open-target": "desk", "data-floor-route": "approvals",
	            onClick: () => ctx.openPage("approvals") }, "Skip to list"),
	        ],
	      }),
	      h("div", { className: "floor-wrap", "data-floor-root": "true", "data-floor-day": ctx.day || "", "data-floor-pending-count": String(pending || 0) },
	        h(window.FloorScene, { data: office, day: ctx.day, pending, onOpen }),
	        h("div", { className: "floor-dock", "data-floor-dock": "true", "data-floor-dock-count": String(DOCK.length) },
	          DOCK.map((d) => h("button", { key: d.room, className: "dock-btn", "aria-label": d.label, title: d.label, "data-floor-action": "dock-open", "data-floor-dock-room": d.room, "data-floor-open-target": d.room, "data-floor-route": ROOM_TO_SCREEN[d.room] || d.room, "data-floor-pending-count": d.room === "desk" ? String(pending || 0) : "", onClick: () => onOpen(d.room) },
	            h("span", { className: "dock-icon" }, h(Icon, { name: d.icon, size: 15 })),
	            h("span", { className: "dock-label" }, d.label),
            d.room === "desk" && pending > 0 && h("span", { className: "dock-badge" }, pending)))),
        h("div", { className: "floor-foot" },
          "Click any object to open it. The list is always available.")));
  }

  window.Screens.floor = FloorView;
})();