diff options
Diffstat (limited to 'webapp')
-rw-r--r-- | webapp/components/integrations/components/commands_container.jsx | 78 | ||||
-rw-r--r-- | webapp/components/integrations/components/installed_oauth_apps/index.js | 29 | ||||
-rw-r--r-- | webapp/components/integrations/components/installed_oauth_apps/installed_oauth_apps.jsx (renamed from webapp/components/integrations/components/installed_oauth_apps.jsx) | 77 | ||||
-rw-r--r-- | webapp/routes/route_integrations.jsx | 2 | ||||
-rw-r--r-- | webapp/tests/components/integrations/__snapshots__/installed_oauth_apps.test.jsx.snap | 98 | ||||
-rw-r--r-- | webapp/tests/components/integrations/installed_oauth_apps.test.jsx | 53 |
6 files changed, 222 insertions, 115 deletions
diff --git a/webapp/components/integrations/components/commands_container.jsx b/webapp/components/integrations/components/commands_container.jsx deleted file mode 100644 index 338d95fa0..000000000 --- a/webapp/components/integrations/components/commands_container.jsx +++ /dev/null @@ -1,78 +0,0 @@ -// Copyright (c) 2016-present Mattermost, Inc. All Rights Reserved. -// See License.txt for license information. - -import IntegrationStore from 'stores/integration_store.jsx'; -import UserStore from 'stores/user_store.jsx'; - -import {loadTeamCommands} from 'actions/integration_actions.jsx'; - -import PropTypes from 'prop-types'; - -import React from 'react'; - -export default class CommandsContainer extends React.Component { - static get propTypes() { - return { - team: PropTypes.object, - user: PropTypes.object, - children: PropTypes.node.isRequired, - isAdmin: PropTypes.bool - }; - } - - constructor(props) { - super(props); - - this.handleIntegrationChange = this.handleIntegrationChange.bind(this); - this.handleUserChange = this.handleUserChange.bind(this); - - const teamId = this.props.team ? this.props.team.id : ''; - - this.state = { - commands: IntegrationStore.getCommands(teamId) || [], - loading: !IntegrationStore.hasReceivedCommands(teamId), - users: UserStore.getProfiles() - }; - } - - componentDidMount() { - IntegrationStore.addChangeListener(this.handleIntegrationChange); - UserStore.addChangeListener(this.handleUserChange); - - if (window.mm_config.EnableCommands === 'true') { - loadTeamCommands((() => this.setState({loading: false}))); - } - } - - componentWillUnmount() { - IntegrationStore.removeChangeListener(this.handleIntegrationChange); - UserStore.removeChangeListener(this.handleUserChange); - } - - handleIntegrationChange() { - const teamId = this.props.team.id; - - this.setState({ - commands: IntegrationStore.getCommands(teamId) - }); - } - - handleUserChange() { - this.setState({users: UserStore.getProfiles()}); - } - - render() { - return ( - <div> - {React.cloneElement(this.props.children, { - commands: this.state.commands, - users: this.state.users, - loading: this.state.loading, - team: this.props.team, - user: this.props.user, - isAdmin: this.props.isAdmin - })} - </div> - ); - } -} diff --git a/webapp/components/integrations/components/installed_oauth_apps/index.js b/webapp/components/integrations/components/installed_oauth_apps/index.js new file mode 100644 index 000000000..85d2a5ba7 --- /dev/null +++ b/webapp/components/integrations/components/installed_oauth_apps/index.js @@ -0,0 +1,29 @@ +// Copyright (c) 2017 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import {connect} from 'react-redux'; +import {bindActionCreators} from 'redux'; +import * as Actions from 'mattermost-redux/actions/integrations'; +import {getOAuthApps} from 'mattermost-redux/selectors/entities/integrations'; +import {isCurrentUserSystemAdmin} from 'mattermost-redux/selectors/entities/users'; + +import InstalledOAuthApps from './installed_oauth_apps.jsx'; + +function mapStateToProps(state, ownProps) { + return { + ...ownProps, + oauthApps: getOAuthApps(state), + isSystemAdmin: isCurrentUserSystemAdmin(state) + }; +} + +function mapDispatchToProps(dispatch) { + return { + actions: bindActionCreators({ + getOAuthApps: Actions.getOAuthApps, + deleteOAuthApp: Actions.deleteOAuthApp + }, dispatch) + }; +} + +export default connect(mapStateToProps, mapDispatchToProps)(InstalledOAuthApps);
\ No newline at end of file diff --git a/webapp/components/integrations/components/installed_oauth_apps.jsx b/webapp/components/integrations/components/installed_oauth_apps/installed_oauth_apps.jsx index 3f3ff4c11..45dd56310 100644 --- a/webapp/components/integrations/components/installed_oauth_apps.jsx +++ b/webapp/components/integrations/components/installed_oauth_apps/installed_oauth_apps.jsx @@ -4,55 +4,60 @@ import React from 'react'; import PropTypes from 'prop-types'; -import UserStore from 'stores/user_store.jsx'; -import IntegrationStore from 'stores/integration_store.jsx'; -import * as OAuthActions from 'actions/oauth_actions.jsx'; import {localizeMessage} from 'utils/utils.jsx'; - import BackstageList from 'components/backstage/components/backstage_list.jsx'; import {FormattedMessage} from 'react-intl'; -import InstalledOAuthApp from './installed_oauth_app.jsx'; - -export default class InstalledOAuthApps extends React.Component { - static get propTypes() { - return { - team: PropTypes.object - }; +import InstalledOAuthApp from '../installed_oauth_app.jsx'; + +export default class InstalledOAuthApps extends React.PureComponent { + static propTypes = { + + /** + * The team data + */ + team: PropTypes.object, + + /** + * The oauthApps data + */ + oauthApps: PropTypes.object, + + /** + * Set if user is admin + */ + isSystemAdmin: PropTypes.bool, + + actions: PropTypes.shape({ + + /** + * The function to call to fetch OAuth apps + */ + getOAuthApps: PropTypes.func.isRequired, + + /** + * The function to call when Delete link is clicked + */ + deleteOAuthApp: PropTypes.func.isRequired + }).isRequired } constructor(props) { super(props); - - this.handleIntegrationChange = this.handleIntegrationChange.bind(this); - - this.deleteOAuthApp = this.deleteOAuthApp.bind(this); - this.state = { - oauthApps: IntegrationStore.getOAuthApps(), - loading: !IntegrationStore.hasReceivedOAuthApps() + loading: true }; } componentDidMount() { - IntegrationStore.addChangeListener(this.handleIntegrationChange); - if (window.mm_config.EnableOAuthServiceProvider === 'true') { - OAuthActions.listOAuthApps(() => this.setState({loading: false})); + this.props.actions.getOAuthApps().then( + () => this.setState({loading: false}) + ); } } - componentWillUnmount() { - IntegrationStore.removeChangeListener(this.handleIntegrationChange); - } - - handleIntegrationChange() { - this.setState({ - oauthApps: IntegrationStore.getOAuthApps() - }); - } - - deleteOAuthApp(app) { - OAuthActions.deleteOAuthApp(app.id); + deleteOAuthApp = (app) => { + this.props.actions.deleteOAuthApp(app.id); } oauthAppCompare(a, b) { @@ -70,7 +75,7 @@ export default class InstalledOAuthApps extends React.Component { } render() { - const oauthApps = this.state.oauthApps.sort(this.oauthAppCompare).map((app) => { + const oauthApps = Object.values(this.props.oauthApps).sort(this.oauthAppCompare).map((app) => { return ( <InstalledOAuthApp key={app.id} @@ -80,9 +85,9 @@ export default class InstalledOAuthApps extends React.Component { ); }); - const isSystemAdmin = UserStore.isSystemAdminForCurrentUser(); const config = global.mm_config; - const integrationsEnabled = (config.EnableOAuthServiceProvider === 'true' && (isSystemAdmin || config.EnableOnlyAdminIntegrations !== 'true')); + const integrationsEnabled = (config.EnableOAuthServiceProvider === 'true' && + (this.props.isSystemAdmin || config.EnableOnlyAdminIntegrations !== 'true')); let props; if (integrationsEnabled) { props = { diff --git a/webapp/routes/route_integrations.jsx b/webapp/routes/route_integrations.jsx index b7e08fda4..c3cf3ae78 100644 --- a/webapp/routes/route_integrations.jsx +++ b/webapp/routes/route_integrations.jsx @@ -95,7 +95,7 @@ export default { path: 'oauth2-apps', indexRoute: { getComponents: (location, callback) => { - System.import('components/integrations/components/installed_oauth_apps.jsx').then(RouteUtils.importComponentSuccess(callback)); + System.import('components/integrations/components/installed_oauth_apps').then(RouteUtils.importComponentSuccess(callback)); } }, childRoutes: [ diff --git a/webapp/tests/components/integrations/__snapshots__/installed_oauth_apps.test.jsx.snap b/webapp/tests/components/integrations/__snapshots__/installed_oauth_apps.test.jsx.snap new file mode 100644 index 000000000..022bc1476 --- /dev/null +++ b/webapp/tests/components/integrations/__snapshots__/installed_oauth_apps.test.jsx.snap @@ -0,0 +1,98 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`components/integrations/InstalledOAuthApps should match snapshot 1`] = ` +<BackstageList + addLink="/test/integrations/oauth2-apps/add" + addText="Add OAuth 2.0 Application" + emptyText={ + <FormattedMessage + defaultMessage="No OAuth 2.0 Applications found" + id="installed_oauth_apps.empty" + values={Object {}} + /> + } + header={ + <FormattedMessage + defaultMessage="OAuth 2.0 Applications" + id="installed_oauth_apps.header" + values={Object {}} + /> + } + helpText={ + <FormattedMessage + defaultMessage="Create {oauthApplications} to securely integrate bots and third-party apps with Mattermost. Visit the {appDirectory} to find available self-hosted apps." + id="installed_oauth_apps.help" + values={ + Object { + "appDirectory": <a + href="https://about.mattermost.com/default-app-directory/" + rel="noopener noreferrer" + target="_blank" + > + <FormattedMessage + defaultMessage="App Directory" + id="installed_oauth_apps.help.appDirectory" + values={Object {}} + /> + </a>, + "oauthApplications": <a + href="https://docs.mattermost.com/developer/oauth-2-0-applications.html" + rel="noopener noreferrer" + target="_blank" + > + <FormattedMessage + defaultMessage="OAuth 2.0 applications" + id="installed_oauth_apps.help.oauthApplications" + values={Object {}} + /> + </a>, + } + } + /> + } + loading={true} + searchPlaceholder="Search OAuth 2.0 Applications" +> + <InstalledOAuthApp + oauthApp={ + Object { + "callback_urls": Array [ + "https://test.com/callback", + ], + "client_secret": "88cxd9wpzpbpfp8pad78xj75pr", + "create_at": 1501365458934, + "creator_id": "88oybd1dwfdoxpkpw1h5kpbyco", + "description": "testing", + "homepage": "https://test.com", + "icon_url": "https://test.com/icon", + "id": "facxd9wpzpbpfp8pad78xj75pr", + "is_trusted": false, + "name": "firstApp", + "update_at": 1501365458934, + } + } + onDelete={[Function]} + /> + <InstalledOAuthApp + oauthApp={ + Object { + "callback_urls": Array [ + "https://test2.com/callback", + "https://test2.com/callback2", + ], + "client_secret": "decxd9wpzpbpfp8pad78xj75pr", + "create_at": 1501365459984, + "creator_id": "88oybd2dwfdoxpkpw1h5kpbyco", + "description": "testing2", + "homepage": "https://test2.com", + "icon_url": "https://test2.com/icon", + "id": "fzcxd9wpzpbpfp8pad78xj75pr", + "is_trusted": true, + "name": "secondApp", + "update_at": 1501365479988, + } + } + onDelete={[Function]} + /> +</BackstageList> +`; diff --git a/webapp/tests/components/integrations/installed_oauth_apps.test.jsx b/webapp/tests/components/integrations/installed_oauth_apps.test.jsx new file mode 100644 index 000000000..4f3ca6ba8 --- /dev/null +++ b/webapp/tests/components/integrations/installed_oauth_apps.test.jsx @@ -0,0 +1,53 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import React from 'react'; +import {shallow} from 'enzyme'; + +import InstalledOAuthApps from 'components/integrations/components/installed_oauth_apps/installed_oauth_apps.jsx'; + +describe('components/integrations/InstalledOAuthApps', () => { + test('should match snapshot', () => { + const emptyFunction = jest.fn(); + const oauthApps = { + facxd9wpzpbpfp8pad78xj75pr: { + id: 'facxd9wpzpbpfp8pad78xj75pr', + name: 'firstApp', + client_secret: '88cxd9wpzpbpfp8pad78xj75pr', + create_at: 1501365458934, + creator_id: '88oybd1dwfdoxpkpw1h5kpbyco', + description: 'testing', + homepage: 'https://test.com', + icon_url: 'https://test.com/icon', + is_trusted: false, + update_at: 1501365458934, + callback_urls: ['https://test.com/callback'] + }, + fzcxd9wpzpbpfp8pad78xj75pr: { + id: 'fzcxd9wpzpbpfp8pad78xj75pr', + name: 'secondApp', + client_secret: 'decxd9wpzpbpfp8pad78xj75pr', + create_at: 1501365459984, + creator_id: '88oybd2dwfdoxpkpw1h5kpbyco', + description: 'testing2', + homepage: 'https://test2.com', + icon_url: 'https://test2.com/icon', + is_trusted: true, + update_at: 1501365479988, + callback_urls: ['https://test2.com/callback', 'https://test2.com/callback2'] + } + }; + global.window.mm_config = {EnableOAuthServiceProvider: 'true'}; + + const wrapper = shallow( + <InstalledOAuthApps + team={{name: 'test'}} + oauthApps={oauthApps} + isSystemAdmin={true} + actions={{getOAuthApps: emptyFunction, deleteOAuthApp: emptyFunction}} + /> + ); + expect(wrapper.find('InstalledOAuthApp').length).toBe(2); + expect(wrapper).toMatchSnapshot(); + }); +});
\ No newline at end of file |