From 67fa7aeb53bb6e67428c5c96c88aab7f3aff9dab Mon Sep 17 00:00:00 2001 From: Amit Uttam Date: Wed, 6 May 2020 22:19:31 -0300 Subject: [PATCH] [MM-24061] Bring back channel sidebar hamburger icon for tablets (#4244) * MM-24061 Bring back channel sidebar hamburger icon for tablets * Remove channel sidebar icon for iPads iPads run with a "persistent" sidebar already. * Better conditional logic from PR review + tests * Test tidying from PR review --- .../channel_nav_bar/channel_nav_bar.js | 15 ++-- .../channel_nav_bar/channel_nav_bar.test.js | 78 ++++++++++++++++++- 2 files changed, 86 insertions(+), 7 deletions(-) diff --git a/app/screens/channel/channel_nav_bar/channel_nav_bar.js b/app/screens/channel/channel_nav_bar/channel_nav_bar.js index 0e3da81cc..3885a5300 100644 --- a/app/screens/channel/channel_nav_bar/channel_nav_bar.js +++ b/app/screens/channel/channel_nav_bar/channel_nav_bar.js @@ -70,6 +70,14 @@ export default class ChannelNavBar extends PureComponent { } }; + drawerButtonVisible = () => { + if (Platform.OS === 'android') { + return true; + } + + return (!DeviceTypes.IS_TABLET || this.state.isSplitView || !this.state.permanentSidebar); + }; + render() { const {isLandscape, onPress, theme} = this.props; const {openMainSidebar, openSettingsSidebar} = this.props; @@ -99,16 +107,11 @@ export default class ChannelNavBar extends PureComponent { break; } - let drawerButtonVisible = false; - if (!DeviceTypes.IS_TABLET || this.state.isSplitView || !this.state.permanentSidebar) { - drawerButtonVisible = true; - } - return ( ({ + isRunningInSplitView: jest.fn().mockResolvedValue(false), +})); describe('ChannelNavBar', () => { const baseProps = { @@ -49,4 +53,76 @@ describe('ChannelNavBar', () => { expect(wrapper.state('permanentSidebar')).toBeDefined(); }); + + test('drawerButtonVisible appears for android tablets', () => { + const wrapper = shallow( + , + ); + + DeviceTypes.IS_TABLET = true; + Platform.OS = 'android'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(true); + }); + + test('drawerButtonVisible appears for android phones', () => { + const wrapper = shallow( + , + ); + + DeviceTypes.IS_TABLET = false; + Platform.OS = 'android'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(true); + }); + + test('drawerButtonVisible appears for iOS phones', () => { + const wrapper = shallow( + , + ); + + DeviceTypes.IS_TABLET = false; + Platform.OS = 'ios'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(true); + }); + + test('drawerButtonVisible appears for iOS tablets with PermanentSidebar at default false, and not in splitview', () => { + const wrapper = shallow( + , + ); + + wrapper.setState({permanentSidebar: false, isSplitView: false}); + + DeviceTypes.IS_TABLET = true; + Platform.OS = 'ios'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(true); + }); + + test('drawerButtonVisible does not appear for iOS tablets with permanentSidebar enabled', () => { + const wrapper = shallow( + , + ); + + wrapper.setState({permanentSidebar: true}); + + DeviceTypes.IS_TABLET = true; + Platform.OS = 'ios'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(false); + }); + + test('drawerButtonVisible appears for iOS tablets with splitview enabled', () => { + const wrapper = shallow( + , + ); + + wrapper.setState({isSplitView: true}); + + DeviceTypes.IS_TABLET = true; + Platform.OS = 'ios'; + + expect(wrapper.instance().drawerButtonVisible()).toBe(true); + }); });