Improve code quality

Signed-off-by: Ajay Bura <ajbura@gmail.com>
This commit is contained in:
Ajay Bura 2022-03-12 14:14:56 +05:30
parent 48ec6224e7
commit a76dcb289a
3 changed files with 41 additions and 44 deletions

View file

@ -14,14 +14,10 @@ class EventLimit {
return this._from;
}
get end() {
get length() {
return this._from + this.maxEvents;
}
setMaxEvents(maxEvents) {
this.maxEvents = maxEvents;
}
setFrom(from) {
this._from = from < 0 ? 0 : from;
}
@ -29,7 +25,7 @@ class EventLimit {
paginate(backwards, limit, timelineLength) {
this._from = backwards ? this._from - limit : this._from + limit;
if (!backwards && this.end > timelineLength) {
if (!backwards && this.length > timelineLength) {
this._from = timelineLength - this.maxEvents;
}
if (this._from < 0) this._from = 0;

View file

@ -119,7 +119,7 @@ function renderEvent(roomTimeline, mEvent, prevMEvent, isFocus = false) {
);
}
function useTimeline(roomTimeline, eventId, readEventStore, eventLimitRef) {
function useTimeline(roomTimeline, eventId, readUptoEvtStore, eventLimitRef) {
const [timelineInfo, setTimelineInfo] = useState(null);
const setEventTimeline = async (eId) => {
@ -145,14 +145,14 @@ function useTimeline(roomTimeline, eventId, readEventStore, eventLimitRef) {
if (isSpecificEvent) {
focusEventIndex = roomTimeline.getEventIndex(eId);
} else if (!readEventStore.getItem()) {
} else if (!readUptoEvtStore.getItem()) {
// either opening live timeline or jump to unread.
focusEventIndex = roomTimeline.getUnreadEventIndex(readUpToId);
if (roomTimeline.hasEventInTimeline(readUpToId)) {
readEventStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
readUptoEvtStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
}
} else {
focusEventIndex = roomTimeline.getUnreadEventIndex(readEventStore.getItem().getId());
focusEventIndex = roomTimeline.getUnreadEventIndex(readUptoEvtStore.getItem().getId());
}
if (focusEventIndex > -1) {
@ -177,7 +177,7 @@ function useTimeline(roomTimeline, eventId, readEventStore, eventLimitRef) {
function usePaginate(
roomTimeline,
readEventStore,
readUptoEvtStore,
forceUpdateLimit,
timelineScrollRef,
eventLimitRef,
@ -185,12 +185,12 @@ function usePaginate(
const [info, setInfo] = useState(null);
useEffect(() => {
const handleOnPagination = (backwards, loaded) => {
const handlePaginatedFromServer = (backwards, loaded) => {
const limit = eventLimitRef.current;
if (loaded === 0) return;
if (!readEventStore.getItem()) {
if (!readUptoEvtStore.getItem()) {
const readUpToId = roomTimeline.getReadUpToEventId();
readEventStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
readUptoEvtStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
}
limit.paginate(backwards, PAG_LIMIT, roomTimeline.timeline.length);
setTimeout(() => setInfo({
@ -198,9 +198,9 @@ function usePaginate(
loaded,
}));
};
roomTimeline.on(cons.events.roomTimeline.PAGINATED, handleOnPagination);
roomTimeline.on(cons.events.roomTimeline.PAGINATED, handlePaginatedFromServer);
return () => {
roomTimeline.on(cons.events.roomTimeline.PAGINATED, handleOnPagination);
roomTimeline.on(cons.events.roomTimeline.PAGINATED, handlePaginatedFromServer);
};
}, [roomTimeline]);
@ -211,7 +211,7 @@ function usePaginate(
const tLength = roomTimeline.timeline.length;
if (timelineScroll.bottom < SCROLL_TRIGGER_POS) {
if (limit.end < tLength) {
if (limit.length < tLength) {
// paginate from memory
limit.paginate(false, PAG_LIMIT, tLength);
forceUpdateLimit();
@ -239,7 +239,7 @@ function usePaginate(
function useHandleScroll(
roomTimeline,
autoPaginate,
readEventStore,
readUptoEvtStore,
forceUpdateLimit,
timelineScrollRef,
eventLimitRef,
@ -251,10 +251,10 @@ function useHandleScroll(
// emit event to toggle scrollToBottom button visibility
const isAtBottom = (
timelineScroll.bottom < 16 && !roomTimeline.canPaginateForward()
&& limit.end >= roomTimeline.timeline.length
&& limit.length >= roomTimeline.timeline.length
);
roomTimeline.emit(cons.events.roomTimeline.AT_BOTTOM, isAtBottom);
if (isAtBottom && readEventStore.getItem()) {
if (isAtBottom && readUptoEvtStore.getItem()) {
requestAnimationFrame(() => roomTimeline.markAllAsRead());
}
});
@ -264,7 +264,7 @@ function useHandleScroll(
const handleScrollToLive = useCallback(() => {
const timelineScroll = timelineScrollRef.current;
const limit = eventLimitRef.current;
if (readEventStore.getItem()) {
if (readUptoEvtStore.getItem()) {
requestAnimationFrame(() => roomTimeline.markAllAsRead());
}
if (roomTimeline.isServingLiveTimeline()) {
@ -279,7 +279,7 @@ function useHandleScroll(
return [handleScroll, handleScrollToLive];
}
function useEventArrive(roomTimeline, readEventStore, timelineScrollRef, eventLimitRef) {
function useEventArrive(roomTimeline, readUptoEvtStore, timelineScrollRef, eventLimitRef) {
const myUserId = initMatrix.matrixClient.getUserId();
const [newEvent, setEvent] = useState(null);
@ -292,19 +292,19 @@ function useEventArrive(roomTimeline, readEventStore, timelineScrollRef, eventLi
roomTimeline.markAllAsRead();
return;
}
const readUpToEvent = readEventStore.getItem();
const readUpToEvent = readUptoEvtStore.getItem();
const readUpToId = roomTimeline.getReadUpToEventId();
const isUnread = readUpToEvent?.getId() === readUpToId;
// if user doesn't have focus on app don't mark messages as read.
if (document.visibilityState === 'hidden' || timelineScroll.bottom >= 16) {
if (readUpToEvent === readUpToId) return;
readEventStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
if (isUnread) return;
readUptoEvtStore.setItem(roomTimeline.findEventByIdInTimelineSet(readUpToId));
return;
}
// user has not mark room as read
const isUnreadMsg = readUpToEvent?.getId() === readUpToId;
if (!isUnreadMsg) {
if (!isUnread) {
roomTimeline.markAllAsRead();
}
const { timeline } = roomTimeline;
@ -318,7 +318,7 @@ function useEventArrive(roomTimeline, readEventStore, timelineScrollRef, eventLi
const tLength = roomTimeline.timeline.length;
const isUserViewingLive = (
roomTimeline.isServingLiveTimeline()
&& limit.end >= tLength - 1
&& limit.length >= tLength - 1
&& timelineScroll.bottom < SCROLL_TRIGGER_POS
);
if (isUserViewingLive) {
@ -334,7 +334,7 @@ function useEventArrive(roomTimeline, readEventStore, timelineScrollRef, eventLi
}
const isUserDitchedLive = (
roomTimeline.isServingLiveTimeline()
&& limit.end >= tLength - 1
&& limit.length >= tLength - 1
);
if (isUserDitchedLive) {
// This stateUpdate will help to put the
@ -375,13 +375,13 @@ function RoomViewContent({ eventId, roomTimeline }) {
const timelineScrollRef = useRef(null);
const eventLimitRef = useRef(null);
const readEventStore = useStore(roomTimeline);
const readUptoEvtStore = useStore(roomTimeline);
const [onLimitUpdate, forceUpdateLimit] = useForceUpdate();
const timelineInfo = useTimeline(roomTimeline, eventId, readEventStore, eventLimitRef);
const timelineInfo = useTimeline(roomTimeline, eventId, readUptoEvtStore, eventLimitRef);
const [paginateInfo, autoPaginate] = usePaginate(
roomTimeline,
readEventStore,
readUptoEvtStore,
forceUpdateLimit,
timelineScrollRef,
eventLimitRef,
@ -389,12 +389,12 @@ function RoomViewContent({ eventId, roomTimeline }) {
const [handleScroll, handleScrollToLive] = useHandleScroll(
roomTimeline,
autoPaginate,
readEventStore,
readUptoEvtStore,
forceUpdateLimit,
timelineScrollRef,
eventLimitRef,
);
useEventArrive(roomTimeline, readEventStore, timelineScrollRef, eventLimitRef);
useEventArrive(roomTimeline, readUptoEvtStore, timelineScrollRef, eventLimitRef);
const { timeline } = roomTimeline;
@ -418,7 +418,7 @@ function RoomViewContent({ eventId, roomTimeline }) {
}
if (timelineScroll.bottom < 16 && !roomTimeline.canPaginateForward()) {
const readUpToId = roomTimeline.getReadUpToEventId();
if (readEventStore.getItem()?.getId() === readUpToId || readUpToId === null) {
if (readUptoEvtStore.getItem()?.getId() === readUpToId || readUpToId === null) {
requestAnimationFrame(() => roomTimeline.markAllAsRead());
}
}
@ -465,14 +465,14 @@ function RoomViewContent({ eventId, roomTimeline }) {
let itemCountIndex = 0;
jumpToItemIndex = -1;
const readEvent = readEventStore.getItem();
const readUptoEvent = readUptoEvtStore.getItem();
let unreadDivider = false;
if (roomTimeline.canPaginateBackward() || limit.from > 0) {
tl.push(loadingMsgPlaceholders(1, PLACEHOLDER_COUNT));
itemCountIndex += PLACEHOLDER_COUNT;
}
for (let i = limit.from; i < limit.end; i += 1) {
for (let i = limit.from; i < limit.length; i += 1) {
if (i >= timeline.length) break;
const mEvent = timeline[i];
const prevMEvent = timeline[i - 1] ?? null;
@ -491,9 +491,9 @@ function RoomViewContent({ eventId, roomTimeline }) {
let isNewEvent = false;
if (!unreadDivider) {
unreadDivider = (readEvent
&& prevMEvent?.getTs() <= readEvent.getTs()
&& readEvent.getTs() < mEvent.getTs());
unreadDivider = (readUptoEvent
&& prevMEvent?.getTs() <= readUptoEvent.getTs()
&& readUptoEvent.getTs() < mEvent.getTs());
if (unreadDivider) {
isNewEvent = true;
tl.push(<Divider key={`new-${mEvent.getId()}`} variant="positive" text="New messages" />);
@ -514,7 +514,7 @@ function RoomViewContent({ eventId, roomTimeline }) {
tl.push(renderEvent(roomTimeline, mEvent, isNewEvent ? null : prevMEvent, isFocus));
itemCountIndex += 1;
}
if (roomTimeline.canPaginateForward() || limit.end < timeline.length) {
if (roomTimeline.canPaginateForward() || limit.length < timeline.length) {
tl.push(loadingMsgPlaceholders(2, PLACEHOLDER_COUNT));
}

View file

@ -154,19 +154,19 @@ class RoomTimeline extends EventEmitter {
this._populateAllLinkedEvents(this.activeTimeline);
}
async _reset(eventId) {
async _reset() {
if (this.isEncrypted()) await this.decryptAllEventsOfTimeline(this.activeTimeline);
this._populateTimelines();
if (!this.initialized) {
this.initialized = true;
this._listenEvents();
}
this.emit(cons.events.roomTimeline.READY, eventId ?? null);
}
async loadLiveTimeline() {
this.activeTimeline = this.liveTimeline;
await this._reset();
this.emit(cons.events.roomTimeline.READY, null);
return true;
}
@ -176,7 +176,8 @@ class RoomTimeline extends EventEmitter {
try {
const eventTimeline = await this.matrixClient.getEventTimeline(timelineSet, eventId);
this.activeTimeline = eventTimeline;
await this._reset(eventId);
await this._reset();
this.emit(cons.events.roomTimeline.READY, eventId);
return true;
} catch {
return false;