@anchrd/intel-ui 0.8.6 → 0.8.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@anchrd/intel-ui",
-  "version": "0.8.6",
+  "version": "0.8.7",
   "type": "module",
   "license": "UNLICENSED",
   "repository": {

package/src/data/sign-in/sign-in.ts

@@ -65,3 +65,33 @@ export function createBrowserSignIn(loginPath: (returnTo?: string) => string): S
     loginPath,
   });
 }
+
+/**
+ * What to do with a 401, across all of them at once (#130).
+ *
+ * ⚠️ The reason this is a guard and not a call to `attempt()` at each 401: a first load without a
+ * session fires several requests together — session, tree, flows — and every one of them answers
+ * 401. The first starts the redirect; the rest arrive while the browser is still on this page,
+ * find the marker the first one just wrote, and read it as "we already tried, this is a loop". It
+ * is not — it is this very sign-in, still in flight.
+ *
+ * Without `leaving`, the interface refuses itself before it can leave, and nobody reaches the
+ * login at all. That is worse than the loop this whole mechanism exists to prevent: a loop still
+ * eventually shows a login, a self-refusal never does.
+ */
+export function createSignInGuard(signIn: SignIn, onRefused: () => void): () => void {
+  let leaving = false;
+  // Latches for its own reason: once the surface has turned down a freshly issued credential,
+  // later 401s say nothing new, and repainting for each would flicker the screen once per request
+  // the page had in flight.
+  let refused = false;
+  return () => {
+    if (leaving || refused) return;
+    if (signIn.attempt()) {
+      leaving = true;
+      return;
+    }
+    refused = true;
+    onRefused();
+  };
+}

package/src/main.tsx

@@ -6,7 +6,7 @@ import {
   createIntelDataProvider,
   loginPath,
 } from "@/data/intel-data-provider/intel-data-provider.ts";
-import { createBrowserSignIn } from "@/data/sign-in/sign-in.ts";
+import { createBrowserSignIn, createSignInGuard } from "@/data/sign-in/sign-in.ts";
 import { createI18n } from "@/i18n/i18n.ts";
 import { createIntelRouter } from "@/router/router.tsx";
 import { SignInRefused } from "@/sign-in-refused/sign-in-refused.tsx";
@@ -23,18 +23,15 @@ const signIn = createBrowserSignIn(loginPath);
 const mounted = createRoot(root);
 const queryClient = new QueryClient();
 
-// ⚠️ The shell is painted from a function because a refused sign-in has to replace it, and that
-// refusal arrives from inside a fetch rather than from React. `refused` latches: once the surface
-// has turned down a freshly issued credential, later 401s say nothing new, and re-painting for each
-// one would flicker the screen as many times as the page had requests in flight (#118).
+// The shell is painted from a function because a refused sign-in has to replace it, and that
+// refusal arrives from inside a fetch rather than from React.
 let refused = false;
 
 const data = createIntelDataProvider({
-  onUnauthorized: () => {
-    if (signIn.attempt() || refused) return;
+  onUnauthorized: createSignInGuard(signIn, () => {
     refused = true;
     paint();
-  },
+  }),
 });
 const router = createIntelRouter({ data, i18n });