@things-factory/auth-ui 10.0.7 → 10.0.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -102,6 +102,22 @@ let RolePrivilegeEditor = class RolePrivilegeEditor extends localize(i18next)(Li
102
102
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
103
103
  }
104
104
 
105
+ /* 코드가 더 이상 요구하지 않는 권한 — 부여해도 아무 일이 없으므로 눈에 구별되어야 한다.
106
+ 감추지는 않는다. 이미 역할에 붙어 있을 수 있고, 그것을 보고 떼는 것이 관리자의 일이다. */
107
+ li[deprecated] label {
108
+ opacity: 0.55;
109
+ text-decoration: line-through;
110
+ }
111
+
112
+ li[deprecated] small {
113
+ display: block;
114
+ margin-left: 1.6em;
115
+ color: var(--md-sys-color-error);
116
+ font-size: 0.8em;
117
+ text-decoration: none;
118
+ opacity: 0.9;
119
+ }
120
+
105
121
  #checkAll,
106
122
  [for='checkAll'] {
107
123
  margin-bottom: var(--spacing-medium);
@@ -183,7 +199,7 @@ let RolePrivilegeEditor = class RolePrivilegeEditor extends localize(i18next)(Li
183
199
  ${groupedPrivileges[category].map(
184
200
  /* privilege : {id, name, category, description} */
185
201
  privilege => html `
186
- <li>
202
+ <li ?deprecated=${privilege.deprecated}>
187
203
  <input
188
204
  type="checkbox"
189
205
  id="${privilege.id}"
@@ -191,6 +207,9 @@ let RolePrivilegeEditor = class RolePrivilegeEditor extends localize(i18next)(Li
191
207
  .data-privilege=${privilege}
192
208
  />
193
209
  <label for="${privilege.id}">${privilege.description}</label>
210
+ ${privilege.deprecated
211
+ ? html `<small>${String(i18next.t('text.privilege no longer declared'))}</small>`
212
+ : ''}
194
213
  </li>
195
214
  `)}
196
215
  </div>
@@ -286,6 +305,7 @@ let RolePrivilegeEditor = class RolePrivilegeEditor extends localize(i18next)(Li
286
305
  name
287
306
  category
288
307
  description
308
+ deprecated
289
309
  }
290
310
  total
291
311
  }
@@ -1 +1 @@
1
- {"version":3,"file":"role-privilege-editor.js","sourceRoot":"","sources":["../../client/components/role-privilege-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('role-privilege-editor')\nclass RolePrivilegeEditor extends localize(i18next)(LitElement) {\n static styles = [\n ButtonContainerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n border: 1px solid var(--md-sys-color-primary);\n font: normal 15px var(--theme-font);\n }\n\n div {\n margin: var(--spacing-medium);\n }\n\n div[users] {\n margin: 0;\n background-color: var(--md-sys-color-surface-variant);\n }\n\n div[titler] {\n color: var(--md-sys-color-secondary);\n font: bold 1.2em var(--theme-font);\n text-transform: capitalize;\n }\n\n ul {\n flex: 1;\n color: var(--md-sys-color-secondary);\n background-color: var(--md-sys-color-surface-variant);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin-block-start: 0;\n margin-block-end: 0;\n padding: var(--spacing-medium);\n list-style: none;\n border: 1px dashed rgba(0, 0, 0, 0.1);\n border-width: 1px 0;\n }\n\n .category-group {\n display: contents;\n }\n\n .category-title {\n font-weight: bold;\n font-size: 0.9em;\n color: var(--md-sys-color-primary);\n text-transform: uppercase;\n opacity: 0.7;\n align-self: stretch;\n position: sticky;\n top: 0;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n text-align: right;\n }\n\n .category-privileges {\n display: contents;\n }\n\n @media screen and (min-width: 640px) {\n ul {\n grid-template-columns: minmax(200px, auto) 1fr 1fr;\n gap: 0;\n }\n\n .category-title {\n grid-column: 1;\n padding-right: var(--spacing-medium);\n }\n\n li {\n grid-column: auto;\n }\n }\n\n input[type='checkbox'] {\n display: inline;\n }\n\n li {\n padding: var(--spacing-small);\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n }\n\n #checkAll,\n [for='checkAll'] {\n margin-bottom: var(--spacing-medium);\n padding-bottom: var(--spacing-small);\n font-weight: bold;\n }\n\n md-elevated-button {\n margin: 5px;\n background-color: var(--md-sys-color-surface-variant);\n }\n\n md-outlined-button {\n background-color: var(--md-sys-color-surface-variant);\n }\n\n @media screen and (max-width: 639px) {\n ul {\n grid-template-columns: 1fr;\n }\n\n .category-group {\n display: block;\n margin-top: var(--spacing-medium);\n }\n\n .category-group:first-child {\n margin-top: 0;\n }\n\n .category-title {\n position: static;\n margin-bottom: var(--spacing-small);\n }\n\n .category-privileges {\n display: grid;\n grid-template-columns: 1fr;\n }\n }\n `\n ]\n\n @property({ type: Object }) role: any\n @property({ type: Array }) allPrivileges: any[] = []\n @property({ type: Object }) updateRoleObj: any\n\n @state() privileges: { id: string; description: string }[] = []\n @state() users: { /* id: string; username: string; */ name: string; email: string }[] = []\n\n render() {\n const allPrivileges = this.allPrivileges || []\n const privileges = this.privileges || []\n const users = this.users || []\n\n // Group privileges by category\n const groupedPrivileges = allPrivileges.reduce(\n (acc, privilege) => {\n const category = privilege.category || 'Other'\n if (!acc[category]) {\n acc[category] = []\n }\n acc[category].push(privilege)\n return acc\n },\n {} as Record<string, any[]>\n )\n\n // Sort categories alphabetically\n const sortedCategories = Object.keys(groupedPrivileges).sort()\n\n // Sort privileges within each category by name (descending)\n sortedCategories.forEach(category => {\n groupedPrivileges[category].sort((a, b) => b.name.localeCompare(a.name))\n })\n\n return html`\n <div titler>${String(i18next.t('label.user'))}</div>\n\n <div users>${users.map(user => html`<div>${user.name} (${user.email})</div>`)}</div>\n\n <div titler>${String(i18next.t('field.privileges'))}</div>\n\n <div>\n <input id=\"checkAll\" type=\"checkbox\" @change=${e => this.oncheckAll(e)} />\n <label for=\"checkAll\">Check all</label>\n </div>\n\n <ul privileges>\n ${sortedCategories.map(\n category => html`\n <div class=\"category-group\">\n <div class=\"category-title\">${category}</div>\n <div class=\"category-privileges\">\n ${groupedPrivileges[category].map(\n /* privilege : {id, name, category, description} */\n privilege => html`\n <li>\n <input\n type=\"checkbox\"\n id=\"${privilege.id}\"\n .checked=${privileges.map(p => p.id).indexOf(privilege.id) > -1}\n .data-privilege=${privilege}\n />\n <label for=\"${privilege.id}\">${privilege.description}</label>\n </li>\n `\n )}\n </div>\n </div>\n `\n )}\n </ul>\n\n <div class=\"button-container\">\n <md-elevated-button @click=${e => this.onSave()}>${String(i18next.t('button.save'))}</md-elevated-button>\n <md-elevated-button @click=${e => this.onDeleteRole()} danger\n >${String(i18next.t('button.delete role'))}</md-elevated-button\n >\n </div>\n `\n }\n\n async firstUpdated() {\n this.allPrivileges = await this.fetchPrivileges()\n }\n\n async updated(changes) {\n if (changes.has('role')) {\n await this.fetchPrivilegesOnRole(this.role.name)\n }\n }\n\n checkAll(checked) {\n Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(\n checkbox => ((checkbox as HTMLInputElement).checked = checked)\n )\n }\n\n oncheckAll(e) {\n this.checkAll(e.target.checked)\n }\n\n async onSave() {\n const updateRoleObj = this.updateRoleObj\n const privileges = Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]:checked')).map(\n e => ({ id: e['data-privilege'].id }) // ObjectRef 타입에 맞게 id만 전송\n )\n\n const patch = { ...updateRoleObj, privileges: privileges }\n\n if (this.role) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: RolePatch!) {\n updateRole(id: $id, patch: $patch) {\n id\n name\n description\n privileges {\n id\n description\n }\n }\n }\n `,\n variables: { id: this.role.id, patch },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await this.dispatchEvent(new CustomEvent('fetch-roles'))\n this.showToast(i18next.t('text.data_updated_successfully'))\n }\n }\n }\n\n async onDeleteRole() {\n if (\n await OxPrompt.open({\n title: i18next.t('text.are_you_sure'),\n text: i18next.t('text.are_you_sure_to_delete_x', { x: i18next.t('label.role') }),\n confirmButton: { text: i18next.t('button.delete') },\n cancelButton: { text: i18next.t('button.cancel') }\n })\n ) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteRole(id: $id)\n }\n `,\n variables: { id: this.role.id },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await this.dispatchEvent(new CustomEvent('fetch-roles'))\n\n await OxPrompt.open({\n type: 'success',\n title: i18next.t('text.completed'),\n text: i18next.t('text.x_deleted_successfully', { x: i18next.t('label.role') }),\n confirmButton: { text: i18next.t('button.confirm') }\n })\n }\n }\n }\n\n async fetchPrivileges() {\n const response = await client.query({\n query: gql`\n query privileges {\n privileges {\n items {\n id\n name\n category\n description\n }\n total\n }\n }\n `\n })\n\n return response.data.privileges.items\n }\n\n async fetchPrivilegesOnRole(name) {\n const response = await client.query({\n query: gql`\n query ($name: String!) {\n role(name: $name) {\n id\n name\n privileges {\n id\n description\n }\n users {\n name\n email\n }\n }\n }\n `,\n variables: { name },\n context: gqlContext()\n })\n\n this.privileges = response.data.role?.privileges\n this.users = response.data.role?.users\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}
1
+ {"version":3,"file":"role-privilege-editor.js","sourceRoot":"","sources":["../../client/components/role-privilege-editor.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client, gqlContext } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { OxPrompt } from '@operato/popup/ox-prompt.js'\nimport { ButtonContainerStyles } from '@operato/styles'\n\n@customElement('role-privilege-editor')\nclass RolePrivilegeEditor extends localize(i18next)(LitElement) {\n static styles = [\n ButtonContainerStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n border: 1px solid var(--md-sys-color-primary);\n font: normal 15px var(--theme-font);\n }\n\n div {\n margin: var(--spacing-medium);\n }\n\n div[users] {\n margin: 0;\n background-color: var(--md-sys-color-surface-variant);\n }\n\n div[titler] {\n color: var(--md-sys-color-secondary);\n font: bold 1.2em var(--theme-font);\n text-transform: capitalize;\n }\n\n ul {\n flex: 1;\n color: var(--md-sys-color-secondary);\n background-color: var(--md-sys-color-surface-variant);\n overflow: auto;\n display: grid;\n grid-template-columns: 1fr 1fr;\n margin-block-start: 0;\n margin-block-end: 0;\n padding: var(--spacing-medium);\n list-style: none;\n border: 1px dashed rgba(0, 0, 0, 0.1);\n border-width: 1px 0;\n }\n\n .category-group {\n display: contents;\n }\n\n .category-title {\n font-weight: bold;\n font-size: 0.9em;\n color: var(--md-sys-color-primary);\n text-transform: uppercase;\n opacity: 0.7;\n align-self: stretch;\n position: sticky;\n top: 0;\n display: flex;\n align-items: center;\n justify-content: flex-end;\n text-align: right;\n }\n\n .category-privileges {\n display: contents;\n }\n\n @media screen and (min-width: 640px) {\n ul {\n grid-template-columns: minmax(200px, auto) 1fr 1fr;\n gap: 0;\n }\n\n .category-title {\n grid-column: 1;\n padding-right: var(--spacing-medium);\n }\n\n li {\n grid-column: auto;\n }\n }\n\n input[type='checkbox'] {\n display: inline;\n }\n\n li {\n padding: var(--spacing-small);\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n }\n\n /* 코드가 더 이상 요구하지 않는 권한 — 부여해도 아무 일이 없으므로 눈에 구별되어야 한다.\n 감추지는 않는다. 이미 역할에 붙어 있을 수 있고, 그것을 보고 떼는 것이 관리자의 일이다. */\n li[deprecated] label {\n opacity: 0.55;\n text-decoration: line-through;\n }\n\n li[deprecated] small {\n display: block;\n margin-left: 1.6em;\n color: var(--md-sys-color-error);\n font-size: 0.8em;\n text-decoration: none;\n opacity: 0.9;\n }\n\n #checkAll,\n [for='checkAll'] {\n margin-bottom: var(--spacing-medium);\n padding-bottom: var(--spacing-small);\n font-weight: bold;\n }\n\n md-elevated-button {\n margin: 5px;\n background-color: var(--md-sys-color-surface-variant);\n }\n\n md-outlined-button {\n background-color: var(--md-sys-color-surface-variant);\n }\n\n @media screen and (max-width: 639px) {\n ul {\n grid-template-columns: 1fr;\n }\n\n .category-group {\n display: block;\n margin-top: var(--spacing-medium);\n }\n\n .category-group:first-child {\n margin-top: 0;\n }\n\n .category-title {\n position: static;\n margin-bottom: var(--spacing-small);\n }\n\n .category-privileges {\n display: grid;\n grid-template-columns: 1fr;\n }\n }\n `\n ]\n\n @property({ type: Object }) role: any\n @property({ type: Array }) allPrivileges: any[] = []\n @property({ type: Object }) updateRoleObj: any\n\n @state() privileges: { id: string; description: string }[] = []\n @state() users: { /* id: string; username: string; */ name: string; email: string }[] = []\n\n render() {\n const allPrivileges = this.allPrivileges || []\n const privileges = this.privileges || []\n const users = this.users || []\n\n // Group privileges by category\n const groupedPrivileges = allPrivileges.reduce(\n (acc, privilege) => {\n const category = privilege.category || 'Other'\n if (!acc[category]) {\n acc[category] = []\n }\n acc[category].push(privilege)\n return acc\n },\n {} as Record<string, any[]>\n )\n\n // Sort categories alphabetically\n const sortedCategories = Object.keys(groupedPrivileges).sort()\n\n // Sort privileges within each category by name (descending)\n sortedCategories.forEach(category => {\n groupedPrivileges[category].sort((a, b) => b.name.localeCompare(a.name))\n })\n\n return html`\n <div titler>${String(i18next.t('label.user'))}</div>\n\n <div users>${users.map(user => html`<div>${user.name} (${user.email})</div>`)}</div>\n\n <div titler>${String(i18next.t('field.privileges'))}</div>\n\n <div>\n <input id=\"checkAll\" type=\"checkbox\" @change=${e => this.oncheckAll(e)} />\n <label for=\"checkAll\">Check all</label>\n </div>\n\n <ul privileges>\n ${sortedCategories.map(\n category => html`\n <div class=\"category-group\">\n <div class=\"category-title\">${category}</div>\n <div class=\"category-privileges\">\n ${groupedPrivileges[category].map(\n /* privilege : {id, name, category, description} */\n privilege => html`\n <li ?deprecated=${privilege.deprecated}>\n <input\n type=\"checkbox\"\n id=\"${privilege.id}\"\n .checked=${privileges.map(p => p.id).indexOf(privilege.id) > -1}\n .data-privilege=${privilege}\n />\n <label for=\"${privilege.id}\">${privilege.description}</label>\n ${privilege.deprecated\n ? html`<small>${String(i18next.t('text.privilege no longer declared'))}</small>`\n : ''}\n </li>\n `\n )}\n </div>\n </div>\n `\n )}\n </ul>\n\n <div class=\"button-container\">\n <md-elevated-button @click=${e => this.onSave()}>${String(i18next.t('button.save'))}</md-elevated-button>\n <md-elevated-button @click=${e => this.onDeleteRole()} danger\n >${String(i18next.t('button.delete role'))}</md-elevated-button\n >\n </div>\n `\n }\n\n async firstUpdated() {\n this.allPrivileges = await this.fetchPrivileges()\n }\n\n async updated(changes) {\n if (changes.has('role')) {\n await this.fetchPrivilegesOnRole(this.role.name)\n }\n }\n\n checkAll(checked) {\n Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]')).forEach(\n checkbox => ((checkbox as HTMLInputElement).checked = checked)\n )\n }\n\n oncheckAll(e) {\n this.checkAll(e.target.checked)\n }\n\n async onSave() {\n const updateRoleObj = this.updateRoleObj\n const privileges = Array.from(this.renderRoot.querySelectorAll('ul[privileges] input[type=checkbox]:checked')).map(\n e => ({ id: e['data-privilege'].id }) // ObjectRef 타입에 맞게 id만 전송\n )\n\n const patch = { ...updateRoleObj, privileges: privileges }\n\n if (this.role) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!, $patch: RolePatch!) {\n updateRole(id: $id, patch: $patch) {\n id\n name\n description\n privileges {\n id\n description\n }\n }\n }\n `,\n variables: { id: this.role.id, patch },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await this.dispatchEvent(new CustomEvent('fetch-roles'))\n this.showToast(i18next.t('text.data_updated_successfully'))\n }\n }\n }\n\n async onDeleteRole() {\n if (\n await OxPrompt.open({\n title: i18next.t('text.are_you_sure'),\n text: i18next.t('text.are_you_sure_to_delete_x', { x: i18next.t('label.role') }),\n confirmButton: { text: i18next.t('button.delete') },\n cancelButton: { text: i18next.t('button.cancel') }\n })\n ) {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n deleteRole(id: $id)\n }\n `,\n variables: { id: this.role.id },\n context: gqlContext()\n })\n\n if (!response.errors) {\n await this.dispatchEvent(new CustomEvent('fetch-roles'))\n\n await OxPrompt.open({\n type: 'success',\n title: i18next.t('text.completed'),\n text: i18next.t('text.x_deleted_successfully', { x: i18next.t('label.role') }),\n confirmButton: { text: i18next.t('button.confirm') }\n })\n }\n }\n }\n\n async fetchPrivileges() {\n const response = await client.query({\n query: gql`\n query privileges {\n privileges {\n items {\n id\n name\n category\n description\n deprecated\n }\n total\n }\n }\n `\n })\n\n return response.data.privileges.items\n }\n\n async fetchPrivilegesOnRole(name) {\n const response = await client.query({\n query: gql`\n query ($name: String!) {\n role(name: $name) {\n id\n name\n privileges {\n id\n description\n }\n users {\n name\n email\n }\n }\n }\n `,\n variables: { name },\n context: gqlContext()\n })\n\n this.privileges = response.data.role?.privileges\n this.users = response.data.role?.users\n }\n\n showToast(message) {\n document.dispatchEvent(new CustomEvent('notify', { detail: { message, option: { timer: 1000 } } }))\n }\n}\n"]}