Commit c10bc851 authored by Christopher Speller's avatar Christopher Speller Committed by GitHub

Updating client dependencies. Switching to yarn. (#6433)

* Updating client dependancies. Switching to using yarn.

* Updating React

* Moving pure components to using function syntax (performance gains with newer react version)

* Updating client dependancies.

* Ignore .yarninstall

* Enabling pre-lockfile because it's the entire point of using yarn.

* Removing old webpack config

* Moving to new prop-types

* Fixing ESLint Errors

* Updating jest snapshots.

* Cleaning up package.json
parent fb7fbe4a
......@@ -2,37 +2,37 @@
BUILD_SERVER_DIR = ..
check-style: .npminstall
check-style: .yarninstall
@echo Checking for style guide compliance
npm run check
yarn run check
test: .npminstall
test: .yarninstall
cd $(BUILD_SERVER_DIR) && $(MAKE) internal-test-web-client
.npminstall: package.json
@echo Getting dependencies using npm
.yarninstall: package.json
@echo Getting dependencies using yarn
npm install
yarn install --pure-lockfile
touch $@
build: .npminstall
build: .yarninstall
@echo Building mattermost Webapp
rm -rf dist
npm run build
yarn run build
run: .npminstall
run: .yarninstall
@echo Running mattermost Webapp for development
npm run run &
yarn run run &
run-fullmap: .npminstall
run-fullmap: .yarninstall
@echo FULL SOURCE MAP Running mattermost Webapp for development FULL SOURCE MAP
npm run run-fullmap &
yarn run run-fullmap &
stop:
@echo Stopping changes watching
......@@ -51,4 +51,4 @@ clean:
rm -rf dist
rm -rf node_modules
rm -f .npminstall
rm -f .yarninstall
......@@ -5,6 +5,8 @@ import {Modal} from 'react-bootstrap';
import {FormattedMessage} from 'react-intl';
import PropTypes from 'prop-types';
import React from 'react';
import Constants from 'utils/constants.jsx';
......@@ -198,6 +200,6 @@ AboutBuildModal.defaultProps = {
};
AboutBuildModal.propTypes = {
show: React.PropTypes.bool.isRequired,
onModalDismissed: React.PropTypes.func.isRequired
show: PropTypes.bool.isRequired,
onModalDismissed: PropTypes.func.isRequired
};
......@@ -9,6 +9,7 @@ import UserStore from 'stores/user_store.jsx';
import * as Utils from 'utils/utils.jsx';
import $ from 'jquery';
import PropTypes from 'prop-types';
import React from 'react';
import {Modal} from 'react-bootstrap';
......@@ -16,9 +17,9 @@ import {FormattedMessage} from 'react-intl';
export default class AccessHistoryModal extends React.Component {
static propTypes = {
onHide: React.PropTypes.func.isRequired,
actions: React.PropTypes.shape({
getUserAudits: React.PropTypes.func.isRequired
onHide: PropTypes.func.isRequired,
actions: PropTypes.shape({
getUserAudits: PropTypes.func.isRequired
}).isRequired
}
......
......@@ -8,16 +8,17 @@ import UserStore from 'stores/user_store.jsx';
import * as Utils from 'utils/utils.jsx';
import $ from 'jquery';
import PropTypes from 'prop-types';
import React from 'react';
import {Modal} from 'react-bootstrap';
import {FormattedMessage, FormattedTime, FormattedDate} from 'react-intl';
export default class ActivityLogModal extends React.Component {
static propTypes = {
onHide: React.PropTypes.func.isRequired,
actions: React.PropTypes.shape({
getSessions: React.PropTypes.func.isRequired,
revokeSession: React.PropTypes.func.isRequired
onHide: PropTypes.func.isRequired,
actions: PropTypes.shape({
getSessions: PropTypes.func.isRequired,
revokeSession: PropTypes.func.isRequired
}).isRequired
}
......
......@@ -14,6 +14,8 @@ import Constants from 'utils/constants.jsx';
import {displayUsernameForUser} from 'utils/utils.jsx';
import Client from 'client/web_client.jsx';
import PropTypes from 'prop-types';
import React from 'react';
import {Modal} from 'react-bootstrap';
import {FormattedMessage} from 'react-intl';
......@@ -27,9 +29,9 @@ const MAX_SELECTABLE_VALUES = 20;
export default class AddUsersToTeam extends React.Component {
static propTypes = {
onModalDismissed: React.PropTypes.func,
actions: React.PropTypes.shape({
getProfilesNotInTeam: React.PropTypes.func.isRequired
onModalDismissed: PropTypes.func,
actions: PropTypes.shape({
getProfilesNotInTeam: PropTypes.func.isRequired
}).isRequired
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -13,7 +15,7 @@ import AdminSidebar from './admin_sidebar.jsx';
export default class AdminConsole extends React.Component {
static get propTypes() {
return {
children: React.PropTypes.node.isRequired
children: PropTypes.node.isRequired
};
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -13,7 +15,7 @@ import {saveConfig} from 'actions/admin_actions.jsx';
export default class AdminSettings extends React.Component {
static get propTypes() {
return {
config: React.PropTypes.object
config: PropTypes.object
};
}
......
......@@ -2,6 +2,7 @@
// See License.txt for license information.
import $ from 'jquery';
import PropTypes from 'prop-types';
import React from 'react';
import {FormattedMessage} from 'react-intl';
......@@ -14,7 +15,7 @@ import AdminSidebarSection from './admin_sidebar_section.jsx';
export default class AdminSidebar extends React.Component {
static get contextTypes() {
return {
router: React.PropTypes.object.isRequired
router: PropTypes.object.isRequired
};
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -8,13 +10,13 @@ import {Link} from 'react-router/es6';
export default class AdminSidebarCategory extends React.Component {
static get propTypes() {
return {
name: React.PropTypes.string,
title: React.PropTypes.node.isRequired,
icon: React.PropTypes.string.isRequired,
sectionClass: React.PropTypes.string,
parentLink: React.PropTypes.string,
children: React.PropTypes.node,
action: React.PropTypes.node
name: PropTypes.string,
title: PropTypes.node.isRequired,
icon: PropTypes.string.isRequired,
sectionClass: PropTypes.string,
parentLink: PropTypes.string,
children: PropTypes.node,
action: PropTypes.node
};
}
......@@ -26,7 +28,7 @@ export default class AdminSidebarCategory extends React.Component {
static get contextTypes() {
return {
router: React.PropTypes.object.isRequired
router: PropTypes.object.isRequired
};
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -9,14 +11,14 @@ import * as Utils from 'utils/utils.jsx';
export default class AdminSidebarSection extends React.Component {
static get propTypes() {
return {
name: React.PropTypes.string.isRequired,
title: React.PropTypes.node.isRequired,
type: React.PropTypes.string,
parentLink: React.PropTypes.string,
subsection: React.PropTypes.bool,
children: React.PropTypes.arrayOf(React.PropTypes.element),
action: React.PropTypes.node,
onlyActiveOnIndex: React.PropTypes.bool
name: PropTypes.string.isRequired,
title: PropTypes.node.isRequired,
type: PropTypes.string,
parentLink: PropTypes.string,
subsection: PropTypes.bool,
children: PropTypes.arrayOf(PropTypes.element),
action: PropTypes.node,
onlyActiveOnIndex: PropTypes.bool
};
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import React from 'react';
import {FormattedMessage} from 'react-intl';
export default class Banner extends React.Component {
render() {
let title = (
<FormattedMessage
id='admin.banner.heading'
defaultMessage='Note:'
/>
);
export default function Banner(props) {
let title = (
<FormattedMessage
id='admin.banner.heading'
defaultMessage='Note:'
/>
);
if (this.props.title) {
title = this.props.title;
}
if (props.title) {
title = props.title;
}
return (
<div className='banner'>
<div className='banner__content'>
<h4 className='banner__heading'>
{title}
</h4>
<p>
{this.props.description}
</p>
</div>
return (
<div className='banner'>
<div className='banner__content'>
<h4 className='banner__heading'>
{title}
</h4>
<p>
{props.description}
</p>
</div>
);
}
</div>
);
}
Banner.defaultProps = {
};
Banner.propTypes = {
title: React.PropTypes.node,
description: React.PropTypes.node.isRequired
title: PropTypes.node,
description: PropTypes.node.isRequired
};
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -85,13 +87,13 @@ BooleanSetting.defaultProps = {
};
BooleanSetting.propTypes = {
id: React.PropTypes.string.isRequired,
label: React.PropTypes.node.isRequired,
value: React.PropTypes.bool.isRequired,
onChange: React.PropTypes.func.isRequired,
trueText: React.PropTypes.node,
falseText: React.PropTypes.node,
disabled: React.PropTypes.bool.isRequired,
disabledText: React.PropTypes.node,
helpText: React.PropTypes.node.isRequired
id: PropTypes.string.isRequired,
label: PropTypes.node.isRequired,
value: PropTypes.bool.isRequired,
onChange: PropTypes.func.isRequired,
trueText: PropTypes.node,
falseText: PropTypes.node,
disabled: PropTypes.bool.isRequired,
disabledText: PropTypes.node,
helpText: PropTypes.node.isRequired
};
......@@ -2,6 +2,7 @@
// See License.txt for license information.
import $ from 'jquery';
import PropTypes from 'prop-types';
import React from 'react';
import ReactDOM from 'react-dom';
......@@ -15,7 +16,7 @@ import {FormattedHTMLMessage, FormattedMessage} from 'react-intl';
export default class BrandImageSetting extends React.Component {
static get propTypes() {
return {
disabled: React.PropTypes.bool.isRequired
disabled: PropTypes.bool.isRequired
};
}
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -11,8 +13,8 @@ import statusRed from 'images/status_red.png';
export default class ClusterTable extends React.Component {
static propTypes = {
clusterInfos: React.PropTypes.array.isRequired,
reload: React.PropTypes.func.isRequired
clusterInfos: PropTypes.array.isRequired,
reload: PropTypes.func.isRequired
}
render() {
......
import PropTypes from 'prop-types';
// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
......@@ -114,101 +116,95 @@ const CONNECTION_SECURITY_HELP_TEXT_WEBSERVER = (
</table>
);
export class ConnectionSecurityDropdownSettingEmail extends React.Component { //eslint-disable-line react/no-multi-comp
render() {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'PLAIN', text: Utils.localizeMessage('admin.connectionSecurityPlain')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')},
{value: 'STARTTLS', text: Utils.localizeMessage('admin.connectionSecurityStart')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={this.props.value}
onChange={this.props.onChange}
disabled={this.props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_EMAIL}
/>
);
}
export function ConnectionSecurityDropdownSettingEmail(props) {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'PLAIN', text: Utils.localizeMessage('admin.connectionSecurityPlain')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')},
{value: 'STARTTLS', text: Utils.localizeMessage('admin.connectionSecurityStart')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={props.value}
onChange={props.onChange}
disabled={props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_EMAIL}
/>
);
}
ConnectionSecurityDropdownSettingEmail.defaultProps = {
};
ConnectionSecurityDropdownSettingEmail.propTypes = {
value: React.PropTypes.string.isRequired,
onChange: React.PropTypes.func.isRequired,
disabled: React.PropTypes.bool.isRequired
value: PropTypes.string.isRequired,
onChange: PropTypes.func.isRequired,
disabled: PropTypes.bool.isRequired
};
export class ConnectionSecurityDropdownSettingLdap extends React.Component { //eslint-disable-line react/no-multi-comp
render() {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')},
{value: 'STARTTLS', text: Utils.localizeMessage('admin.connectionSecurityStart')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={this.props.value}
onChange={this.props.onChange}
disabled={this.props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_LDAP}
/>
);
}
export function ConnectionSecurityDropdownSettingLdap(props) {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')},
{value: 'STARTTLS', text: Utils.localizeMessage('admin.connectionSecurityStart')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={props.value}
onChange={props.onChange}
disabled={props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_LDAP}
/>
);
}
ConnectionSecurityDropdownSettingLdap.defaultProps = {
};
ConnectionSecurityDropdownSettingLdap.propTypes = {
value: React.PropTypes.string.isRequired,
onChange: React.PropTypes.func.isRequired,
disabled: React.PropTypes.bool.isRequired
value: PropTypes.string.isRequired,
onChange: PropTypes.func.isRequired,
disabled: PropTypes.bool.isRequired
};
export class ConnectionSecurityDropdownSettingWebserver extends React.Component { //eslint-disable-line react/no-multi-comp
render() {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={this.props.value}
onChange={this.props.onChange}
disabled={this.props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_WEBSERVER}
/>
);
}
export function ConnectionSecurityDropdownSettingWebserver(props) {
return (
<DropdownSetting
id='connectionSecurity'
values={[
{value: '', text: Utils.localizeMessage('admin.connectionSecurityNone', 'None')},
{value: 'TLS', text: Utils.localizeMessage('admin.connectionSecurityTls', 'TLS (Recommended)')}
]}
label={
<FormattedMessage
id='admin.connectionSecurityTitle'
defaultMessage='Connection Security:'
/>
}
value={props.value}
onChange={props.onChange}
disabled={props.disabled}
helpText={CONNECTION_SECURITY_HELP_TEXT_WEBSERVER}
/>
);
}
ConnectionSecurityDropdownSettingWebserver.defaultProps = {
};
ConnectionSecurityDropdownSettingWebserver.propTypes = {
value: React.PropTypes.string.isRequired,
onChange: React.PropTypes.func.isRequired,