PLT-1866/PLT-3509 Added links to download the native apps (#3651)

* PLT-1866 Added configurable links for native app downloads

* PLT-1866 Added native app download link to main menu

* PLT-3509 Added native app link to tutorial

* PLT-3509 Added native app link to welcome email

* PLT-3509 Made link to apps in welcome email conditional on being set
Этот коммит содержится в:
Harrison Healey
2016-07-22 10:53:57 -04:00
коммит произвёл GitHub
родитель 946302d9a2
Коммит 9c2c941449
16 изменённых файлов: 274 добавлений и 4 удалений

Просмотреть файл

@@ -581,6 +581,16 @@ export default class AdminSidebar extends React.Component {
/>
}
/>
<AdminSidebarSection
name='native_app_links'
title={
<FormattedMessage
id='admin.sidebar.nativeAppLinks'
defaultMessage='Native App Links'
/>
}
/>
</AdminSidebarSection>
<AdminSidebarSection
name='advanced'

Просмотреть файл

@@ -0,0 +1,104 @@
// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import React from 'react';
import AdminSettings from './admin_settings.jsx';
import {FormattedMessage} from 'react-intl';
import SettingsGroup from './settings_group.jsx';
import TextSetting from './text_setting.jsx';
export default class NativeAppLinkSettings extends AdminSettings {
constructor(props) {
super(props);
this.getConfigFromState = this.getConfigFromState.bind(this);
this.renderSettings = this.renderSettings.bind(this);
}
getConfigFromState(config) {
config.NativeAppSettings.AppDownloadLink = this.state.appDownloadLink;
config.NativeAppSettings.AndroidAppDownloadLink = this.state.androidAppDownloadLink;
config.NativeAppSettings.IosAppDownloadLink = this.state.iosAppDownloadLink;
return config;
}
getStateFromConfig(config) {
return {
appDownloadLink: config.NativeAppSettings.AppDownloadLink,
androidAppDownloadLink: config.NativeAppSettings.AndroidAppDownloadLink,
iosAppDownloadLink: config.NativeAppSettings.IosAppDownloadLink
};
}
renderTitle() {
return (
<h3>
<FormattedMessage
id='admin.customization.nativeAppLinks'
defaultMessage='Native App Links'
/>
</h3>
);
}
renderSettings() {
return (
<SettingsGroup>
<TextSetting
id='appDownloadLink'
label={
<FormattedMessage
id='admin.customization.appDownloadLinkTitle'
defaultMessage='Mattermost Apps Download Page Link:'
/>
}
helpText={
<FormattedMessage
id='admin.customization.appDownloadLinkDesc'
defaultMessage='Add a link to a download page for the Mattermost apps. When a link is present, an option to "Download Mattermost Apps" will be added in the Main Menu so users can find the download page. Leave this field blank to hide the option from the Main Menu.'
/>
}
value={this.state.appDownloadLink}
onChange={this.handleChange}
/>
<TextSetting
id='androidAppDownloadLink'
label={
<FormattedMessage
id='admin.customization.androidAppDownloadLinkTitle'
defaultMessage='Android App Download Link:'
/>
}
helpText={
<FormattedMessage
id='admin.customization.androidAppDownloadLinkDesc'
defaultMessage='Add a link to download the Android app. Users who access the site on a mobile web browser will be prompted with a page giving them the option to download the app. Leave this field blank to prevent the page from appearing.'
/>
}
value={this.state.androidAppDownloadLink}
onChange={this.handleChange}
/>
<TextSetting
id='iosAppDownloadLink'
label={
<FormattedMessage
id='admin.customization.iosAppDownloadLinkTitle'
defaultMessage='iOS App Download Link:'
/>
}
helpText={
<FormattedMessage
id='admin.customization.iosAppDownloadLinkDesc'
defaultMessage='Add a link to download the iOS app. Users who access the site on a mobile web browser will be prompted with a page giving them the option to download the app. Leave this field blank to prevent the page from appearing.'
/>
}
value={this.state.iosAppDownloadLink}
onChange={this.handleChange}
/>
</SettingsGroup>
);
}
}

Просмотреть файл

@@ -332,6 +332,26 @@ export default class NavbarDropdown extends React.Component {
);
}
let nativeAppDivider = null;
let nativeAppLink = null;
if (global.window.mm_config.AppDownloadLink) {
nativeAppDivider = <li className='divider'/>;
nativeAppLink = (
<li>
<Link
target='_blank'
rel='noopener noreferrer'
to={global.window.mm_config.AppDownloadLink}
>
<FormattedMessage
id='navbar_dropdown.nativeApps'
defaultMessage='Download Native Apps'
/>
</Link>
</li>
);
}
return (
<ul className='nav navbar-nav navbar-right'>
<li
@@ -403,6 +423,8 @@ export default class NavbarDropdown extends React.Component {
/>
</a>
</li>
{nativeAppDivider}
{nativeAppLink}
<UserSettingsModal
show={this.state.showUserSettingsModal}
onModalDismissed={() => this.setState({showUserSettingsModal: false})}

Просмотреть файл

@@ -295,6 +295,25 @@ export default class SidebarRightMenu extends React.Component {
this.openRightSidebar();
}
let nativeAppLink = null;
if (global.window.mm_config.AppDownloadLink && !Utils.isMobileApp()) {
nativeAppLink = (
<li>
<Link
target='_blank'
rel='noopener noreferrer'
to={global.window.mm_config.AppDownloadLink}
>
<i className='icon fa fa-mobile'></i>
<FormattedMessage
id='sidebar_right_menu.nativeApps'
defaultMessage='Download Native Apps'
/>
</Link>
</li>
);
}
return (
<div
className='sidebar--menu'
@@ -378,6 +397,7 @@ export default class SidebarRightMenu extends React.Component {
/>
</a>
</li>
{nativeAppLink}
</ul>
</div>
<UserSettingsModal

Просмотреть файл

@@ -7,12 +7,12 @@ import PreferenceStore from 'stores/preference_store.jsx';
import * as AsyncClient from 'utils/async_client.jsx';
import * as GlobalActions from 'actions/global_actions.jsx';
import Constants from 'utils/constants.jsx';
import {Constants, Preferences} from 'utils/constants.jsx';
import {FormattedMessage, FormattedHTMLMessage} from 'react-intl';
import {browserHistory} from 'react-router/es6';
const Preferences = Constants.Preferences;
import AppIcons from 'images/appIcons.png';
const NUM_SCREENS = 3;
@@ -91,6 +91,46 @@ export default class TutorialIntroScreens extends React.Component {
createScreenTwo() {
const circles = this.createCircles();
let appDownloadLink = null;
let appDownloadImage = null;
if (global.window.mm_config.AppDownloadLink) {
// not using a FormattedHTMLMessage here since mm_config.AppDownloadLink is configurable and could be used
// to inject HTML if we're not careful
appDownloadLink = (
<FormattedMessage
id='tutorial_intro.mobileApps'
defaultMessage='Install the apps for {link} for easy access and notifications on the go.'
values={{
link: (
<a
href={global.window.mm_config.AppDownloadLink}
target='_blank'
rel='noopener noreferrer'
>
<FormattedMessage
id='tutorial_intro.mobileAppsLinkText'
defaultMessage='PC, Mac, iOS and Android'
/>
</a>
)
}}
/>
);
appDownloadImage = (
<a
href={global.window.mm_config.AppDownloadLink}
target='_blank'
rel='noopener noreferrer'
>
<img
className='tutorial__app-icons'
src={AppIcons}
/>
</a>
);
}
return (
<div>
<FormattedHTMLMessage
@@ -99,6 +139,8 @@ export default class TutorialIntroScreens extends React.Component {
<p>Communication happens in public discussion channels, private groups and direct messages.</p>
<p>Everything is archived and searchable from any web-enabled desktop, laptop or phone.</p>'
/>
{appDownloadLink}
{appDownloadImage}
{circles}
</div>
);