import {RouterModule, Routes} from '@angular/router';

import {UserComponent} from './user.component/user.component';

export const USER_ROUTS: Routes = [
  {
    path: '',
    component: UserComponent,

    data:{title: 'User'},
    children: [
      { path: '', pathMatch: 'full', redirectTo: 'user-welcome' }, // default redirect

      {
        path: 'user-welcome',
        loadComponent: () => import('../user-module/user-welcome.component/user-welcome.component').then((c) => c.UserWelcomeComponent),
        data:{title: 'Welcome', icon:'dashboard', nav:true}
      },
      {
        path: 'tutorials-list',
        loadComponent: () => import('../user-module/tutorials-list.component/tutorials-list.component').then((c) => c.TutorialsListComponent),
        data:{title: 'Tutorials List', icon:'list', nav:true}
      },
      {
        path: 'tutorial-add',
        loadComponent: () => import('../user-module/tutorial-add.component/tutorial-add.component').then((c) => c.TutorialAddComponent),
        data:{title: 'Add Tutorial'}
      },
      {
        path: 'tutorial-edit',
        loadComponent: () => import('../user-module/tutorial-edit.component/tutorial-edit.component').then((c) => c.TutorialEditComponent),
        data:{title: 'Edit Tutorial'}
      },
      {
        path: 'files-browser',
        loadComponent: ()=>import('../user-module/files-browser.component/files-browser.component').then((c)=>c.FilesBrowserComponent),
        data:{title: 'Files Browser', icon:'folder_data', nav:true}
      },
      {
        path: 'ai-models',
        loadComponent: () => import('../user-module/ai-models.component/ai-models.component').then((c) => c.AiModelsComponent),
        data:{title: 'AI'}
      },
      {
        path: 'images',
        loadComponent: () => import('../user-module/images.component/images.component').then((c) => c.ImagesComponent),
        data:{title: 'Images', icon: 'imagesmode', nav:true}
      },
      {
        path:'docker',
        loadComponent: () => import('../user-module/docker-management-component/docker-management-component').then((c)=>c.DockerManagementComponent),
        data:{title: 'Docker', icon: 'docker', nav:true}
      },
      {
        path: 'projects',
        loadComponent: () => import('../user-module/projects.component/projects.component').then((c) => c.ProjectsComponent),
        data: { title: 'Dashboard', icon: 'dashboard', nav: true }
      },
      {
        path: 'projects/:id/details',
        loadComponent: () => import('../user-module/project-details.component/project-details.component').then((c) => c.ProjectDetailsComponent),
        data: { title: 'Project Details' }
      },
      {
        path: 'projects/add',
        loadComponent: () => import('../user-module/project-add.component/project-add.component').then((c) => c.ProjectAddComponent),
        data: { title: 'New Project' }
      }
    ]
  }
];

export const userRouting = RouterModule.forChild(USER_ROUTS);