diff --git a/packages/console/src/pages/TenantSettings/TenantMembers/EditMemberModal/index.tsx b/packages/console/src/pages/TenantSettings/TenantMembers/EditMemberModal/index.tsx index 2fdee2af1..f16d28990 100644 --- a/packages/console/src/pages/TenantSettings/TenantMembers/EditMemberModal/index.tsx +++ b/packages/console/src/pages/TenantSettings/TenantMembers/EditMemberModal/index.tsx @@ -1,7 +1,7 @@ import { TenantRole } from '@logto/schemas'; import { getUserDisplayName } from '@logto/shared/universal'; import { useContext, useMemo, useState } from 'react'; -import { useTranslation } from 'react-i18next'; +import { Trans, useTranslation } from 'react-i18next'; import ReactModal from 'react-modal'; import { useAuthedCloudApi } from '@/cloud/hooks/use-cloud-api'; @@ -11,6 +11,7 @@ import Button from '@/ds-components/Button'; import FormField from '@/ds-components/FormField'; import ModalLayout from '@/ds-components/ModalLayout'; import Select, { type Option } from '@/ds-components/Select'; +import { useConfirmModal } from '@/hooks/use-confirm-modal'; import * as modalStyles from '@/scss/modal.module.scss'; type Props = { @@ -25,6 +26,7 @@ function EditMemberModal({ user, isOpen, onClose }: Props) { const [isLoading, setIsLoading] = useState(false); const [role, setRole] = useState(TenantRole.Collaborator); + const { show } = useConfirmModal(); const cloudApi = useAuthedCloudApi(); const roleOptions: Array> = useMemo( @@ -36,6 +38,19 @@ function EditMemberModal({ user, isOpen, onClose }: Props) { ); const onSubmit = async () => { + if (role === TenantRole.Admin) { + const [result] = await show({ + ModalContent: () => ( + , li:
  • }}>{t('assign_admin_confirm')} + ), + confirmButtonText: 'general.confirm', + }); + + if (!result) { + return; + } + } + setIsLoading(true); try { await cloudApi.put(`/api/tenants/:tenantId/members/:userId/roles`, { diff --git a/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.module.scss b/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.module.scss deleted file mode 100644 index 64140a627..000000000 --- a/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.module.scss +++ /dev/null @@ -1,11 +0,0 @@ -@use '@/scss/underscore' as _; - -ul { - padding-inline-start: _.unit(6); - - > li { - font: var(--font-body-2); - margin-block: _.unit(2); - padding-inline-start: _.unit(1); - } -} diff --git a/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.tsx b/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.tsx index 1e2162437..d1cdec79d 100644 --- a/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.tsx +++ b/packages/console/src/pages/TenantSettings/TenantMembers/InviteMemberModal/index.tsx @@ -18,7 +18,6 @@ import useEmailInputUtils from '../InviteEmailsInput/hooks'; import { type InviteMemberForm } from '../types'; import Footer from './Footer'; -import './index.module.scss'; type Props = { isOpen: boolean; diff --git a/packages/console/src/pages/TenantSettings/TenantMembers/Members/index.tsx b/packages/console/src/pages/TenantSettings/TenantMembers/Members/index.tsx index f24cc28bc..9b4687c67 100644 --- a/packages/console/src/pages/TenantSettings/TenantMembers/Members/index.tsx +++ b/packages/console/src/pages/TenantSettings/TenantMembers/Members/index.tsx @@ -1,3 +1,4 @@ +import { TenantRole } from '@logto/schemas'; import { condArray, conditional } from '@silverhand/essentials'; import { useContext, useState } from 'react'; import { useTranslation } from 'react-i18next'; @@ -14,6 +15,7 @@ import Table from '@/ds-components/Table'; import Tag from '@/ds-components/Tag'; import { type RequestError } from '@/hooks/use-api'; import useCurrentTenantScopes from '@/hooks/use-current-tenant-scopes'; +import useCurrentUser from '@/hooks/use-current-user'; import EditMemberModal from '../EditMemberModal'; @@ -21,6 +23,7 @@ function Members() { const { t } = useTranslation(undefined, { keyPrefix: 'admin_console.tenant_members' }); const cloudApi = useAuthedCloudApi(); const { currentTenantId } = useContext(TenantsContext); + const { user: currentUser } = useCurrentUser(); const { canRemoveMember, canUpdateMemberRole } = useCurrentTenantScopes(); const { data, error, isLoading, mutate } = useSWR( @@ -55,9 +58,12 @@ function Members() { return '-'; } - return organizationRoles.map(({ id, name }) => ( + return organizationRoles.map(({ id }) => ( - + )); }, @@ -85,6 +91,8 @@ function Members() { )} onDelete={conditional( canRemoveMember && + // Cannot remove self from members list + currentUser?.id !== user.id && (async () => { await cloudApi.delete(`/api/tenants/:tenantId/members/:userId`, { params: { tenantId: currentTenantId, userId: user.id }, diff --git a/packages/console/src/pages/TenantSettings/TenantMembers/index.module.scss b/packages/console/src/pages/TenantSettings/TenantMembers/index.module.scss index ab0e1e9a2..bb444a0dd 100644 --- a/packages/console/src/pages/TenantSettings/TenantMembers/index.module.scss +++ b/packages/console/src/pages/TenantSettings/TenantMembers/index.module.scss @@ -52,3 +52,13 @@ } } } + +ul { + padding-inline-start: _.unit(6); + + > li { + font: var(--font-body-2); + margin-block: _.unit(2); + padding-inline-start: _.unit(1); + } +}