<template>
  <base-layout>

    <template slot="header">
      Grady
    </template>

    <template slot="sidebar-content">
      <v-list dense>
        <v-list-tile v-for="(item, i) in generalNavItems" :key="i" :to="item.route">
          <v-list-tile-action>
            <v-icon>{{ item.icon }}</v-icon>
          </v-list-tile-action>
          <v-list-tile-content>
            <v-list-tile-title :id="item.tagId">
              {{ item.name }}
            </v-list-tile-title>
          </v-list-tile-content>
        </v-list-tile>
      </v-list>
      <v-divider></v-divider>
      <slot name="above-subscriptions"></slot>
      <subscription-list :sidebar="true"/>
      <feedback-labels-list/>
      <slot name="below-subscriptions"></slot>
    </template>
    <template slot="toolbar-right"><slot name="toolbar-right"></slot></template>
  </base-layout>
</template>

<script>
import BaseLayout from '@/components/BaseLayout'
import SubscriptionList from '@/components/subscriptions/SubscriptionList'
import FeedbackLabelsList from '@/components/feedback_labels/FeedbackLabelsList.vue'

export default {
  components: {
    SubscriptionList,
    FeedbackLabelsList,
    BaseLayout },
  name: 'tutor-reviewer-base-layout',
  data () {
    return {
      generalNavItems: [
        {
          name: 'Overview',
          icon: 'home',
          route: '/home',
          tagId: 'overview'
        },
        {
          name: 'Feedback History',
          icon: 'feedback',
          route: '/feedback',
          tagId: 'feedback'
        },
        {
          name: 'Statistics',
          icon: 'bar_chart',
          route: '/statistics',
          tagId: 'statistics'
        }
      ]
    }
  }
}
</script>

<style scoped>
</style>