import UserCardContent from '../user_card_content/user_card_content.vue'
import Timeline from '../timeline/timeline.vue'
import timelineFetcher from '../../services/timeline_fetcher/timeline_fetcher.service.js'

const UserProfile = {
  data: () => ({timeline: { visibleStatuses: [] }}),
  created () {
    this.$store.state.api.backendInteractor.getUser(this.userId)
      .then((user) => {
        if (!user.error) {
          this.$store.commit('addNewUsers', [user])
        }
      })
    const store = this.$store
    const credentials = store.state.users.currentUser.credentials
    const timelineData = this.timeline
    timelineFetcher.fetchStatuses({
      timelineData,
      credentials,
      timeline: 'user',
      userId: this.userId
    }).then((data) => {
      this.timeline.visibleStatuses = data
    })
  },
  computed: {
    userId () {
      return parseInt(this.$route.params.id)
    },
    user () {
      return this.$store.state.users.usersObject[this.userId]
    }
  },
  components: {
    UserCardContent,
    Timeline
  }
}

export default UserProfile