@aiquants/auth-react-router 0.12.0 → 0.13.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aiquants/auth-react-router",
-  "version": "0.12.0",
+  "version": "0.13.1",
   "description": "React Router v7 / v8 auth adapter for @aiquants/auth-core: Google OAuth strategy factory (remix-auth), cookie session storage with DI test backdoor, a loader guard that authenticates at most once per request (token refresh + photo cache), auth route handlers, and a <GoogleForm> login button.",
   "sideEffects": [
     "**/*.css"

package/src/admin/format.ts

@@ -21,13 +21,29 @@ export function fill(template: string, values: Record<string, string | number>):
 }
 
 /**
- * Formats an ISO timestamp with the locale the labels declare, not the runtime's.
- * ISO 時刻を、実行環境ではなく **ラベルが宣言したロケール** で整形する処理。
+ * Formats an ISO timestamp with the locale the labels declare, degrading instead of throwing.
+ * ISO 時刻を **ラベルが宣言したロケール** で整形する処理 (例外を投げず、読める形へ退避する)。
  *
- * @param iso ISO 8601 timestamp. ISO 8601 の時刻。
+ * `Intl.DateTimeFormat().format()` は不正な日時で `RangeError` を投げる (`toLocaleString()` が
+ * 「Invalid Date」を返すのとは違う)。この関数を呼ぶのはシェルの同期バナーであり、バナーは
+ * **全タブで描かれる**。上流の 1 行が壊れた時刻を持っていただけで、ユーザー管理面が丸ごと
+ * エラー境界へ落ちる。ロケール文字列が空でも同じく投げるため、そこも退避する。
+ *
+ * オフセットの無い ISO 文字列 (`2026-03-01T09:00:00`) は仕様上 **実行環境の時間帯** で解釈される。
+ * サーバーとブラウザで別の時刻になり水和が壊れるため、UTC として読む。
+ *
+ * @param iso ISO 8601 timestamp. ISO 8601 の時刻 (オフセット無しは UTC として解釈)。
  * @param labels Resolved label set carrying locale and time zone. ロケールと時間帯を持つラベル。
- * @returns Formatted text. 整形済みの文言。
+ * @returns Formatted text, or the input itself when it cannot be formatted. 整形済みの文言 (整形できない場合は入力そのもの)。
  */
 export function formatDateTime(iso: string, labels: UserAdminLabels): string {
-    return new Intl.DateTimeFormat(labels.locale, { timeZone: labels.timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(iso))
+    // オフセットが無ければ UTC を補う (実行環境の時間帯で解釈させない)
+    const normalized = /(?:Z|[+-]\d{2}:?\d{2})$/.test(iso) ? iso : `${iso}Z`
+    try {
+        return new Intl.DateTimeFormat(labels.locale, { timeZone: labels.timeZone, dateStyle: "medium", timeStyle: "short" }).format(new Date(normalized))
+    } catch {
+        // 不正な日時 (`RangeError: Invalid time value`) も、不正なロケール・時間帯も、ここで
+        // 受け止める。画面を落とすより生の値を見せる方がまだ役に立つ
+        return iso
+    }
 }

package/src/admin/labels.ts

@@ -26,7 +26,6 @@ export type UserAdminLabels = {
      * ここ 1 か所に置く。
      */
     common: {
-        add: string
         create: string
         edit: string
         delete: string
@@ -108,6 +107,9 @@ export type UserAdminLabels = {
         /** 所属人数。`{count}` を人数へ置換する。 */
         memberCountTemplate: string
         confirmDelete: string
+        /** 行ごとの読み上げ名。`{group}` をグループ名へ置換する。 */
+        editGroupAria: string
+        deleteGroupAria: string
         noDescription: string
         groupKeyPlaceholder: string
         namePlaceholder: string
@@ -153,9 +155,6 @@ export type UserAdminLabels = {
     }
     directoryView: {
         title: string
-        /** 出所列。ローカル管理か、どの上流かを示す。 */
-        source: string
-        localSource: string
         membershipMode: string
         directMode: string
         transitiveMode: string
@@ -188,6 +187,7 @@ export type UserAdminLabels = {
         notWiredNotice: string
         /** 行ごとの読み上げ名。`{group}` をグループ名へ置換する。 */
         syncNowAria: string
+        syncQueuedAria: string
         pauseAria: string
         resumeAria: string
         allowGroupAria: string
@@ -199,10 +199,6 @@ export type UserAdminLabels = {
         unlink: string
         externalKey: string
         empty: string
-        /** 直近の同期が失敗したグループの見出し。件数だけでは何が起きたか判らない。 */
-        erroredWarning: string
-        /** 同期有効なリンクのうち最も古い成功時刻。滞留の実際の深さを示す。 */
-        oldestSyncedAt: string
         /** 連携するグループを選ぶ欄。 */
         selectGroup: string
         /** 上流グループのアドレス入力。 */
@@ -230,7 +226,6 @@ export const defaultUserAdminLabels: UserAdminLabels = {
     timeZone: "UTC",
     heading: "\u{1F464} User administration",
     common: {
-        add: "Add",
         create: "Create",
         edit: "Edit",
         delete: "Delete",
@@ -291,6 +286,8 @@ export const defaultUserAdminLabels: UserAdminLabels = {
         description: "Description",
         memberCountTemplate: "{count} members",
         confirmDelete: "Delete this group?",
+        editGroupAria: "Edit {group}",
+        deleteGroupAria: "Delete {group}",
         noDescription: "No description",
         groupKeyPlaceholder: "e.g. dev-team",
         namePlaceholder: "e.g. Development team",
@@ -327,8 +324,6 @@ export const defaultUserAdminLabels: UserAdminLabels = {
     },
     directoryView: {
         title: "Directory synchronization",
-        source: "Source",
-        localSource: "Local",
         membershipMode: "Membership",
         directMode: "Direct only",
         transitiveMode: "Nested expanded",
@@ -350,6 +345,7 @@ export const defaultUserAdminLabels: UserAdminLabels = {
         nothingToLink: "Every group is already linked to a directory.",
         notWiredNotice: "Directory synchronization is not wired for this deployment, so links cannot be created or changed here.",
         syncNowAria: "Synchronize {group} now",
+        syncQueuedAria: "A synchronization of {group} is queued",
         pauseAria: "Pause synchronization of {group}",
         resumeAria: "Resume synchronization of {group}",
         allowGroupAria: "Allow members of {group} to sign in",
@@ -360,8 +356,6 @@ export const defaultUserAdminLabels: UserAdminLabels = {
         unlink: "Unlink",
         externalKey: "Upstream group",
         empty: "No groups are linked to a directory",
-        erroredWarning: "Last synchronization failed for",
-        oldestSyncedAt: "Oldest successful sync",
         selectGroup: "Group to link",
         externalKeyPlaceholder: "e.g. dev-team@example.com",
         confirmUnlink: "Unlink this group? Its member ledger and group-based sign-in permission are removed.",
@@ -383,7 +377,6 @@ export const jaUserAdminLabels: UserAdminLabels = {
     timeZone: "Asia/Tokyo",
     heading: "\u{1F464} ユーザー管理",
     common: {
-        add: "追加",
         create: "作成",
         edit: "編集",
         delete: "削除",
@@ -444,6 +437,8 @@ export const jaUserAdminLabels: UserAdminLabels = {
         description: "説明",
         memberCountTemplate: "所属 {count} 名",
         confirmDelete: "このグループを削除しますか？",
+        editGroupAria: "{group} を編集",
+        deleteGroupAria: "{group} を削除",
         noDescription: "説明なし",
         groupKeyPlaceholder: "例: dev-team",
         namePlaceholder: "例: 開発チーム",
@@ -480,8 +475,6 @@ export const jaUserAdminLabels: UserAdminLabels = {
     },
     directoryView: {
         title: "ディレクトリ同期",
-        source: "出所",
-        localSource: "ローカル管理",
         membershipMode: "所属の展開",
         directMode: "直接所属のみ",
         transitiveMode: "入れ子を展開",
@@ -503,6 +496,7 @@ export const jaUserAdminLabels: UserAdminLabels = {
         nothingToLink: "すべてのグループが既にディレクトリと連携しています。",
         notWiredNotice: "この配備ではディレクトリ同期が結線されていないため、ここから連携の作成・変更はできません。",
         syncNowAria: "{group} を今すぐ同期",
+        syncQueuedAria: "{group} の同期を要求済み",
         pauseAria: "{group} の同期を一時停止",
         resumeAria: "{group} の同期を再開",
         allowGroupAria: "{group} のメンバーのサインインを許可",
@@ -513,8 +507,6 @@ export const jaUserAdminLabels: UserAdminLabels = {
         unlink: "連携を解除",
         externalKey: "上流グループ",
         empty: "ディレクトリと連携しているグループはありません",
-        erroredWarning: "直近の同期に失敗したグループ",
-        oldestSyncedAt: "最も古い同期成功",
         selectGroup: "連携するグループ",
         externalKeyPlaceholder: "例: dev-team@example.com",
         confirmUnlink: "このグループの連携を解除しますか？ メンバー台帳とグループ単位のサインイン許可が失われます。",

package/src/admin/server.ts

@@ -216,6 +216,47 @@ function isForbidden(error: unknown): boolean {
     return typeof error === "object" && error !== null && (error as { status?: unknown }).status === 403
 }
 
+/**
+ * Reads the allowlist kind, refusing anything but the two declared values.
+ * 許可の種別を読み取る処理 (宣言された 2 値以外を拒否する)。
+ *
+ * 指定外を既定値へ倒すと、綴り違い (`Domain`) や欠落が **完全一致の許可** として登録される。
+ * 「ドメイン全体を許可したつもりが 1 アドレスだけだった」は、逆向きより静かに壊れる。
+ *
+ * @param formData Submitted form. 送信されたフォーム。
+ * @returns The declared kind. 宣言された種別。
+ * @throws {Error} When the value is absent or unknown. 未指定・未知の値の場合。
+ */
+function requireAllowlistType(formData: FormData): "email" | "domain" {
+    const raw = String(formData.get("type") ?? "")
+    if (raw === "email" || raw === "domain") return raw
+    throw new Error(`type は "email" または "domain" のいずれかで指定してください (受け取った値: ${JSON.stringify(raw)})`)
+}
+
+/** 表示するタブ。未知の値は先頭のタブへ寄せる。 */
+const SEGMENTS = ["users", "groups", "group_members", "allowlist", "directory"] as const
+
+/**
+ * Derives the segment from a request path, tolerating the router's single-fetch suffix.
+ * リクエストパスからセグメントを決める処理 (ルーターの単一フェッチ用の接尾辞を許容する)。
+ *
+ * ⚠️ クライアント側の遷移では、ルーターは画面の URL ではなく **`<path>.data`** を取りに来る
+ * (単一フェッチ)。素朴に末尾セグメントを見ると `"groups.data"` になり、どのタブにも一致せず
+ * 既定へ落ちる。結果、**URL は変わるのに中身が変わらない** — 全画面再読込でだけ正しく描かれる
+ * ため、動作確認では気付きにくい。接尾辞を落としてから判定する。
+ *
+ * @param pathname Request pathname. リクエストのパス。
+ * @returns One of the known segments. 既知のセグメントのいずれか。
+ */
+function segmentFromPathname(pathname: string): (typeof SEGMENTS)[number] {
+    const parts = pathname
+        .replace(/\.data$/, "")
+        .split("/")
+        .filter(Boolean)
+    const last = parts[parts.length - 1] ?? ""
+    return (SEGMENTS as readonly string[]).includes(last) ? (last as (typeof SEGMENTS)[number]) : "users"
+}
+
 /**
  * The CRUD verb an operation performs. Deliberately a plain string union so this package stays
  * independent of any particular authorization library.
@@ -402,9 +443,7 @@ export function createUserAdminApp(config: UserAdminAppConfig) {
     async function loader({ request }: RouteArgs) {
         // 読取ガード: 拒否は throw されるためここで処理が打ち切られる
         await config.guards.requireAccess(request, { action: "read", intent: "loader" })
-        const url = new URL(request.url)
-        const pathSegments = url.pathname.split("/").filter(Boolean)
-        const segment = pathSegments[pathSegments.length - 1] ?? "users"
+        const segment = segmentFromPathname(new URL(request.url).pathname)
 
         const [users, groups, groupMembers, allowlist, directoryStatus, myPermissions] = await Promise.all([
             config.store.listUsers(),
@@ -423,7 +462,7 @@ export function createUserAdminApp(config: UserAdminAppConfig) {
 
         return {
             resourceLabels: config.resourceLabels,
-            segment: ["groups", "group_members", "allowlist", "directory"].includes(segment) ? segment : "users",
+            segment,
             users,
             groups,
             groupMembers,
@@ -445,6 +484,22 @@ export function createUserAdminApp(config: UserAdminAppConfig) {
         const access = INTENT_ACCESS.get(intent)
         if (!access) return { ok: false, error: `Unknown intent: ${intent}` }
 
+        /** 403 かどうか。Response でも素の例外でも `status` は共通語彙である。 */
+        const isDenied = (error: unknown) => isForbidden(error)
+        /**
+         * Turns a denial into an in-page error without leaking the guard's own message.
+         * 拒否を、ガードの内部文言を漏らさずに画面内エラーへ変える処理。
+         */
+        const denied = (error: unknown) => {
+            try {
+                config.guards.onDenied?.({ intent, actions: access, error })
+            } catch {
+                // 記録に失敗しても拒否の応答は返す。ログの都合で操作の結果が変わってはならない
+            }
+            // 監視から消えないよう、状態は 403 のまま返す。画面は data() なので生き残る
+            return data({ ok: false, error: labels.errors.forbidden }, { status: 403 })
+        }
+
         // 操作ごとの CRUD 種別でガードする。複数を要求する intent は **すべて** 通ること
         try {
             for (const action of access) await config.guards.requireAccess(request, { action, intent })
@@ -452,17 +507,18 @@ export function createUserAdminApp(config: UserAdminAppConfig) {
             // 403 は「この操作だけができない」であり、画面ごと落とすと **他の操作まで巻き添え** に
             // なる (閲覧と作成はできるのに削除だけ拒否された、で一覧が消える)。401 や再認証の
             // リダイレクト、それ以外の障害はそのまま伝播させる — 握り潰すとログインし直せない
-            if (!isForbidden(error)) throw error
-            // 監視から消えないよう、状態は 403 のまま返す。画面は data() なので生き残る
-            config.guards.onDenied?.({ intent, actions: access, error })
-            return data({ ok: false, error: labels.errors.forbidden }, { status: 403 })
+            if (!isDenied(error)) throw error
+            return denied(error)
         }
 
         try {
             return await dispatch(intent, formData)
         } catch (error) {
+            // ガードの後 (ストアの中) で投げられた拒否も同じ扱いにする。ここを素通りさせると、
+            // 拒否理由がそのまま利用者へ渡り、しかも HTTP は 200 になって監視から消える
+            if (isDenied(error)) return denied(error)
             // ガード拒否 (Response/redirect) はそのまま伝播させる。ストア由来の業務エラーだけ
-            // {ok:false,error} に写して UI へ届ける (ロックアウト理由・重複パターン等)。
+            // {ok:false,error} に写して UI へ届ける (ロックアウト理由・重複パターン等)
             if (error instanceof Response) throw error
             return { ok: false, error: error instanceof Error ? error.message : String(error) }
         }
@@ -514,7 +570,7 @@ export function createUserAdminApp(config: UserAdminAppConfig) {
         }
 
         if (intent === "addAllowlistEntry") {
-            const type: "email" | "domain" = formData.get("type") === "domain" ? "domain" : "email"
+            const type = requireAllowlistType(formData)
             await config.store.addAllowlistEntry({ pattern: requireText(formData, "pattern"), type, description: optionalText(formData, "description") })
             return { ok: true }
         }

package/src/admin/ui.tsx

@@ -93,6 +93,8 @@ function DirectorySyncBanner({ status, labels, groups }: { status?: AuthDirector
  * ヘッダー注釈委譲を備えたユーザー管理ページのシェルレイアウト。
  */
 export function UserAdminShell({ children, renderHeader }: UserAdminShellProps) {
+    // ⚠️ ここは `UserAdminLoaderData` と違い **すべて任意** で受ける。シェルは loader を持たない
+    // 呼び出し (エラー境界の外側、テスト、部分描画) からも描かれるため、欠落を落ちる理由にしない
     const data = useLoaderData() as { segment?: string; labels?: UserAdminLabels; myPermissions?: Record<string, UserAdminPermission | undefined> | null; resourceLabels?: Record<string, string>; directoryStatus?: AuthDirectoryStatus; groups?: AuthGroup[] } | undefined
     const segment = data?.segment ?? "users"
     const labels = data?.labels ?? defaultUserAdminLabels
@@ -109,8 +111,13 @@ export function UserAdminShell({ children, renderHeader }: UserAdminShellProps)
         { key: "allowlist", label: labels.tabs.allowlist, href: "/users/allowlist" },
     ]
     // 未結線でも **連携が残っていれば** 出す。停止を警告した直後に、解除や再開ができる唯一の
-    // 面だけが消えるのは最悪の挙動である。連携も結線も無い配備でだけ隠す
-    if (data?.directoryStatus && (data.directoryStatus.isEnabled || data.directoryStatus.linkedGroupCount > 0)) tabs.push({ key: "directory", label: labels.tabs.directory, href: "/users/directory" })
+    // 面だけが消えるのは最悪の挙動である。連携も結線も無い配備でだけ隠す。
+    // 判定は状態の件数と一覧の実体の **両方** を見る — 片方だけだと、件数が 0 なのに
+    // 「上流が所有」と描かれるグループが取り残される
+    const hasLinkedGroup = (data?.groups ?? []).some((g) => g.externalLink)
+    if (data?.directoryStatus?.isEnabled || (data?.directoryStatus?.linkedGroupCount ?? 0) > 0 || hasLinkedGroup) {
+        tabs.push({ key: "directory", label: labels.tabs.directory, href: "/users/directory" })
+    }
 
     const permEntries = Object.entries(myPermissions ?? {})