Fix long display names for users and rooms with word-break (#480)

This commit is contained in:
Borislav Pantaleev 2025-04-11 22:49:27 +03:00 committed by GitHub
parent 4f488e5a39
commit 107d9f4e39
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 30 additions and 5 deletions

View File

@ -412,6 +412,10 @@ export const RoomList = (props: ListProps) => {
</WrapperField> </WrapperField>
<FunctionField <FunctionField
source="name" source="name"
sx={{
wordBreak: "break-word",
overflowWrap: "break-word",
}}
render={record => record["name"] || record["canonical_alias"] || record["id"]} render={record => record["name"] || record["canonical_alias"] || record["id"]}
label="resources.rooms.fields.name" label="resources.rooms.fields.name"
/> />

View File

@ -187,8 +187,23 @@ export const UserList = (props: ListProps) => (
sortBy="avatar_url" sortBy="avatar_url"
label="resources.users.fields.avatar" label="resources.users.fields.avatar"
/> />
<TextField source="id" sortBy="name" label="resources.users.fields.id" /> <TextField
<TextField source="displayname" label="resources.users.fields.displayname" /> source="id"
sx={{
wordBreak: "break-word",
overflowWrap: "break-word",
}}
sortBy="name"
label="resources.users.fields.id"
/>
<TextField
source="displayname"
sx={{
wordBreak: "break-word",
overflowWrap: "break-word",
}}
label="resources.users.fields.displayname"
/>
<BooleanField source="is_guest" label="resources.users.fields.is_guest" /> <BooleanField source="is_guest" label="resources.users.fields.is_guest" />
<BooleanField source="admin" label="resources.users.fields.admin" /> <BooleanField source="admin" label="resources.users.fields.admin" />
<BooleanField source="deactivated" label="resources.users.fields.deactivated" /> <BooleanField source="deactivated" label="resources.users.fields.deactivated" />
@ -283,7 +298,7 @@ export const UserCreate = (props: CreateProps) => {
onSuccess: (resource: User) => { onSuccess: (resource: User) => {
notify("ra.notification.created", { messageArgs: { smart_count: 1 } }); notify("ra.notification.created", { messageArgs: { smart_count: 1 } });
redirect(() => { redirect(() => {
return `users/${encodeURIComponent(resource.id)}`; return `users/${encodeURIComponent(resource.id as string)}`;
}); });
}, },
} }
@ -307,7 +322,7 @@ export const UserCreate = (props: CreateProps) => {
onSuccess: (resource: User) => { onSuccess: (resource: User) => {
notify("ra.notification.updated", { messageArgs: { smart_count: 1 } }); notify("ra.notification.updated", { messageArgs: { smart_count: 1 } });
redirect(() => { redirect(() => {
return `users/${encodeURIComponent(resource.id)}`; return `users/${encodeURIComponent(resource.id as string)}`;
}); });
}, },
} }
@ -602,7 +617,13 @@ export const UserEdit = (props: EditProps) => {
link={false} link={false}
sortable={false} sortable={false}
> >
<TextField source="name" /> <TextField
source="name"
sx={{
wordBreak: "break-word",
overflowWrap: "break-word",
}}
/>
</ReferenceField> </ReferenceField>
<ReferenceField <ReferenceField
reference="rooms" reference="rooms"