import React, {lazy, useState} from 'react';
import TabNav from '../util/TabNav';
// This is needed because there is some problem with the lazy loading of the pages when they import this file.  
// Importing it here pre-loads it and avoids the issue.
// It has something to do with the students.js file and its import of the csv parsing library.
import {Students} from "/imports/api/students";

export default () => {
	let tabs = [
		{
			title: "Sites",
			getElement: () => {
				const Sites = lazy(()=>import('./Admin/Sites'))
				return <Sites/>
			},
			path: '/sites',
			href: 'sites'
		},
		{
			title: "Students",
			getElement: () => {
				const Students = lazy(()=>import('./Admin/Students'))
				return <Students/>
			},
			path: '/students',
			href: 'students'
		},
		{
			title: "Staff",
			getElement: () => {
				const Staff = lazy(()=>import('./Admin/Staff'))
				return <Staff/>
			},
			path: '/staff',
			href: 'staff'
		},
		{
			title: "Asset Types",
			getElement: () => {
				const AssetTypes = lazy(()=>import('./Admin/AssetTypes'))
				return <AssetTypes/>
			},
			path: '/assetTypes',
			href: 'assetTypes'
		},
		{
			title: "Functions",
			getElement: () => {
				const Functions = lazy(()=>import('./Admin/Functions'))
				return <Functions/>
			},
			path: '/functions',
			href: 'functions'
		},
	]

	return <TabNav tabs={tabs}/>
}