Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[CP Staging] Only apply interaction for desktop #34449

Merged
merged 3 commits into from
Jan 15, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions src/libs/DoInteractionTask/index.desktop.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
import {InteractionManager} from 'react-native';

// For desktop, we should call the callback after all interactions to prevent freezing. See more detail in https://github.com/Expensify/App/issues/28916
function doInteractionTask(callback: () => void) {
return InteractionManager.runAfterInteractions(() => {
callback();
});
}

export default doInteractionTask;
6 changes: 6 additions & 0 deletions src/libs/DoInteractionTask/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
function doInteractionTask(callback: () => void) {
callback();
return null;
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NAB: Is this returning null for explicit clarity or does it serve any other purpose as well?

Copy link
Contributor Author

@dukenv0307 dukenv0307 Jan 15, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For desktop we return an interaction and cancel it in cleanup function. For others, only need to return null.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I saw that. By default it returns undefined anyway if we dont add any return statement. Returning null does not appear to serve any additional purpose. That's why I asked.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

By default it returns undefined anyway if we don't add any return statement

I know that but I think a function should return something.

}

export default doInteractionTask;
12 changes: 9 additions & 3 deletions src/pages/NewChatPage.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import PropTypes from 'prop-types';
import React, {useCallback, useEffect, useMemo, useState} from 'react';
import {InteractionManager, View} from 'react-native';
import {View} from 'react-native';
import {withOnyx} from 'react-native-onyx';
import _ from 'underscore';
import KeyboardAvoidingView from '@components/KeyboardAvoidingView';
Expand All @@ -15,6 +15,7 @@ import useThemeStyles from '@hooks/useThemeStyles';
import useWindowDimensions from '@hooks/useWindowDimensions';
import compose from '@libs/compose';
import * as DeviceCapabilities from '@libs/DeviceCapabilities';
import doInteractionTask from '@libs/DoInteractionTask';
import * as OptionsListUtils from '@libs/OptionsListUtils';
import * as ReportUtils from '@libs/ReportUtils';
import variables from '@styles/variables';
Expand Down Expand Up @@ -209,11 +210,16 @@ function NewChatPage({betas, isGroupChat, personalDetails, reports, translate, i
}, [reports, personalDetails, searchTerm]);

useEffect(() => {
const interactionTask = InteractionManager.runAfterInteractions(() => {
const interactionTask = doInteractionTask(() => {
setDidScreenTransitionEnd(true);
});

return interactionTask.cancel;
return () => {
if (!interactionTask) {
return;
}
interactionTask.cancel();
};
}, []);

useEffect(() => {
Expand Down
Loading