chore: upgrade i18next 26, prettier 3, fontsource-variable, domhandler 6, lint-staged 17
CI / Build & Quality Checks (push) Successful in 10m13s

- i18next 23->26 + react-i18next 15->17
- prettier 2->3, reformat all files
- replace @fontsource/inter with @fontsource-variable/inter 5, update import path
- domhandler 5->6 (aligns with transitive deps)
- lint-staged 16->17
This commit is contained in:
Lotus Bot
2026-05-21 23:30:50 -04:00
parent 98fde12682
commit 23008670f3
363 changed files with 1443 additions and 1419 deletions
@@ -43,7 +43,7 @@ export function CommandAutocomplete({
const [result, search, resetSearch] = useAsyncSearch(
commandNames,
useCallback((commandName: string) => commandName, []),
SEARCH_OPTIONS
SEARCH_OPTIONS,
);
const autoCompleteNames = result ? result.items : commandNames;
+7 -7
View File
@@ -206,13 +206,13 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
const filteredMembers = useMemo(
() => members.filter(membershipFilter.filterFn).sort(memberSort.sortFn).sort(memberPowerSort),
[members, membershipFilter, memberSort, memberPowerSort]
[members, membershipFilter, memberSort, memberPowerSort],
);
const [result, search, resetSearch] = useAsyncSearch(
filteredMembers,
getRoomMemberStr,
SEARCH_OPTIONS
SEARCH_OPTIONS,
);
if (!result && searchInputRef.current?.value) search(searchInputRef.current.value);
@@ -233,9 +233,9 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
if (evt.target.value) search(evt.target.value);
else resetSearch();
},
[search, resetSearch]
[search, resetSearch],
),
{ wait: 200 }
{ wait: 200 },
);
const handleMemberClick: MouseEventHandler<HTMLButtonElement> = (evt) => {
@@ -276,7 +276,7 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
onClick={
((evt) =>
setAnchor(
evt.currentTarget.getBoundingClientRect()
evt.currentTarget.getBoundingClientRect(),
)) as MouseEventHandler<HTMLButtonElement>
}
variant="Background"
@@ -308,7 +308,7 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
onClick={
((evt) =>
setAnchor(
evt.currentTarget.getBoundingClientRect()
evt.currentTarget.getBoundingClientRect(),
)) as MouseEventHandler<HTMLButtonElement>
}
variant="Background"
@@ -421,7 +421,7 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
onClick={handleMemberClick}
pressed={openProfileUserId === tagOrMember.userId}
typing={typingMembers.some(
(receipt) => receipt.userId === tagOrMember.userId
(receipt) => receipt.userId === tagOrMember.userId,
)}
/>
</div>
+2 -2
View File
@@ -46,8 +46,8 @@ export function Room() {
markAsRead(mx, room.roomId, hideActivity);
}
},
[mx, room.roomId, hideActivity]
)
[mx, room.roomId, hideActivity],
),
);
const callView = callEmbed?.roomId === room.roomId || room.isCallRoom() || callMembers.length > 0;
+22 -22
View File
@@ -31,7 +31,7 @@ import {
import { useMatrixClient } from '../../hooks/useMatrixClient';
const GifPicker = React.lazy(() =>
import('../../components/GifPicker').then((m) => ({ default: m.GifPicker }))
import('../../components/GifPicker').then((m) => ({ default: m.GifPicker })),
);
import { useClientConfig } from '../../hooks/useClientConfig';
import {
@@ -60,7 +60,7 @@ import {
} from '../../components/editor';
import { EmojiBoardTab } from '../../components/emoji-board/types';
const EmojiBoard = React.lazy(() =>
import('../../components/emoji-board').then((m) => ({ default: m.EmojiBoard }))
import('../../components/emoji-board').then((m) => ({ default: m.EmojiBoard })),
);
import { UseStateProvider } from '../../components/UseStateProvider';
import {
@@ -159,7 +159,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const accessibleTagColors = useAccessiblePowerTagColors(
theme.kind,
creatorsTag,
powerLevelTags
powerLevelTags,
);
const replyPowerTag = replyUserID ? getMemberPowerTag(replyUserID) : undefined;
@@ -173,7 +173,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const [selectedFiles, setSelectedFiles] = useAtom(roomIdToUploadItemsAtomFamily(roomId));
const uploadFamilyObserverAtom = createUploadFamilyObserverAtom(
roomUploadAtomFamily,
selectedFiles.map((f) => f.file)
selectedFiles.map((f) => f.file),
);
const uploadBoardHandlers = useRef<UploadBoardImperativeHandlers>();
@@ -196,7 +196,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
} as any);
},
() => setLocating(false),
{ timeout: 10000 }
{ timeout: 10000 },
);
};
@@ -213,7 +213,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
if (room.hasEncryptionStateEvent()) {
const encryptFiles = fulfilledPromiseSettledResult(
await Promise.allSettled(safeFiles.map((f) => encryptFile(f)))
await Promise.allSettled(safeFiles.map((f) => encryptFile(f))),
);
encryptFiles.forEach((ef) =>
fileItems.push({
@@ -221,7 +221,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
metadata: {
markedAsSpoiler: false,
},
})
}),
);
} else {
safeFiles.forEach((f) =>
@@ -232,7 +232,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
metadata: {
markedAsSpoiler: false,
},
})
}),
);
}
setSelectedFiles({
@@ -240,7 +240,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
item: fileItems,
});
},
[setSelectedFiles, room]
[setSelectedFiles, room],
);
const pickFile = useFilePicker(handleFiles, true);
const handlePaste = useFilePasteHandler(handleFiles);
@@ -254,7 +254,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
useElementSizeObserver(
useCallback(() => fileDropContainerRef.current, [fileDropContainerRef]),
useCallback((width) => setHideStickerBtn(width < 500), [])
useCallback((width) => setHideStickerBtn(width < 500), []),
);
const didRestoreDraft = React.useRef(false);
@@ -277,7 +277,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
resetEditor(editor);
resetEditorHistory(editor);
},
[roomId, editor, setMsgDraft]
[roomId, editor, setMsgDraft],
);
const handleFileMetadata = useCallback(
@@ -288,7 +288,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
replacement: { ...fileItem, metadata },
});
},
[setSelectedFiles]
[setSelectedFiles],
);
const handleRemoveUpload = useCallback(
@@ -300,7 +300,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
});
uploads.forEach((u) => roomUploadAtomFamily.remove(u));
},
[setSelectedFiles, selectedFiles]
[setSelectedFiles, selectedFiles],
);
const handleCancelUpload = (uploads: Upload[]) => {
@@ -343,7 +343,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
allowTextFormatting: true,
allowBlockMarkdown: isMarkdown,
allowInlineMarkdown: isMarkdown,
})
}),
);
let msgType = MsgType.Text;
@@ -434,7 +434,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
setReplyDraft(undefined);
}
},
[submit, setReplyDraft, enterForNewline, autocompleteQuery, isComposing]
[submit, setReplyDraft, enterForNewline, autocompleteQuery, isComposing],
);
const handleKeyUp: KeyboardEventHandler = useCallback(
@@ -454,7 +454,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
: undefined;
setAutocompleteQuery(query);
},
[editor, sendTypingStatus, hideActivity]
[editor, sendTypingStatus, hideActivity],
);
const handleCloseAutocomplete = useCallback(() => {
@@ -497,7 +497,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const uploadRes = await mx.uploadContent(
new File([blob], 'image.gif', { type: 'image/gif' }),
{ type: 'image/gif', name: 'image.gif', includeFilename: false }
{ type: 'image/gif', name: 'image.gif', includeFilename: false },
);
const mxcUrl = (uploadRes as { content_uri: string }).content_uri;
if (!mxcUrl) return;
@@ -514,7 +514,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
setTimeout(() => setGifError(null), 4000);
}
},
[mx, roomId]
[mx, roomId],
);
const handleStickerSelect = async (mxc: string, shortcode: string, label: string) => {
@@ -523,7 +523,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
const info = await getImageInfo(
await loadImageElement(stickerUrl),
await getImageUrlBlob(stickerUrl)
await getImageUrlBlob(stickerUrl),
);
mx.sendEvent(roomId, EventType.Sticker, {
@@ -703,7 +703,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
anchor={
emojiBoardTab === undefined
? undefined
: emojiBtnRef.current?.getBoundingClientRect() ?? undefined
: (emojiBtnRef.current?.getBoundingClientRect() ?? undefined)
}
content={
<React.Suspense fallback={null}>
@@ -774,7 +774,7 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
align="End"
anchor={
gifOpen
? gifBtnRef.current?.getBoundingClientRect() ?? undefined
? (gifBtnRef.current?.getBoundingClientRect() ?? undefined)
: undefined
}
content={
@@ -871,5 +871,5 @@ export const RoomInput = forwardRef<HTMLDivElement, RoomInputProps>(
/>
</div>
);
}
},
);
@@ -7,5 +7,5 @@ import * as css from './RoomInputPlaceholder.css';
export const RoomInputPlaceholder = as<'div', ComponentProps<typeof Box>>(
({ className, ...props }, ref) => (
<Box className={classNames(css.RoomInputPlaceholder, className)} {...props} ref={ref} />
)
),
);
+50 -50
View File
@@ -141,7 +141,7 @@ const TimelineFloat = as<'div', css.TimelineFloatVariants>(
{...props}
ref={ref}
/>
)
),
);
const TimelineDivider = as<'div', { variant?: ContainerColor | 'Inherit' }>(
@@ -151,7 +151,7 @@ const TimelineDivider = as<'div', { variant?: ContainerColor | 'Inherit' }>(
{children}
<Line style={{ flexGrow: 1 }} variant={variant} size="300" />
</Box>
)
),
);
export const getLiveTimeline = (room: Room): EventTimeline =>
@@ -164,7 +164,7 @@ export const getEventTimeline = (room: Room, eventId: string): EventTimeline | u
export const getFirstLinkedTimeline = (
timeline: EventTimeline,
direction: Direction
direction: Direction,
): EventTimeline => {
const linkedTm = timeline.getNeighbouringTimeline(direction);
if (!linkedTm) return timeline;
@@ -194,7 +194,7 @@ export const getTimelinesEventsCount = (timelines: EventTimeline[]): number => {
export const getTimelineAndBaseIndex = (
timelines: EventTimeline[],
index: number
index: number,
): [EventTimeline | undefined, number] => {
let uptoTimelineLen = 0;
const timeline = timelines.find((t) => {
@@ -215,7 +215,7 @@ export const getTimelineEvent = (timeline: EventTimeline, index: number): Matrix
export const getEventIdAbsoluteIndex = (
timelines: EventTimeline[],
eventTimeline: EventTimeline,
eventId: string
eventId: string,
): number | undefined => {
const timelineIndex = timelines.findIndex((t) => t === eventTimeline);
if (timelineIndex === -1) return undefined;
@@ -245,12 +245,12 @@ const useEventTimelineLoader = (
mx: MatrixClient,
room: Room,
onLoad: (eventId: string, linkedTimelines: EventTimeline[], evtAbsIndex: number) => void,
onError: (err: Error | null) => void
onError: (err: Error | null) => void,
) => {
const loadEventTimeline = useCallback(
async (eventId: string) => {
const [err, replyEvtTimeline] = await to(
mx.getEventTimeline(room.getUnfilteredTimelineSet(), eventId)
mx.getEventTimeline(room.getUnfilteredTimelineSet(), eventId),
);
if (!replyEvtTimeline) {
onError(err ?? null);
@@ -266,7 +266,7 @@ const useEventTimelineLoader = (
onLoad(eventId, linkedTimelines, absIndex);
},
[mx, room, onLoad, onError]
[mx, room, onLoad, onError],
);
return loadEventTimeline;
@@ -276,7 +276,7 @@ const useTimelinePagination = (
mx: MatrixClient,
timeline: Timeline,
setTimeline: Dispatch<SetStateAction<Timeline>>,
limit: number
limit: number,
) => {
const timelineRef = useRef(timeline);
timelineRef.current = timeline;
@@ -288,7 +288,7 @@ const useTimelinePagination = (
const recalibratePagination = (
linkedTimelines: EventTimeline[],
timelinesEventsCount: number[],
backwards: boolean
backwards: boolean,
) => {
const topTimeline = linkedTimelines[0];
const timelineMatch = (mt: EventTimeline) => (t: EventTimeline) => t === mt;
@@ -322,7 +322,7 @@ const useTimelinePagination = (
if (!timelineToPaginate) return;
const paginationToken = timelineToPaginate.getPaginationToken(
backwards ? Direction.Backward : Direction.Forward
backwards ? Direction.Backward : Direction.Forward,
);
if (
!paginationToken &&
@@ -338,7 +338,7 @@ const useTimelinePagination = (
mx.paginateEventTimeline(timelineToPaginate, {
backwards,
limit,
})
}),
);
if (err) {
fetching = false;
@@ -346,7 +346,7 @@ const useTimelinePagination = (
}
const fetchedTimeline =
timelineToPaginate.getNeighbouringTimeline(
backwards ? Direction.Backward : Direction.Forward
backwards ? Direction.Backward : Direction.Forward,
) ?? timelineToPaginate;
// Decrypt all event ahead of render cycle
const roomId = fetchedTimeline.getRoomId();
@@ -372,7 +372,7 @@ const useLiveEventArrive = (room: Room, onArrive: (mEvent: MatrixEvent) => void)
eventRoom,
toStartOfTimeline,
removed,
data
data,
) => {
if (eventRoom?.roomId !== room.roomId || !data.liveEvent) return;
onArrive(mEvent);
@@ -472,7 +472,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
const accessiblePowerTagColors = useAccessiblePowerTagColors(
theme.kind,
creatorsTag,
powerLevelTags
powerLevelTags,
);
const permissions = useRoomPermissions(creators, powerLevels);
@@ -524,10 +524,10 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
() => ({
...LINKIFY_OPTS,
render: factoryRenderLinkifyWithMention((href) =>
renderMatrixMention(mx, room.roomId, href, makeMentionCustomProps(mentionClickHandler))
renderMatrixMention(mx, room.roomId, href, makeMentionCustomProps(mentionClickHandler)),
),
}),
[mx, room, mentionClickHandler]
[mx, room, mentionClickHandler],
);
const htmlReactParserOptions = useMemo<HTMLReactParserOptions>(
() =>
@@ -537,12 +537,12 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
handleSpoilerClick: spoilerClickHandler,
handleMentionClick: mentionClickHandler,
}),
[mx, room, linkifyOpts, spoilerClickHandler, mentionClickHandler, useAuthentication]
[mx, room, linkifyOpts, spoilerClickHandler, mentionClickHandler, useAuthentication],
);
const parseMemberEvent = useMemberEventParser();
const [timeline, setTimeline] = useState<Timeline>(() =>
eventId ? getEmptyTimeline() : getInitialTimeline(room)
eventId ? getEmptyTimeline() : getInitialTimeline(room),
);
const timelineRef = React.useRef(timeline);
timelineRef.current = timeline;
@@ -571,7 +571,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
mx,
timeline,
setTimeline,
PAGINATION_LIMIT
PAGINATION_LIMIT,
);
const getScrollElement = useCallback(() => scrollRef.current, []);
@@ -587,7 +587,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
(index: number) =>
(scrollRef.current?.querySelector(`[data-message-item="${index}"]`) as HTMLElement) ??
undefined,
[]
[],
),
onEnd: handleTimelinePagination,
});
@@ -613,14 +613,14 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
},
});
},
[alive]
[alive],
),
useCallback(() => {
if (!alive()) return;
setTimeline(getInitialTimeline(room));
scrollToBottomRef.current.count += 1;
scrollToBottomRef.current.smooth = false;
}, [alive, room])
}, [alive, room]),
);
useLiveEventArrive(
@@ -661,15 +661,15 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
setUnreadInfo(getRoomUnreadInfo(room));
}
},
[mx, room, unreadInfo, hideActivity]
)
[mx, room, unreadInfo, hideActivity],
),
);
const handleOpenEvent = useCallback(
async (
evtId: string,
highlight = true,
onScroll: ((scrolled: boolean) => void) | undefined = undefined
onScroll: ((scrolled: boolean) => void) | undefined = undefined,
) => {
const evtTimeline = getEventTimeline(room, evtId);
const absoluteIndex =
@@ -693,7 +693,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
loadEventTimeline(evtId);
}
},
[room, scrollToItem, loadEventTimeline]
[room, scrollToItem, loadEventTimeline],
);
useLiveTimelineRefresh(
@@ -702,7 +702,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
if (liveTimelineLinked) {
setTimeline(getInitialTimeline(room));
}
}, [room, liveTimelineLinked])
}, [room, liveTimelineLinked]),
);
// Stay at bottom when room editor resize
@@ -725,7 +725,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
}
};
}, [getScrollElement, roomInputRef]),
useCallback(() => roomInputRef.current, [roomInputRef])
useCallback(() => roomInputRef.current, [roomInputRef]),
);
const tryAutoMarkAsRead = useCallback(() => {
@@ -745,7 +745,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
useCallback((entry: IntersectionObserverEntry) => {
if (!entry.isIntersecting) setAtBottom(false);
}, []),
{ wait: 1000 }
{ wait: 1000 },
);
useIntersectionObserver(
useCallback(
@@ -761,16 +761,16 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
}
}
},
[debounceSetAtBottom, tryAutoMarkAsRead]
[debounceSetAtBottom, tryAutoMarkAsRead],
),
useCallback(
() => ({
root: getScrollElement(),
rootMargin: '100px',
}),
[getScrollElement]
[getScrollElement],
),
useCallback(() => atBottomAnchorRef.current, [])
useCallback(() => atBottomAnchorRef.current, []),
);
useDocumentFocusChange(
@@ -790,8 +790,8 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
tryAutoMarkAsRead();
}
},
[tryAutoMarkAsRead, unreadInfo, handleOpenEvent]
)
[tryAutoMarkAsRead, unreadInfo, handleOpenEvent],
),
);
// Handle up arrow edit
@@ -806,7 +806,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
isEmptyEditor(editor)
) {
const editableEvt = getLatestEditableEvt(room.getLiveTimeline(), (mEvt) =>
canEditEvent(mx, mEvt)
canEditEvent(mx, mEvt),
);
const editableEvtId = editableEvt?.getId();
if (!editableEvtId) return;
@@ -814,8 +814,8 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
evt.preventDefault();
}
},
[mx, room, editor]
)
[mx, room, editor],
),
);
useEffect(() => {
@@ -931,7 +931,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
if (!targetId) return;
handleOpenEvent(targetId);
},
[handleOpenEvent]
[handleOpenEvent],
);
const handleUserClick: MouseEventHandler<HTMLButtonElement> = useCallback(
@@ -947,10 +947,10 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
room.roomId,
space?.roomId,
userId,
evt.currentTarget.getBoundingClientRect()
evt.currentTarget.getBoundingClientRect(),
);
},
[room, space, openUserRoomProfile]
[room, space, openUserRoomProfile],
);
const handleUsernameClick: MouseEventHandler<HTMLButtonElement> = useCallback(
(evt) => {
@@ -965,13 +965,13 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
createMentionElement(
userId,
name.startsWith('@') ? name : `@${name}`,
userId === mx.getUserId()
)
userId === mx.getUserId(),
),
);
ReactEditor.focus(editor);
moveCursor(editor);
},
[mx, room, editor]
[mx, room, editor],
);
const handleReplyClick: MouseEventHandler<HTMLButtonElement> = useCallback(
@@ -1001,7 +1001,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
setTimeout(() => ReactEditor.focus(editor), 100);
}
},
[room, setReplyDraft, editor]
[room, setReplyDraft, editor],
);
const handleReactionToggle = useCallback(
@@ -1022,10 +1022,10 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
mx.sendEvent(
room.roomId,
MessageEvent.Reaction as any,
getReactionContent(targetEventId, key, rShortcode)
getReactionContent(targetEventId, key, rShortcode),
);
},
[mx, room]
[mx, room],
);
const handleEdit = useCallback(
(editEvtId?: string) => {
@@ -1036,7 +1036,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
setEditId(undefined);
ReactEditor.focus(editor);
},
[editor]
[editor],
);
const { t } = useTranslation();
@@ -1938,7 +1938,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
/>
</Event>
);
}
},
);
let prevEvent: MatrixEvent | undefined;
@@ -2014,7 +2014,7 @@ export function RoomTimeline({ room, eventId, roomInputRef, editor }: RoomTimeli
mEvent,
item,
timelineSet,
collapsed
collapsed,
);
prevEvent = mEvent;
isPrevRendered = !!eventJSX;
+1 -1
View File
@@ -21,7 +21,7 @@ export function RoomTombstone({ roomId, body, replacementRoomId }: RoomTombstone
return mx.joinRoom(replacementRoomId, {
viaServers: via,
});
}, [mx, roomId, replacementRoomId])
}, [mx, roomId, replacementRoomId]),
);
const replacementRoom = mx.getRoom(replacementRoomId);
+3 -3
View File
@@ -92,14 +92,14 @@ export function RoomView({ eventId }: { eventId?: string }) {
ReactEditor.focus(editor);
}
},
[editor]
)
[editor],
),
);
const chatBgStyle = useMemo(
() =>
getChatBg(lotusTerminal && chatBackground === 'none' ? 'tactical' : chatBackground, isDark),
[chatBackground, lotusTerminal, isDark]
[chatBackground, lotusTerminal, isDark],
);
return (
+3 -2
View File
@@ -40,7 +40,8 @@ export const RoomViewFollowing = as<'div', RoomViewFollowingProps>(
const names = latestEventReaders
.filter((readerId) => readerId !== mx.getUserId())
.map(
(readerId) => getMemberDisplayName(room, readerId) ?? getMxIdLocalPart(readerId) ?? readerId
(readerId) =>
getMemberDisplayName(room, readerId) ?? getMxIdLocalPart(readerId) ?? readerId,
);
const eventId = latestEvent?.getId();
@@ -141,5 +142,5 @@ export const RoomViewFollowing = as<'div', RoomViewFollowingProps>(
</Box>
</>
);
}
},
);
+3 -3
View File
@@ -303,7 +303,7 @@ const CallMenu = forwardRef<HTMLDivElement, CallMenuProps>(
</Box>
</Menu>
);
}
},
);
function CallButton() {
@@ -398,7 +398,7 @@ export function RoomViewHeader({ callView }: { callView?: boolean }) {
const hasCallPermission = permissions.stateEvent(
StateEvent.GroupCallMemberPrefix,
mx.getSafeUserId()
mx.getSafeUserId(),
);
const livekitSupported = useLivekitSupport();
const rtcSupported = webRTCSupported();
@@ -414,7 +414,7 @@ export function RoomViewHeader({ callView }: { callView?: boolean }) {
const name = useRoomName(room);
const topic = useRoomTopic(room);
const avatarUrl = avatarMxc
? mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined
? (mxcUrlToHttp(mx, avatarMxc, useAuthentication, 96, 96, 'crop') ?? undefined)
: undefined;
const [peopleDrawer, setPeopleDrawer] = useSetting(settingsAtom, 'isPeopleDrawer');
+4 -4
View File
@@ -27,10 +27,10 @@ export const RoomViewTyping = as<'div', RoomViewTypingProps>(
.filter((receipt) => receipt.userId !== myUserId)
.map(
(receipt) =>
getMemberDisplayName(room, receipt.userId) ?? getMxIdLocalPart(receipt.userId)
getMemberDisplayName(room, receipt.userId) ?? getMxIdLocalPart(receipt.userId),
)
.reverse(),
[typingMembers, myUserId, room]
[typingMembers, myUserId, room],
);
if (typingNames.length === 0) {
@@ -45,7 +45,7 @@ export const RoomViewTyping = as<'div', RoomViewTypingProps>(
type: 'DELETE',
roomId: room.roomId,
userId: receipt.userId,
})
}),
);
};
@@ -129,5 +129,5 @@ export const RoomViewTyping = as<'div', RoomViewTypingProps>(
</Box>
</div>
);
}
},
);
@@ -73,8 +73,8 @@ export function JumpToTime({ onCancel, onSubmit }: JumpToTimeProps) {
const result = await mx.timestampToEvent(room.roomId, newTs, Direction.Forward);
return result.event_id;
},
[mx, room]
)
[mx, room],
),
);
const handleSubmit = () => {
+15 -15
View File
@@ -176,7 +176,7 @@ export const MessageQuickReactions = as<'div', MessageQuickReactionsProps>(
<Line size="300" />
</>
);
}
},
);
export const MessageAllReactionItem = as<
@@ -461,8 +461,8 @@ export const MessageDeleteItem = as<
useCallback(
(eventId: string, reason?: string) =>
mx.redactEvent(room.roomId, eventId, undefined, reason ? { reason } : undefined),
[mx, room]
)
[mx, room],
),
);
const handleSubmit: FormEventHandler<HTMLFormElement> = (evt) => {
@@ -590,8 +590,8 @@ export const MessageReportItem = as<
useCallback(
(eventId: string, score: number, reason: string) =>
mx.reportEvent(room.roomId, eventId, score, reason),
[mx, room]
)
[mx, room],
),
);
const handleSubmit: FormEventHandler<HTMLFormElement> = (evt) => {
@@ -726,7 +726,7 @@ export type MessageProps = {
onUsernameClick: MouseEventHandler<HTMLButtonElement>;
onReplyClick: (
ev: Parameters<MouseEventHandler<HTMLButtonElement>>[0],
startThread?: boolean
startThread?: boolean,
) => void;
onEditId?: (eventId?: string) => void;
onReactionToggle: (targetEventId: string, key: string, shortcode?: string) => void;
@@ -776,7 +776,7 @@ export const Message = React.memo(
children,
...props
},
ref
ref,
) => {
const mx = useMatrixClient();
const useAuthentication = useMediaAuthentication();
@@ -784,7 +784,7 @@ export const Message = React.memo(
const readPositions = useReadPositions();
const readReceiptUsers = hideReadReceipts
? []
: readPositions.get(mEvent.getId() ?? '') ?? [];
: (readPositions.get(mEvent.getId() ?? '') ?? []);
const isMine = mEvent.getSender() === mx.getUserId();
const lotusTerminal = lotusTerminalProp;
@@ -870,8 +870,8 @@ export const Message = React.memo(
userId={senderId}
src={
senderAvatarMxc
? mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
undefined
? (mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
undefined)
: undefined
}
alt={senderDisplayName}
@@ -1254,8 +1254,8 @@ export const Message = React.memo(
)}
</MessageBase>
);
}
)
},
),
);
export type EventProps = {
@@ -1282,7 +1282,7 @@ export const Event = React.memo(
children,
...props
},
ref
ref,
) => {
const mx = useMatrixClient();
const [hover, setHover] = useState(false);
@@ -1409,6 +1409,6 @@ export const Event = React.memo(
<div onContextMenu={handleContextMenu}>{children}</div>
</MessageBase>
);
}
)
},
),
);
@@ -78,7 +78,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
const getPrevBodyAndFormattedBody = useCallback((): [
string | undefined,
string | undefined,
IMentions | undefined
IMentions | undefined,
] => {
const evtId = mEvent.getId()!;
const evtTimeline = room.getTimelineForEvent(evtId);
@@ -105,7 +105,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
allowTextFormatting: true,
allowBlockMarkdown: isMarkdown,
allowInlineMarkdown: isMarkdown,
})
}),
);
const [prevBody, prevCustomHtml, prevMentions] = getPrevBodyAndFormattedBody();
@@ -154,7 +154,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
};
return mx.sendMessage(roomId, content);
}, [mx, editor, roomId, mEvent, isMarkdown, getPrevBodyAndFormattedBody])
}, [mx, editor, roomId, mEvent, isMarkdown, getPrevBodyAndFormattedBody]),
);
const handleSave = useCallback(() => {
@@ -177,7 +177,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
onCancel();
}
},
[onCancel, handleSave, enterForNewline, isComposing]
[onCancel, handleSave, enterForNewline, isComposing],
);
const handleKeyUp: KeyboardEventHandler = useCallback(
@@ -193,7 +193,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
: undefined;
setAutocompleteQuery(query);
},
[editor]
[editor],
);
const handleCloseAutocomplete = useCallback(() => {
@@ -330,7 +330,7 @@ export const MessageEditor = as<'div', MessageEditorProps>(
onClick={
((evt) =>
setAnchor(
evt.currentTarget.getBoundingClientRect()
evt.currentTarget.getBoundingClientRect(),
)) as MouseEventHandler<HTMLButtonElement>
}
variant="SurfaceVariant"
@@ -355,5 +355,5 @@ export const MessageEditor = as<'div', MessageEditorProps>(
/>
</div>
);
}
},
);
+2 -2
View File
@@ -39,7 +39,7 @@ export const Reactions = as<'div', ReactionsProps>(
const myUserId = mx.getUserId();
const reactions = useRelations(
relations,
useCallback((rel) => [...(rel.getSortedAnnotationsByKey() ?? [])], [])
useCallback((rel) => [...(rel.getSortedAnnotationsByKey() ?? [])], []),
);
const handleViewReaction: MouseEventHandler<HTMLButtonElement> = (evt) => {
@@ -126,5 +126,5 @@ export const Reactions = as<'div', ReactionsProps>(
)}
</Box>
);
}
},
);
+6 -6
View File
@@ -22,7 +22,7 @@ const generateThumbnailContent = async (
mx: MatrixClient,
img: HTMLImageElement | HTMLVideoElement,
dimensions: [number, number],
encrypt: boolean
encrypt: boolean,
): Promise<IThumbnailContent> => {
const thumbnail = await getThumbnail(img, ...dimensions);
if (!thumbnail) throw new Error('Can not create thumbnail!');
@@ -46,7 +46,7 @@ const generateThumbnailContent = async (
export const getImageMsgContent = async (
mx: MatrixClient,
item: TUploadItem,
mxc: string
mxc: string,
): Promise<IContent> => {
const { file, originalFile, encInfo, metadata } = item;
const [imgError, imgEl] = await to(loadImageElement(getImageFileUrl(originalFile)));
@@ -80,7 +80,7 @@ export const getImageMsgContent = async (
export const getVideoMsgContent = async (
mx: MatrixClient,
item: TUploadItem,
mxc: string
mxc: string,
): Promise<IContent> => {
const { file, originalFile, encInfo, metadata } = item;
@@ -99,14 +99,14 @@ export const getVideoMsgContent = async (
mx,
videoEl,
getThumbnailDimensions(videoEl.videoWidth, videoEl.videoHeight),
!!encInfo
)
!!encInfo,
),
);
if (thumbContent && thumbContent.thumbnail_info) {
thumbContent.thumbnail_info[MATRIX_BLUR_HASH_PROPERTY_NAME] = encodeBlurHash(
videoEl,
512,
scaleYDimension(videoEl.videoWidth, 512, videoEl.videoHeight)
scaleYDimension(videoEl.videoWidth, 512, videoEl.videoHeight),
);
}
if (thumbError) console.warn(thumbError);
@@ -41,7 +41,7 @@ export const ReactionViewer = as<'div', ReactionViewerProps>(
const useAuthentication = useMediaAuthentication();
const reactions = useRelations(
relations,
useCallback((rel) => [...(rel.getSortedAnnotationsByKey() ?? [])], [])
useCallback((rel) => [...(rel.getSortedAnnotationsByKey() ?? [])], []),
);
const space = useSpaceOptionally();
const openProfile = useOpenUserRoomProfile();
@@ -123,7 +123,7 @@ export const ReactionViewer = as<'div', ReactionViewerProps>(
'crop',
undefined,
false,
useAuthentication
useAuthentication,
)
: undefined;
@@ -138,7 +138,7 @@ export const ReactionViewer = as<'div', ReactionViewerProps>(
space?.roomId,
senderId,
getMouseEventCords(event.nativeEvent),
'Bottom'
'Bottom',
);
}}
before={
@@ -166,5 +166,5 @@ export const ReactionViewer = as<'div', ReactionViewerProps>(
</Box>
</Box>
);
}
},
);
@@ -124,7 +124,7 @@ function PinnedMessage({
};
return mx.sendStateEvent(room.roomId, StateEvent.RoomPinnedEvents as any, newContent);
}, [room, eventId, mx])
}, [room, eventId, mx]),
);
const handleOpenClick: MouseEventHandler = (evt) => {
@@ -199,8 +199,8 @@ function PinnedMessage({
userId={sender}
src={
senderAvatarMxc
? mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
undefined
? (mxcUrlToHttp(mx, senderAvatarMxc, useAuthentication, 48, 48, 'crop') ??
undefined)
: undefined
}
alt={displayName}
@@ -266,7 +266,7 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
const accessibleTagColors = useAccessiblePowerTagColors(
theme.kind,
creatorsTag,
powerLevelTags
powerLevelTags,
);
const pinnedEvents = useRoomPinnedEvents(room);
@@ -298,10 +298,10 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
() => ({
...LINKIFY_OPTS,
render: factoryRenderLinkifyWithMention((href) =>
renderMatrixMention(mx, room.roomId, href, makeMentionCustomProps(mentionClickHandler))
renderMatrixMention(mx, room.roomId, href, makeMentionCustomProps(mentionClickHandler)),
),
}),
[mx, room, mentionClickHandler]
[mx, room, mentionClickHandler],
);
const htmlReactParserOptions = useMemo<HTMLReactParserOptions>(
() =>
@@ -311,7 +311,7 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
handleSpoilerClick: spoilerClickHandler,
handleMentionClick: mentionClickHandler,
}),
[mx, room, linkifyOpts, mentionClickHandler, spoilerClickHandler, useAuthentication]
[mx, room, linkifyOpts, mentionClickHandler, spoilerClickHandler, useAuthentication],
);
const renderMatrixEvent = useMatrixEventRenderer<[MatrixEvent, string, GetContentCallback]>(
@@ -442,7 +442,7 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
</Text>
</Box>
);
}
},
);
const handleOpen = (roomId: string, eventId: string) => {
@@ -542,5 +542,5 @@ export const RoomPinMenu = forwardRef<HTMLDivElement, RoomPinMenuProps>(
</Box>
</Menu>
);
}
},
);