feat(console): support org permission management on new org template page (#5603)

* feat(console): support org permission management on new org template page

* refactor(console): rename org pages

* refactor(console): rename phrase keys

* refactor(console): rename org to organization

packages/console/src/consts/page-tabs.ts

@@ -49,6 +49,6 @@ export enum EnterpriseSsoDetailsTabs {
 }
 
 export enum OrganizationTemplateTabs {
-  OrgRoles = 'org-roles',
-  OrgPermissions = 'org-permissions',
+  OrganizationRoles = 'organization-roles',
+  OrganizationPermissions = 'organization-permissions',
 }

packages/console/src/containers/ConsoleContent/index.tsx

@@ -36,8 +36,8 @@ import Mfa from '@/pages/Mfa';
 import NotFound from '@/pages/NotFound';
 import OrganizationDetails from '@/pages/OrganizationDetails';
 import OrganizationTemplate from '@/pages/OrganizationTemplate';
-import OrgPermissions from '@/pages/OrganizationTemplate/OrgPermissions';
-import OrgRoles from '@/pages/OrganizationTemplate/OrgRoles';
+import OrganizationPermissions from '@/pages/OrganizationTemplate/OrganizationPermissions';
+import OrganizationRoles from '@/pages/OrganizationTemplate/OrganizationRoles';
 import Organizations from '@/pages/Organizations';
 import OrganizationGuide from '@/pages/Organizations/Guide';
 import Profile from '@/pages/Profile';
@@ -190,12 +190,15 @@ function ConsoleContent() {
               <Route path="organization-template" element={<OrganizationTemplate />}>
                 <Route
                   index
-                  element={<Navigate replace to={OrganizationTemplateTabs.OrgRoles} />}
+                  element={<Navigate replace to={OrganizationTemplateTabs.OrganizationRoles} />}
                 />
-                <Route path={OrganizationTemplateTabs.OrgRoles} element={<OrgRoles />} />
                 <Route
-                  path={OrganizationTemplateTabs.OrgPermissions}
-                  element={<OrgPermissions />}
+                  path={OrganizationTemplateTabs.OrganizationRoles}
+                  element={<OrganizationRoles />}
+                />
+                <Route
+                  path={OrganizationTemplateTabs.OrganizationPermissions}
+                  element={<OrganizationPermissions />}
                 />
               </Route>
             )}

packages/console/src/pages/OrganizationTemplate/OrgPermissions/index.tsx

@@ -1,139 +0,0 @@
-import { type OrganizationScope } from '@logto/schemas';
-import { cond } from '@silverhand/essentials';
-import { useTranslation } from 'react-i18next';
-import useSWR from 'swr';
-
-import Plus from '@/assets/icons/plus.svg';
-import PermissionsEmptyDark from '@/assets/images/permissions-empty-dark.svg';
-import PermissionsEmpty from '@/assets/images/permissions-empty.svg';
-import ActionsButton from '@/components/ActionsButton';
-import Breakable from '@/components/Breakable';
-import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
-import { organizationPermissionLink } from '@/consts';
-import Button from '@/ds-components/Button';
-import DynamicT from '@/ds-components/DynamicT';
-import Search from '@/ds-components/Search';
-import Table from '@/ds-components/Table';
-import TablePlaceholder from '@/ds-components/Table/TablePlaceholder';
-import Tag from '@/ds-components/Tag';
-import { type RequestError } from '@/hooks/use-api';
-import useDocumentationUrl from '@/hooks/use-documentation-url';
-import useSearchParametersWatcher from '@/hooks/use-search-parameters-watcher';
-import { buildUrl, formatSearchKeyword } from '@/utils/url';
-
-import * as styles from './index.module.scss';
-
-function OrgPermissions() {
-  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
-  const { getDocumentationUrl } = useDocumentationUrl();
-  const [{ keyword }, updateSearchParameters] = useSearchParametersWatcher({
-    keyword: '',
-  });
-
-  const { data, error, mutate, isLoading } = useSWR<OrganizationScope[], RequestError>(
-    buildUrl('api/organization-scopes', {
-      ...cond(keyword && { q: formatSearchKeyword(keyword) }),
-    })
-  );
-
-  return (
-    <Table
-      rowGroups={[{ key: 'orgPermissions', data }]}
-      rowIndexKey="id"
-      columns={[
-        {
-          title: <DynamicT forKey="organization_template.org_permissions.permission_column" />,
-          dataIndex: 'name',
-          colSpan: 7,
-          render: ({ name }) => {
-            return (
-              <Tag variant="cell">
-                <Breakable>{name}</Breakable>
-              </Tag>
-            );
-          },
-        },
-        {
-          title: <DynamicT forKey="organization_template.org_permissions.description_column" />,
-          dataIndex: 'scopes',
-          colSpan: 8,
-          render: ({ description }) => <Breakable>{description ?? '-'}</Breakable>,
-        },
-        {
-          title: null,
-          dataIndex: 'action',
-          colSpan: 1,
-          render: () => (
-            <ActionsButton
-              fieldName="organization_template.org_permissions.permission_column"
-              deleteConfirmation="organization_template.org_permissions.delete_confirm"
-              onEdit={() => {
-                // Todo @xiaoyijun implement edit
-              }}
-              onDelete={async () => {
-                // Todo @xiaoyijun implement deletion
-              }}
-            />
-          ),
-        },
-      ]}
-      filter={
-        <div className={styles.filter}>
-          <Search
-            placeholder={t('organization_template.org_permissions.search_placeholder')}
-            defaultValue={keyword}
-            isClearable={Boolean(keyword)}
-            onSearch={(keyword) => {
-              updateSearchParameters({ keyword });
-            }}
-            onClearSearch={() => {
-              updateSearchParameters({ keyword: '' });
-            }}
-          />
-          <Button
-            title="organization_template.org_permissions.create_org_permission"
-            className={styles.createButton}
-            type="primary"
-            size="large"
-            icon={<Plus />}
-            onClick={() => {
-              // Todo @xiaoyijun implement org permission creation
-            }}
-          />
-        </div>
-      }
-      placeholder={
-        keyword ? (
-          <EmptyDataPlaceholder />
-        ) : (
-          <TablePlaceholder
-            image={<PermissionsEmpty />}
-            imageDark={<PermissionsEmptyDark />}
-            title="organization_template.org_permissions.placeholder_title"
-            description="organization_template.org_permissions.placeholder_description"
-            learnMoreLink={{
-              href: getDocumentationUrl(organizationPermissionLink),
-              targetBlank: 'noopener',
-            }}
-            action={
-              <Button
-                title="organization_template.org_permissions.create_org_permission"
-                type="primary"
-                size="large"
-                icon={<Plus />}
-                onClick={() => {
-                  // Todo @xiaoyijun implement org permission creation
-                }}
-              />
-            }
-          />
-        )
-      }
-      isLoading={isLoading}
-      errorMessage={error?.body?.message ?? error?.message}
-      onRetry={async () => mutate(undefined, true)}
-    />
-  );
-}
-
-export default OrgPermissions;

packages/console/src/pages/OrganizationTemplate/OrganizationPermissions/OrganizationPermissionModal.tsx

@@ -0,0 +1,114 @@
+import { type OrganizationScope } from '@logto/schemas';
+import { cond, type Nullable } from '@silverhand/essentials';
+import { useForm } from 'react-hook-form';
+import { toast } from 'react-hot-toast';
+import { useTranslation } from 'react-i18next';
+import ReactModal from 'react-modal';
+
+import Button from '@/ds-components/Button';
+import FormField from '@/ds-components/FormField';
+import ModalLayout from '@/ds-components/ModalLayout';
+import TextInput from '@/ds-components/TextInput';
+import useApi from '@/hooks/use-api';
+import * as modalStyles from '@/scss/modal.module.scss';
+import { trySubmitSafe } from '@/utils/form';
+
+type Props = {
+  /**
+   * The organization permission data to edit. If null, the modal will be in create mode.
+   */
+  data: Nullable<OrganizationScope>;
+  onClose: () => void;
+};
+
+type FormData = Pick<OrganizationScope, 'name' | 'description'>;
+
+const organizationScopesPath = 'api/organization-scopes';
+
+/** A modal that allows users to create or edit an organization permission. */
+function OrganizationPermissionModal({ data, onClose }: Props) {
+  const isCreateMode = data === null;
+
+  const { t } = useTranslation(undefined, {
+    keyPrefix: 'admin_console',
+  });
+
+  const api = useApi();
+
+  const {
+    register,
+    formState: { errors, isSubmitting },
+    handleSubmit,
+  } = useForm<FormData>(cond(data && { defaultValues: data }));
+
+  const submit = handleSubmit(
+    trySubmitSafe(async (json) => {
+      await (isCreateMode
+        ? api.post(organizationScopesPath, {
+            json,
+          })
+        : api.patch(`${organizationScopesPath}/${data.id}`, {
+            json,
+          }));
+      toast.success(
+        t(isCreateMode ? 'organization_template.permissions.created' : 'general.saved', {
+          name: json.name,
+        })
+      );
+      onClose();
+    })
+  );
+
+  return (
+    <ReactModal
+      isOpen
+      className={modalStyles.content}
+      overlayClassName={modalStyles.overlay}
+      onRequestClose={onClose}
+    >
+      <ModalLayout
+        title={`organization_template.permissions.${isCreateMode ? 'create' : 'edit'}_title`}
+        footer={
+          <>
+            {!isCreateMode && (
+              <Button title="general.cancel" isLoading={isSubmitting} onClick={onClose} />
+            )}
+            <Button
+              type="primary"
+              title={
+                isCreateMode
+                  ? 'organization_template.permissions.create_permission'
+                  : 'general.save'
+              }
+              isLoading={isSubmitting}
+              onClick={submit}
+            />
+          </>
+        }
+        onClose={onClose}
+      >
+        <FormField isRequired title="organization_template.permissions.permission_field_name">
+          <TextInput
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus={isCreateMode}
+            readOnly={!isCreateMode}
+            placeholder="read:appointment"
+            error={Boolean(errors.name)}
+            {...register('name', { required: true })}
+          />
+        </FormField>
+        <FormField title="organization_template.permissions.description_field_name">
+          <TextInput
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus={!isCreateMode}
+            placeholder={t('organization_template.permissions.description_field_placeholder')}
+            error={Boolean(errors.description)}
+            {...register('description')}
+          />
+        </FormField>
+      </ModalLayout>
+    </ReactModal>
+  );
+}
+
+export default OrganizationPermissionModal;

packages/console/src/pages/OrganizationTemplate/OrganizationPermissions/index.tsx

@@ -0,0 +1,156 @@
+import { type OrganizationScope } from '@logto/schemas';
+import { type Nullable, cond } from '@silverhand/essentials';
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import useSWR from 'swr';
+
+import Plus from '@/assets/icons/plus.svg';
+import PermissionsEmptyDark from '@/assets/images/permissions-empty-dark.svg';
+import PermissionsEmpty from '@/assets/images/permissions-empty.svg';
+import ActionsButton from '@/components/ActionsButton';
+import Breakable from '@/components/Breakable';
+import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
+import { organizationPermissionLink } from '@/consts';
+import Button from '@/ds-components/Button';
+import DynamicT from '@/ds-components/DynamicT';
+import Search from '@/ds-components/Search';
+import Table from '@/ds-components/Table';
+import TablePlaceholder from '@/ds-components/Table/TablePlaceholder';
+import Tag from '@/ds-components/Tag';
+import useApi, { type RequestError } from '@/hooks/use-api';
+import useDocumentationUrl from '@/hooks/use-documentation-url';
+import useSearchParametersWatcher from '@/hooks/use-search-parameters-watcher';
+import { buildUrl, formatSearchKeyword } from '@/utils/url';
+
+import OrganizationPermissionModal from './OrganizationPermissionModal';
+import * as styles from './index.module.scss';
+
+function OrganizationPermissions() {
+  const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
+  const { getDocumentationUrl } = useDocumentationUrl();
+  const [{ keyword }, updateSearchParameters] = useSearchParametersWatcher({
+    keyword: '',
+  });
+
+  const { data, error, mutate, isLoading } = useSWR<OrganizationScope[], RequestError>(
+    buildUrl('api/organization-scopes', {
+      ...cond(keyword && { q: formatSearchKeyword(keyword) }),
+    })
+  );
+
+  const api = useApi();
+
+  const [permissionModalData, setPermissionModalData] = useState<Nullable<OrganizationScope>>();
+
+  return (
+    <>
+      <Table
+        rowGroups={[{ key: 'organizationPermissions', data }]}
+        rowIndexKey="id"
+        columns={[
+          {
+            title: <DynamicT forKey="organization_template.permissions.permission_column" />,
+            dataIndex: 'name',
+            colSpan: 7,
+            render: ({ name }) => {
+              return (
+                <Tag variant="cell">
+                  <Breakable>{name}</Breakable>
+                </Tag>
+              );
+            },
+          },
+          {
+            title: <DynamicT forKey="organization_template.permissions.description_column" />,
+            dataIndex: 'scopes',
+            colSpan: 8,
+            render: ({ description }) => <Breakable>{description ?? '-'}</Breakable>,
+          },
+          {
+            title: null,
+            dataIndex: 'action',
+            colSpan: 1,
+            render: (scope) => (
+              <ActionsButton
+                fieldName="organization_template.permissions.permission_column"
+                deleteConfirmation="organization_template.permissions.delete_confirm"
+                onEdit={() => {
+                  setPermissionModalData(scope);
+                }}
+                onDelete={async () => {
+                  await api.delete(`api/organization-scopes/${scope.id}`);
+                  void mutate();
+                }}
+              />
+            ),
+          },
+        ]}
+        filter={
+          <div className={styles.filter}>
+            <Search
+              placeholder={t('organization_template.permissions.search_placeholder')}
+              defaultValue={keyword}
+              isClearable={Boolean(keyword)}
+              onSearch={(keyword) => {
+                updateSearchParameters({ keyword });
+              }}
+              onClearSearch={() => {
+                updateSearchParameters({ keyword: '' });
+              }}
+            />
+            <Button
+              title="organization_template.permissions.create_org_permission"
+              className={styles.createButton}
+              type="primary"
+              icon={<Plus />}
+              onClick={() => {
+                setPermissionModalData(null);
+              }}
+            />
+          </div>
+        }
+        placeholder={
+          keyword ? (
+            <EmptyDataPlaceholder />
+          ) : (
+            <TablePlaceholder
+              image={<PermissionsEmpty />}
+              imageDark={<PermissionsEmptyDark />}
+              title="organization_template.permissions.placeholder_title"
+              description="organization_template.permissions.placeholder_description"
+              learnMoreLink={{
+                href: getDocumentationUrl(organizationPermissionLink),
+                targetBlank: 'noopener',
+              }}
+              action={
+                <Button
+                  title="organization_template.permissions.create_org_permission"
+                  type="primary"
+                  size="large"
+                  icon={<Plus />}
+                  onClick={() => {
+                    setPermissionModalData(null);
+                  }}
+                />
+              }
+            />
+          )
+        }
+        isLoading={isLoading}
+        errorMessage={error?.body?.message ?? error?.message}
+        onRetry={async () => mutate(undefined, true)}
+      />
+      {permissionModalData !== undefined && (
+        <OrganizationPermissionModal
+          data={permissionModalData}
+          onClose={() => {
+            setPermissionModalData(undefined);
+            void mutate();
+          }}
+        />
+      )}
+    </>
+  );
+}
+
+export default OrganizationPermissions;

packages/console/src/pages/OrganizationTemplate/OrganizationRoles/index.tsx

@@ -21,7 +21,7 @@ import { buildUrl } from '@/utils/url';
 
 import * as styles from './index.module.scss';
 
-function OrgRoles() {
+function OrganizationRoles() {
   const { getDocumentationUrl } = useDocumentationUrl();
 
   const [{ page }, updateSearchParameters] = useSearchParametersWatcher({
@@ -42,11 +42,11 @@ function OrgRoles() {
 
   return (
     <Table
-      rowGroups={[{ key: 'orgRoles', data: orgRoles }]}
+      rowGroups={[{ key: 'organizationRoles', data: orgRoles }]}
       rowIndexKey="id"
       columns={[
         {
-          title: <DynamicT forKey="organization_template.org_roles.org_role_column" />,
+          title: <DynamicT forKey="organization_template.roles.role_column" />,
           dataIndex: 'name',
           colSpan: 4,
           render: ({ name }) => {
@@ -54,7 +54,7 @@ function OrgRoles() {
           },
         },
         {
-          title: <DynamicT forKey="organization_template.org_roles.permissions_column" />,
+          title: <DynamicT forKey="organization_template.roles.permissions_column" />,
           dataIndex: 'scopes',
           colSpan: 12,
           render: ({ scopes }) => {
@@ -75,9 +75,8 @@ function OrgRoles() {
       filter={
         <div className={styles.filter}>
           <Button
-            title="organization_template.org_roles.create_org_roles"
+            title="organization_template.roles.create_title"
             type="primary"
-            size="large"
             icon={<Plus />}
             onClick={() => {
               // Todo @xiaoyijun implment create org role
@@ -89,15 +88,15 @@ function OrgRoles() {
         <TablePlaceholder
           image={<RolesEmpty />}
           imageDark={<RolesEmptyDark />}
-          title="organization_template.org_roles.placeholder_title"
-          description="organization_template.org_roles.placeholder_description"
+          title="organization_template.roles.placeholder_title"
+          description="organization_template.roles.placeholder_description"
           learnMoreLink={{
             href: getDocumentationUrl(organizationRoleLink),
             targetBlank: 'noopener',
           }}
           action={
             <Button
-              title="organization_template.org_roles.create_org_roles"
+              title="organization_template.roles.create_title"
               type="primary"
               size="large"
               icon={<Plus />}
@@ -123,4 +122,4 @@ function OrgRoles() {
   );
 }
 
-export default OrgRoles;
+export default OrganizationRoles;

packages/console/src/pages/OrganizationTemplate/index.tsx

@@ -41,11 +41,11 @@ function OrganizationTemplate() {
         />
       </div>
       <TabNav>
-        <TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrgRoles}`}>
-          <DynamicT forKey="organization_template.org_roles.tab_name" />
+        <TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrganizationRoles}`}>
+          <DynamicT forKey="organization_template.roles.tab_name" />
         </TabNavItem>
-        <TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrgPermissions}`}>
-          <DynamicT forKey="organization_template.org_permissions.tab_name" />
+        <TabNavItem href={`${basePathname}/${OrganizationTemplateTabs.OrganizationPermissions}`}>
+          <DynamicT forKey="organization_template.permissions.tab_name" />
         </TabNavItem>
       </TabNav>
       <Outlet />

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Organisationsvorlage',
   subtitle:
     'In Multi-Tenant-SaaS-Anwendungen ist es üblich, dass mehrere Organisationen identische Zugriffskontrollrichtlinien teilen, einschließlich Berechtigungen und Rollen. In Logto wird dieses Konzept als "Organisationsvorlage" bezeichnet. Ihre Verwendung vereinfacht den Prozess des Aufbaus und Entwurfs Ihres Autorisierungsmodells.',
-  org_roles: {
+  roles: {
     tab_name: 'Org Rollen',
     search_placeholder: 'Nach Rollennamen suchen',
-    create_org_roles: 'Org Rolle erstellen',
-    org_role_column: 'Org Rolle',
+    create_title: 'Org Rolle erstellen',
+    role_column: 'Org Rolle',
     permissions_column: 'Berechtigungen',
     placeholder_title: 'Organisationsrolle',
     placeholder_description:
       'Eine Organisationsrolle ist eine Gruppierung von Berechtigungen, die Benutzern zugewiesen werden können. Die Berechtigungen müssen aus den vordefinierten Organisationsberechtigungen stammen.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Org Berechtigungen',
     search_placeholder: 'Nach Berechtigungsnamen suchen',
     create_org_permission: 'Org Berechtigung erstellen',
@@ -23,6 +23,13 @@ const organization_template = {
       'Organisationsberechtigung bezieht sich auf die Autorisierung, auf eine Ressource im Kontext der Organisation zuzugreifen.',
     delete_confirm:
       'Wenn diese Berechtigung gelöscht wird, verlieren alle Organisationsrollen, die diese Berechtigung beinhalten, diese Berechtigung und Benutzer, die diese Berechtigung hatten, verlieren den Zugang, der durch sie gewährt wurde.',
+    create_title: 'Erstellen von Organisationsberechtigungen',
+    edit_title: 'Bearbeiten von Organisationsberechtigungen',
+    permission_field_name: 'Berechtigungsname',
+    description_field_name: 'Beschreibung',
+    description_field_placeholder: 'Terminhistorie lesen',
+    create_permission: 'Berechtigung erstellen',
+    created: 'Die Organisationsberechtigung {{name}} wurde erfolgreich erstellt.',
   },
 };
 

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

@@ -2,20 +2,20 @@ const organization_template = {
   title: 'Organization template',
   subtitle:
     'In multi-tenant SaaS applications, it\'s common for multiple organizations to share identical access control policies, including permissions and roles. In Logto, this concept is termed "organization template." Using it streamlines the process of constructing and designing your authorization model.',
-  org_roles: {
-    tab_name: 'Org roles',
+  roles: {
+    tab_name: 'Organization roles',
     search_placeholder: 'Search by role name',
-    create_org_roles: 'Create org role',
-    org_role_column: 'Org role',
+    create_title: 'Create organization role',
+    role_column: 'Organization role',
     permissions_column: 'Permissions',
     placeholder_title: 'Organization role',
     placeholder_description:
       'Organization role is a grouping of permissions that can be assigned to users. The permissions must come from the predefined organization permissions.',
   },
-  org_permissions: {
-    tab_name: 'Org permissions',
+  permissions: {
+    tab_name: 'Organization permissions',
     search_placeholder: 'Search by permission name',
-    create_org_permission: 'Create org permission',
+    create_org_permission: 'Create organization permission',
     permission_column: 'Permission',
     description_column: 'Description',
     placeholder_title: 'Organization permission',
@@ -23,6 +23,13 @@ const organization_template = {
       'Organization permission refers to the authorization to access a resource in the context of organization.',
     delete_confirm:
       'If this permission is deleted, all organization roles including this permission will lose this permission, and users who had this permission will lose the access granted by it.',
+    create_title: 'Create organization permission',
+    edit_title: 'Edit organization permission',
+    permission_field_name: 'Permission name',
+    description_field_name: 'Description',
+    description_field_placeholder: 'Read appointment history',
+    create_permission: 'Create permission',
+    created: 'The organization permission {{name}} has been successfully created.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Plantilla de organización',
   subtitle:
     'En aplicaciones SaaS multiinquilino, es común que múltiples organizaciones compartan políticas de control de acceso idénticas, incluyendo permisos y roles. En Logto, este concepto se denomina "plantilla de organización". Usarla simplifica el proceso de construir y diseñar tu modelo de autorización.',
-  org_roles: {
+  roles: {
     tab_name: 'Roles de org',
     search_placeholder: 'Buscar por nombre de rol',
-    create_org_roles: 'Crear rol de org',
-    org_role_column: 'Rol de org',
+    create_title: 'Crear rol de org',
+    role_column: 'Rol de org',
     permissions_column: 'Permisos',
     placeholder_title: 'Rol de organización',
     placeholder_description:
       'El rol de organización es un agrupamiento de permisos que se pueden asignar a los usuarios. Los permisos deben provenir de los permisos de organización predefinidos.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Permisos de org',
     search_placeholder: 'Buscar por nombre de permiso',
     create_org_permission: 'Crear permiso de org',
@@ -23,6 +23,13 @@ const organization_template = {
       'El permiso de organización se refiere a la autorización para acceder a un recurso en el contexto de la organización.',
     delete_confirm:
       'Si se elimina este permiso, todos los roles de organización que incluyan este permiso perderán dicho permiso, y los usuarios que tenían este permiso perderán el acceso concedido por él.',
+    create_title: 'Crear permiso de organización',
+    edit_title: 'Editar permiso de organización',
+    permission_field_name: 'Nombre del permiso',
+    description_field_name: 'Descripción',
+    description_field_placeholder: 'Leer historial de citas',
+    create_permission: 'Crear permiso',
+    created: 'Se ha creado correctamente el permiso de organización {{name}}.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Modèle d’organisation',
   subtitle:
     'Dans les applications SaaS multi-locataires, il est courant que plusieurs organisations partagent des politiques de contrôle d’accès identiques, incluant les permissions et les rôles. Chez Logto, ce concept est désigné par "modèle d’organisation". Son utilisation simplifie le processus de construction et de conception de votre modèle d’autorisation.',
-  org_roles: {
+  roles: {
     tab_name: 'Rôles org',
     search_placeholder: 'Rechercher par nom de rôle',
-    create_org_roles: 'Créer un rôle org',
-    org_role_column: 'Rôle org',
+    create_title: 'Créer un rôle org',
+    role_column: 'Rôle org',
     permissions_column: 'Permissions',
     placeholder_title: 'Rôle d’organisation',
     placeholder_description:
       'Un rôle d’organisation est un groupement de permissions qui peuvent être attribuées aux utilisateurs. Les permissions doivent provenir des permissions d’organisation prédéfinies.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Permissions org',
     search_placeholder: 'Rechercher par nom de permission',
     create_org_permission: 'Créer une permission org',
@@ -23,6 +23,13 @@ const organization_template = {
       'La permission d’organisation se réfère à l’autorisation d’accéder à une ressource dans le contexte de l’organisation.',
     delete_confirm:
       'Si cette permission est supprimée, tous les rôles d’organisation incluant cette permission perdront cette permission, et les utilisateurs qui avaient cette permission perdront l’accès accordé par celle-ci.',
+    create_title: 'Créer une autorisation d’organisation',
+    edit_title: 'Modifier une autorisation d’organisation',
+    permission_field_name: 'Nom de la permission',
+    description_field_name: 'Description',
+    description_field_placeholder: "Lire l'historique des rendez-vous",
+    create_permission: 'Créer une permission',
+    created: "La permission d'organisation {{name}} a été créée avec succès.",
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Modello di organizzazione',
   subtitle:
     'Nelle applicazioni SaaS multi-tenant, è comune che più organizzazioni condividano politiche di controllo dell’accesso identiche, incluse autorizzazioni e ruoli. In Logto, questo concetto è denominato "modello di organizzazione". Utilizzarlo semplifica il processo di costruzione e progettazione del tuo modello di autorizzazione.',
-  org_roles: {
+  roles: {
     tab_name: 'Ruoli org',
     search_placeholder: 'Cerca per nome del ruolo',
-    create_org_roles: 'Crea ruolo org',
-    org_role_column: 'Ruolo org',
+    create_title: 'Crea ruolo org',
+    role_column: 'Ruolo org',
     permissions_column: 'Permessi',
     placeholder_title: 'Ruolo di organizzazione',
     placeholder_description:
       'Il ruolo di organizzazione è un raggruppamento di permessi che possono essere assegnati agli utenti. I permessi devono provenire dai permessi di organizzazione predefiniti.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Permessi org',
     search_placeholder: 'Cerca per nome del permesso',
     create_org_permission: 'Crea permesso org',
@@ -23,6 +23,13 @@ const organization_template = {
       'Il permesso di organizzazione si riferisce all’autorizzazione ad accedere a una risorsa nel contesto dell’organizzazione.',
     delete_confirm:
       'Se questo permesso viene eliminato, tutti i ruoli di organizzazione che includono questo permesso perderanno tale permesso, e gli utenti che avevano questo permesso perderanno l’accesso concesso da esso.',
+    create_title: 'Crea permesso di organizzazione',
+    edit_title: 'Modifica permesso di organizzazione',
+    permission_field_name: 'Nome del permesso',
+    description_field_name: 'Descrizione',
+    description_field_placeholder: 'Leggi la cronologia degli appuntamenti',
+    create_permission: 'Crea permesso',
+    created: 'Permesso creato con successo',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: '組織テンプレート',
   subtitle:
     'マルチテナントSaaSアプリケーションでは、複数の組織が同一のアクセス制御ポリシーを共有することが一般的です。これには、権限と役割が含まれます。Logtoでは、この概念を「組織テンプレート」と呼びます。これを使用することで、認証モデルの構築と設計のプロセスが簡素化されます。',
-  org_roles: {
+  roles: {
     tab_name: '組織の役割',
     search_placeholder: '役割名で検索',
-    create_org_roles: '組織の役割を作成',
-    org_role_column: '組織の役割',
+    create_title: '組織の役割を作成',
+    role_column: '組織の役割',
     permissions_column: '権限',
     placeholder_title: '組織の役割',
     placeholder_description:
       '組織の役割は、ユーザーに割り当てることができる権限のグループです。権限は、事前に定義された組織の権限から来なければなりません。',
   },
-  org_permissions: {
+  permissions: {
     tab_name: '組織の権限',
     search_placeholder: '権限名で検索',
     create_org_permission: '組織の権限を作成',
@@ -23,6 +23,13 @@ const organization_template = {
       '組織の権限は、組織の文脈でリソースにアクセスするための認可を指します。',
     delete_confirm:
       'この権限が削除されると、この権限を含むすべての組織の役割がこの権限を失い、この権限を持っていたユーザーはそれによって与えられたアクセスを失います。',
+    create_title: '組織の権限を作成',
+    edit_title: '組織の権限を編集',
+    permission_field_name: '権限名',
+    description_field_name: '説明',
+    description_field_placeholder: '予約履歴を読む',
+    create_permission: '権限を作成',
+    created: '組織権限 {{name}} が正常に作成されました。',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: '조직 템플릿',
   subtitle:
     '멀티-테넌트 SaaS 애플리케이션에서는 여러 조직이 동일한 접근 제어 정책을 공유하는 것이 일반적입니다. 이에는 권한과 역할이 포함됩니다. Logto에서는 이 개념을 "조직 템플릿"이라고 합니다. 이를 사용하면 권한 모델을 구축하고 설계하는 과정이 간소화됩니다.',
-  org_roles: {
+  roles: {
     tab_name: '조직 역할',
     search_placeholder: '역할 이름으로 검색',
-    create_org_roles: '조직 역할 생성',
-    org_role_column: '조직 역할',
+    create_title: '조직 역할 생성',
+    role_column: '조직 역할',
     permissions_column: '권한',
     placeholder_title: '조직 역할',
     placeholder_description:
       '조직 역할은 사용자에게 할당될 수 있는 권한의 그룹입니다. 권한은 미리 정의된 조직 권한에서 와야 합니다.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: '조직 권한',
     search_placeholder: '권한 이름으로 검색',
     create_org_permission: '조직 권한 생성',
@@ -22,6 +22,13 @@ const organization_template = {
     placeholder_description: '조직 권한은 조직의 맥락에서 자원에 접근할 수 있는 권한을 의미합니다.',
     delete_confirm:
       '이 권한이 삭제되면, 이 권한을 포함하는 모든 조직 역할이 이 권한을 잃게 되며, 이 권한을 가진 사용자는 그것에 의해 부여된 접근을 잃게 됩니다.',
+    create_title: '조직 권한 생성',
+    edit_title: '조직 권한 편집',
+    permission_field_name: '권한 이름',
+    description_field_name: '설명',
+    description_field_placeholder: '약속 기록 읽기',
+    create_permission: '권한 생성',
+    created: '조직 권한 {{name}}이(가) 성공적으로 생성되었습니다.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Szablon organizacji',
   subtitle:
     'W aplikacjach SaaS wieloklienckich jest powszechne, że wiele organizacji dzieli identyczne polityki kontroli dostępu, w tym uprawnienia i role. W Logto, ten koncept jest określany jako "szablon organizacji". Jego użycie usprawnia proces budowania i projektowania modelu autoryzacji.',
-  org_roles: {
+  roles: {
     tab_name: 'Role org',
     search_placeholder: 'Szukaj po nazwie roli',
-    create_org_roles: 'Utwórz rolę org',
-    org_role_column: 'Rola org',
+    create_title: 'Utwórz rolę org',
+    role_column: 'Rola org',
     permissions_column: 'Uprawnienia',
     placeholder_title: 'Rola organizacyjna',
     placeholder_description:
       'Rola organizacyjna to grupowanie uprawnień, które można przypisać użytkownikom. Uprawnienia muszą pochodzić z wcześniej zdefiniowanych uprawnień organizacyjnych.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Uprawnienia org',
     search_placeholder: 'Szukaj po nazwie uprawnienia',
     create_org_permission: 'Utwórz uprawnienie org',
@@ -23,6 +23,13 @@ const organization_template = {
       'Uprawnienie organizacyjne odnosi się do autoryzacji dostępu do zasobu w kontekście organizacji.',
     delete_confirm:
       'Jeśli to uprawnienie zostanie usunięte, wszystkie role organizacyjne zawierające to uprawnienie stracą je, a użytkownicy, którzy mieli to uprawnienie, stracą dostęp przyznany przez nie.',
+    create_title: 'Utwórz uprawnienie organizacji',
+    edit_title: 'Edytuj uprawnienie organizacji',
+    permission_field_name: 'Nazwa uprawnienia',
+    description_field_name: 'Opis',
+    description_field_placeholder: 'Przeczytaj historię spotkań',
+    create_permission: 'Utwórz uprawnienie',
+    created: 'Uprawnienie organizacji {{name}} zostało pomyślnie utworzone.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Template de organização',
   subtitle:
     'Em aplicações SaaS multi-tenant, é comum que várias organizações compartilhem políticas de controle de acesso idênticas, incluindo permissões e papéis. No Logto, este conceito é chamado de "template de organização". Usá-lo simplifica o processo de construção e design do seu modelo de autorização.',
-  org_roles: {
+  roles: {
     tab_name: 'Papéis da org',
     search_placeholder: 'Buscar por nome do papel',
-    create_org_roles: 'Criar papel da org',
-    org_role_column: 'Papel da org',
+    create_title: 'Criar papel da org',
+    role_column: 'Papel da org',
     permissions_column: 'Permissões',
     placeholder_title: 'Papel da organização',
     placeholder_description:
       'Papel da organização é um agrupamento de permissões que podem ser atribuídas aos usuários. As permissões devem vir das permissões organizacionais predefinidas.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Permissões da org',
     search_placeholder: 'Buscar por nome da permissão',
     create_org_permission: 'Criar permissão da org',
@@ -23,6 +23,13 @@ const organization_template = {
       'Permissão da organização refere-se à autorização para acessar um recurso no contexto da organização.',
     delete_confirm:
       'Se esta permissão for deletada, todos os papéis da organização que incluírem esta permissão perderão a mesma, e usuários que tinham esta permissão perderão o acesso concedido por ela.',
+    create_title: 'Criar permissão de organização',
+    edit_title: 'Editar permissão de organização',
+    permission_field_name: 'Nome da permissão',
+    description_field_name: 'Descrição',
+    description_field_placeholder: 'Ler histórico de compromissos',
+    create_permission: 'Criar permissão',
+    created: 'A permissão de organização {{name}} foi criada com sucesso.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Modelo de organização',
   subtitle:
     'Em aplicações SaaS multi-inquilino, é comum várias organizações partilharem políticas de controlo de acesso idênticas, incluindo permissões e papéis. No Logto, este conceito é denominado "modelo de organização". A sua utilização simplifica o processo de construção e desenho do seu modelo de autorização.',
-  org_roles: {
+  roles: {
     tab_name: 'Papéis da org',
     search_placeholder: 'Procurar por nome do papel',
-    create_org_roles: 'Criar papel da org',
-    org_role_column: 'Papel da org',
+    create_title: 'Criar papel da org',
+    role_column: 'Papel da org',
     permissions_column: 'Permissões',
     placeholder_title: 'Papel da organização',
     placeholder_description:
       'O papel da organização é um agrupamento de permissões que podem ser atribuídas a utilizadores. As permissões devem provir das permissões organizacionais predefinidas.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Permissões da org',
     search_placeholder: 'Procurar por nome da permissão',
     create_org_permission: 'Criar permissão da org',
@@ -23,6 +23,13 @@ const organization_template = {
       'A permissão da organização refere-se à autorização para aceder a um recurso no contexto da organização.',
     delete_confirm:
       'Se esta permissão for apagada, todos os papéis da organização que incluam esta permissão perderão a mesma, e utilizadores que tinham esta permissão perderão o acesso concedido por ela.',
+    create_title: 'Criar permissão de organização',
+    edit_title: 'Editar permissão de organização',
+    permission_field_name: 'Nome da permissão',
+    description_field_name: 'Descrição',
+    description_field_placeholder: 'Ler histórico de compromissos',
+    create_permission: 'Criar permissão',
+    created: 'A permissão de organização {{name}} foi criada com sucesso.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Шаблон организации',
   subtitle:
     'В многоарендных SaaS-приложениях обычно несколько организаций делят идентичные политики контроля доступа, включая разрешения и роли. В Logto этот концепт называется "шаблон организации". Его использование упрощает процесс построения и проектирования вашей модели авторизации.',
-  org_roles: {
+  roles: {
     tab_name: 'Роли орг',
     search_placeholder: 'Поиск по названию роли',
-    create_org_roles: 'Создать роль орг',
-    org_role_column: 'Роль орг',
+    create_title: 'Создать роль орг',
+    role_column: 'Роль орг',
     permissions_column: 'Разрешения',
     placeholder_title: 'Роль организации',
     placeholder_description:
       'Роль организации - это группировка разрешений, которые могут быть назначены пользователям. Разрешения должны происходить из предопределенных разрешений организации.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Разрешения орг',
     search_placeholder: 'Поиск по названию разрешения',
     create_org_permission: 'Создать разрешение орг',
@@ -23,6 +23,13 @@ const organization_template = {
       'Разрешение организации относится к авторизации на доступ к ресурсу в контексте организации.',
     delete_confirm:
       'Если это разрешение будет удалено, все роли организации, включающие это разрешение, потеряют его, и пользователи, имевшие это разрешение, потеряют доступ, предоставленный им.',
+    create_title: 'Создание разрешения организации',
+    edit_title: 'Редактирование разрешения организации',
+    permission_field_name: 'Название разрешения',
+    description_field_name: 'Описание',
+    description_field_placeholder: 'Читать историю назначений',
+    create_permission: 'Создать разрешение',
+    created: 'Разрешение для организации {{name}} успешно создано.',
   },
 };
 

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

@@ -2,17 +2,17 @@ const organization_template = {
   title: 'Organizasyon şablonu',
   subtitle:
     'Çok kiracılı SaaS uygulamalarında, birden fazla organizasyonun aynı erişim kontrol politikalarını, izinleri ve rolleri dahil olmak üzere paylaşması yaygındır. Logto\'da bu kavram "organizasyon şablonu" olarak adlandırılır. Bunu kullanmak, yetkilendirme modelinizi oluşturma ve tasarlama sürecini basitleştirir.',
-  org_roles: {
+  roles: {
     tab_name: 'Org rolleri',
     search_placeholder: 'Role adı ile ara',
-    create_org_roles: 'Org rolü oluştur',
-    org_role_column: 'Org rolü',
+    create_title: 'Org rolü oluştur',
+    role_column: 'Org rolü',
     permissions_column: 'İzinler',
     placeholder_title: 'Organizasyon rolü',
     placeholder_description:
       'Organizasyon rolü, kullanıcılara atanabilecek izinlerin bir gruplamasıdır. İzinler, önceden belirlenmiş organizasyon izinlerinden gelmelidir.',
   },
-  org_permissions: {
+  permissions: {
     tab_name: 'Org izinleri',
     search_placeholder: 'İzin adı ile ara',
     create_org_permission: 'Org izni oluştur',
@@ -23,6 +23,13 @@ const organization_template = {
       'Organizasyon izni, organizasyon bağlamında bir kaynağa erişim yetkisi anlamına gelir.',
     delete_confirm:
       'Bu izin silinirse, bu izni içeren tüm organizasyon rolleri bu izni kaybeder ve bu izne sahip kullanıcılar, bu izin tarafından verilen erişimi kaybeder.',
+    create_title: 'Organizasyon izni oluştur',
+    edit_title: 'Organizasyon iznini düzenle',
+    permission_field_name: 'İzin adı',
+    description_field_name: 'Açıklama',
+    description_field_placeholder: 'Randevu geçmişini oku',
+    create_permission: 'İzin oluştur',
+    created: 'Kuruluş izni {{name}} başarıyla oluşturuldu.',
   },
 };
 

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

@@ -2,16 +2,16 @@ const organization_template = {
   title: '组织模板',
   subtitle:
     '在多租户SaaS应用中，多个组织共享相同的访问控制政策，包括权限和角色，是很常见的。在Logto中，这一概念被称为“组织模板”。使用它可以简化构建和设计授权模型的过程。',
-  org_roles: {
+  roles: {
     tab_name: '组织角色',
     search_placeholder: '按角色名称搜索',
-    create_org_roles: '创建组织角色',
-    org_role_column: '组织角色',
+    create_title: '创建组织角色',
+    role_column: '组织角色',
     permissions_column: '权限',
     placeholder_title: '组织角色',
     placeholder_description: '组织角色是一组可以分配给用户的权限。权限必须来自预定义的组织权限。',
   },
-  org_permissions: {
+  permissions: {
     tab_name: '组织权限',
     search_placeholder: '按权限名称搜索',
     create_org_permission: '创建组织权限',
@@ -21,6 +21,13 @@ const organization_template = {
     placeholder_description: '组织权限指的是在组织上下文中访问资源的授权。',
     delete_confirm:
       '如果删除此权限，包括此权限的所有组织角色都将失去此权限，拥有此权限的用户将失去由此权限授予的访问权限。',
+    create_title: '创建组织权限',
+    edit_title: '编辑组织权限',
+    permission_field_name: '权限名称',
+    description_field_name: '描述',
+    description_field_placeholder: '阅读预约历史',
+    create_permission: '创建权限',
+    created: '组织权限 {{name}} 已成功创建。',
   },
 };
 

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

@@ -2,16 +2,16 @@ const organization_template = {
   title: '組織模板',
   subtitle:
     '在多租戶SaaS應用中，多個組織共享相同的訪問控制政策，包括權限和角色，是很常見的。在Logto中，這一概念被稱為“組織模板”。使用它可以簡化構建和設計授權模型的過程。',
-  org_roles: {
+  roles: {
     tab_name: '組織角色',
     search_placeholder: '按角色名稱搜索',
-    create_org_roles: '創建組織角色',
-    org_role_column: '組織角色',
+    create_title: '創建組織角色',
+    role_column: '組織角色',
     permissions_column: '權限',
     placeholder_title: '組織角色',
     placeholder_description: '組織角色是一組可以分配給用戶的權限。權限必須來自預定義的組織權限。',
   },
-  org_permissions: {
+  permissions: {
     tab_name: '組織權限',
     search_placeholder: '按權限名稱搜索',
     create_org_permission: '創建組織權限',
@@ -21,6 +21,13 @@ const organization_template = {
     placeholder_description: '組織權限指的是在組織上下文中訪問資源的授權。',
     delete_confirm:
       '如果刪除此權限，包括此權限的所有組織角色都將失去此權限，擁有此權限的用戶將失去由此權限授予的訪問權限。',
+    create_title: '創建組織權限',
+    edit_title: '編輯組織權限',
+    permission_field_name: '權限名稱',
+    description_field_name: '描述',
+    description_field_placeholder: '閱讀約會歷史',
+    create_permission: '創建權限',
+    created: '組織權限 {{name}} 已成功建立。',
   },
 };
 

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

@@ -2,16 +2,16 @@ const organization_template = {
   title: '組織模板',
   subtitle:
     '在多租戶SaaS應用中，多個組織共享相同的訪問控制政策，包括權限和角色，是很常見的。在Logto中，這一概念被稱為“組織模板”。使用它可以簡化建立和設計授權模型的過程。',
-  org_roles: {
+  roles: {
     tab_name: '組織角色',
     search_placeholder: '按角色名稱搜尋',
-    create_org_roles: '創建組織角色',
-    org_role_column: '組織角色',
+    create_title: '創建組織角色',
+    role_column: '組織角色',
     permissions_column: '權限',
     placeholder_title: '組織角色',
     placeholder_description: '組織角色是一組可以分配給使用者的權限。權限必須來自預定義的組織權限。',
   },
-  org_permissions: {
+  permissions: {
     tab_name: '組織權限',
     search_placeholder: '按權限名稱搜尋',
     create_org_permission: '創建組織權限',
@@ -21,6 +21,13 @@ const organization_template = {
     placeholder_description: '組織權限指的是在組織上下文中訪問資源的授權。',
     delete_confirm:
       '如果刪除此權限，包括此權限的所有組織角色都將失去此權限，擁有此權限的使用者將失去由此權限授予的訪問權限。',
+    create_title: '創建組織權限',
+    edit_title: '編輯組織權限',
+    permission_field_name: '權限名稱',
+    description_field_name: '描述',
+    description_field_placeholder: '閱讀預約歷史',
+    create_permission: '創建權限',
+    created: '組織權限 {{name}} 已成功建立。',
   },
 };