summaryrefslogtreecommitdiff
path: root/ui/app/components/main_panel/index.js
diff options
context:
space:
mode:
authorelijah <elijah@riseup.net>2016-09-16 14:02:32 -0700
committerKali Kaneko (leap communications) <kali@leap.se>2016-09-22 11:40:11 -0400
commit073393af311d36c8ca7570ff0d3f0a3117c0b544 (patch)
treee59286ac350ba17110392f53b6e48bcedfd12ef1 /ui/app/components/main_panel/index.js
parentae5a20d059209f2027c05820dc3b4cfe7346c8a8 (diff)
[pkg] rename www to ui
Diffstat (limited to 'ui/app/components/main_panel/index.js')
-rw-r--r--ui/app/components/main_panel/index.js80
1 files changed, 80 insertions, 0 deletions
diff --git a/ui/app/components/main_panel/index.js b/ui/app/components/main_panel/index.js
new file mode 100644
index 00000000..3cc6c11f
--- /dev/null
+++ b/ui/app/components/main_panel/index.js
@@ -0,0 +1,80 @@
+//
+// The main panel manages the current account and the list of available accounts
+//
+// It displays multiple sections, one for each service.
+//
+
+import React from 'react'
+import App from 'app'
+import Login from 'components/login'
+import Account from 'models/account'
+import DummyAccount from 'models/dummy_account'
+
+import './main_panel.less'
+import AccountList from './account_list'
+import UserSection from './user_section'
+import EmailSection from './email_section'
+
+export default class MainPanel extends React.Component {
+
+ static get defaultProps() {return{
+ initialAccount: null
+ }}
+
+ constructor(props) {
+ super(props)
+ this.state = {
+ account: null,
+ accounts: []
+ }
+ this.activateAccount = this.activateAccount.bind(this)
+ }
+
+ componentWillMount() {
+ if (this.props.initialAccount) {
+ console.log(Account.list)
+ Account.add(this.props.initialAccount)
+ Account.add(new DummyAccount(this.props.initialAccount))
+ this.setState({
+ account: this.props.initialAccount,
+ accounts: Account.list
+ })
+ }
+ }
+
+ activateAccount(account) {
+ this.setState({
+ account: account,
+ accounts: Account.list
+ })
+ }
+
+ //setAccounts(accounts) {
+ // this.setState({
+ // accounts: accounts
+ // })
+ //}
+
+ render() {
+ let emailSection = null
+ let vpnSection = null
+
+ if (this.state.account.authenticated) {
+ if (this.state.account.hasEmail) {
+ emailSection = <EmailSection account={this.state.account} />
+ }
+ }
+
+ return (
+ <div className="main-panel">
+ <AccountList account={this.state.account} accounts={this.state.accounts} onSelect={this.activateAccount} />
+ <div className="body">
+ <UserSection account={this.state.account} onLogin={this.activateAccount} onLogout={this.activateAccount}/>
+ {vpnSection}
+ {emailSection}
+ </div>
+ </div>
+ )
+ }
+
+}