diff --git a/.changeset/maxHeight-stateEvent-fix.md b/.changeset/maxHeight-stateEvent-fix.md new file mode 100644 index 000000000..f237fd647 --- /dev/null +++ b/.changeset/maxHeight-stateEvent-fix.md @@ -0,0 +1,5 @@ +--- +default: patch +--- + +Added maximum height to state events diff --git a/src/app/components/message/Reply.tsx b/src/app/components/message/Reply.tsx index 03ff33cc2..3342b0d52 100644 --- a/src/app/components/message/Reply.tsx +++ b/src/app/components/message/Reply.tsx @@ -179,7 +179,12 @@ export const Reply = as<'div', ReplyProps>( const parsedMemberEvent = parseMemberEvent(replyEvent); image = parsedMemberEvent.icon; mentioned = false; - bodyJSX = parsedMemberEvent.body; + bodyJSX = ( + + {' '} + {parsedMemberEvent.body}{' '} + + ); } else if (eventType === StateEvent.RoomName) { image = Icons.Hash; bodyJSX = t('Organisms.RoomCommon.changed_room_name'); diff --git a/src/app/hooks/timeline/useTimelineEventRenderer.tsx b/src/app/hooks/timeline/useTimelineEventRenderer.tsx index 382cdfc62..b7d2bff7d 100644 --- a/src/app/hooks/timeline/useTimelineEventRenderer.tsx +++ b/src/app/hooks/timeline/useTimelineEventRenderer.tsx @@ -53,11 +53,16 @@ import { Message, Reactions, } from '$features/room/message'; + import { useSableCosmetics } from '$hooks/useSableCosmetics'; function DecoratedUser({ room, userId, userName }: DecoratedUserProps) { const { color, font } = useSableCosmetics(userId, room ?? ({} as Room)); - return {userName ?? userId} ; + return ( + + {userName ?? userId} + + ); } type DecoratedUserProps = { @@ -763,11 +768,11 @@ export function useTimelineEventRenderer({ time={timeJSX} iconSrc={parsed.icon} content={ - - + + {parsed.body} - - + + } /> diff --git a/src/app/hooks/useMemberEventParser.tsx b/src/app/hooks/useMemberEventParser.tsx index bb788a812..88265ad0d 100644 --- a/src/app/hooks/useMemberEventParser.tsx +++ b/src/app/hooks/useMemberEventParser.tsx @@ -1,5 +1,5 @@ import { ReactNode } from 'react'; -import { IconSrc, Icons } from 'folds'; +import { IconSrc, Icons, Text } from 'folds'; import { MatrixEvent, Room } from '$types/matrix-sdk'; import { IMemberContent, Membership } from '$types/matrix/room'; import { getMxIdLocalPart } from '$utils/matrix'; @@ -17,7 +17,11 @@ function DecoratedUser({ roomId, userId, userName }: DecoratedUserProps) { const mx = useMatrixClient(); const room = mx.getRoom(roomId); const { color, font } = useSableCosmetics(userId, room ?? ({} as Room)); - return {userName ?? userId} ; + return ( + + {userName ?? userId} + + ); } export type ParsedResult = { @@ -56,10 +60,12 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' accepted '} + {' accepted '} - {`'s join request `} - {reason} + + {`'s join request `} + {reason} + ), }; @@ -70,9 +76,9 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' invited '} + {' invited '} - {reason} + {reason} ), }; @@ -84,8 +90,10 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' requested to join room: '} - {reason} + + {' requested to join room: '} + {reason} + ), }; @@ -97,7 +105,7 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' joined the room'} + {' joined the room'} ), }; @@ -111,16 +119,20 @@ export const useMemberEventParser = (): MemberEventParser => { senderId === userId ? ( <> - {' rejected the invitation '} - {reason} + + {' rejected the invitation '} + {reason} + ) : ( <> - {' rejected '} + {' rejected '} - {`'s join request `} - {reason} + + {`'s join request `} + {reason} + ), }; @@ -133,16 +145,20 @@ export const useMemberEventParser = (): MemberEventParser => { senderId === userId ? ( <> - {' revoked joined request '} - {reason} + + {' revoked joined request '} + {reason} + ) : ( <> {' revoked '} - {`'s invite `} - {reason} + + {`'s invite `} + {reason} + ), }; @@ -154,9 +170,9 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' unbanned '} + {' unbanned '} - {reason} + {reason} ), }; @@ -168,15 +184,17 @@ export const useMemberEventParser = (): MemberEventParser => { senderId === userId ? ( <> - {' left the room '} - {reason} + + {' left the room '} + {reason} + ) : ( <> - {' kicked '} + {' kicked '} - {reason} + {reason} ), }; @@ -188,9 +206,9 @@ export const useMemberEventParser = (): MemberEventParser => { body: ( <> - {' banned '} + {' banned '} - {reason} + {reason} ), }; @@ -209,13 +227,13 @@ export const useMemberEventParser = (): MemberEventParser => { typeof content.displayname === 'string' ? ( <> - {' changed display name to '} + {' changed display name to '} ) : ( <> - {' removed their display name '} + {' removed their display name '} ), }; @@ -227,12 +245,12 @@ export const useMemberEventParser = (): MemberEventParser => { content.avatar_url && typeof content.avatar_url === 'string' ? ( <> - {' changed their avatar'} + {' changed their avatar'} ) : ( <> - {' removed their avatar '} + {' removed their avatar '} ), };