@ai-matrx/meet 0.10.6 → 0.11.0

package/dist/skins/meet.cjs

@@ -112,9 +112,6 @@ var import_react10 = require("react");
 // src/react/facade.ts
 var import_react8 = require("react");
 
-// src/react/root.tsx
-var import_react3 = require("react");
-
 // src/core/names.ts
 function isGuestIdentity(identity) {
   return String(identity).startsWith("guest:");
@@ -364,6 +361,27 @@ function isObserverRole(role) {
   return role === "viewer";
 }
 
+// src/core/phase.ts
+var LIVE_PHASES = /* @__PURE__ */ new Set(["joining", "in_call"]);
+var WAITING_PHASES = /* @__PURE__ */ new Set([
+  "waiting:host_not_started",
+  "waiting:knocking",
+  "denied",
+  "knock_expired"
+]);
+function isLivePhase(phase) {
+  return LIVE_PHASES.has(phase);
+}
+function isWaitingPhase(phase) {
+  return WAITING_PHASES.has(phase);
+}
+function isRefusedPhase(phase) {
+  return phase.startsWith("refused:");
+}
+function reasonOf(phase) {
+  return isRefusedPhase(phase) ? phase.slice("refused:".length) : null;
+}
+
 // src/core/app-panel.ts
 function appPanelOf(meeting) {
   const raw = meeting?.metadata?.["app_panel"];
@@ -444,6 +462,7 @@ var DEFAULT_EFFECTS = {
   background: "none",
   backgroundImage: null
 };
+var NO_SHARE = { state: "none", reason: null, remedy: null, at: 0 };
 function effectiveRole(snapshot) {
   const me = snapshot.participants.find(
     (participant) => participant.identity === snapshot.localIdentity
@@ -459,6 +478,9 @@ function effectiveStanding(snapshot) {
 }
 var REACTION_TTL_MS = 5e3;
 
+// src/react/root.tsx
+var import_react3 = require("react");
+
 // src/core/observation.ts
 function observedRole(role, standing) {
   if (role === "host" || role === "cohost") return role;
@@ -488,43 +510,12 @@ function endedRecord(snapshot, given) {
 function observedPhase(input) {
   const { snapshot } = input;
   if (snapshot === null) return "resolving";
-  const raw = snapshot.phase;
-  const live = raw === "connected" || raw === "reconnecting";
-  if (endedRecord(snapshot, input.meeting ?? null) && !live) return "ended";
-  const reason = raw === "failed" ? snapshot.failure?.reason ?? null : null;
-  if (reason !== null) return reason === "ended" ? "ended" : `refused:${reason}`;
-  switch (raw) {
-    case "idle":
-    case "failed":
-    case "left":
-      return "prejoin";
-    case "lobby":
-      return waitingPhase(snapshot);
-    case "requesting-token":
-    case "connecting":
-      return "joining";
-    case "connected":
-    case "reconnecting":
-      return "in_call";
-  }
+  const phase = snapshot.phase;
+  if (endedRecord(snapshot, input.meeting ?? null) && !isLivePhase(phase) && !isCallPhase(phase)) return "ended";
+  return phase;
 }
-function waitingPhase(snapshot) {
-  switch (snapshot.waiting?.admission) {
-    case "waiting_host":
-      return "waiting:host_not_started";
-    case "denied":
-      return "denied";
-    case "expired":
-      return "knock_expired";
-    case "withdrawn":
-      return "left";
-    case "ended":
-      return "ended";
-    case "removed":
-      return "refused:removed";
-    default:
-      return "waiting:knocking";
-  }
+function isCallPhase(phase) {
+  return phase.startsWith("ringing_") || phase.startsWith("call_") || phase === "answered_elsewhere";
 }
 var ADMITTER_ROLES = /* @__PURE__ */ new Set(["host", "cohost"]);
 function observe(input) {
@@ -537,10 +528,10 @@ function observe(input) {
   const deviceInPlay = phase === "joining" || inCall;
   return {
     phase,
-    reason: phase.startsWith("refused:") ? phase.slice("refused:".length) : null,
+    reason: phase === "ended" ? snapshot?.reason ?? null : snapshot?.reason ?? reasonOf(phase),
     role,
-    connection: snapshot?.phase === "reconnecting" ? "reconnecting" : "stable",
-    hostPresent: inCall && snapshot !== null ? snapshot.participants.some((p) => ADMITTER_ROLES.has(p.role)) : snapshot?.phase === "lobby" ? snapshot.waiting?.admittersPresent ?? null : null,
+    connection: snapshot?.connection ?? "stable",
+    hostPresent: inCall && snapshot !== null ? snapshot.participants.some((p) => ADMITTER_ROLES.has(p.role)) : snapshot !== null && isWaitingPhase(snapshot.phase) ? snapshot.waiting?.admittersPresent ?? null : null,
     lobbyCount: canAdmit && snapshot !== null ? snapshot.lobby.filter((entry) => entry.state === "knocking").length : 0,
     recording: snapshot?.recording === "recording" || snapshot?.recording === "stopping",
     audioBlocked: null,
@@ -1054,7 +1045,7 @@ function useRoom() {
     (participant) => participant.identity === snapshot.localIdentity
   ) ?? null;
   return {
-    phase: snapshot?.phase ?? "idle",
+    phase: snapshot?.phase ?? "resolving",
     participants: snapshot?.participants ?? [],
     failure: snapshot?.failure ?? null,
     local,
@@ -1653,6 +1644,36 @@ function useCollabPanelRequest(onRequest) {
 var MEET_REACTIONS = ["\u{1F496}", "\u{1F44D}", "\u{1F389}", "\u{1F44F}", "\u{1F602}", "\u{1F62E}", "\u{1F622}", "\u{1F914}", "\u{1F44E}"];
 
 // src/react/facade.ts
+var NO_ACTIONS = {
+  join: async () => void 0,
+  rejoin: async () => void 0,
+  leave: async () => void 0,
+  backToPrejoin: () => void 0,
+  retry: () => void 0,
+  resolved: () => void 0,
+  dismissShareNotice: () => void 0,
+  dismissCall: () => void 0
+};
+function actionsFor(host) {
+  if (host === null) return NO_ACTIONS;
+  const { engine, store } = host;
+  return {
+    join: (request) => engine.join(request),
+    rejoin: () => engine.rejoin(),
+    leave: () => engine.leave(),
+    backToPrejoin: () => engine.backToPrejoin(),
+    retry: () => {
+      store.dispatch({ type: "retry", click: true });
+    },
+    resolved: () => {
+      store.dispatch({ type: "resolved" });
+    },
+    dismissShareNotice: () => engine.dismissShareNotice(),
+    dismissCall: () => {
+      if (store.dispatch({ type: "reset" })) store.patch({ call: null });
+    }
+  };
+}
 function useMeetCore() {
   const host = useMeetHost();
   const snapshot = useMeetSnapshot();
@@ -1660,9 +1681,24 @@ function useMeetCore() {
   const role = useRole();
   const isHost = useIsHost();
   const observation = useCoreObservation();
+  const actions = (0, import_react8.useMemo)(() => actionsFor(host), [host]);
   return (0, import_react8.useMemo)(
-    () => ({ host, snapshot, devices, role, isHost, observation }),
-    [host, snapshot, devices, role, isHost, observation]
+    () => ({
+      host,
+      snapshot,
+      devices,
+      role,
+      isHost,
+      observation,
+      phase: snapshot?.phase ?? "resolving",
+      reason: snapshot?.reason ?? null,
+      phaseNotice: snapshot?.phaseNotice ?? null,
+      connection: snapshot?.connection ?? "stable",
+      share: snapshot?.share ?? NO_SHARE,
+      call: snapshot?.call ?? null,
+      actions
+    }),
+    [host, snapshot, devices, role, isHost, observation, actions]
   );
 }
 
@@ -4609,11 +4645,52 @@ function MeetSkinRoom({
   headerControls,
   observe: observe2 = false
 }) {
-  const { host, snapshot, isHost } = useMeetCore();
+  const core = useMeetCore();
+  const { host, snapshot, isHost, phase } = core;
   const elapsed = useElapsed(snapshot?.meeting?.startedAt ?? null);
-  const phase = snapshot?.phase ?? "idle";
   if (host === null) return null;
-  if (phase === "idle" || phase === "failed" || phase === "left") {
+  const screen = (() => {
+    if (isRefusedPhase(phase)) return "refused";
+    switch (phase) {
+      case "resolving":
+        return "resolving";
+      case "prejoin":
+      case "guest_name":
+        return "prejoin";
+      case "joining":
+      case "in_call":
+        return "room";
+      case "waiting:host_not_started":
+      case "waiting:knocking":
+      case "denied":
+      case "knock_expired":
+        return "waiting";
+      case "left":
+        return snapshot?.waiting?.admission === "withdrawn" ? "waiting" : "exit";
+      case "disconnected":
+      case "removed":
+      case "superseded":
+      case "inactive":
+      case "unsupported":
+      case "ended":
+      case "record":
+      case "ringing_out":
+      case "ringing_in":
+      case "call_declined":
+      case "call_missed":
+      case "call_busy":
+      case "answered_elsewhere":
+        return "exit";
+      default: {
+        const unhandled = phase;
+        return unhandled;
+      }
+    }
+  })();
+  if (screen === "resolving") {
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__empty-body", role: "status", children: "Getting the meeting ready\u2026" }) });
+  }
+  if (screen === "prejoin") {
     return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
       PreJoin,
       {
@@ -4624,9 +4701,12 @@ function MeetSkinRoom({
       }
     ) });
   }
-  if (phase === "lobby") {
+  if (screen === "waiting") {
     return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet mx-meet--lobby", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(WaitingRoom, { host, ...onLeave !== void 0 ? { onLeave } : {} }) });
   }
+  if (screen === "refused" || screen === "exit") {
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet mx-meet--lobby", children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ExitScreen, { ...onLeave !== void 0 ? { onLeave } : {} }) });
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mx-meet", children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ConsentNotice, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(AttendanceNotice, {}),
@@ -4646,14 +4726,148 @@ function MeetSkinRoom({
       headerControls !== void 0 && headerControls !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "mx-meet__header-controls", "data-meet-header-controls": "", children: headerControls }) : null,
       isHost ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(HostMenu, {}) : null
     ] }),
-    phase === "reconnecting" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__banner", role: "status", children: "Reconnecting\u2026" }) : null,
+    core.connection !== "stable" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__banner", role: "status", children: "Reconnecting\u2026" }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ShareNotice, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Stage, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Captions, {}),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(ControlBar, { ...onLeave !== void 0 ? { onLeave } : {} })
   ] });
 }
+function ShareNotice() {
+  const { share, actions } = useMeetCore();
+  if (share.state !== "refused") return null;
+  const text = share.reason === "unsupported" ? "You can't share your screen from this browser" : share.reason === "blocked" ? "Screen sharing is blocked" : "Couldn't start sharing your screen";
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("p", { className: "mx-meet__banner", role: "status", "data-meet-notice": "share-unavailable", children: [
+    text,
+    share.remedy !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "mx-meet__remedy", children: share.remedy }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("button", { type: "button", className: "mx-meet__link", onClick: actions.dismissShareNotice, children: "Dismiss" })
+  ] });
+}
+var REFUSED_TITLES = {
+  not_found: "Check your meeting code",
+  cancelled: "This meeting was cancelled",
+  expired: "This meeting link has expired",
+  too_early: "This meeting hasn't started yet",
+  sign_in_required: "Sign in to join this meeting",
+  wrong_account: "You're signed in with a different account",
+  not_invited: "You aren't invited to this meeting",
+  locked: "This meeting is locked",
+  removed: "You can't rejoin this meeting",
+  lobby_rejects: "You can't ask to join this meeting",
+  meeting_full: "This meeting is full",
+  platform_capacity: "Meetings are busy right now",
+  verification_required: "Verify your account to join",
+  registration_required: "Register to join this meeting"
+};
+function ExitScreen({ onLeave }) {
+  const { phase, reason, host, snapshot, actions, call } = useMeetCore();
+  const [busy, setBusy] = (0, import_react10.useState)(false);
+  const failure = snapshot?.failure ?? null;
+  const rejoin = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_design_system.Button,
+    {
+      type: "button",
+      disabled: busy,
+      onClick: () => {
+        setBusy(true);
+        void actions.rejoin().catch(() => void 0).finally(() => setBusy(false));
+      },
+      children: "Rejoin"
+    }
+  );
+  const home = /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    "a",
+    {
+      className: "mx-meet__link",
+      href: "/",
+      onClick: (event) => {
+        if (call !== null) {
+          event.preventDefault();
+          actions.dismissCall();
+        }
+        if (onLeave !== void 0) {
+          event.preventDefault();
+          onLeave();
+        }
+      },
+      children: "Go home"
+    }
+  );
+  let title;
+  let line = null;
+  let notice = null;
+  let actionsNode = home;
+  if (phase.startsWith("refused:")) {
+    const code = phase.slice("refused:".length);
+    title = REFUSED_TITLES[code] ?? "You can't join this meeting";
+    line = failure?.remedy ?? null;
+    actionsNode = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_design_system.Button, { type: "button", variant: "outline", onClick: actions.retry, children: "Try again" }),
+      home
+    ] });
+  } else {
+    switch (phase) {
+      case "left":
+        title = "You left the meeting";
+        actionsNode = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+          rejoin,
+          home
+        ] });
+        break;
+      case "disconnected":
+        title = "You lost your connection to the meeting";
+        line = failure?.remedy ?? "Check your internet connection, then rejoin.";
+        notice = "disconnected";
+        actionsNode = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+          rejoin,
+          home
+        ] });
+        break;
+      case "removed":
+        title = "You've been removed from the meeting";
+        notice = "removed";
+        break;
+      case "superseded":
+        title = "You joined from another tab or device";
+        line = "This screen left the meeting so you aren't in it twice.";
+        notice = "displaced";
+        actionsNode = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+          rejoin,
+          home
+        ] });
+        break;
+      case "inactive":
+        title = "You left the meeting because this tab was inactive";
+        actionsNode = /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_jsx_runtime6.Fragment, { children: [
+          rejoin,
+          home
+        ] });
+        break;
+      case "unsupported":
+        title = "This browser can't join meetings";
+        line = "Open the link in Chrome, Edge, Firefox or Safari.";
+        break;
+      case "ended":
+      case "record":
+        title = reason === "time_limit" ? "The meeting reached its time limit" : "The meeting has ended";
+        notice = "meeting-ended";
+        break;
+      default:
+        title = "The call has ended";
+        break;
+    }
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mx-meet__waiting", "data-meet-exit": phase, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Avatar, { name: host?.identity.displayName ?? "", url: host?.identity.avatarUrl ?? null, size: 72 }),
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h1", { className: "mx-meet__prejoin-title", children: title }),
+    line !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__empty-body", children: line }) : null,
+    notice !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { role: "status", "data-meet-notice": notice, className: "mx-meet__sr-only", children: title }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet__waiting-actions", children: actionsNode })
+  ] });
+}
 function WaitingRoom({ host, onLeave }) {
   const { waiting, withdraw, askAgain } = useWaiting();
+  const { phaseNotice } = useMeetCore();
   const [busy, setBusy] = (0, import_react10.useState)(false);
   const admission = waiting?.admission ?? "knocking";
   const run = (action) => () => {
@@ -4702,6 +4916,7 @@ function WaitingRoom({ host, onLeave }) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("div", { className: "mx-meet__waiting", children: [
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Avatar, { name: host.identity.displayName, url: host.identity.avatarUrl, size: 72 }),
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("h1", { className: "mx-meet__prejoin-title", children: title }),
+    phaseNotice === "sent-to-waiting" ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__empty-body", role: "status", "data-meet-notice": "sent-to-waiting", children: "The host moved you back to the waiting room" }) : null,
     line !== null ? /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("p", { className: "mx-meet__empty-body", role: "status", "data-meet-notice": "host-absent", children: line }) : null,
     /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { className: "mx-meet__waiting-actions", children: actions })
   ] });