<template>
  <keep-alive>
    <component v-if="layout" :is="layout" :pageName="pageName" v-bind="props" />
  </keep-alive>
</template>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import { HashNavigationModule } from '@/widgets/HashNavigationModule'
import { getModule } from 'vuex-module-decorators'
import MessagesLayout from '@/widgets/messages/layouts/MessagesLayout.vue'

const layouts = {
  messages: MessagesLayout,
}

@Component({ inheritAttrs: false })
export default class WidgetsPage extends Vue {
  @Prop({ type: String, required: true })
  userId!: string

  hashNavigationModule = getModule(HashNavigationModule, this.$store)

  get layout() {
    const { layoutName } = this.hashNavigationModule

    return layoutName ? layouts[layoutName as keyof typeof layouts] : null
  }

  get pageName() {
    return this.hashNavigationModule.pageName
  }

  get props() {
    return this.hashNavigationModule.props
  }

  // created() {
  //   const lastRoute = RouteHelper.getLastLocation()
  //
  //   if (lastRoute) {
  //     if (!this.orderName) {
  //       if (lastRoute.name === MessagesRouteNames.orderThreads) {
  //         this.$router.push({ name: MessagesRouteNames.index })
  //       } else if (lastRoute.name === TasksRouteNames.orderTasks) {
  //         this.$router.push({ name: TasksRouteNames.tasks })
  //       } else if (this.$route.path !== lastRoute.path) {
  //         this.$router.push({ path: lastRoute.path })
  //       }
  //     } else {
  //       const lastWidget = RouteHelper.getWidgetName(lastRoute)
  //
  //       if (lastWidget === 'messages') {
  //         this.$router.push({
  //           name: MessagesRouteNames.orderThreads,
  //           params: { orderName: this.orderName },
  //         })
  //       } else if (lastWidget === 'tasks') {
  //         this.$router.push({
  //           name: TasksRouteNames.orderTasks,
  //           params: { orderName: this.orderName },
  //         })
  //       }
  //     }
  //   }
  // }
}
</script>
