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
Этот коммит содержится в:
коммит произвёл
GitHub
родитель
946302d9a2
Коммит
9c2c941449
@@ -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'
|
||||
|
||||
104
webapp/components/admin_console/native_app_link_settings.jsx
Обычный файл
104
webapp/components/admin_console/native_app_link_settings.jsx
Обычный файл
@@ -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>
|
||||
);
|
||||
|
||||
Ссылка в новой задаче
Block a user