Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00
Code Issues Activity

refactor(console): make long text breakable in roles page (#5956)

Browse source
This commit is contained in:
Xiao Yijun 2024-06-03 10:51:36 +08:00 committed by GitHub
parent ec2df4d3cf
commit 014d7f63c3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 6 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
packages/console/src/pages/Roles/index.module.scss
View file

@ -1,6 +0,0 @@
@use '@/scss/underscore' as _;
.type,
.description {
@include _.text-ellipsis;
}

12
packages/console/src/pages/Roles/index.tsx
View file

@ -12,6 +12,7 @@ import UserRoleIconDark from '@/assets/icons/user-role-dark.svg';
import UserRoleIcon from '@/assets/icons/user-role.svg'; import UserRoleIcon from '@/assets/icons/user-role.svg';
import RolesEmptyDark from '@/assets/images/roles-empty-dark.svg'; import RolesEmptyDark from '@/assets/images/roles-empty-dark.svg';
import RolesEmpty from '@/assets/images/roles-empty.svg'; import RolesEmpty from '@/assets/images/roles-empty.svg';
import Breakable from '@/components/Breakable';
import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder'; import EmptyDataPlaceholder from '@/components/EmptyDataPlaceholder';
import ItemPreview from '@/components/ItemPreview'; import ItemPreview from '@/components/ItemPreview';
import ListPage from '@/components/ListPage'; import ListPage from '@/components/ListPage';
@ -28,7 +29,6 @@ import { buildUrl, formatSearchKeyword } from '@/utils/url';
import AssignedEntities from './components/AssignedEntities'; import AssignedEntities from './components/AssignedEntities';
import CreateRoleModal from './components/CreateRoleModal'; import CreateRoleModal from './components/CreateRoleModal';
import * as styles from './index.module.scss';
const rolesPathname = '/roles'; const rolesPathname = '/roles';
const createRolePathname = `${rolesPathname}/create`; const createRolePathname = `${rolesPathname}/create`;
@ -107,18 +107,18 @@ function Roles() {
{ {
title: t('roles.col_type'), title: t('roles.col_type'),
dataIndex: 'type', dataIndex: 'type',
colSpan: 5, colSpan: 4,
render: ({ type }) => ( render: ({ type }) => (
<div className={styles.type}> <Breakable>
{type === RoleType.User ? t('roles.type_user') : t('roles.type_machine_to_machine')} {type === RoleType.User ? t('roles.type_user') : t('roles.type_machine_to_machine')}
</div> </Breakable>
), ),
}, },
{ {
title: t('roles.col_description'), title: t('roles.col_description'),
dataIndex: 'description', dataIndex: 'description',
colSpan: 5, colSpan: 6,
render: ({ description }) => <div className={styles.description}>{description}</div>, render: ({ description }) => <Breakable>{description}</Breakable>,
}, },
{ {
title: <span>{t('roles.col_assigned_entities')}</span>, title: <span>{t('roles.col_assigned_entities')}</span>,