diff --git a/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js b/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js index 28e70e6f6..fc7042fed 100644 --- a/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js +++ b/react/features/invite/components/add-people-dialog/native/AddPeopleDialog.js @@ -67,6 +67,11 @@ type Props = AbstractProps & { type State = AbstractState & { + /** + * Boolean to show if an extra padding needs to be added to the bottom bar. + */ + bottomPadding: boolean, + /** * State variable to keep track of the search field value. */ @@ -94,6 +99,7 @@ class AddPeopleDialog extends AbstractAddPeopleDialog { defaultState = { addToCallError: false, addToCallInProgress: false, + bottomPadding: false, fieldValue: '', inviteItems: [], searchInprogress: false, @@ -194,9 +200,11 @@ class AddPeopleDialog extends AbstractAddPeopleDialog { { renderItem = { this._renderItem } /> - + { this._renderShareMeetingButton() } @@ -317,6 +329,22 @@ class AddPeopleDialog extends AbstractAddPeopleDialog { return false; } + _onFocused: boolean => Function; + + /** + * Constructs a callback to be used to update the padding of the field if necessary. + * + * @param {boolean} focused - True of the field is focused. + * @returns {Function} + */ + _onFocused(focused) { + return () => { + Platform.OS === 'android' && this.setState({ + bottomPadding: focused + }); + }; + } + _onInvite: () => void /** diff --git a/react/features/invite/components/add-people-dialog/native/styles.js b/react/features/invite/components/add-people-dialog/native/styles.js index c255fecb6..a553ea469 100644 --- a/react/features/invite/components/add-people-dialog/native/styles.js +++ b/react/features/invite/components/add-people-dialog/native/styles.js @@ -58,6 +58,13 @@ export default { justifyContent: 'flex-start' }, + /** + * A special padding to avoid issues on some devices (such as Android devices with custom suggestions bar). + */ + extraBarPadding: { + paddingBottom: 30 + }, + invitedList: { padding: 3 },