chore: upgrade i18next 26, prettier 3, fontsource-variable, domhandler 6, lint-staged 17
CI / Build & Quality Checks (push) Successful in 10m13s
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:
@@ -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;
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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} />
|
||||
)
|
||||
),
|
||||
);
|
||||
|
||||
@@ -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;
|
||||
|
||||
@@ -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);
|
||||
|
||||
|
||||
@@ -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 (
|
||||
|
||||
@@ -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>
|
||||
</>
|
||||
);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
@@ -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');
|
||||
|
||||
@@ -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 = () => {
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
@@ -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>
|
||||
);
|
||||
}
|
||||
},
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user