@things-factory/auth-ui 10.1.225 → 10.1.227

package/dist-client/pages/role/role-privilege-page.d.ts

@@ -1,4 +1,5 @@
 import '@material/web/icon/icon.js';
+import '../../components/auth-badge.js';
 import '@operato/list-state/ox-page-state.js';
 import '@operato/input/ox-input-search.js';
 import type { CSSResultGroup } from 'lit';
@@ -29,7 +30,7 @@ declare const RolePrivilegePage_base: (new (...args: any[]) => import("lit").Lit
  * (`auth-base/server/index.ts:34-36`). 그래서 지금 화면에 나오는 문장은 전부 2번이다.
  *
  * ── 저장 범위는 서버가 준 목록이다 ──────────────────────────────────────────
- * 옛 편집기는 `querySelectorAll('input:checked')` 로 보냈다. 「더하기」 판에서 다른 모듈로
+ * 옛 편집기는 `querySelectorAll('input:checked')` 로 보냈다. 「더하기」 패널에서 다른 모듈로
  * 옮기면 앞 모듈의 체크박스는 **DOM 에 없다** — 그 방식이면 모듈을 옮겨 다니는 것만으로
  * 권한이 조용히 떨어진다. 여기서는 `rolePrivileges` 가 준 전체가 범위이고 켠 것은
  * `assigned` 에만 있다. 화면이 무엇을 그렸는지와 무관하다.
@@ -63,6 +64,8 @@ export declare class RolePrivilegePage extends RolePrivilegePage_base {
      * 말한다. (프로필의 `domain` 에 `id` 가 없어서 `subdomain` 으로 견준다.)
      */
     private get inherited();
+    /** The domain the role stands in - named the same way by the badge beside the name and the note above it. */
+    private ownerDomainName;
     private get savable();
     private get visibleModules();
     /**
@@ -113,7 +116,7 @@ export declare class RolePrivilegePage extends RolePrivilegePage_base {
      * 자리를 옮긴다(`renderAdd`). 문장이 줄마다 있으므로 배우는 일이 따로 없다.
      *
      * ── 켜진 것만 낸다 ─────────────────────────────────────────────────────────
-     * 전체를 여기 또 그리면 같은 46 모듈이 화면에 두 번 선다. 전체는 「더하기」 판이 갖는다.
+     * 전체를 여기 또 그리면 같은 46 모듈이 화면에 두 번 선다. 전체는 「더하기」 패널이 갖는다.
      *
      * ── 글이 없을 때 ───────────────────────────────────────────────────────────
      * 「더하기」 판에서는 문장이 없으면 **없다고 말해도 된다** — 체크박스 옆에 「읽기」라는
@@ -183,7 +186,7 @@ export declare class RolePrivilegePage extends RolePrivilegePage_base {
      */
     private renderAdd;
     /**
-     * 고르는 판을 **넓은 팝업**으로 연다.
+     * 고르는 패널을 **넓은 팝업**으로 연다.
      *
      * 사용자 말씀이다 — 「'할 수 있는 일 더하기' 작동을 팝업으로 넓게 할 수 있었으면 어떤가?
      * 지금은 좁아보이고」. 페이지 안에 펼치면 본문(할 수 있는 일)이 아래로 밀리고, 남은 폭에서
@@ -202,9 +205,9 @@ export declare class RolePrivilegePage extends RolePrivilegePage_base {
      */
     private openAdd;
     /**
-     * 고르는 판의 몸체 — **팝업이 이것을 그린다.**
+     * 고르는 패널의 몸체 — **팝업이 이것을 그린다.**
      *
-     * 판을 부품 안으로 옮기지 않는다. 모듈 접기·축 줄·유령 규칙이 전부 이 페이지의 상태
+     * 패널을 부품 안으로 옮기지 않는다. 모듈 접기·축 줄·유령 규칙이 전부 이 페이지의 상태
      * (`modules`·`assigned`·`selected`·`keyword`)를 보기 때문이고, 옮기면 **상태가 두 벌**이 된다.
      * 두 벌이 되는 순간 어느 쪽이 저장 범위인지 흐려진다 — 옛 편집기가 `querySelectorAll` 로
      * 범위를 만들던 결함이 정확히 그 모양이었다.

package/dist-client/pages/role/role-privilege-page.js

@@ -1,5 +1,6 @@
 import { __decorate, __metadata } from "tslib";
 import '@material/web/icon/icon.js';
+import '../../components/auth-badge.js';
 import '@operato/list-state/ox-page-state.js';
 import '@operato/input/ox-input-search.js';
 import gql from 'graphql-tag';
@@ -40,7 +41,7 @@ const GRANT_FIELDS = 'category axes';
  * (`auth-base/server/index.ts:34-36`). 그래서 지금 화면에 나오는 문장은 전부 2번이다.
  *
  * ── 저장 범위는 서버가 준 목록이다 ──────────────────────────────────────────
- * 옛 편집기는 `querySelectorAll('input:checked')` 로 보냈다. 「더하기」 판에서 다른 모듈로
+ * 옛 편집기는 `querySelectorAll('input:checked')` 로 보냈다. 「더하기」 패널에서 다른 모듈로
  * 옮기면 앞 모듈의 체크박스는 **DOM 에 없다** — 그 방식이면 모듈을 옮겨 다니는 것만으로
  * 권한이 조용히 떨어진다. 여기서는 `rolePrivileges` 가 준 전체가 범위이고 켠 것은
  * `assigned` 에만 있다. 화면이 무엇을 그렸는지와 무관하다.
@@ -64,7 +65,8 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         this.loadError = null;
         this.saving = false;
         this.dirty = false;
-        this.view = 'privileges';
+        /* 업무가 먼저다 — 사람이 읽는 말이 업무이고, 권한은 그 아래 낱낱이다(2026-10-28 사용자: 「'업무'를 먼저 보여주어라」). */
+        this.view = 'tasks';
         /** The role laid against every task - computed by the server from the saved privileges (`Role.taskCoverage`). */
         this.coverage = { tasks: [], unclassified: [] };
         this.showUnheldTasks = false;
@@ -279,6 +281,9 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
       }
 
       [subject] [name] {
+        display: flex;
+        align-items: center;
+        gap: 8px;
         font-size: 1.15rem;
         font-weight: 640;
       }
@@ -329,7 +334,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         흘렀다.** 내 ul[lines] 는 display 를 선언하지 않으므로 맞설 것이 없었다.
         마크업을 갈 때는 그 마크업만 쓰던 CSS 를 함께 지운다.
 
-        높이도 바뀐다. max-height: 22vh 는 격자 두 판이 늘 아래에 펼쳐져 있던 시절의 값이다.
+        높이도 바뀐다. max-height: 22vh 는 격자 두 패널이 늘 아래에 펼쳐져 있던 시절의 값이다.
         지금은 **이 목록이 본문**이므로(§2) 남는 높이를 여기가 받고, 59줄은 여기서 흐른다.
       */
       [granted] ul {
@@ -619,6 +624,10 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         const subdomain = this.subject?.domain?.subdomain;
         return Boolean(subdomain && this.mySubdomain && subdomain !== this.mySubdomain);
     }
+    /** The domain the role stands in - named the same way by the badge beside the name and the note above it. */
+    ownerDomainName() {
+        return this.subject?.domain?.name || this.subject?.domain?.subdomain || '';
+    }
     get savable() {
         return this.fetchState === 'loaded' && !this.saving && !this.inherited;
     }
@@ -698,9 +707,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         return html `
       ${this.inherited
             ? html `<div note attention>
-              ${i18next.t('text.role belongs to x domain and is edited there', {
-                x: this.subject?.domain?.name || this.subject?.domain?.subdomain
-            })}
+              ${i18next.t('text.role belongs to x domain and is edited there', { x: this.ownerDomainName() })}
             </div>`
             : nothing}
       ${this.renderSubject()} ${this.renderHolders()} ${this.renderGranted()}
@@ -720,7 +727,10 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         }
         return html `
       <div subject>
-        <div name>${this.subject?.name || i18next.t('label.role')}</div>
+        <div name>
+          ${this.subject?.name || i18next.t('label.role')}
+          ${this.inherited ? html `<auth-badge>${i18next.t('label.inherited')} · ${this.ownerDomainName()}</auth-badge>` : nothing}
+        </div>
         ${this.subject?.description
             ? html `<div says>${this.subject.description}</div>`
             : html `<div says missing>${i18next.t('text.no description for this role')}</div>`}
@@ -739,7 +749,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
      * 자리를 옮긴다(`renderAdd`). 문장이 줄마다 있으므로 배우는 일이 따로 없다.
      *
      * ── 켜진 것만 낸다 ─────────────────────────────────────────────────────────
-     * 전체를 여기 또 그리면 같은 46 모듈이 화면에 두 번 선다. 전체는 「더하기」 판이 갖는다.
+     * 전체를 여기 또 그리면 같은 46 모듈이 화면에 두 번 선다. 전체는 「더하기」 패널이 갖는다.
      *
      * ── 글이 없을 때 ───────────────────────────────────────────────────────────
      * 「더하기」 판에서는 문장이 없으면 **없다고 말해도 된다** — 체크박스 옆에 「읽기」라는
@@ -762,7 +772,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
           ${i18next.t('field.granted privileges')}
           <span count>${granted.length}</span>
           <nav>
-            ${this.viewButton('privileges', i18next.t('label.privileges view'))} ${this.viewButton('tasks', i18next.t('label.tasks view'))}
+            ${this.viewButton('tasks', i18next.t('label.tasks view'))} ${this.viewButton('privileges', i18next.t('label.privileges view'))}
             ${this.viewButton('template', i18next.t('label.template view'))}
           </nav>
         </header>
@@ -1132,7 +1142,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
     `;
     }
     /**
-     * 고르는 판을 **넓은 팝업**으로 연다.
+     * 고르는 패널을 **넓은 팝업**으로 연다.
      *
      * 사용자 말씀이다 — 「'할 수 있는 일 더하기' 작동을 팝업으로 넓게 할 수 있었으면 어떤가?
      * 지금은 좁아보이고」. 페이지 안에 펼치면 본문(할 수 있는 일)이 아래로 밀리고, 남은 폭에서
@@ -1158,9 +1168,9 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         });
     }
     /**
-     * 고르는 판의 몸체 — **팝업이 이것을 그린다.**
+     * 고르는 패널의 몸체 — **팝업이 이것을 그린다.**
      *
-     * 판을 부품 안으로 옮기지 않는다. 모듈 접기·축 줄·유령 규칙이 전부 이 페이지의 상태
+     * 패널을 부품 안으로 옮기지 않는다. 모듈 접기·축 줄·유령 규칙이 전부 이 페이지의 상태
      * (`modules`·`assigned`·`selected`·`keyword`)를 보기 때문이고, 옮기면 **상태가 두 벌**이 된다.
      * 두 벌이 되는 순간 어느 쪽이 저장 범위인지 흐려진다 — 옛 편집기가 `querySelectorAll` 로
      * 범위를 만들던 결함이 정확히 그 모양이었다.
@@ -1406,7 +1416,7 @@ let RolePrivilegePage = class RolePrivilegePage extends localize(i18next)(PageVi
         this.modules = [...byCategory.values()].sort((a, b) => moduleLabel(a.category).localeCompare(moduleLabel(b.category)));
         this.assigned = assigned;
         this.dirty = false;
-        /* 고른 것이 없으면 첫 모듈을 연다 — 빈 오른쪽 판을 처음 화면으로 두지 않는다. */
+        /* 고른 것이 없으면 첫 모듈을 연다 — 빈 오른쪽 패널을 처음 화면으로 두지 않는다. */
         if (!this.modules.find(m => m.category === this.selected)) {
             this.selected = this.modules[0]?.category || '';
         }