import { createRouter, createWebHistory } from 'vue-router';
import HomePage from '../domain/manga/presentation/pages/HomePage.vue';

// Placeholder component for new routes
const PlaceholderComponent = {
  props: {
    title: {
      type: String,
      required: true
    }
  },
  template: `
    <div class="container mx-auto px-4 py-8">
      <h1 class="text-2xl font-bold mb-4">{{ title }}</h1>
      <p class="text-gray-600">Cette fonctionnalité sera bientôt disponible.</p>
    </div>
  `
};

const routes = [
    {
        path: '/',
        name: 'home',
        component: HomePage
    },
    {
        path: '/manga/:slug',
        name: 'manga-detail',
        component: PlaceholderComponent,
        props: { title: 'Détails du manga' }
    },
    {
        path: '/add',
        name: 'add-manga',
        component: PlaceholderComponent,
        props: { title: 'Ajouter un manga' }
    },
    {
        path: '/reader/:chapterId',
        name: 'reader',
        component: PlaceholderComponent,
        props: { title: 'Lecteur' }
    },
    // Pages placeholder avec chargement différé
    {
        path: '/import',
        name: 'import',
        component: PlaceholderComponent,
        props: { title: 'Import de bibliothèque' }
    },
    {
        path: '/discover',
        name: 'discover',
        component: PlaceholderComponent,
        props: { title: 'Découvrir' }
    },
    {
        path: '/convert',
        name: 'convert',
        component: PlaceholderComponent,
        props: { title: 'Convertir CBR en CBZ' }
    },
    {
        path: '/calendar',
        name: 'calendar',
        component: PlaceholderComponent,
        props: { title: 'Calendrier' }
    },
    {
        path: '/activity',
        name: 'activity',
        component: PlaceholderComponent,
        props: { title: 'Activité' }
    },
    // Paramètres
    {
        path: '/settings/general',
        name: 'settings-general',
        component: PlaceholderComponent,
        props: { title: 'Paramètres généraux' }
    },
    {
        path: '/settings/folders',
        name: 'settings-folders',
        component: PlaceholderComponent,
        props: { title: 'Gestion des dossiers' }
    },
    {
        path: '/settings/scrappers',
        name: 'settings-scrappers',
        component: PlaceholderComponent,
        props: { title: 'Configuration des scrappers' }
    },
    {
        path: '/settings/ui',
        name: 'settings-ui',
        component: PlaceholderComponent,
        props: { title: "Paramètres de l'interface" }
    },
    // Système
    {
        path: '/system/status',
        name: 'system-status',
        component: PlaceholderComponent,
        props: { title: 'Status du système' }
    },
    {
        path: '/system/backup',
        name: 'system-backup',
        component: PlaceholderComponent,
        props: { title: 'Sauvegarde' }
    },
    {
        path: '/system/logs',
        name: 'system-logs',
        component: PlaceholderComponent,
        props: { title: 'Journaux système' }
    },
    {
        path: '/system/updates',
        name: 'system-updates',
        component: PlaceholderComponent,
        props: { title: 'Mises à jour' }
    }
];

export default routes;