Skip to content

[CP Staging] Only apply interaction for desktop #34449

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.

Sign up for GitHub

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

Merged
mountiny merged 3 commits into from
Jan 15, 2024
Merged

[CP Staging] Only apply interaction for desktop #34449

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6ab6be8
only apply interaction for desktop
dukenv0307 Jan 12, 2024
3172464
add comment
dukenv0307 Jan 12, 2024
7ed7b59
Merge branch 'main' into fix/34371
dukenv0307 Jan 12, 2024
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
View file
Open in desktop
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
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
function doInteractionTask(callback: () => void) {
callback();
return null;

@c3024 c3024 Jan 15, 2024

Copy link
Copy Markdown
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?

@dukenv0307 dukenv0307 Jan 15, 2024 •
edited
Loading

Copy link
Copy Markdown
Contributor Author

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.

@c3024 c3024 Jan 15, 2024

Copy link
Copy Markdown
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.

@dukenv0307 dukenv0307 Jan 15, 2024

Copy link
Copy Markdown
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
View file
Open in desktop
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