import { createRouter, createWebHistory } from 'vue-router';
import { useAuthStore } from '../stores/auth.ts';

const router = createRouter({
  history: createWebHistory(),
  routes: [
    { path: '/login', component: () => import('../views/LoginView.vue') },
    {
      path: '/',
      component: () => import('../layouts/MainLayout.vue'),
      meta: { requiresAuth: true },
      children: [
        { path: '', component: () => import('../views/HomeView.vue') },
        { path: 'bet', component: () => import('../views/FootballView.vue') },
        { path: 'football', redirect: '/bet' },
        { path: 'match/:id', component: () => import('../views/MatchDetailView.vue') },
        { path: 'bets', component: () => import('../views/MyBetsView.vue') },
        { path: 'bets/:betNo', component: () => import('../views/BetDetailView.vue') },
        { path: 'wallet', component: () => import('../views/WalletView.vue') },
        { path: 'wallet/detail', component: () => import('../views/WalletDetailView.vue') },
        { path: 'wallet/cashbacks', component: () => import('../views/CashbackRecordsView.vue') },
        { path: 'wallet/transactions/:transactionId', component: () => import('../views/WalletTransactionDetailView.vue') },
        { path: 'profile', component: () => import('../views/ProfileView.vue') },
        { path: 'profile/cashbacks', component: () => import('../views/CashbackRecordsView.vue') },
        { path: 'profile/edit', component: () => import('../views/ProfileEditView.vue') },
      ],
    },
  ],
});

router.beforeEach((to) => {
  const auth = useAuthStore();
  if (to.meta.requiresAuth && !auth.token) return '/login';
  if (to.path === '/login' && auth.token) return '/';
});

export default router;
