Page MenuHomePhabricator
Differential D8074 Diff 27826 lib/hooks/message-hooks.js

Changeset View

Standalone View

View Options

lib/hooks/message-hooks.js

// @flow // @flow
import _max from 'lodash/fp/max.js';
import _min from 'lodash/fp/min.js';
import * as React from 'react';
import {
fetchLatestMessages,
fetchLatestMessagesActionTypes,
} from '../actions/message-actions.js';
import { createLoadingStatusSelector } from '../selectors/loading-selectors.js';
import { getOldestNonLocalMessageID } from '../shared/message-utils.js'; import { getOldestNonLocalMessageID } from '../shared/message-utils.js';
import type { LoadingStatus } from '../types/loading-types.js';
import {
useDispatchActionPromise,
useServerCall,
} from '../utils/action-utils.js';
import { values } from '../utils/objects.js';
import { useSelector } from '../utils/redux-utils.js'; import { useSelector } from '../utils/redux-utils.js';
function useOldestMessageServerID(threadID: string): ?string { function useOldestMessageServerID(threadID: string): ?string {
return useSelector(state => return useSelector(state =>
getOldestNonLocalMessageID(threadID, state.messageStore), getOldestNonLocalMessageID(threadID, state.messageStore),
); );
} }
export { useOldestMessageServerID }; type FetchLatestMessagesState =
| { type: 'everything_loaded' }
| { type: 'loaded_upto_message', message: string };
ashoatUnsubmitted
Not Done
Inline Actions
| { type: 'everything_loaded' }
- | { type: 'loaded_upto_message', message: string };
+ | { type: 'loaded_up_to_message', message: string };
function useFetchLatestMessages(home: boolean): {

Nit

ashoat: Nit
ashoatUnsubmitted
Not Done
Inline Actions
type FetchLatestMessagesState =
- | { type: 'everything_loaded' }
- | { type: 'loaded_upto_message', message: string };
+ | { +type: 'everything_loaded' }
+ | { +type: 'loaded_upto_message', +message: string };
function useFetchLatestMessages(home: boolean): {

React state should always be read-only

ashoat: React state should always be read-only
function useFetchLatestMessages(home: boolean): {
fetchMoreLatestMessages: () => Promise<void>,
loadingStatus: LoadingStatus,
} {
const dispatchActionPromise = useDispatchActionPromise();
const callFetchLatestMessages = useServerCall(fetchLatestMessages);
const messageStoreThreads = useSelector(state => state.messageStore.threads);
const [fetchState, setFetchState] =
React.useState<?FetchLatestMessagesState>(null);
React.useEffect(() => {
if (values(messageStoreThreads).length === 0) {
setFetchState(null);
} else if (fetchState === null) {
const latestMessageForThread = thread =>
_max(thread.messageIDs.map(Number));
const oldestLatestMessage = _min(
values(messageStoreThreads).map(latestMessageForThread),
);
if (oldestLatestMessage) {
setFetchState({
type: 'loaded_upto_message',
message: oldestLatestMessage.toString(),
});
}
}
ashoatUnsubmitted
Not Done
Inline Actions
React.useEffect(() => {
if (values(messageStoreThreads).length === 0) {
setFetchState(null);
- } else if (fetchState === null) {
- const latestMessageForThread = thread =>
- _max(thread.messageIDs.map(Number));
+ return;
+ } else if (fetchState !== null) {
+ return;
+ }
+ const latestMessageForThread = thread =>
+ _max(thread.messageIDs.map(Number));
- const oldestLatestMessage = _min(
- values(messageStoreThreads).map(latestMessageForThread),
- );
+ const oldestLatestMessage = _min(
+ values(messageStoreThreads).map(latestMessageForThread),
+ );
- if (oldestLatestMessage) {
- setFetchState({
- type: 'loaded_upto_message',
- message: oldestLatestMessage.toString(),
- });
- }
- }
+ if (oldestLatestMessage) {
+ setFetchState({
+ type: 'loaded_upto_message',
+ message: oldestLatestMessage.toString(),
+ });
+ }
}, [fetchState, messageStoreThreads]);

We can reduce indentation here and "exit early"

ashoat: We can reduce indentation here and "exit early"
}, [fetchState, messageStoreThreads]);
const fetchMoreLatestMessages = React.useCallback(async () => {
if (fetchState?.type !== 'loaded_upto_message') {
return;
}
inkaUnsubmitted
Not Done
Inline Actions

what if fetchState is null?

inka: what if fetchState is null?
await dispatchActionPromise(
fetchLatestMessagesActionTypes,
(async () => {
const result = await callFetchLatestMessages({
home,
fromMessage: fetchState.message,
});
if (
!result.oldestMessage ||
result.oldestMessage === fetchState.message
michalAuthorUnsubmitted
Done
Inline Actions

Regarding previous @inka comment: I'm checking if the message is the same because of this issue: https://linear.app/comm/issue/ENG-4101

michal: Regarding previous @inka comment: I'm checking if the message is the same because of this issue…
inkaUnsubmitted
Not Done
Inline Actions

So is this a hack? Should it be reverted when ENG-4101 is resolved? If so, please make it a subtask of ENG-4101

inka: So is this a hack? Should it be reverted when ENG-4101 is resolved? If so, please make it a…
) {
setFetchState({ type: 'everything_loaded' });
} else {
setFetchState({
type: 'loaded_upto_message',
message: result.oldestMessage,
});
}
return result;
})(),
);
}, [fetchState, dispatchActionPromise, callFetchLatestMessages, home]);
const loadingStatusSelector = createLoadingStatusSelector(
fetchLatestMessagesActionTypes,
);
const loadingStatus = useSelector(loadingStatusSelector);
return {
fetchMoreLatestMessages,
loadingStatus,
};
}
export { useOldestMessageServerID, useFetchLatestMessages };