Merge pull request #245 from thornbill/is-compact-check

Move compact height check to util
This commit is contained in:
Anthony Lavado 2021-04-03 21:39:21 -04:00 committed by GitHub
commit 225e99b81f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 26 additions and 7 deletions

View File

@ -3,11 +3,12 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
import PropTypes from 'prop-types';
import React, { useContext } from 'react';
import { StyleSheet, useWindowDimensions, View } from 'react-native';
import { Button, Icon, Text, ThemeContext } from 'react-native-elements';
import PropTypes from 'prop-types';
import { isCompact } from '../utils/Device';
import { getIconName } from '../utils/Icons';
const ErrorView = ({
@ -20,8 +21,7 @@ const ErrorView = ({
onPress
}) => {
const window = useWindowDimensions();
const isCompact = window.height < 480;
const marginVertical = isCompact ? 20 : 40;
const marginVertical = isCompact(window) ? 20 : 40;
const { theme } = useContext(ThemeContext);
return (
@ -33,7 +33,7 @@ const ErrorView = ({
<Icon
name={icon.name}
type={icon.type}
size={isCompact ? 60 : 100}
size={isCompact(window) ? 60 : 100}
/>
<Text h2 style={{ ...styles.heading, marginVertical }}>{heading}</Text>
<Text style={{ ...styles.message, marginBottom: marginVertical }}>{message}</Text>

View File

@ -3,13 +3,13 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/.
*/
import * as Device from 'expo-device';
import Constants from 'expo-constants';
import * as Device from 'expo-device';
import { Platform } from 'react-native';
import iOSProfile from './profiles/ios';
import iOS10Profile from './profiles/ios10';
import iOS12Profile from './profiles/ios12';
import iOSProfile from './profiles/ios';
export function getAppName() {
return `Jellyfin Mobile (${Device.osName})`;
@ -44,6 +44,10 @@ export function getDeviceProfile() {
return {};
}
export function isCompact({ height = 500 } = {}) {
return height < 480;
}
// Does the platform support system level themes: https://docs.expo.io/versions/latest/sdk/appearance/
export function isSystemThemeSupported() {
return (Platform.OS === 'ios' && parseInt(Platform.Version, 10) > 12) ||

View File

@ -6,7 +6,7 @@
import Constants from 'expo-constants';
import { Platform } from 'react-native';
import { getAppName, getDeviceProfile, getSafeDeviceName, isSystemThemeSupported } from '../Device';
import { getAppName, getDeviceProfile, getSafeDeviceName, isCompact, isSystemThemeSupported } from '../Device';
import iOS10Profile from '../profiles/ios10';
import iOS12Profile from '../profiles/ios12';
import iOSProfile from '../profiles/ios';
@ -72,6 +72,21 @@ describe('Device', () => {
});
});
describe('isCompact()', () => {
it('should return false by default', () => {
expect(isCompact()).toBe(false);
});
it('should return false for heights >= 480', () => {
expect(isCompact({ height: 480 })).toBe(false);
expect(isCompact({ height: 481 })).toBe(false);
});
it('should return true for heights < 480', () => {
expect(isCompact({ height: 479 })).toBe(true);
});
});
describe('isSystemThemeSupported()', () => {
it('should return true for iOS 13+', () => {
Platform.Version = '13';