MM-19733 fix posts getting behing post text box in thread screen (#3480)

* MM-19733 fix posts getting behing post text box in thread screen

* Update app/components/safe_area_view/safe_area_view.ios.js

Co-Authored-By: Miguel Alatzar <migbot@users.noreply.github.com>

* Update app/components/safe_area_view/safe_area_view.ios.js

Co-Authored-By: Miguel Alatzar <migbot@users.noreply.github.com>

* Small refactor

* Fix snapshot test after merge
This commit is contained in:
Elias Nahum 2019-10-30 11:37:26 +01:00 committed by Guillermo Vayá
parent 4c1a60db5b
commit c8ee8fc2dd
4 changed files with 21 additions and 40 deletions

View file

@ -84,17 +84,15 @@ export default class SafeAreaIos extends PureComponent {
getSafeAreaInsets = async (dimensions) => {
this.getStatusBarHeight();
const safeAreaInsetsStored = EphemeralStore.safeAreaInsets[PORTRAIT] !== null && EphemeralStore.safeAreaInsets[LANDSCAPE] !== null;
if ((DeviceTypes.IS_IPHONE_WITH_INSETS || mattermostManaged.hasSafeAreaInsets) && !safeAreaInsetsStored) {
if (DeviceTypes.IS_IPHONE_WITH_INSETS || mattermostManaged.hasSafeAreaInsets) {
const window = dimensions?.window || Dimensions.get('window');
const landscape = window.width > window.length;
const orientation = window.width > window.length ? LANDSCAPE : PORTRAIT;
const {safeAreaInsets} = await SafeArea.getSafeAreaInsetsForRootView();
this.setSafeAreaInsets(safeAreaInsets, landscape);
this.setSafeAreaInsets(safeAreaInsets, orientation);
}
}
setSafeAreaInsets = (safeAreaInsets, landscape) => {
const orientation = landscape ? LANDSCAPE : PORTRAIT;
setSafeAreaInsets = (safeAreaInsets, orientation) => {
if (EphemeralStore.safeAreaInsets[orientation] === null) {
EphemeralStore.safeAreaInsets[orientation] = safeAreaInsets;
}
@ -130,8 +128,8 @@ export default class SafeAreaIos extends PureComponent {
this.getStatusBarHeight();
const {width, height} = Dimensions.get('window');
const landscape = width > height;
this.setSafeAreaInsets(safeAreaInsets, landscape);
const orientation = width > height ? LANDSCAPE : PORTRAIT;
this.setSafeAreaInsets(safeAreaInsets, orientation);
}
}

View file

@ -195,9 +195,9 @@ describe('SafeAreaIos', () => {
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(null);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(null);
const landscape = false;
const orientation = PORTRAIT;
const instance = wrapper.instance();
instance.setSafeAreaInsets(PORTRAIT_INSETS.safeAreaInsets, landscape);
instance.setSafeAreaInsets(PORTRAIT_INSETS.safeAreaInsets, orientation);
expect(wrapper.state().safeAreaInsets).toEqual(PORTRAIT_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(PORTRAIT_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(null);
@ -211,9 +211,9 @@ describe('SafeAreaIos', () => {
EphemeralStore.safeAreaInsets[PORTRAIT] = PORTRAIT_INSETS.safeAreaInsets;
expect(wrapper.state().safeAreaInsets).not.toEqual(PORTRAIT_INSETS.safeAreaInsets);
const landscape = false;
const orientation = PORTRAIT;
const instance = wrapper.instance();
instance.setSafeAreaInsets(IGNORED_INSETS.safeAreaInsets, landscape);
instance.setSafeAreaInsets(IGNORED_INSETS.safeAreaInsets, orientation);
expect(wrapper.state().safeAreaInsets).toEqual(PORTRAIT_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(PORTRAIT_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(null);
@ -228,9 +228,9 @@ describe('SafeAreaIos', () => {
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(null);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(null);
const landscape = true;
const orientation = LANDSCAPE;
const instance = wrapper.instance();
instance.setSafeAreaInsets(LANDSCAPE_INSETS.safeAreaInsets, landscape);
instance.setSafeAreaInsets(LANDSCAPE_INSETS.safeAreaInsets, orientation);
expect(wrapper.state().safeAreaInsets).toEqual(LANDSCAPE_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(LANDSCAPE_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(null);
@ -244,9 +244,9 @@ describe('SafeAreaIos', () => {
EphemeralStore.safeAreaInsets[LANDSCAPE] = LANDSCAPE_INSETS.safeAreaInsets;
expect(wrapper.state().safeAreaInsets).not.toEqual(LANDSCAPE_INSETS.safeAreaInsets);
const landscape = true;
const orientation = LANDSCAPE;
const instance = wrapper.instance();
instance.setSafeAreaInsets(IGNORED_INSETS.safeAreaInsets, landscape);
instance.setSafeAreaInsets(IGNORED_INSETS.safeAreaInsets, orientation);
expect(wrapper.state().safeAreaInsets).toEqual(LANDSCAPE_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(LANDSCAPE_INSETS.safeAreaInsets);
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(null);
@ -302,27 +302,4 @@ describe('SafeAreaIos', () => {
instance.onSafeAreaInsetsForRootViewChange(TEST_INSETS_1);
expect(removeEventListener).toHaveBeenCalledWith('safeAreaInsetsForRootViewDidChange', instance.onSafeAreaInsetsForRootViewChange);
});
test('getSafeAreaInsets should set safe area insets when not already in ephemeral store', async () => {
const wrapper = shallow(
<SafeAreaIos {...baseProps}/>
);
const instance = wrapper.instance();
const setSafeAreaInsets = jest.spyOn(instance, 'setSafeAreaInsets');
expect(EphemeralStore.safeAreaInsets[PORTRAIT]).toEqual(null);
expect(EphemeralStore.safeAreaInsets[LANDSCAPE]).toEqual(null);
await instance.getSafeAreaInsets();
expect(setSafeAreaInsets).toHaveBeenCalled();
setSafeAreaInsets.mockClear();
EphemeralStore.safeAreaInsets[PORTRAIT] = TEST_INSETS_1.safeAreaInsets; /* eslint-disable-line require-atomic-updates */
await instance.getSafeAreaInsets();
expect(setSafeAreaInsets).toHaveBeenCalled();
setSafeAreaInsets.mockClear();
EphemeralStore.safeAreaInsets[LANDSCAPE] = TEST_INSETS_1.safeAreaInsets; /* eslint-disable-line require-atomic-updates */
await instance.getSafeAreaInsets();
expect(setSafeAreaInsets).not.toHaveBeenCalled();
});
});

View file

@ -4,6 +4,7 @@ exports[`thread should match snapshot, has root post 1`] = `
<React.Fragment>
<Connect(SafeAreaIos)
excludeHeader={true}
forceInsets={true}
>
<View
style={
@ -74,6 +75,7 @@ exports[`thread should match snapshot, no root post, loading 1`] = `
<React.Fragment>
<Connect(SafeAreaIos)
excludeHeader={true}
forceInsets={true}
>
<View
style={
@ -143,6 +145,7 @@ exports[`thread should match snapshot, render footer 3`] = `
<React.Fragment>
<Connect(SafeAreaIos)
excludeHeader={true}
forceInsets={true}
>
<View
style={

View file

@ -92,7 +92,10 @@ export default class ThreadIOS extends ThreadBase {
const style = getStyleSheet(theme);
return (
<React.Fragment>
<SafeAreaView excludeHeader={true}>
<SafeAreaView
excludeHeader={true}
forceInsets={true}
>
<View style={style.separator}/>
<StatusBar/>
{content}