client/components/LoggedInView.jsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66

import React from 'react'
import ModalDialog from './ModalDialog.jsx'
import Menu from './Menu.jsx'
import UserList from './UserList.jsx'
import MealList from './MealList.jsx'

import client from '../client'

export default class LoggedInView extends React.Component {
  constructor(props) {
    super()
    this.state = {
      user: Object.assign({}, props.user),
      meals: [],
      mode: 'meals',
    }
    this.updateUser = this.updateUser.bind(this)
    this.updateMeals = this.updateMeals.bind(this)
    this.toggleMode = this.toggleMode.bind(this)
  }
  toggleMode(){
    this.setState({ mode: this.state.mode == 'meals' ? 'users' : 'meals' })
  }
  updateUser(user) {
    this.setState({
      user: user,
      mode: 'meals',
    })
  }
  updateMeals(user) {
    this.setState({
      meals: meals,
    })
  }
  render() {
    let activity = null
    if (this.state.mode == 'meals') {
      activity = (
        <MealList user={this.state.user}
          currentUser={this.props.user}
          onUpdate={this.updateMeals}
        />
      )
    }
    else {
      activity = (
        <UserList user={this.state.user}
          currentUser={this.props.user}
          updateUser={this.updateUser}
        />
      )
    }
    return (
      <div>
        <Menu mode={this.state.mode}
              user={this.state.user}
              toggleMode={this.toggleMode}
              currentUser={this.props.user}
              updateUser={this.updateUser} />
        {activity}
      </div>
    )
  }
}