Merge pull request #4696 from logto-io/gao-console-org-4

feat(console,core): edit permissions and roles

packages/console/src/assets/icons/edit.svg

@@ -0,0 +1,5 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M4.16675 14.9998H7.70008C7.80975 15.0004 7.91847 14.9794 8.02 14.9379C8.12153 14.8965 8.21388 14.8354 8.29175 14.7581L14.0584 8.98312L16.4251 6.66645C16.5032 6.58898 16.5652 6.49682 16.6075 6.39527C16.6498 6.29372 16.6716 6.1848 16.6716 6.07479C16.6716 5.96478 16.6498 5.85586 16.6075 5.75431C16.5652 5.65276 16.5032 5.56059 16.4251 5.48312L12.8917 1.90812C12.8143 1.83001 12.7221 1.76802 12.6206 1.72571C12.519 1.6834 12.4101 1.66162 12.3001 1.66162C12.1901 1.66162 12.0812 1.6834 11.9796 1.72571C11.8781 1.76802 11.7859 1.83001 11.7084 1.90812L9.35841 4.26645L3.57508 10.0415C3.49785 10.1193 3.43674 10.2117 3.39527 10.3132C3.3538 10.4147 3.33278 10.5234 3.33341 10.6331V14.1665C3.33341 14.3875 3.42121 14.5994 3.57749 14.7557C3.73377 14.912 3.94573 14.9998 4.16675 14.9998ZM12.3001 3.67479L14.6584 6.03312L13.4751 7.21645L11.1167 4.85812L12.3001 3.67479ZM5.00008 10.9748L9.94175 6.03312L12.3001 8.39145L7.35841 13.3331H5.00008V10.9748ZM17.5001 16.6665H2.50008C2.27907 16.6665 2.06711 16.7543 1.91083 16.9105C1.75455 17.0668 1.66675 17.2788 1.66675 17.4998C1.66675 17.7208 1.75455 17.9328 1.91083 18.089C2.06711 18.2453 2.27907 18.3331 2.50008 18.3331H17.5001C17.7211 18.3331 17.9331 18.2453 18.0893 18.089C18.2456 17.9328 18.3334 17.7208 18.3334 17.4998C18.3334 17.2788 18.2456 17.0668 18.0893 16.9105C17.9331 16.7543 17.7211 16.6665 17.5001 16.6665Z"
+    fill="currentColor" />
+</svg>

packages/console/src/components/DeleteButton/index.tsx

@@ -1,60 +0,0 @@
-import { useCallback, useState, type ReactNode } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import Delete from '@/assets/icons/delete.svg';
-import ConfirmModal from '@/ds-components/ConfirmModal';
-import IconButton from '@/ds-components/IconButton';
-import { Tooltip } from '@/ds-components/Tip';
-
-type Props = {
-  /** A function that will be called when the user confirms the deletion. */
-  onDelete: () => void | Promise<void>;
-  /** The text or content to display in the confirmation modal. */
-  content: ReactNode;
-};
-
-/**
- * A button that displays a trash can icon, with a tooltip that says localized
- * "Delete". Clicking the button will pop up a confirmation modal.
- */
-function DeleteButton({ onDelete, content }: Props) {
-  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
-  const [isModalOpen, setIsModalOpen] = useState(false);
-  const [isDeleting, setIsDeleting] = useState(false);
-
-  const handleDelete = useCallback(async () => {
-    setIsDeleting(true);
-    try {
-      await onDelete();
-    } finally {
-      setIsDeleting(false);
-      setIsModalOpen(false);
-    }
-  }, [onDelete]);
-
-  return (
-    <>
-      <Tooltip content={<div>{t('general.delete')}</div>}>
-        <IconButton
-          onClick={() => {
-            setIsModalOpen(true);
-          }}
-        >
-          <Delete />
-        </IconButton>
-      </Tooltip>
-      <ConfirmModal
-        isOpen={isModalOpen}
-        confirmButtonText="general.delete"
-        isLoading={isDeleting}
-        onCancel={() => {
-          setIsModalOpen(false);
-        }}
-        onConfirm={handleDelete}
-      >
-        {content}
-      </ConfirmModal>
-    </>
-  );
-}
-export default DeleteButton;

packages/console/src/hooks/use-action-translation.ts

@@ -0,0 +1,20 @@
+import { type AdminConsoleKey } from '@logto/phrases';
+import { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+
+const decapitalize = (value: string) => value.charAt(0).toLowerCase() + value.slice(1);
+
+/**
+ * Returns a function that translates a given action and target into a short phrase.
+ */
+const useActionTranslation = () => {
+  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+
+  return useCallback(
+    (action: 'edit' | 'create' | 'delete', target: AdminConsoleKey) =>
+      t(`general.${action}_field`, { field: decapitalize(String(t(target))) }),
+    [t]
+  );
+};
+
+export default useActionTranslation;

packages/console/src/pages/Organizations/ActionsButton/index.module.scss

@@ -0,0 +1,3 @@
+.moreIcon {
+  color: var(--color-text-secondary);
+}

packages/console/src/pages/Organizations/ActionsButton/index.tsx

@@ -0,0 +1,80 @@
+import { type AdminConsoleKey } from '@logto/phrases';
+import { useCallback, useState, type ReactNode } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import Delete from '@/assets/icons/delete.svg';
+import Edit from '@/assets/icons/edit.svg';
+import More from '@/assets/icons/more.svg';
+import ActionMenu, { ActionMenuItem } from '@/ds-components/ActionMenu';
+import ConfirmModal from '@/ds-components/ConfirmModal';
+import useActionTranslation from '@/hooks/use-action-translation';
+
+import * as styles from './index.module.scss';
+
+type Props = {
+  /** A function that will be called when the user confirms the deletion. */
+  onDelete: () => void | Promise<void>;
+  /** A function that will be called when the user clicks the edit button. */
+  onEdit: () => void | Promise<void>;
+  /** The text or content to display in the confirmation modal. */
+  content: ReactNode;
+  /** The name of the field that is being operated. */
+  fieldName: AdminConsoleKey;
+};
+
+/**
+ * A button that displays a three-dot icon and opens a menu the following options:
+ *
+ * - Edit
+ * - Delete
+ */
+function ActionsButton({ onDelete, onEdit, content, fieldName }: Props) {
+  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const tAction = useActionTranslation();
+  const [isModalOpen, setIsModalOpen] = useState(false);
+  const [isDeleting, setIsDeleting] = useState(false);
+
+  const handleDelete = useCallback(async () => {
+    setIsDeleting(true);
+    try {
+      await onDelete();
+    } finally {
+      setIsDeleting(false);
+      setIsModalOpen(false);
+    }
+  }, [onDelete]);
+
+  return (
+    <>
+      <ActionMenu
+        buttonProps={{ icon: <More className={styles.moreIcon} />, size: 'small', type: 'text' }}
+        title={t('general.more_options')}
+      >
+        <ActionMenuItem iconClassName={styles.moreIcon} icon={<Edit />} onClick={onEdit}>
+          {tAction('edit', fieldName)}
+        </ActionMenuItem>
+        <ActionMenuItem
+          icon={<Delete />}
+          type="danger"
+          onClick={() => {
+            setIsModalOpen(true);
+          }}
+        >
+          {tAction('delete', fieldName)}
+        </ActionMenuItem>
+      </ActionMenu>
+      <ConfirmModal
+        isOpen={isModalOpen}
+        confirmButtonText="general.delete"
+        isLoading={isDeleting}
+        onCancel={() => {
+          setIsModalOpen(false);
+        }}
+        onConfirm={handleDelete}
+      >
+        {content}
+      </ConfirmModal>
+    </>
+  );
+}
+export default ActionsButton;

packages/console/src/pages/Organizations/PermissionModal/index.tsx

@@ -1,21 +1,29 @@
+import { type OrganizationScope } from '@logto/schemas';
+import { type Nullable } from '@silverhand/essentials';
 import { useEffect, useState } from 'react';
 import { useForm } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import ReactModal from 'react-modal';
 
 import Button from '@/ds-components/Button';
+import DangerousRaw from '@/ds-components/DangerousRaw';
 import FormField from '@/ds-components/FormField';
 import ModalLayout from '@/ds-components/ModalLayout';
 import TextInput from '@/ds-components/TextInput';
+import useActionTranslation from '@/hooks/use-action-translation';
 import useApi from '@/hooks/use-api';
 import * as modalStyles from '@/scss/modal.module.scss';
 
+const organizationScopesPath = 'api/organization-scopes';
+
 type Props = {
   isOpen: boolean;
+  editData: Nullable<OrganizationScope>;
   onFinish: () => void;
 };
 
-function CreatePermissionModal({ isOpen, onFinish }: Props) {
+/** A modal that allows users to create or edit an organization scope. */
+function PermissionModal({ isOpen, editData, onFinish }: Props) {
   const api = useApi();
   const [isLoading, setIsLoading] = useState(false);
   const {
@@ -23,26 +31,36 @@ function CreatePermissionModal({ isOpen, onFinish }: Props) {
     register,
     handleSubmit,
     formState: { errors },
-  } = useForm<{ name: string; description?: string }>({ defaultValues: { name: '' } });
+  } = useForm<Partial<OrganizationScope>>();
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const tAction = useActionTranslation();
+  const title = editData
+    ? tAction('edit', 'organizations.organization_permission')
+    : tAction('create', 'organizations.organization_permission');
+  const action = editData ? t('general.save') : tAction('create', 'organizations.permission');
 
-  const addPermission = handleSubmit(async (json) => {
+  const submit = handleSubmit(async (json) => {
     setIsLoading(true);
     try {
-      await api.post('api/organization-scopes', {
-        json,
-      });
+      await (editData
+        ? api.patch(`${organizationScopesPath}/${editData.id}`, {
+            json,
+          })
+        : api.post(organizationScopesPath, {
+            json,
+          }));
       onFinish();
     } finally {
       setIsLoading(false);
     }
   });
 
+  // Reset form on open
   useEffect(() => {
-    if (!isOpen) {
-      reset();
+    if (isOpen) {
+      reset(editData ?? {});
     }
-  }, [isOpen, reset]);
+  }, [editData, isOpen, reset]);
 
   return (
     <ReactModal
@@ -52,13 +70,13 @@ function CreatePermissionModal({ isOpen, onFinish }: Props) {
       onRequestClose={onFinish}
     >
       <ModalLayout
-        title="organizations.create_organization_permission"
+        title={<DangerousRaw>{title}</DangerousRaw>}
         footer={
           <Button
             type="primary"
-            title="organizations.create_permission"
+            title={<DangerousRaw>{action}</DangerousRaw>}
             isLoading={isLoading}
-            onClick={addPermission}
+            onClick={submit}
           />
         }
         onClose={onFinish}
@@ -69,11 +87,14 @@ function CreatePermissionModal({ isOpen, onFinish }: Props) {
             autoFocus
             placeholder="read:appointment"
             error={Boolean(errors.name)}
+            disabled={Boolean(editData)}
             {...register('name', { required: true })}
           />
         </FormField>
         <FormField title="general.description">
           <TextInput
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus={Boolean(editData)}
             placeholder={t('organizations.create_permission_placeholder')}
             error={Boolean(errors.description)}
             {...register('description')}
@@ -83,4 +104,4 @@ function CreatePermissionModal({ isOpen, onFinish }: Props) {
     </ReactModal>
   );
 }
-export default CreatePermissionModal;
+export default PermissionModal;

packages/console/src/pages/Organizations/PermissionsField/index.tsx

@@ -1,14 +1,15 @@
 import { type OrganizationScope } from '@logto/schemas';
+import { type Nullable } from '@silverhand/essentials';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import useSWR from 'swr';
 
-import DeleteButton from '@/components/DeleteButton';
 import FormField from '@/ds-components/FormField';
 import useApi, { type RequestError } from '@/hooks/use-api';
+import ActionsButton from '@/pages/Organizations/ActionsButton';
 import { buildUrl } from '@/utils/url';
 
-import CreatePermissionModal from '../CreatePermissionModal';
+import PermissionModal from '../PermissionModal';
 import TemplateTable, { pageSize } from '../TemplateTable';
 
 /**
@@ -32,6 +33,7 @@ function PermissionsField() {
   const api = useApi();
   const [isModalOpen, setIsModalOpen] = useState(false);
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const [editData, setEditData] = useState<Nullable<OrganizationScope>>(null);
 
   const isLoading = !response && !error;
 
@@ -40,9 +42,10 @@ function PermissionsField() {
   }
 
   return (
-    <FormField title="organizations.organization_permissions">
-      <CreatePermissionModal
+    <FormField title="organizations.organization_permission_other">
+      <PermissionModal
         isOpen={isModalOpen}
+        editData={editData}
         onFinish={() => {
           setIsModalOpen(false);
           void mutate();
@@ -69,11 +72,16 @@ function PermissionsField() {
           {
             title: null,
             dataIndex: 'delete',
-            render: ({ id }) => (
-              <DeleteButton
+            render: (data) => (
+              <ActionsButton
+                fieldName="organizations.permission"
                 content="Delete at your own risk, mate."
+                onEdit={() => {
+                  setEditData(data);
+                  setIsModalOpen(true);
+                }}
                 onDelete={async () => {
-                  await api.delete(`api/organization-scopes/${id}`);
+                  await api.delete(`api/organization-scopes/${data.id}`);
                   void mutate();
                 }}
               />
@@ -82,6 +90,7 @@ function PermissionsField() {
         ]}
         onPageChange={setPage}
         onAdd={() => {
+          setEditData(null);
           setIsModalOpen(true);
         }}
       />

packages/console/src/pages/Organizations/RoleModal/index.tsx

@@ -1,25 +1,37 @@
-import { type OrganizationScope } from '@logto/schemas';
+import {
+  type OrganizationRole,
+  type OrganizationRoleWithScopes,
+  type OrganizationScope,
+} from '@logto/schemas';
+import { type Nullable } from '@silverhand/essentials';
 import { useEffect, useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
+import { useTranslation } from 'react-i18next';
 import ReactModal from 'react-modal';
 import useSWR from 'swr';
 
 import { defaultPageSize } from '@/consts';
 import Button from '@/ds-components/Button';
+import DangerousRaw from '@/ds-components/DangerousRaw';
 import FormField from '@/ds-components/FormField';
 import ModalLayout from '@/ds-components/ModalLayout';
 import MultiSelect, { type Option } from '@/ds-components/Select/MultiSelect';
 import TextInput from '@/ds-components/TextInput';
+import useActionTranslation from '@/hooks/use-action-translation';
 import useApi, { type RequestError } from '@/hooks/use-api';
 import * as modalStyles from '@/scss/modal.module.scss';
 import { buildUrl } from '@/utils/url';
 
+const organizationRolePath = 'api/organization-roles';
+
 type Props = {
   isOpen: boolean;
+  editData: Nullable<OrganizationRoleWithScopes>;
   onFinish: () => void;
 };
 
-function CreateRoleModal({ isOpen, onFinish }: Props) {
+/** A modal that allows users to create or edit an organization role. */
+function RoleModal({ isOpen, editData, onFinish }: Props) {
   const api = useApi();
   const [isLoading, setIsLoading] = useState(false);
   const {
@@ -28,8 +40,8 @@ function CreateRoleModal({ isOpen, onFinish }: Props) {
     control,
     handleSubmit,
     formState: { errors },
-  } = useForm<{ name: string; description?: string; scopes: Array<Option<string>> }>({
-    defaultValues: { name: '', scopes: [] },
+  } = useForm<Partial<OrganizationRole> & { scopes: Array<Option<string>> }>({
+    defaultValues: { scopes: [] },
   });
   const [keyword, setKeyword] = useState('');
   const {
@@ -45,15 +57,29 @@ function CreateRoleModal({ isOpen, onFinish }: Props) {
     { revalidateOnFocus: false }
   );
   const [scopes] = response ?? [[], 0];
+  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const tAction = useActionTranslation();
+  const title = editData
+    ? tAction('edit', 'organizations.organization_role')
+    : tAction('create', 'organizations.organization_role');
+  const action = editData ? t('general.save') : tAction('create', 'organizations.role');
 
-  const addRole = handleSubmit(async ({ scopes, ...json }) => {
+  const submit = handleSubmit(async ({ scopes, ...json }) => {
     setIsLoading(true);
     try {
-      await api.post('api/organization-roles', {
-        json: {
-          ...json,
-          organizationScopeIds: scopes.map(({ value }) => value),
-        },
+      // Create or update role
+      const { id } = await (editData
+        ? api.patch(`${organizationRolePath}/${editData.id}`, {
+            json,
+          })
+        : api.post(organizationRolePath, {
+            json,
+          })
+      ).json<OrganizationRole>();
+
+      // Update scopes for role
+      await api.put(`${organizationRolePath}/${id}/scopes`, {
+        json: { organizationScopeIds: scopes.map(({ value }) => value) },
       });
       onFinish();
     } finally {
@@ -61,12 +87,20 @@ function CreateRoleModal({ isOpen, onFinish }: Props) {
     }
   });
 
-  // Reset form on close
+  // Reset form on open
   useEffect(() => {
-    if (!isOpen) {
-      reset();
+    if (isOpen) {
+      reset(
+        editData
+          ? {
+              ...editData,
+              scopes: editData.scopes.map(({ id, name }) => ({ value: id, title: name })),
+            }
+          : { scopes: [] }
+      );
+      setKeyword('');
     }
-  }, [isOpen, reset]);
+  }, [editData, isOpen, reset]);
 
   // Initial fetch on open
   useEffect(() => {
@@ -83,13 +117,13 @@ function CreateRoleModal({ isOpen, onFinish }: Props) {
       onRequestClose={onFinish}
     >
       <ModalLayout
-        title="organizations.create_organization_role"
+        title={<DangerousRaw>{title}</DangerousRaw>}
         footer={
           <Button
             type="primary"
-            title="organizations.create_role"
+            title={<DangerousRaw>{action}</DangerousRaw>}
             isLoading={isLoading}
-            onClick={addRole}
+            onClick={submit}
           />
         }
         onClose={onFinish}
@@ -129,4 +163,4 @@ function CreateRoleModal({ isOpen, onFinish }: Props) {
     </ReactModal>
   );
 }
-export default CreateRoleModal;
+export default RoleModal;

packages/console/src/pages/Organizations/RolesField/index.tsx

@@ -1,15 +1,16 @@
 import { type OrganizationRoleWithScopes } from '@logto/schemas';
+import { type Nullable } from '@silverhand/essentials';
 import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import useSWR from 'swr';
 
-import DeleteButton from '@/components/DeleteButton';
 import FormField from '@/ds-components/FormField';
 import Tag from '@/ds-components/Tag';
 import useApi, { type RequestError } from '@/hooks/use-api';
+import ActionsButton from '@/pages/Organizations/ActionsButton';
 import { buildUrl } from '@/utils/url';
 
-import CreateRoleModal from '../CreateRoleModal';
+import RoleModal from '../RoleModal';
 import TemplateTable, { pageSize } from '../TemplateTable';
 
 import * as styles from './index.module.scss';
@@ -35,6 +36,7 @@ function RolesField() {
   const api = useApi();
   const [isModalOpen, setIsModalOpen] = useState(false);
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const [editData, setEditData] = useState<Nullable<OrganizationRoleWithScopes>>(null);
 
   const isLoading = !response && !error;
 
@@ -43,9 +45,10 @@ function RolesField() {
   }
 
   return (
-    <FormField title="organizations.organization_roles">
-      <CreateRoleModal
+    <FormField title="organizations.organization_role_other">
+      <RoleModal
         isOpen={isModalOpen}
+        editData={editData}
         onFinish={() => {
           setIsModalOpen(false);
           void mutate();
@@ -83,11 +86,16 @@ function RolesField() {
           {
             title: null,
             dataIndex: 'delete',
-            render: ({ id }) => (
-              <DeleteButton
+            render: (data) => (
+              <ActionsButton
+                fieldName="organizations.role"
                 content="Delete at your own risk, mate."
+                onEdit={() => {
+                  setEditData(data);
+                  setIsModalOpen(true);
+                }}
                 onDelete={async () => {
-                  await api.delete(`api/organization-roles/${id}`);
+                  await api.delete(`api/organization-roles/${data.id}`);
                   void mutate();
                 }}
               />
@@ -96,6 +104,7 @@ function RolesField() {
         ]}
         onPageChange={setPage}
         onAdd={() => {
+          setEditData(null);
           setIsModalOpen(true);
         }}
       />

packages/core/src/queries/organizations.ts

@@ -18,7 +18,7 @@ import { conditionalSql, convertToIdentifiers } from '@logto/shared';
 import { sql, type CommonQueryMethods } from 'slonik';
 import { z } from 'zod';
 
-import RelationQueries from '#src/utils/RelationQueries.js';
+import RelationQueries, { TwoRelationsQueries } from '#src/utils/RelationQueries.js';
 import SchemaQueries from '#src/utils/SchemaQueries.js';
 
 /**
@@ -52,7 +52,7 @@ export const organizationWithRolesGuard: z.ZodType<OrganizationWithRoles> =
       .array(),
   });
 
-class UserRelationQueries extends RelationQueries<[typeof Organizations, typeof Users]> {
+class UserRelationQueries extends TwoRelationsQueries<typeof Organizations, typeof Users> {
   constructor(pool: CommonQueryMethods) {
     super(pool, OrganizationUserRelations.table, Organizations, Users);
   }
@@ -94,15 +94,23 @@ class OrganizationRolesQueries extends SchemaQueries<
   CreateOrganizationRole,
   OrganizationRole
 > {
-  async findAllWithScopes(
+  override async findById(id: string): Promise<Readonly<OrganizationRoleWithScopes>> {
+    return this.pool.one(this.#findWithScopesSql(id));
+  }
+
+  override async findAll(
     limit: number,
     offset: number
   ): Promise<Readonly<OrganizationRoleWithScopes[]>> {
+    return this.pool.any(this.#findWithScopesSql(undefined, limit, offset));
+  }
+
+  #findWithScopesSql(roleId?: string, limit = 1, offset = 0) {
     const { table, fields } = convertToIdentifiers(OrganizationRoles, true);
     const relations = convertToIdentifiers(OrganizationRoleScopeRelations, true);
     const scopes = convertToIdentifiers(OrganizationScopes, true);
 
-    return this.pool.any(sql`
+    return sql<OrganizationRoleWithScopes>`
       select
         ${table}.*,
         coalesce(
@@ -110,7 +118,7 @@ class OrganizationRolesQueries extends SchemaQueries<
             json_build_object(
               'id', ${scopes.fields.id},
               'name', ${scopes.fields.name}
-            )
+            ) order by ${scopes.fields.name}
           ) filter (where ${scopes.fields.id} is not null),
           '[]'
         ) as scopes -- left join could produce nulls as scopes
@@ -119,13 +127,16 @@ class OrganizationRolesQueries extends SchemaQueries<
         on ${relations.fields.organizationRoleId} = ${fields.id}
       left join ${scopes.table}
         on ${relations.fields.organizationScopeId} = ${scopes.fields.id}
+      ${conditionalSql(roleId, (id) => {
+        return sql`where ${fields.id} = ${id}`;
+      })}
       group by ${fields.id}
       ${conditionalSql(this.orderBy, ({ field, order }) => {
         return sql`order by ${fields[field]} ${order === 'desc' ? sql`desc` : sql`asc`}`;
       })}
       limit ${limit}
       offset ${offset}
-    `);
+    `;
   }
 }
 
@@ -146,7 +157,7 @@ export default class OrganizationQueries extends SchemaQueries<
   /** Queries for relations that connected with organization-related entities. */
   relations = {
     /** Queries for organization role - organization scope relations. */
-    rolesScopes: new RelationQueries(
+    rolesScopes: new TwoRelationsQueries(
       this.pool,
       OrganizationRoleScopeRelations.table,
       OrganizationRoles,

packages/core/src/routes/organization/roles.ts

@@ -1,13 +1,5 @@
-import {
-  type CreateOrganizationRole,
-  OrganizationRoles,
-  organizationRoleWithScopesGuard,
-} from '@logto/schemas';
-import { generateStandardId } from '@logto/shared';
-import { z } from 'zod';
+import { OrganizationRoles } from '@logto/schemas';
 
-import koaGuard from '#src/middleware/koa-guard.js';
-import koaPagination from '#src/middleware/koa-pagination.js';
 import SchemaRouter from '#src/utils/SchemaRouter.js';
 
 import { type AuthedRouter, type RouterInitArgs } from '../types.js';
@@ -28,65 +20,9 @@ export default function organizationRoleRoutes<T extends AuthedRouter>(
   ]: RouterInitArgs<T>
 ) {
   const router = new SchemaRouter(OrganizationRoles, roles, {
-    disabled: { get: true, post: true },
     errorHandler,
   });
 
-  router.get(
-    '/',
-    koaPagination(),
-    koaGuard({
-      response: organizationRoleWithScopesGuard.array(),
-      status: [200],
-    }),
-    async (ctx, next) => {
-      const { limit, offset } = ctx.pagination;
-      const [count, entities] = await Promise.all([
-        roles.findTotalNumber(),
-        roles.findAllWithScopes(limit, offset),
-      ]);
-
-      ctx.pagination.totalCount = count;
-      ctx.body = entities;
-      return next();
-    }
-  );
-
-  /** Allows to carry an initial set of scopes for creating a new organization role. */
-  type CreateOrganizationRolePayload = Omit<CreateOrganizationRole, 'id'> & {
-    organizationScopeIds: string[];
-  };
-
-  const createGuard: z.ZodType<CreateOrganizationRolePayload, z.ZodTypeDef, unknown> =
-    OrganizationRoles.createGuard
-      .omit({
-        id: true,
-      })
-      .extend({
-        organizationScopeIds: z.array(z.string()).default([]),
-      });
-
-  router.post(
-    '/',
-    koaGuard({
-      body: createGuard,
-      response: OrganizationRoles.guard,
-      status: [201, 422],
-    }),
-    async (ctx, next) => {
-      const { organizationScopeIds: scopeIds, ...data } = ctx.guard.body;
-      const role = await roles.insert({ id: generateStandardId(), ...data });
-
-      if (scopeIds.length > 0) {
-        await rolesScopes.insert(...scopeIds.map<[string, string]>((id) => [role.id, id]));
-      }
-
-      ctx.body = role;
-      ctx.status = 201;
-      return next();
-    }
-  );
-
   router.addRelationRoutes(rolesScopes, 'scopes');
 
   originalRouter.use(router.routes());

packages/core/src/utils/RelationQueries.ts

@@ -239,3 +239,56 @@ export default class RelationQueries<
     `);
   }
 }
+
+/**
+ * Query class for relation tables that connect two tables by their entity ids. It
+ * provides a {@link RelationQueries.replace} method that replaces all relations
+ * for a specific entity.
+ *
+ * @see {@link RelationQueries} for more information.
+ */
+export class TwoRelationsQueries<
+  Schema1 extends TableInfo<string, string, unknown>,
+  Schema2 extends TableInfo<string, string, unknown>,
+> extends RelationQueries<[Schema1, Schema2]> {
+  /**
+   * Replace all relations for a specific `Schema1` entity with the given `Schema2` entities.
+   * If `schema2Ids` is empty, all relations for the given `Schema1` entity will be deleted.
+   *
+   * @remarks This method is transactional.
+   * @param schema1Id The id of the `Schema1` entity.
+   * @param schema2Ids The ids of the `Schema2` entities to replace the relation s with.
+   * @returns A Promise that resolves to the query result.
+   */
+  async replace(schema1Id: string, schema2Ids: readonly string[]) {
+    return this.pool.transaction(async (transaction) => {
+      // Lock schema1 row
+      await transaction.query(sql`
+        select *
+        from ${sql.identifier([this.schemas[0].table])}
+        where id = ${schema1Id}
+        for update
+      `);
+      // Delete old relations
+      await transaction.query(sql`
+        delete from ${this.table}
+        where ${sql.identifier([this.schemas[0].tableSingular + '_id'])} = ${schema1Id}
+      `);
+
+      if (schema2Ids.length === 0) {
+        return;
+      }
+      // Insert new relations
+      await transaction.query(sql`
+        insert into ${this.table} (
+          ${sql.identifier([this.schemas[0].tableSingular + '_id'])},
+          ${sql.identifier([this.schemas[1].tableSingular + '_id'])}
+        )
+          values ${sql.join(
+            schema2Ids.map((schema2Id) => sql`(${schema1Id}, ${schema2Id})`),
+            sql`, `
+          )}
+      `);
+    });
+  }
+}

packages/core/src/utils/SchemaRouter.ts

@@ -9,7 +9,7 @@ import { z } from 'zod';
 import koaGuard from '#src/middleware/koa-guard.js';
 import koaPagination from '#src/middleware/koa-pagination.js';
 
-import type RelationQueries from './RelationQueries.js';
+import { type TwoRelationsQueries } from './RelationQueries.js';
 import type SchemaQueries from './SchemaQueries.js';
 
 /**
@@ -219,14 +219,15 @@ export default class SchemaRouter<
    * @param relationQueries The queries class for the relation.
    * @param pathname The pathname of the relation. If not provided, it will be
    * the camel case of the relation schema's table name.
-   * @see {@link RelationQueries} for the `relationQueries` configuration.
+   * @see {@link TwoRelationsQueries} for the `relationQueries` configuration.
    */
   addRelationRoutes<
     RelationCreateSchema extends Partial<SchemaLike<string> & { id: string }>,
     RelationSchema extends SchemaLike<string> & { id: string },
   >(
-    relationQueries: RelationQueries<
-      [typeof this.schema, GeneratedSchema<string, RelationCreateSchema, RelationSchema>]
+    relationQueries: TwoRelationsQueries<
+      typeof this.schema,
+      GeneratedSchema<string, RelationCreateSchema, RelationSchema>
     >,
     pathname = tableToPathname(relationQueries.schemas[1].table)
   ) {
@@ -286,6 +287,25 @@ export default class SchemaRouter<
       }
     );
 
+    this.put(
+      `/:id/${pathname}`,
+      koaGuard({
+        params: z.object({ id: z.string().min(1) }),
+        body: z.object({ [columns.relationSchemaIds]: z.string().min(1).array().nonempty() }),
+        status: [204, 422],
+      }),
+      async (ctx, next) => {
+        const {
+          params: { id },
+          body: { [columns.relationSchemaIds]: relationIds },
+        } = ctx.guard;
+
+        await relationQueries.replace(id, relationIds ?? []);
+        ctx.status = 204;
+        return next();
+      }
+    );
+
     this.delete(
       `/:id/${pathname}/:relationId`,
       koaGuard({

packages/integration-tests/src/api/organization-role.ts

@@ -1,4 +1,8 @@
-import { type OrganizationScope, type OrganizationRole } from '@logto/schemas';
+import {
+  type OrganizationScope,
+  type OrganizationRole,
+  type OrganizationRoleWithScopes,
+} from '@logto/schemas';
 
 import { authedAdminApi } from './api.js';
 import { ApiFactory } from './factory.js';
@@ -11,6 +15,18 @@ class OrganizationRoleApi extends ApiFactory<
     super('organization-roles');
   }
 
+  override async getList(
+    params?: URLSearchParams | undefined
+  ): Promise<OrganizationRoleWithScopes[]> {
+    // eslint-disable-next-line no-restricted-syntax
+    return super.getList(params) as Promise<OrganizationRoleWithScopes[]>;
+  }
+
+  override async get(id: string): Promise<OrganizationRoleWithScopes> {
+    // eslint-disable-next-line no-restricted-syntax
+    return super.get(id) as Promise<OrganizationRoleWithScopes>;
+  }
+
   async addScopes(id: string, organizationScopeIds: string[]): Promise<void> {
     await authedAdminApi.post(`${this.path}/${id}/scopes`, { json: { organizationScopeIds } });
   }

packages/integration-tests/src/tests/api/organization-role.test.ts

@@ -29,51 +29,6 @@ describe('organization role APIs', () => {
       await roleApi.delete(createdRole.id);
     });
 
-    it('should be able to create a role with some scopes', async () => {
-      const name = 'test' + randomId();
-      const scopes = await Promise.all(
-        Array.from({ length: 20 }).map(async () => scopeApi.create({ name: 'test' + randomId() }))
-      );
-      const organizationScopeIds = scopes.map((scope) => scope.id);
-      const role = await roleApi.create({ name, organizationScopeIds });
-
-      const roleScopes = await roleApi.getScopes(role.id);
-      expect(roleScopes).toHaveLength(20);
-
-      // Check pagination
-      const roleScopes2 = await roleApi.getScopes(
-        role.id,
-        new URLSearchParams({
-          page: '2',
-          page_size: '10',
-        })
-      );
-
-      expect(roleScopes2).toHaveLength(10);
-      expect(roleScopes2[0]?.id).not.toBeFalsy();
-      expect(roleScopes2[0]?.id).toBe(roleScopes[10]?.id);
-
-      await Promise.all(scopes.map(async (scope) => scopeApi.delete(scope.id)));
-      await roleApi.delete(role.id);
-    });
-
-    it('should fail to create a role with some scopes if the scopes do not exist', async () => {
-      const name = 'test' + randomId();
-      const organizationScopeIds = ['0'];
-      const response = await roleApi
-        .create({ name, organizationScopeIds })
-        .catch((error: unknown) => error);
-
-      assert(response instanceof HTTPError);
-
-      const { statusCode, body: raw } = response.response;
-      const body: unknown = JSON.parse(String(raw));
-      expect(statusCode).toBe(422);
-      expect(isKeyInObject(body, 'code') && body.code).toBe(
-        'entity.relation_foreign_key_not_found'
-      );
-    });
-
     it('should get organization roles successfully', async () => {
       const [name1, name2] = ['test' + randomId(), 'test' + randomId()];
       const createdRoles = await Promise.all([
@@ -114,7 +69,7 @@ describe('organization role APIs', () => {
 
     it('should be able to create and get organization roles by id', async () => {
       const createdRole = await roleApi.create({ name: 'test' + randomId() });
-      const role = await roleApi.get(createdRole.id);
+      const { scopes, ...role } = await roleApi.get(createdRole.id);
 
       expect(role).toStrictEqual(createdRole);
       await roleApi.delete(createdRole.id);

packages/phrases/src/locales/de/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/de/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/en/translation/admin-console/general.ts

@@ -60,6 +60,9 @@ const general = {
   contact_us_action: 'Contact Us',
   description: 'Description',
   name: 'Name',
+  create_field: 'Create {{field}}',
+  edit_field: 'Edit {{field}}',
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/en/translation/admin-console/organizations.ts

@@ -5,20 +5,16 @@ const organization = {
   access_control: 'Access control',
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
-  organization_permissions: 'Organization permissions',
-  create_organization_permission: 'Create organization permission',
-  create_permission: 'Create permission',
+  organization_permission: 'Organization permission',
+  organization_permission_other: 'Organization permissions',
   create_permission_placeholder: 'Read appointment history.',
   permission: 'Permission',
   permission_other: 'Permissions',
-  organization_roles: 'Organization roles',
-  create_organization_role: 'Create organization role',
+  organization_role: 'Organization role',
+  organization_role_other: 'Organization roles',
   role: 'Role',
-  create_role: 'Create role',
   create_role_placeholder: 'Users with view-only permissions.',
   search_permission_placeholder: 'Type to search for permissions.',
-  edit_role: 'Edit role',
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organization);

packages/phrases/src/locales/es/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/es/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/fr/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/fr/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/it/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/it/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/ja/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/ja/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/ko/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/ko/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/pl-pl/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/pl-pl/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/pt-br/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/pt-br/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/pt-pt/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/pt-pt/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/ru/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/ru/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/tr-tr/translation/admin-console/general.ts

@@ -64,6 +64,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/tr-tr/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/zh-cn/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/zh-cn/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/zh-hk/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/zh-hk/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);

packages/phrases/src/locales/zh-tw/translation/admin-console/general.ts

@@ -63,6 +63,12 @@ const general = {
   description: 'Description',
   /** UNTRANSLATED */
   name: 'Name',
+  /** UNTRANSLATED */
+  create_field: 'Create {{field}}',
+  /** UNTRANSLATED */
+  edit_field: 'Edit {{field}}',
+  /** UNTRANSLATED */
+  delete_field: 'Delete {{field}}',
 };
 
 export default Object.freeze(general);

packages/phrases/src/locales/zh-tw/translation/admin-console/organizations.ts

@@ -10,11 +10,9 @@ const organizations = {
   access_control_description:
     'Authorization in a multi-tenancy applications is often designed to make sure that tenant isolation is maintained throughout an application and that tenants can access only their own resources.',
   /** UNTRANSLATED */
-  organization_permissions: 'Organization permissions',
+  organization_permission: 'Organization permission',
   /** UNTRANSLATED */
-  create_organization_permission: 'Create organization permission',
-  /** UNTRANSLATED */
-  create_permission: 'Create permission',
+  organization_permission_other: 'Organization permissions',
   /** UNTRANSLATED */
   create_permission_placeholder: 'Read appointment history.',
   /** UNTRANSLATED */
@@ -22,21 +20,15 @@ const organizations = {
   /** UNTRANSLATED */
   permission_other: 'Permissions',
   /** UNTRANSLATED */
-  organization_roles: 'Organization roles',
+  organization_role: 'Organization role',
   /** UNTRANSLATED */
-  create_organization_role: 'Create organization role',
+  organization_role_other: 'Organization roles',
   /** UNTRANSLATED */
   role: 'Role',
   /** UNTRANSLATED */
-  create_role: 'Create role',
-  /** UNTRANSLATED */
   create_role_placeholder: 'Users with view-only permissions.',
   /** UNTRANSLATED */
   search_permission_placeholder: 'Type to search for permissions.',
-  /** UNTRANSLATED */
-  edit_role: 'Edit role',
-  /** UNTRANSLATED */
-  delete_role: 'Delete role',
 };
 
 export default Object.freeze(organizations);