@hgdc/ui 0.16.1 → 0.17.0

package/dist/app-shell.js

@@ -12,6 +12,7 @@ import { isApplePlatform, Kbd, KbdGroup } from "./kbd.js";
 import { CONTENT_LOADING_LAYER, ContentLoadingContext, PAGE_PENDING_MIN_MS, PAGE_PENDING_MS, PagePending, } from "./page-pending.js";
 import { ProductBadge } from "./product-badge.js";
 import { ProductRail } from "./product-rail.js";
+import { useProductSwitch } from "./product-switch.js";
 import { HGDC_ACCOUNT, HGDC_PRODUCTS } from "./products.js";
 import { ProductRailShownContext, ShellLeaveContext } from "./shell-placement.js";
 import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.js";
@@ -177,6 +178,8 @@ export function AppShell({ product, organization, productRail = true, accountHre
     // Barre des produits élargie : la barre latérale se plie le temps du survol (ADR 0011).
     const [railPeek, setRailPeek] = useState(false);
     useToggleShortcut();
+    // Relecture des organisations après un passage depuis la barre, préchargement des autres produits (ADR 0016).
+    useProductSwitch(productRail);
     // Chargement de la zone de contenu (ADR 0015) : une navigation en cours (après 50 ms), une page
     // qui attend (`PagePending`, aussitôt : le routeur a déjà attendu), ou le départ vers un autre
     // produit (aussitôt). Une fois montré, au moins 300 ms. Le H est celui du document, en position

package/dist/product-switch.d.ts

@@ -0,0 +1,29 @@
+/** Cookie posé par l'entrée : relire les organisations en arrière-plan. */
+export declare const ORG_SYNC_COOKIE = "hgdc-org-sync";
+/** Cadre caché de la relecture : l'entrée repasse par Account, retour sur une réponse vide. */
+export declare const BACKGROUND_REFRESH_PATH = "/auth/hgdc?refresh=1&frame=1";
+/** Abandon du cadre s'il ne s'est pas chargé : Account injoignable, réseau coupé. */
+export declare const BACKGROUND_REFRESH_TIMEOUT_MS = 20000;
+/**
+ * Liens préchargés au survol : l'entrée d'un autre produit en `refresh=background`. Elle ne fait
+ * que lire la session et rediriger ; sans session, elle répond 503 à un préchargement (rien n'est
+ * créé), et le clic repart normalement. Jamais de `prerender` : la page d'arrivée lit un cookie et
+ * ouvre un cadre, ce qu'un prérendu ferait pour un simple survol.
+ */
+export declare const PRODUCT_PREFETCH_RULES: string;
+/** Lit et efface le cookie de relecture. Vrai s'il était posé. */
+export declare function takeOrgSyncCookie(doc?: Document): boolean;
+/**
+ * Relit les organisations dans un cadre caché, une fois, si l'entrée l'a demandé. Le cadre n'a
+ * ni script ni formulaire (`sandbox`), il suit seulement les redirections d'Account ; la nouvelle
+ * session du produit recopie les organisations, et les requêtes Convex abonnées se mettent à jour.
+ * Si la session d'Account a expiré, Account refuse d'être affiché dans un cadre : rien ne se passe,
+ * la session du produit reste celle d'avant.
+ */
+export declare function startBackgroundRefresh(doc?: Document): HTMLIFrameElement | null;
+/**
+ * À monter une fois par document dans la coque (`AppShell` le fait) : relecture en arrière-plan
+ * après un passage depuis la barre, et préchargement au survol des autres produits. Le cadre vit
+ * hors de l'arbre React : un démontage ne l'interrompt pas, il se retire seul.
+ */
+export declare function useProductSwitch(enabled?: boolean): void;

package/dist/product-switch.js

@@ -0,0 +1,92 @@
+import { useEffect } from "react";
+/*
+ * Passage d'un produit à l'autre (ADR 0016) : la barre des produits pointe vers
+ * `/auth/hgdc?refresh=background&next=/`. Avec une session du produit ouverte, l'entrée de
+ * `@hgdc/auth` va droit à la page et pose un cookie « relire les organisations » ; la coque le lit
+ * ici et relit les organisations dans un cadre caché, sans faire attendre la personne.
+ *
+ * Les trois noms ci-dessous sont ceux de `@hgdc/auth` (`HGDC_ORG_SYNC_COOKIE`,
+ * `HGDC_BACKGROUND_REFRESH_PATH`, `HGDC_ENTRY_REFRESH_BACKGROUND`) : `@hgdc/ui` n'en dépend pas,
+ * un test de `@hgdc/auth` vérifie qu'ils restent égaux.
+ */
+/** Cookie posé par l'entrée : relire les organisations en arrière-plan. */
+export const ORG_SYNC_COOKIE = "hgdc-org-sync";
+/** Cadre caché de la relecture : l'entrée repasse par Account, retour sur une réponse vide. */
+export const BACKGROUND_REFRESH_PATH = "/auth/hgdc?refresh=1&frame=1";
+/** Abandon du cadre s'il ne s'est pas chargé : Account injoignable, réseau coupé. */
+export const BACKGROUND_REFRESH_TIMEOUT_MS = 20_000;
+/**
+ * Liens préchargés au survol : l'entrée d'un autre produit en `refresh=background`. Elle ne fait
+ * que lire la session et rediriger ; sans session, elle répond 503 à un préchargement (rien n'est
+ * créé), et le clic repart normalement. Jamais de `prerender` : la page d'arrivée lit un cookie et
+ * ouvre un cadre, ce qu'un prérendu ferait pour un simple survol.
+ */
+export const PRODUCT_PREFETCH_RULES = JSON.stringify({
+    prefetch: [
+        {
+            source: "document",
+            where: { href_matches: "https://*.hgdc.ch/auth/hgdc?refresh=background*" },
+            eagerness: "moderate",
+        },
+    ],
+});
+/** Lit et efface le cookie de relecture. Vrai s'il était posé. */
+export function takeOrgSyncCookie(doc = document) {
+    const present = doc.cookie.split(";").some((part) => part.trim() === `${ORG_SYNC_COOKIE}=1`);
+    if (present) {
+        const secure = doc.location.protocol === "https:" ? "; Secure" : "";
+        doc.cookie = `${ORG_SYNC_COOKIE}=; Path=/; Max-Age=0; SameSite=Lax${secure}`;
+    }
+    return present;
+}
+/**
+ * Relit les organisations dans un cadre caché, une fois, si l'entrée l'a demandé. Le cadre n'a
+ * ni script ni formulaire (`sandbox`), il suit seulement les redirections d'Account ; la nouvelle
+ * session du produit recopie les organisations, et les requêtes Convex abonnées se mettent à jour.
+ * Si la session d'Account a expiré, Account refuse d'être affiché dans un cadre : rien ne se passe,
+ * la session du produit reste celle d'avant.
+ */
+export function startBackgroundRefresh(doc = document) {
+    if (!takeOrgSyncCookie(doc))
+        return null;
+    const frame = doc.createElement("iframe");
+    frame.hidden = true;
+    frame.tabIndex = -1;
+    frame.title = "";
+    frame.setAttribute("aria-hidden", "true");
+    // Même origine pour les cookies du produit ; ni script, ni formulaire, ni navigation de la page.
+    frame.setAttribute("sandbox", "allow-same-origin");
+    frame.referrerPolicy = "no-referrer";
+    const done = () => {
+        window.clearTimeout(timer);
+        frame.remove();
+    };
+    const timer = window.setTimeout(done, BACKGROUND_REFRESH_TIMEOUT_MS);
+    frame.addEventListener("load", done, { once: true });
+    frame.src = BACKGROUND_REFRESH_PATH;
+    doc.body.append(frame);
+    return frame;
+}
+/**
+ * À monter une fois par document dans la coque (`AppShell` le fait) : relecture en arrière-plan
+ * après un passage depuis la barre, et préchargement au survol des autres produits. Le cadre vit
+ * hors de l'arbre React : un démontage ne l'interrompt pas, il se retire seul.
+ */
+export function useProductSwitch(enabled = true) {
+    useEffect(() => {
+        if (enabled)
+            startBackgroundRefresh();
+    }, [enabled]);
+    useEffect(() => {
+        if (!enabled)
+            return;
+        if (typeof HTMLScriptElement === "undefined" || !HTMLScriptElement.supports?.("speculationrules"))
+            return;
+        // Créé par le DOM, pas par React : un script inséré par `innerHTML` n'est jamais lu.
+        const script = document.createElement("script");
+        script.type = "speculationrules";
+        script.textContent = PRODUCT_PREFETCH_RULES;
+        document.head.append(script);
+        return () => script.remove();
+    }, [enabled]);
+}

package/dist/products.d.ts

@@ -16,9 +16,10 @@ export type HgdcCatalogProduct = {
     href: string;
     /**
      * Entrée dans l'app avec la session HGDC Account (`PRODUCT_ENTRY_PATH`), sans page d'accueil
-     * ni bouton de connexion : `https://<mot>.hgdc.ch/auth/hgdc?refresh=1&next=/`. `refresh=1`
-     * relit les organisations au passage (une organisation rejointe dans Account apparaît sans se
-     * reconnecter, ADR 0013). Pour Account, sa racine.
+     * ni bouton de connexion : `https://<mot>.hgdc.ch/auth/hgdc?refresh=background&next=/`. Avec une
+     * session du produit ouverte, on arrive tout de suite et les organisations se relisent en
+     * arrière-plan (une organisation rejointe dans Account apparaît sans se reconnecter, ADR 0013,
+     * 0016). Pour Account, sa racine.
      */
     entryHref: string;
     /** Une phrase, au tutoiement. */
@@ -40,8 +41,11 @@ export type HgdcCatalogProduct = {
  * quand cette session existe.
  */
 export declare const PRODUCT_ENTRY_PATH = "/auth/hgdc";
-/** Requête de l'entrée depuis un autre produit : relire les organisations, arriver sur l'accueil. */
-export declare const PRODUCT_ENTRY_REFRESH_QUERY = "refresh=1&next=/";
+/**
+ * Requête de l'entrée depuis un autre produit : arriver sur l'accueil, relire les organisations en
+ * arrière-plan (`refresh=background`, ADR 0016).
+ */
+export declare const PRODUCT_ENTRY_REFRESH_QUERY = "refresh=background&next=/";
 export declare const HGDC_ACCOUNT: HgdcCatalogProduct;
 /** Les produits de la famille, dans leur ordre d'affichage. Account n'en fait pas partie (`HGDC_ACCOUNT`). */
 export declare const HGDC_PRODUCTS: ReadonlyArray<HgdcCatalogProduct>;
@@ -83,7 +87,7 @@ export type ProductRailEntry = {
 /**
  * Les entrées de la barre des produits : les produits ouverts du catalogue et Account, affiché en
  * tête (le compte commun, pas un produit). Chaque produit pointe vers son entrée
- * `/auth/hgdc?refresh=1&next=/` (ADR 0010, 0013), Account vers sa racine (`accountHref` en
+ * `/auth/hgdc?refresh=background&next=/` (ADR 0010, 0013, 0016), Account vers sa racine (`accountHref` en
  * développement). Le produit courant pointe vers `/`, sans détour par l'entrée.
  */
 export declare function productRailEntries(options?: {

package/dist/products.js

@@ -18,8 +18,11 @@ export const PRODUCT_STAGE_LABEL = {
  * quand cette session existe.
  */
 export const PRODUCT_ENTRY_PATH = "/auth/hgdc";
-/** Requête de l'entrée depuis un autre produit : relire les organisations, arriver sur l'accueil. */
-export const PRODUCT_ENTRY_REFRESH_QUERY = "refresh=1&next=/";
+/**
+ * Requête de l'entrée depuis un autre produit : arriver sur l'accueil, relire les organisations en
+ * arrière-plan (`refresh=background`, ADR 0016).
+ */
+export const PRODUCT_ENTRY_REFRESH_QUERY = "refresh=background&next=/";
 function product(word, pitch, icon, stage) {
     const badge = word.toLowerCase();
     if (!isFamilyProduct(badge))
@@ -77,7 +80,7 @@ export function productMenuEntries(options = {}) {
 /**
  * Les entrées de la barre des produits : les produits ouverts du catalogue et Account, affiché en
  * tête (le compte commun, pas un produit). Chaque produit pointe vers son entrée
- * `/auth/hgdc?refresh=1&next=/` (ADR 0010, 0013), Account vers sa racine (`accountHref` en
+ * `/auth/hgdc?refresh=background&next=/` (ADR 0010, 0013, 0016), Account vers sa racine (`accountHref` en
  * développement). Le produit courant pointe vers `/`, sans détour par l'entrée.
  */
 export function productRailEntries(options = {}) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hgdc/ui",
-  "version": "0.16.1",
+  "version": "0.17.0",
   "description": "Interface de la H family : jetons de la DA, thèmes, polices et composants.",
   "license": "UNLICENSED",
   "homepage": "https://github.com/hugogebel-boop/hgdc-kit/tree/main/packages/ui#readme",