import { createRouter, createWebHistory } from 'vue-router'
import LayoutMain from '../layout/LayoutMain.vue'
import LayoutAuth from '../layout/LayoutAuth.vue'
import LayoutUser from '../layout/LayoutUser.vue'
import LayoutCreator from '../layout/LayoutCreator.vue'

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [
    {
      path: '/',
      component: LayoutMain,
      children: [
        {
          path: '',
          name: 'home',
          component: () => import('../views/HomeView.vue')
        },
        {
          path: 'contents/:id',
          name: 'content-detail',
          component: () => import('../views/content/DetailView.vue')
        },
        {
          path: 't/:id',
          name: 'tenant-home',
          component: () => import('../views/tenant/HomeView.vue')
        },
        {
          path: 'explore',
          name: 'explore',
          component: () => import('../views/ExploreView.vue') // Placeholder
        },
        {
          path: 'topics',
          name: 'topics',
          component: () => import('../views/TopicsView.vue') // Placeholder
        },
        {
            path: 'creator/apply',
            name: 'creator-apply',
            component: () => import('../views/creator/ApplyView.vue')
        },
        {
            path: 'creator/contents/new',
            name: 'creator-content-new',
            component: () => import('../views/creator/ContentsEditView.vue')
        }
      ]
    },
    {
      path: '/auth',
      component: LayoutAuth,
      children: [
        {
          path: 'login',
          name: 'login',
          component: () => import('../views/auth/LoginView.vue')
        }
      ]
    },
    {
        path: '/me',
        component: LayoutUser,
        children: [
            {
                path: '',
                name: 'user-dashboard',
                component: () => import('../views/user/DashboardView.vue')
            },
            {
                path: 'orders',
                name: 'user-orders',
                component: () => import('../views/user/OrdersView.vue')
            },
            {
                path: 'orders/:id',
                name: 'user-order-detail',
                component: () => import('../views/order/DetailView.vue')
            },
            {
                path: 'wallet',
                name: 'user-wallet',
                component: () => import('../views/user/WalletView.vue')
            },
            {
                path: 'library',
                name: 'user-library',
                component: () => import('../views/user/LibraryView.vue')
            },
            {
                path: 'favorites',
                name: 'user-favorites',
                component: () => import('../views/user/FavoritesView.vue')
            },
            {
                path: 'likes',
                name: 'user-likes',
                component: () => import('../views/user/LikesView.vue')
            },
            {
                path: 'notifications',
                name: 'user-notifications',
                component: () => import('../views/user/NotificationsView.vue')
            },
            {
                path: 'profile',
                name: 'user-profile',
                component: () => import('../views/user/ProfileView.vue')
            },
            {
                path: 'security',
                name: 'user-security',
                component: () => import('../views/user/SecurityView.vue')
            }
        ]
    },
    {
        path: '/creator',
        component: LayoutCreator, 
        children: [
             {
                path: '',
                name: 'creator-dashboard',
                component: () => import('../views/creator/DashboardView.vue')
             },
             {
                path: 'contents',
                name: 'creator-contents',
                component: () => import('../views/creator/ContentsView.vue')
             },
             {
                path: 'orders',
                name: 'creator-orders',
                component: () => import('../views/creator/OrdersView.vue')
             },
             {
                path: 'settings',
                name: 'creator-settings',
                component: () => import('../views/creator/SettingsView.vue')
             }
        ]
    },
    {
        path: '/checkout',
        component: LayoutMain,
        children: [
            {
                path: '',
                name: 'checkout',
                component: () => import('../views/order/CheckoutView.vue')
            }
        ]
    },
    {
        path: '/payment/:id',
        component: LayoutMain,
        children: [
             {
                path: '',
                name: 'payment',
                component: () => import('../views/order/PaymentView.vue')
             }
        ]
    },
    // Fallback
    { 
        path: '/:pathMatch(.*)*', 
        name: 'not-found', 
        component: () => import('../views/misc/NotFoundView.vue') 
    }
  ],
  scrollBehavior(to, from, savedPosition) {
    if (savedPosition) {
      return savedPosition
    } else {
      return { top: 0 }
    }
  }
})

export default router