Files
react-native/Libraries/LogBox/UI/LogBoxInspectorMeta.js
T
Rick Hanlon a9ffad446a LogBox - Better design for stacks
Summary:
This diff makes minor style improvements and refactors to stack frame displays, primarily:
- Adding brackets around react components
- Uses a monospace font for the code
- Changing section titles to "Components" and "Call stack"
- Refactors the section headers to a single component and reduces the text size of headings
- Removes the query string from unsymbolicated stacks

Changelog: [Internal]

Reviewed By: cpojer

Differential Revision: D18433487

fbshipit-source-id: 7914b5810a4303e9a0d52def92e524b9e72f79ed
2019-11-11 16:12:44 -08:00

71 lines
1.8 KiB
JavaScript

/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*
* @flow strict-local
* @format
*/
'use strict';
import * as React from 'react';
import StyleSheet from '../../StyleSheet/StyleSheet';
import Text from '../../Text/Text';
import View from '../../Components/View/View';
import Platform from '../../Utilities/Platform';
import * as LogBoxStyle from './LogBoxStyle';
import LogBoxInspectorSection from './LogBoxInspectorSection';
type Props = $ReadOnly<{||}>;
function LogBoxInspectorMeta(props: Props): React.Node {
return (
<LogBoxInspectorSection heading="Meta">
<View style={metaStyles.body}>
<View style={metaStyles.bodyItem}>
<Text style={metaStyles.bodyText}>Platform</Text>
<Text style={metaStyles.bodyText}>Engine</Text>
</View>
<View style={metaStyles.bodyItem}>
{/* TODO: Determine engine correctly */}
<Text style={[metaStyles.bodyText, metaStyles.bodyTextRight]}>
{Platform.OS === 'android' ? 'Android' : 'iOS'}
</Text>
<Text style={[metaStyles.bodyText, metaStyles.bodyTextRight]}>
{global.HermesInternal ? 'Hermes' : 'Unknown'}
</Text>
</View>
</View>
</LogBoxInspectorSection>
);
}
const metaStyles = StyleSheet.create({
body: {
paddingLeft: 25,
paddingRight: 25,
paddingBottom: 20,
flexDirection: 'row',
justifyContent: 'space-between',
},
bodyItem: {
flex: 0,
},
bodyText: {
color: LogBoxStyle.getTextColor(0.5),
fontSize: 14,
paddingTop: 3,
paddingBottom: 3,
includeFontPadding: false,
lineHeight: 20,
flex: 0,
flexGrow: 0,
},
bodyTextRight: {
textAlign: 'right',
},
});
export default LogBoxInspectorMeta;