Fix calls tab clearing clicking on old calls
This commit is contained in:
parent
c3248be854
commit
55dca745c7
5 changed files with 40 additions and 11 deletions
|
@ -111,6 +111,7 @@ type CallsListProps = Readonly<{
|
|||
options: CallHistoryFilterOptions,
|
||||
pagination: CallHistoryPagination
|
||||
) => Promise<Array<CallHistoryGroup>>;
|
||||
callHistoryEdition: number;
|
||||
getConversation: (id: string) => ConversationType | void;
|
||||
i18n: LocalizerType;
|
||||
selectedCallHistoryGroup: CallHistoryGroup | null;
|
||||
|
@ -139,6 +140,7 @@ export function CallsList({
|
|||
hasActiveCall,
|
||||
getCallHistoryGroupsCount,
|
||||
getCallHistoryGroups,
|
||||
callHistoryEdition,
|
||||
getConversation,
|
||||
i18n,
|
||||
selectedCallHistoryGroup,
|
||||
|
@ -154,6 +156,14 @@ export function CallsList({
|
|||
|
||||
const prevOptionsRef = useRef<CallHistoryFilterOptions | null>(null);
|
||||
|
||||
const getCallHistoryGroupsCountRef = useRef(getCallHistoryGroupsCount);
|
||||
const getCallHistoryGroupsRef = useRef(getCallHistoryGroups);
|
||||
|
||||
useEffect(() => {
|
||||
getCallHistoryGroupsCountRef.current = getCallHistoryGroupsCount;
|
||||
getCallHistoryGroupsRef.current = getCallHistoryGroups;
|
||||
}, [getCallHistoryGroupsCount, getCallHistoryGroups]);
|
||||
|
||||
useEffect(() => {
|
||||
const controller = new AbortController();
|
||||
|
||||
|
@ -180,8 +190,8 @@ export function CallsList({
|
|||
|
||||
try {
|
||||
const [count, items] = await Promise.all([
|
||||
getCallHistoryGroupsCount(options),
|
||||
getCallHistoryGroups(options, {
|
||||
getCallHistoryGroupsCountRef.current(options),
|
||||
getCallHistoryGroupsRef.current(options, {
|
||||
offset: 0,
|
||||
limit: 100, // preloaded rows
|
||||
}),
|
||||
|
@ -226,7 +236,7 @@ export function CallsList({
|
|||
return () => {
|
||||
controller.abort();
|
||||
};
|
||||
}, [getCallHistoryGroupsCount, getCallHistoryGroups, queryInput, status]);
|
||||
}, [queryInput, status, callHistoryEdition]);
|
||||
|
||||
const loadMoreRows = useCallback(
|
||||
async (props: IndexRange) => {
|
||||
|
@ -250,7 +260,10 @@ export function CallsList({
|
|||
const limit = stopIndex - startIndex + 1;
|
||||
|
||||
try {
|
||||
const groups = await getCallHistoryGroups(options, { offset, limit });
|
||||
const groups = await getCallHistoryGroupsRef.current(options, {
|
||||
offset,
|
||||
limit,
|
||||
});
|
||||
|
||||
if (searchState.options !== options) {
|
||||
return;
|
||||
|
@ -275,7 +288,7 @@ export function CallsList({
|
|||
log.error('CallsList#loadMoreRows error fetching', error);
|
||||
}
|
||||
},
|
||||
[getCallHistoryGroups, searchState]
|
||||
[searchState]
|
||||
);
|
||||
|
||||
const isRowLoaded = useCallback(
|
||||
|
|
|
@ -34,6 +34,7 @@ type CallsTabProps = Readonly<{
|
|||
options: CallHistoryFilterOptions,
|
||||
pagination: CallHistoryPagination
|
||||
) => Promise<Array<CallHistoryGroup>>;
|
||||
callHistoryEdition: number;
|
||||
getConversation: (id: string) => ConversationType | void;
|
||||
hasFailedStorySends: boolean;
|
||||
hasPendingUpdate: boolean;
|
||||
|
@ -59,6 +60,7 @@ export function CallsTab({
|
|||
otherTabsUnreadStats,
|
||||
getCallHistoryGroupsCount,
|
||||
getCallHistoryGroups,
|
||||
callHistoryEdition,
|
||||
getConversation,
|
||||
hasFailedStorySends,
|
||||
hasPendingUpdate,
|
||||
|
@ -221,6 +223,7 @@ export function CallsTab({
|
|||
hasActiveCall={activeCall != null}
|
||||
getCallHistoryGroupsCount={getCallHistoryGroupsCount}
|
||||
getCallHistoryGroups={getCallHistoryGroups}
|
||||
callHistoryEdition={callHistoryEdition}
|
||||
getConversation={getConversation}
|
||||
i18n={i18n}
|
||||
selectedCallHistoryGroup={selected?.callHistoryGroup ?? null}
|
||||
|
|
|
@ -187,6 +187,7 @@ export function reducer(
|
|||
case CALL_HISTORY_ADD:
|
||||
return {
|
||||
...state,
|
||||
edition: state.edition + 1,
|
||||
callHistoryByCallId: {
|
||||
...state.callHistoryByCallId,
|
||||
[action.payload.callId]: action.payload,
|
||||
|
@ -195,6 +196,7 @@ export function reducer(
|
|||
case CALL_HISTORY_REMOVE:
|
||||
return {
|
||||
...state,
|
||||
edition: state.edition + 1,
|
||||
callHistoryByCallId: omit(state.callHistoryByCallId, action.payload),
|
||||
};
|
||||
case CALL_HISTORY_UPDATE_UNREAD:
|
||||
|
|
|
@ -110,8 +110,6 @@ export function SmartCallsTab(): JSX.Element {
|
|||
|
||||
const getCallHistoryGroupsCount = useCallback(
|
||||
async (options: CallHistoryFilterOptions) => {
|
||||
// Used to fire effects when all calls are erased
|
||||
void callHistoryEdition;
|
||||
const callHistoryFilter = getCallHistoryFilter(
|
||||
allConversations,
|
||||
regionCode,
|
||||
|
@ -125,7 +123,7 @@ export function SmartCallsTab(): JSX.Element {
|
|||
);
|
||||
return count;
|
||||
},
|
||||
[allConversations, regionCode, callHistoryEdition]
|
||||
[allConversations, regionCode]
|
||||
);
|
||||
|
||||
const getCallHistoryGroups = useCallback(
|
||||
|
@ -133,8 +131,6 @@ export function SmartCallsTab(): JSX.Element {
|
|||
options: CallHistoryFilterOptions,
|
||||
pagination: CallHistoryPagination
|
||||
) => {
|
||||
// Used to fire effects when all calls are erased
|
||||
void callHistoryEdition;
|
||||
const callHistoryFilter = getCallHistoryFilter(
|
||||
allConversations,
|
||||
regionCode,
|
||||
|
@ -149,7 +145,7 @@ export function SmartCallsTab(): JSX.Element {
|
|||
);
|
||||
return results;
|
||||
},
|
||||
[allConversations, regionCode, callHistoryEdition]
|
||||
[allConversations, regionCode]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -164,6 +160,7 @@ export function SmartCallsTab(): JSX.Element {
|
|||
getConversation={getConversation}
|
||||
getCallHistoryGroupsCount={getCallHistoryGroupsCount}
|
||||
getCallHistoryGroups={getCallHistoryGroups}
|
||||
callHistoryEdition={callHistoryEdition}
|
||||
hasFailedStorySends={hasFailedStorySends}
|
||||
hasPendingUpdate={hasPendingUpdate}
|
||||
i18n={i18n}
|
||||
|
|
|
@ -3086,6 +3086,20 @@
|
|||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2023-08-18T19:09:30.283Z"
|
||||
},
|
||||
{
|
||||
"rule": "React-useRef",
|
||||
"path": "ts/components/CallsList.tsx",
|
||||
"line": " const getCallHistoryGroupsCountRef = useRef(getCallHistoryGroupsCount);",
|
||||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2023-11-27T20:25:10.634Z"
|
||||
},
|
||||
{
|
||||
"rule": "React-useRef",
|
||||
"path": "ts/components/CallsList.tsx",
|
||||
"line": " const getCallHistoryGroupsRef = useRef(getCallHistoryGroups);",
|
||||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2023-11-27T20:25:10.634Z"
|
||||
},
|
||||
{
|
||||
"rule": "React-useRef",
|
||||
"path": "ts/components/CaptchaDialog.tsx",
|
||||
|
|
Loading…
Reference in a new issue