@the-portland-company/shell 0.75.2 → 0.76.1

package/dist/app-chrome.cjs

@@ -538,6 +538,9 @@ function useChromeMe() {
   const ctx = react.useContext(NavChromeContext);
   return { me: ctx?.me ?? null, loaded: ctx?.meLoaded ?? false };
 }
+function useNavChromeDedupedFetch() {
+  return react.useContext(NavChromeContext)?.dedupedFetch ?? null;
+}
 function useNavChromeFetcher() {
   return react.useContext(NavChromeContext)?.fetchJson ?? null;
 }
@@ -550,12 +553,16 @@ function useNavChrome(component) {
   }
   return ctx;
 }
-function useChromeOrgs() {
+function useChromeOrgs({ enabled = true } = {}) {
   const { dedupedFetch } = useNavChrome("useChromeOrgs");
   const [orgs, setOrgs] = react.useState(null);
-  const [loading, setLoading] = react.useState(true);
+  const [loading, setLoading] = react.useState(enabled);
   const [error, setError] = react.useState(false);
   react.useEffect(() => {
+    if (!enabled) {
+      setLoading(false);
+      return;
+    }
     let cancelled = false;
     setLoading(true);
     setError(false);
@@ -571,7 +578,7 @@ function useChromeOrgs() {
     return () => {
       cancelled = true;
     };
-  }, [dedupedFetch]);
+  }, [dedupedFetch, enabled]);
   return { orgs, loading, error };
 }
 function ValueSkeleton({ className }) {
@@ -861,6 +868,10 @@ function FuelAction({ orgId }) {
   const [error, setError] = react.useState(false);
   react.useEffect(() => {
     let cancelled = false;
+    if (!orgId) {
+      setLoading(false);
+      return;
+    }
     setLoading(true);
     setError(false);
     setFuel(null);
@@ -1096,6 +1107,10 @@ function NotificationsAction({ orgId }) {
   }, [orgId]);
   react.useEffect(() => {
     let cancelled = false;
+    if (!orgId) {
+      setLoading(false);
+      return;
+    }
     setLoading(true);
     setError(false);
     setPayload(null);
@@ -1335,10 +1350,14 @@ function composeSupportMessage(input) {
 ---
 ${ctx.join("\n")}`;
 }
-function SupportAction({ orgId } = {}) {
+function SupportAction({
+  orgId,
+  orgs: knownOrgs
+} = {}) {
   const { fetchJson } = useNavChrome("SupportAction");
   const { me, loaded } = useChromeMe();
-  const { orgs } = useChromeOrgs();
+  const { orgs: fetchedOrgs } = useChromeOrgs({ enabled: !knownOrgs });
+  const orgs = knownOrgs ?? fetchedOrgs;
   const [open, setOpen] = react.useState(false);
   const [message, setMessage] = react.useState("");
   const [email, setEmail] = react.useState("");
@@ -3855,6 +3874,85 @@ function resolveActiveOrg(search) {
   if (fromUrl) return fromUrl;
   return readActiveOrgCookie();
 }
+var ORG_ID_QUERY_PARAM = "org_id";
+var ORG_ID_TAIL_LENGTH = 7;
+var LEGACY_ORG_TAIL_LENGTH = 6;
+var TAIL_RE = /^[0-9a-f]{6,7}$/i;
+var AUTH_BASE_URL = "https://auth.politogyvrm.com";
+var AUTH_BASE_URL_STAGING = "https://auth-staging.politogyvrm.com";
+function orgIdTail(orgId) {
+  return isOrgId(orgId) ? orgId.trim().toLowerCase().slice(-ORG_ID_TAIL_LENGTH) : null;
+}
+function isOrgSelector(v) {
+  return typeof v === "string" && (UUID_RE.test(v.trim()) || TAIL_RE.test(v.trim()));
+}
+function matchOrgSelector(selector, orgs) {
+  if (!isOrgSelector(selector)) return null;
+  const sel = selector.trim().toLowerCase();
+  if (UUID_RE.test(sel)) return orgs.find((o) => o.id.toLowerCase() === sel) ?? null;
+  if (sel.length !== ORG_ID_TAIL_LENGTH && sel.length !== LEGACY_ORG_TAIL_LENGTH) return null;
+  const hits = orgs.filter((o) => o.id.toLowerCase().endsWith(sel));
+  return hits.length === 1 ? hits[0] : null;
+}
+function readOrgSelectorFromUrl(search) {
+  if (!search) return null;
+  try {
+    const qs = search.includes("?") ? search.slice(search.indexOf("?") + 1) : search;
+    const params = new URLSearchParams(qs);
+    for (const key of [ORG_ID_QUERY_PARAM, ACTIVE_ORG_QUERY_PARAM]) {
+      const v = params.get(key);
+      if (isOrgSelector(v)) return v.trim().toLowerCase();
+    }
+    return null;
+  } catch {
+    return null;
+  }
+}
+function orgClaimsFrom(claims) {
+  if (!claims || typeof claims !== "object") return null;
+  const c = claims;
+  if (!isOrgId(c.org_id)) return null;
+  return {
+    orgId: c.org_id.trim().toLowerCase(),
+    orgRole: typeof c.org_role === "string" ? c.org_role : null
+  };
+}
+function authBaseUrl() {
+  if (typeof window !== "undefined" && window.location.hostname.toLowerCase().includes("staging")) {
+    return AUTH_BASE_URL_STAGING;
+  }
+  return AUTH_BASE_URL;
+}
+var ActiveOrgSwitchError = class extends Error {
+  constructor(status, message) {
+    super(message);
+    this.status = status;
+    this.name = "ActiveOrgSwitchError";
+  }
+};
+async function switchActiveOrg(orgId, opts = {}) {
+  if (!isOrgId(orgId)) throw new ActiveOrgSwitchError(400, "org_id must be a full uuid");
+  const doFetch = opts.fetch ?? fetch;
+  const res = await doFetch(`${opts.authBaseUrl ?? authBaseUrl()}/api/active-org`, {
+    method: "POST",
+    credentials: "include",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ org_id: orgId })
+  });
+  if (!res.ok) {
+    let msg = `active-org switch failed (${res.status})`;
+    try {
+      const body = await res.json();
+      if (body?.error) msg = body.error;
+    } catch {
+    }
+    throw new ActiveOrgSwitchError(res.status, msg);
+  }
+  const claims = orgClaimsFrom(await res.json().catch(() => null));
+  if (!claims) throw new ActiveOrgSwitchError(502, "active-org switch returned no org_id");
+  writeActiveOrgCookie(claims.orgId);
+  return claims;
+}
 
 // src/lib/breadcrumbs.ts
 function deriveBreadcrumbs(items, pathname, opts) {
@@ -4533,6 +4631,7 @@ function PolitogyAppFrame({
       fetchJson: data?.fetchJson,
       devNotes: data?.devNotes,
       org: data?.org,
+      tokenOrg: data?.tokenOrg,
       identity: {
         userId: session.userId,
         userName: session.userName ?? null,
@@ -4813,6 +4912,107 @@ var ChromeStateContext = react.createContext(null);
 function useChromeState() {
   return react.useContext(ChromeStateContext);
 }
+function TokenChromeStateProvider({
+  tokenOrg,
+  children
+}) {
+  const { orgs: fetchedOrgs, loading: orgsFetching, error: orgsError } = useChromeOrgs({
+    enabled: !tokenOrg.orgs
+  });
+  const [navDisplay, setNavDisplayState] = react.useState(NAV_DISPLAY_DEFAULT);
+  const [pendingOrg, setPendingOrg] = react.useState(null);
+  const tokenOrgRef = react.useRef(tokenOrg);
+  tokenOrgRef.current = tokenOrg;
+  react.useEffect(() => {
+    setNavDisplayState(resolveNavDisplay());
+  }, []);
+  const orgs = react.useMemo(
+    () => tokenOrg.orgs ?? (fetchedOrgs ?? []).map((o) => ({
+      id: o.id,
+      name: o.name,
+      logoUrl: o.logoUrl,
+      brandColor: o.brandColor,
+      role: o.role,
+      rawRole: o.rawRole ?? null
+    })),
+    [tokenOrg.orgs, fetchedOrgs]
+  );
+  const [urlSelector] = react.useState(
+    () => typeof window === "undefined" ? null : readOrgSelectorFromUrl(window.location.search)
+  );
+  const overrideOrg = react.useMemo(
+    () => urlSelector ? matchOrgSelector(urlSelector, orgs)?.id ?? null : null,
+    [urlSelector, orgs]
+  );
+  const orgId = pendingOrg ?? (tokenOrg.orgId && overrideOrg ? overrideOrg : tokenOrg.orgId);
+  const reexchangedFor = react.useRef(null);
+  react.useEffect(() => {
+    if (!overrideOrg || !tokenOrg.orgId || overrideOrg === tokenOrg.orgId) return;
+    if (reexchangedFor.current === overrideOrg) return;
+    reexchangedFor.current = overrideOrg;
+    void Promise.resolve(tokenOrgRef.current.onReexchange(overrideOrg, { perTab: true })).catch(
+      () => {
+      }
+    );
+  }, [overrideOrg, tokenOrg.orgId]);
+  react.useEffect(() => {
+    if (pendingOrg && tokenOrg.orgId === pendingOrg) setPendingOrg(null);
+  }, [pendingOrg, tokenOrg.orgId]);
+  const setOrgId = react.useCallback((id) => {
+    const current = tokenOrgRef.current;
+    if (!isOrgId(id) || id === (current.orgId ?? null)) return;
+    setPendingOrg(id);
+    void (async () => {
+      try {
+        const claims = await switchActiveOrg(id, { authBaseUrl: current.authBaseUrl });
+        try {
+          const url = new URL(window.location.href);
+          url.searchParams.delete(ACTIVE_ORG_QUERY_PARAM);
+          url.searchParams.set(ORG_ID_QUERY_PARAM, orgIdTail(claims.orgId));
+          window.history.replaceState(window.history.state, "", url.toString());
+        } catch {
+        }
+        await tokenOrgRef.current.onReexchange(claims.orgId, { perTab: false });
+      } catch (err) {
+        setPendingOrg(null);
+        tokenOrgRef.current.onSwitchError?.(err);
+      }
+    })();
+  }, []);
+  const setNavDisplay = react.useCallback((m) => {
+    setNavDisplayState(m);
+    writeNavDisplayLocal(m);
+    writeNavDisplayCookie(m);
+  }, []);
+  react.useEffect(() => {
+    if (!isOrgId(orgId)) return;
+    try {
+      const url = new URL(window.location.href);
+      const tail = orgIdTail(orgId);
+      if (url.searchParams.has(ACTIVE_ORG_QUERY_PARAM) || url.searchParams.get(ORG_ID_QUERY_PARAM) !== tail) {
+        url.searchParams.delete(ACTIVE_ORG_QUERY_PARAM);
+        url.searchParams.set(ORG_ID_QUERY_PARAM, tail);
+        window.history.replaceState(window.history.state, "", url.toString());
+      }
+    } catch {
+    }
+  }, [orgId]);
+  react.useEffect(() => {
+    if (isOrgId(tokenOrg.orgId) && !pendingOrg) writeActiveOrgCookie(tokenOrg.orgId);
+  }, [tokenOrg.orgId, pendingOrg]);
+  const value = react.useMemo(
+    () => ({
+      orgId,
+      setOrgId,
+      orgs,
+      orgsLoading: !tokenOrg.orgs && orgsFetching && !orgsError && !fetchedOrgs,
+      navDisplay,
+      setNavDisplay
+    }),
+    [orgId, setOrgId, orgs, tokenOrg.orgs, orgsFetching, orgsError, fetchedOrgs, navDisplay, setNavDisplay]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(ChromeStateContext.Provider, { value, children });
+}
 function ChromeStateProvider({
   controlledOrg,
   children
@@ -5116,6 +5316,7 @@ function PolitogyAppChrome({
   fetchJson: fetchJsonOverride,
   devNotes,
   org,
+  tokenOrg,
   identity,
   children
 }) {
@@ -5134,7 +5335,7 @@ function PolitogyAppChrome({
     [proxyBasePath]
   );
   const fetchJson = fetchJsonOverride ?? proxyFetchJson;
-  return /* @__PURE__ */ jsxRuntime.jsx(NavChromeProvider, { fetchJson, children: /* @__PURE__ */ jsxRuntime.jsx(ChromeStateProvider, { controlledOrg: org, children: /* @__PURE__ */ jsxRuntime.jsx(
+  const devNotesTree = /* @__PURE__ */ jsxRuntime.jsx(
     AppDevNotes,
     {
       storagePrefix,
@@ -5143,11 +5344,13 @@ function PolitogyAppChrome({
       identity,
       children
     }
-  ) }) });
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(NavChromeProvider, { fetchJson, children: tokenOrg ? /* @__PURE__ */ jsxRuntime.jsx(TokenChromeStateProvider, { tokenOrg, children: devNotesTree }) : /* @__PURE__ */ jsxRuntime.jsx(ChromeStateProvider, { controlledOrg: org, children: devNotesTree }) });
 }
 function ChromeTopBarActions() {
   const state = useChromeState();
   if (!state) return null;
+  const settledOrgId = state.orgsLoading ? null : state.orgId;
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       TopBarWidgetSlot,
@@ -5157,10 +5360,10 @@ function ChromeTopBarActions() {
         children: /* @__PURE__ */ jsxRuntime.jsx(ChromeDevNotesMenu, {})
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx(FuelAction, { orgId: state.orgId }),
+    /* @__PURE__ */ jsxRuntime.jsx(FuelAction, { orgId: settledOrgId }),
     /* @__PURE__ */ jsxRuntime.jsx(SpecOverlayAction, { orgId: state.orgId, orgName: state.orgs.find((o) => o.id === state.orgId)?.name ?? null }),
-    /* @__PURE__ */ jsxRuntime.jsx(NotificationsAction, { orgId: state.orgId }),
-    /* @__PURE__ */ jsxRuntime.jsx(SupportAction, { orgId: state.orgId })
+    /* @__PURE__ */ jsxRuntime.jsx(NotificationsAction, { orgId: settledOrgId }),
+    /* @__PURE__ */ jsxRuntime.jsx(SupportAction, { orgId: state.orgId, orgs: state.orgs.length ? state.orgs : void 0 })
   ] });
 }
 function ChromeDevNotesMenu() {
@@ -5246,7 +5449,8 @@ var MODE_DEFS = [
 function useChromeMode(arg = {}) {
   const { fallbackModeId = "relationship", pinnedModeId } = typeof arg === "string" ? { fallbackModeId: arg, pinnedModeId: void 0 } : arg;
   const ctx = react.useContext(ChromeStateContext);
-  const nav = useNavChromeFetcher();
+  const dedupedFetch = useNavChromeDedupedFetch();
+  const { me, loaded: meLoaded } = useChromeMe();
   const orgId = ctx?.orgId ?? null;
   const [entitled, setEntitled] = react.useState(null);
   const [selectedModeId, setSelectedModeId] = react.useState(null);
@@ -5258,9 +5462,14 @@ function useChromeMode(arg = {}) {
     }
   }, []);
   react.useEffect(() => {
-    if (!nav || !orgId) return;
+    if (!dedupedFetch || !orgId || !meLoaded) return;
+    const bootMe = me;
+    if (bootMe && bootMe.account === orgId && bootMe.modes !== void 0) {
+      setEntitled(bootMe.modes ?? null);
+      return;
+    }
     let cancelled = false;
-    nav("me", { headers: { "x-contacts-org": orgId } }).then((data) => {
+    dedupedFetch("me", { headers: { "x-contacts-org": orgId } }, { orgId }).then((data) => {
       if (cancelled) return;
       const modes = data?.modes ?? null;
       setEntitled(modes);
@@ -5269,7 +5478,7 @@ function useChromeMode(arg = {}) {
     return () => {
       cancelled = true;
     };
-  }, [nav, orgId]);
+  }, [dedupedFetch, me, meLoaded, orgId]);
   const options = MODE_DEFS.filter((m) => entitled?.[m.id]);
   const pinned = pinnedModeId ? MODE_DEFS.find((m) => m.id === pinnedModeId) ?? null : null;
   const selected = selectedModeId ? options.find((m) => m.id === selectedModeId) ?? null : null;