06e333dc52
* MM-10193 for landscape Feature Commit for MM-10193 to the landscape feature with latest pull. This is the initial commit with SafeAreaView in place, but should not be merged into master as this is step one and not suitable for production. Another commit will be following with adjustments to allow SafeAreaView to display correctly for users. * MM-10193 for landscape Feature Commit for MM-10193 to the landscape feature with latest pull. This is the initial commit with SafeAreaView in place, but should not be merged into master as this is step one and not suitable for production. Another commit will be following with adjustments to allow SafeAreaView to display correctly for users. * MM-10193 Extend design elements for iPhoneX SafeAreaViews This is the second portion of the MM-10193 changes for the landscape feature. This item was to extend the design elements for the application into the SafeAreaView so the application looks uniform on the iPhoneX. * MM-10193 Patch for Snapshot tests and eslint * MM-10193 Re-Patch These chanbes mistakenly got reverted from last Patch * MM-10193 Updates for PR Fixed the 4 screens from the text box that were missed. Updated the padding to run from a method. * Revert "MM-10193 Updates for PR" This reverts commit fe8d650ce3ca2828d8c94e4af470649aa2582ec1. * MM-10193 Updates for PR This reverts commit 4966d83d5401720d26ca22a55cf8f92f1657b7e2. Applied Updated Snapshots * MM-10193 Updated Modifier for iphone_x_spacing Updated Modifier for iphone_x_spacing * MM-10193 Updates for Review Review changes for Post Textbox and a few states that were unavailable. * MM-10193 Fix Longpress padding Fixed longpress padding for Channel Info and Edit Post views. * MM-10193 Update isLandscape Updated isLandscape to pull directly from dimensions. Updated padding for Recent Mentions and Flagged Posts. * MM-10193 Updates for review longpost Updated for longpost padding. Fixed issue with notifications not padding right correctly. * MM-10193 Update with Cleanup Reverted Cocoapods back to 1.5.3. Cleaned up spacing in two files. * MM-10193 Merge Conflict Updates Updates to resolve merge conflicts
449 lines
16 KiB
JavaScript
449 lines
16 KiB
JavaScript
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
|
|
// See LICENSE.txt for license information.
|
|
|
|
import React, {PureComponent} from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import {
|
|
Linking,
|
|
ScrollView,
|
|
Text,
|
|
TouchableOpacity,
|
|
View,
|
|
} from 'react-native';
|
|
import DeviceInfo from 'react-native-device-info';
|
|
|
|
import FormattedText from 'app/components/formatted_text';
|
|
import StatusBar from 'app/components/status_bar';
|
|
import {changeOpacity, makeStyleSheetFromTheme, setNavigatorStyles} from 'app/utils/theme';
|
|
import {paddingHorizontal as padding} from 'app/components/safe_area_view/iphone_x_spacing';
|
|
import AppIcon from 'app/components/app_icon';
|
|
import Config from 'assets/config';
|
|
|
|
const MATTERMOST_BUNDLE_IDS = ['com.mattermost.rnbeta', 'com.mattermost.rn'];
|
|
|
|
export default class About extends PureComponent {
|
|
static propTypes = {
|
|
componentId: PropTypes.string,
|
|
config: PropTypes.object.isRequired,
|
|
license: PropTypes.object.isRequired,
|
|
theme: PropTypes.object.isRequired,
|
|
isLandscape: PropTypes.bool.isRequired,
|
|
};
|
|
|
|
componentWillReceiveProps(nextProps) {
|
|
if (this.props.theme !== nextProps.theme) {
|
|
setNavigatorStyles(this.props.componentId, nextProps.theme);
|
|
}
|
|
}
|
|
|
|
handleAboutTeam = () => {
|
|
Linking.openURL(Config.AboutTeamURL);
|
|
};
|
|
|
|
handleAboutEnterprise = () => {
|
|
Linking.openURL(Config.AboutEnterpriseURL);
|
|
};
|
|
|
|
handlePlatformNotice = () => {
|
|
Linking.openURL(Config.PlatformNoticeURL);
|
|
};
|
|
|
|
handleMobileNotice = () => {
|
|
Linking.openURL(Config.MobileNoticeURL);
|
|
};
|
|
|
|
handleTermsOfService = () => {
|
|
Linking.openURL(this.props.config.TermsOfServiceLink);
|
|
};
|
|
|
|
handlePrivacyPolicy = () => {
|
|
Linking.openURL(this.props.config.PrivacyPolicyLink);
|
|
}
|
|
|
|
render() {
|
|
const {theme, config, license, isLandscape} = this.props;
|
|
const style = getStyleSheet(theme);
|
|
|
|
let title = (
|
|
<FormattedText
|
|
id='about.teamEditiont0'
|
|
defaultMessage='Team Edition'
|
|
style={style.title}
|
|
/>
|
|
);
|
|
|
|
let subTitle = (
|
|
<FormattedText
|
|
id='about.teamEditionSt'
|
|
defaultMessage='All your team communication in one place, instantly searchable and accessible anywhere.'
|
|
style={style.subtitle}
|
|
/>
|
|
);
|
|
|
|
let learnMore = (
|
|
<View style={style.learnContainer}>
|
|
<FormattedText
|
|
id='about.teamEditionLearn'
|
|
defaultMessage='Join the Mattermost community at '
|
|
style={style.learn}
|
|
/>
|
|
<TouchableOpacity
|
|
onPress={this.handleAboutTeam}
|
|
>
|
|
<Text style={style.learnLink}>
|
|
{Config.TeamEditionLearnURL}
|
|
</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
);
|
|
|
|
let licensee;
|
|
if (config.BuildEnterpriseReady === 'true') {
|
|
title = (
|
|
<FormattedText
|
|
id='about.teamEditiont1'
|
|
defaultMessage='Enterprise Edition'
|
|
style={style.title}
|
|
/>
|
|
);
|
|
|
|
subTitle = (
|
|
<FormattedText
|
|
id='about.enterpriseEditionSt'
|
|
defaultMessage='Modern communication from behind your firewall.'
|
|
style={style.subtitle}
|
|
/>
|
|
);
|
|
|
|
learnMore = (
|
|
<View style={style.learnContainer}>
|
|
<FormattedText
|
|
id='about.enterpriseEditionLearn'
|
|
defaultMessage='Learn more about Enterprise Edition at '
|
|
style={style.learn}
|
|
/>
|
|
<TouchableOpacity
|
|
onPress={this.handleAboutEnterprise}
|
|
>
|
|
<Text style={style.learnLink}>
|
|
{Config.EELearnURL}
|
|
</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
);
|
|
|
|
if (license.IsLicensed === 'true') {
|
|
title = (
|
|
<FormattedText
|
|
id='about.enterpriseEditione1'
|
|
defaultMessage='Enterprise Edition'
|
|
style={style.title}
|
|
/>
|
|
);
|
|
|
|
licensee = (
|
|
<View style={style.licenseContainer}>
|
|
<FormattedText
|
|
id='mobile.about.licensed'
|
|
defaultMessage='Licensed to: {company}'
|
|
style={style.info}
|
|
values={{
|
|
company: license.Company,
|
|
}}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
let serverVersion;
|
|
if (config.BuildNumber === config.Version) {
|
|
serverVersion = (
|
|
<FormattedText
|
|
id='mobile.about.serverVersionNoBuild'
|
|
defaultMessage='Server Version: {version}'
|
|
style={style.info}
|
|
values={{
|
|
version: config.Version,
|
|
}}
|
|
/>
|
|
);
|
|
} else {
|
|
serverVersion = (
|
|
<FormattedText
|
|
id='mobile.about.serverVersion'
|
|
defaultMessage='Server Version: {version} (Build {number})'
|
|
style={style.info}
|
|
values={{
|
|
version: config.Version,
|
|
number: config.BuildNumber,
|
|
}}
|
|
/>
|
|
);
|
|
}
|
|
|
|
let termsOfService;
|
|
if (config.TermsOfServiceLink) {
|
|
termsOfService = (
|
|
<FormattedText
|
|
id='mobile.tos_link'
|
|
defaultMessage='Terms of Service'
|
|
style={style.noticeLink}
|
|
onPress={this.handleTermsOfService}
|
|
/>
|
|
);
|
|
}
|
|
|
|
let privacyPolicy;
|
|
if (config.PrivacyPolicyLink) {
|
|
privacyPolicy = (
|
|
<FormattedText
|
|
id='mobile.privacy_link'
|
|
defaultMessage='Privacy Policy'
|
|
style={style.noticeLink}
|
|
onPress={this.handlePrivacyPolicy}
|
|
/>
|
|
);
|
|
}
|
|
|
|
let tosPrivacyHyphen;
|
|
if (termsOfService && privacyPolicy) {
|
|
tosPrivacyHyphen = (
|
|
<Text style={[style.footerText, style.hyphenText]}>
|
|
{' - '}
|
|
</Text>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<View style={style.wrapper}>
|
|
<StatusBar/>
|
|
<ScrollView
|
|
style={[style.scrollView, padding(isLandscape)]}
|
|
contentContainerStyle={style.scrollViewContent}
|
|
>
|
|
<View style={style.logoContainer}>
|
|
<AppIcon
|
|
color={theme.centerChannelColor}
|
|
height={120}
|
|
width={120}
|
|
/>
|
|
</View>
|
|
<View style={style.infoContainer}>
|
|
<View style={style.titleContainer}>
|
|
<Text style={style.title}>
|
|
{`${config.SiteName} `}
|
|
</Text>
|
|
{title}
|
|
</View>
|
|
{subTitle}
|
|
<FormattedText
|
|
id='mobile.about.appVersion'
|
|
defaultMessage='App Version: {version} (Build {number})'
|
|
style={style.info}
|
|
values={{
|
|
version: DeviceInfo.getVersion(),
|
|
number: DeviceInfo.getBuildNumber(),
|
|
}}
|
|
/>
|
|
{serverVersion}
|
|
<FormattedText
|
|
id='mobile.about.database'
|
|
defaultMessage='Database: {type}'
|
|
style={style.info}
|
|
values={{
|
|
type: config.SQLDriverName,
|
|
}}
|
|
/>
|
|
{licensee}
|
|
{learnMore}
|
|
{!MATTERMOST_BUNDLE_IDS.includes(DeviceInfo.getBundleId()) &&
|
|
<FormattedText
|
|
id='mobile.about.powered_by'
|
|
defaultMessage='{site} is powered by Mattermost'
|
|
style={style.footerText}
|
|
values={{
|
|
site: this.props.config.SiteName,
|
|
}}
|
|
/>
|
|
}
|
|
<FormattedText
|
|
id='mobile.about.copyright'
|
|
defaultMessage='Copyright 2015-{currentYear} Mattermost, Inc. All rights reserved'
|
|
style={[style.footerText, style.copyrightText]}
|
|
values={{
|
|
currentYear: new Date().getFullYear(),
|
|
}}
|
|
/>
|
|
<View style={style.tosPrivacyContainer}>
|
|
{termsOfService}
|
|
{tosPrivacyHyphen}
|
|
{privacyPolicy}
|
|
</View>
|
|
<View style={style.noticeContainer}>
|
|
<View style={style.footerGroup}>
|
|
<FormattedText
|
|
id='mobile.notice_text'
|
|
defaultMessage='Mattermost is made possible by the open source software used in our {platform} and {mobile}.'
|
|
style={style.footerText}
|
|
values={{
|
|
platform: (
|
|
<FormattedText
|
|
id='mobile.notice_platform_link'
|
|
defaultMessage='server'
|
|
style={style.noticeLink}
|
|
onPress={this.handlePlatformNotice}
|
|
/>
|
|
),
|
|
mobile: (
|
|
<FormattedText
|
|
id='mobile.notice_mobile_link'
|
|
defaultMessage='mobile apps'
|
|
style={[style.noticeLink, {marginLeft: 5}]}
|
|
onPress={this.handleMobileNotice}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
</View>
|
|
</View>
|
|
<View style={style.hashContainer}>
|
|
<View style={style.footerGroup}>
|
|
<FormattedText
|
|
id='about.hash'
|
|
defaultMessage='Build Hash:'
|
|
style={style.footerTitleText}
|
|
/>
|
|
<Text style={style.footerText}>
|
|
{config.BuildHash}
|
|
</Text>
|
|
</View>
|
|
<View style={style.footerGroup}>
|
|
<FormattedText
|
|
id='about.hashee'
|
|
defaultMessage='EE Build Hash:'
|
|
style={style.footerTitleText}
|
|
/>
|
|
<Text style={style.footerText}>
|
|
{config.BuildHashEnterprise}
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
<View style={style.footerGroup}>
|
|
<FormattedText
|
|
id='about.date'
|
|
defaultMessage='Build Date:'
|
|
style={style.footerTitleText}
|
|
/>
|
|
<Text style={style.footerText}>
|
|
{config.BuildDate}
|
|
</Text>
|
|
</View>
|
|
</View>
|
|
</ScrollView>
|
|
</View>
|
|
);
|
|
}
|
|
}
|
|
|
|
const getStyleSheet = makeStyleSheetFromTheme((theme) => {
|
|
return {
|
|
wrapper: {
|
|
flex: 1,
|
|
backgroundColor: theme.centerChannelBg,
|
|
},
|
|
scrollView: {
|
|
flex: 1,
|
|
backgroundColor: changeOpacity(theme.centerChannelColor, 0.06),
|
|
},
|
|
scrollViewContent: {
|
|
paddingBottom: 30,
|
|
},
|
|
logoContainer: {
|
|
alignItems: 'center',
|
|
flex: 1,
|
|
height: 200,
|
|
paddingVertical: 40,
|
|
},
|
|
infoContainer: {
|
|
flex: 1,
|
|
flexDirection: 'column',
|
|
paddingHorizontal: 20,
|
|
},
|
|
titleContainer: {
|
|
flex: 1,
|
|
marginBottom: 20,
|
|
},
|
|
title: {
|
|
fontSize: 22,
|
|
color: theme.centerChannelColor,
|
|
},
|
|
subtitle: {
|
|
color: changeOpacity(theme.centerChannelColor, 0.5),
|
|
fontSize: 19,
|
|
marginBottom: 15,
|
|
},
|
|
learnContainer: {
|
|
flex: 1,
|
|
flexDirection: 'column',
|
|
marginVertical: 20,
|
|
},
|
|
learn: {
|
|
color: theme.centerChannelColor,
|
|
fontSize: 16,
|
|
},
|
|
learnLink: {
|
|
color: theme.linkColor,
|
|
fontSize: 16,
|
|
},
|
|
info: {
|
|
color: theme.centerChannelColor,
|
|
fontSize: 16,
|
|
lineHeight: 19,
|
|
},
|
|
licenseContainer: {
|
|
flex: 1,
|
|
flexDirection: 'row',
|
|
marginTop: 20,
|
|
},
|
|
noticeContainer: {
|
|
flex: 1,
|
|
flexDirection: 'column',
|
|
},
|
|
noticeLink: {
|
|
color: theme.linkColor,
|
|
fontSize: 11,
|
|
lineHeight: 13,
|
|
},
|
|
hashContainer: {
|
|
flex: 1,
|
|
flexDirection: 'column',
|
|
},
|
|
footerGroup: {
|
|
flex: 1,
|
|
},
|
|
footerTitleText: {
|
|
color: changeOpacity(theme.centerChannelColor, 0.5),
|
|
fontSize: 11,
|
|
fontWeight: '600',
|
|
lineHeight: 13,
|
|
},
|
|
footerText: {
|
|
color: changeOpacity(theme.centerChannelColor, 0.5),
|
|
fontSize: 11,
|
|
lineHeight: 13,
|
|
marginBottom: 10,
|
|
},
|
|
copyrightText: {
|
|
marginBottom: 0,
|
|
},
|
|
hyphenText: {
|
|
marginBottom: 0,
|
|
},
|
|
tosPrivacyContainer: {
|
|
flex: 1,
|
|
flexDirection: 'row',
|
|
marginBottom: 10,
|
|
},
|
|
};
|
|
});
|