From c41bf73d129d2fba3ec23c1b7b463aaf9dc80dc6 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Mon, 8 Apr 2019 15:57:32 +0200 Subject: Add new Team page in settings --- src/containers/settings/TeamScreen.js | 63 +++++++++++++++++++++++++++++++++++ 1 file changed, 63 insertions(+) create mode 100644 src/containers/settings/TeamScreen.js (limited to 'src/containers/settings/TeamScreen.js') diff --git a/src/containers/settings/TeamScreen.js b/src/containers/settings/TeamScreen.js new file mode 100644 index 000000000..3a4b7ef77 --- /dev/null +++ b/src/containers/settings/TeamScreen.js @@ -0,0 +1,63 @@ +import { remote } from 'electron'; +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { inject, observer } from 'mobx-react'; + +import PaymentStore from '../../stores/PaymentStore'; +import UserStore from '../../stores/UserStore'; +import AppStore from '../../stores/AppStore'; + +import TeamDashboard from '../../components/settings/team/TeamDashboard'; +import ErrorBoundary from '../../components/util/ErrorBoundary'; +import { WEBSITE } from '../../environment'; + +const { BrowserWindow } = remote; + +export default @inject('stores', 'actions') @observer class TeamScreen extends Component { + handleWebsiteLink(route) { + const { actions, stores } = this.props; + + const url = `${WEBSITE}${route}?authToken=${stores.user.authToken}&utm_source=app&utm_medium=account_dashboard`; + console.log(url); + + actions.app.openExternalUrl({ url }); + } + + render() { + const { user } = this.props.stores; + + const isLoadingUserInfo = user.getUserInfoRequest.isExecuting; + + return ( + + this.reloadData()} + openTeamManagement={() => this.handleWebsiteLink('/user/team')} + /> + + ); + } +} + +TeamScreen.wrappedComponent.propTypes = { + stores: PropTypes.shape({ + user: PropTypes.instanceOf(UserStore).isRequired, + payment: PropTypes.instanceOf(PaymentStore).isRequired, + app: PropTypes.instanceOf(AppStore).isRequired, + }).isRequired, + actions: PropTypes.shape({ + payment: PropTypes.shape({ + createDashboardUrl: PropTypes.func.isRequired, + }).isRequired, + app: PropTypes.shape({ + openExternalUrl: PropTypes.func.isRequired, + }).isRequired, + user: PropTypes.shape({ + update: PropTypes.func.isRequired, + delete: PropTypes.func.isRequired, + }).isRequired, + }).isRequired, +}; -- cgit v1.2.3-70-g09d2 From b92541305cbeaf32f54ed2751f4ddd880baa2b69 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Mon, 8 Apr 2019 16:01:39 +0200 Subject: Clean up --- src/components/settings/team/TeamDashboard.js | 6 ++---- src/containers/settings/TeamScreen.js | 5 ----- 2 files changed, 2 insertions(+), 9 deletions(-) (limited to 'src/containers/settings/TeamScreen.js') diff --git a/src/components/settings/team/TeamDashboard.js b/src/components/settings/team/TeamDashboard.js index a29a262e9..e222bb14c 100644 --- a/src/components/settings/team/TeamDashboard.js +++ b/src/components/settings/team/TeamDashboard.js @@ -37,11 +37,11 @@ const messages = defineMessages({ }, }); -const styles = theme => ({ +const styles = { cta: { marginTop: 40, }, -}); +}; export default @injectSheet(styles) @observer class TeamDashboard extends Component { @@ -51,7 +51,6 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon userInfoRequestFailed: PropTypes.bool.isRequired, retryUserInfoRequest: PropTypes.func.isRequired, openTeamManagement: PropTypes.func.isRequired, - upgradeAccount: PropTypes.func.isRequired, classes: PropTypes.object.isRequired, }; @@ -66,7 +65,6 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon userInfoRequestFailed, retryUserInfoRequest, openTeamManagement, - upgradeAccount, classes, } = this.props; const { intl } = this.context; diff --git a/src/containers/settings/TeamScreen.js b/src/containers/settings/TeamScreen.js index 3a4b7ef77..30b0895e3 100644 --- a/src/containers/settings/TeamScreen.js +++ b/src/containers/settings/TeamScreen.js @@ -1,9 +1,7 @@ -import { remote } from 'electron'; import React, { Component } from 'react'; import PropTypes from 'prop-types'; import { inject, observer } from 'mobx-react'; -import PaymentStore from '../../stores/PaymentStore'; import UserStore from '../../stores/UserStore'; import AppStore from '../../stores/AppStore'; @@ -11,8 +9,6 @@ import TeamDashboard from '../../components/settings/team/TeamDashboard'; import ErrorBoundary from '../../components/util/ErrorBoundary'; import { WEBSITE } from '../../environment'; -const { BrowserWindow } = remote; - export default @inject('stores', 'actions') @observer class TeamScreen extends Component { handleWebsiteLink(route) { const { actions, stores } = this.props; @@ -45,7 +41,6 @@ export default @inject('stores', 'actions') @observer class TeamScreen extends C TeamScreen.wrappedComponent.propTypes = { stores: PropTypes.shape({ user: PropTypes.instanceOf(UserStore).isRequired, - payment: PropTypes.instanceOf(PaymentStore).isRequired, app: PropTypes.instanceOf(AppStore).isRequired, }).isRequired, actions: PropTypes.shape({ -- cgit v1.2.3-70-g09d2 From e5a3a933bad97378a03a82d9d88a67548f8cbad8 Mon Sep 17 00:00:00 2001 From: Stefan Malzner Date: Sat, 13 Apr 2019 21:02:36 +0200 Subject: fix linting issues --- src/components/settings/team/TeamDashboard.js | 10 ++++------ src/containers/settings/TeamScreen.js | 1 - 2 files changed, 4 insertions(+), 7 deletions(-) (limited to 'src/containers/settings/TeamScreen.js') diff --git a/src/components/settings/team/TeamDashboard.js b/src/components/settings/team/TeamDashboard.js index 63381c4ed..e3ea08bf5 100644 --- a/src/components/settings/team/TeamDashboard.js +++ b/src/components/settings/team/TeamDashboard.js @@ -46,7 +46,7 @@ const styles = { flexDirection: 'column', height: 'auto', - ['@media(min-width: 800px)']: { + '@media(min-width: 800px)': { flexDirection: 'row', }, }, @@ -54,7 +54,7 @@ const styles = { height: 'auto', order: 1, - ['@media(min-width: 800px)']: { + '@media(min-width: 800px)': { order: 0, }, }, @@ -64,17 +64,16 @@ const styles = { order: 0, margin: [0, 'auto', 40, 'auto'], - ['@media(min-width: 800px)']: { + '@media(min-width: 800px)': { marginLeft: 40, order: 1, }, - } + }, }; export default @injectSheet(styles) @observer class TeamDashboard extends Component { static propTypes = { - user: MobxPropTypes.observableObject.isRequired, isLoading: PropTypes.bool.isRequired, userInfoRequestFailed: PropTypes.bool.isRequired, retryUserInfoRequest: PropTypes.func.isRequired, @@ -88,7 +87,6 @@ export default @injectSheet(styles) @observer class TeamDashboard extends Compon render() { const { - user, isLoading, userInfoRequestFailed, retryUserInfoRequest, diff --git a/src/containers/settings/TeamScreen.js b/src/containers/settings/TeamScreen.js index 30b0895e3..c69d5ad08 100644 --- a/src/containers/settings/TeamScreen.js +++ b/src/containers/settings/TeamScreen.js @@ -27,7 +27,6 @@ export default @inject('stores', 'actions') @observer class TeamScreen extends C return ( this.reloadData()} -- cgit v1.2.3-70-g09d2