import { lazy } from 'react'
import { Route } from 'react-router-dom'

const Invoices = lazy(
  () => import('../components/Dashboard/Finance/Invoices.jsx')
)
const InvoiceInfo = lazy(
  () => import('../components/Dashboard/Finance/Invoices/InvoiceInfo.jsx')
)
const Payments = lazy(
  () => import('../components/Dashboard/Finance/Payments.jsx')
)
const PaymentInfo = lazy(
  () => import('../components/Dashboard/Finance/Payments/PaymentInfo.jsx')
)
const FinanceOverview = lazy(
  () => import('../components/Dashboard/Finance/FinanceOverview.jsx')
)

const FinanceRoutes = [
  <Route
    key='overview'
    path='finance/overview'
    element={<FinanceOverview />}
  />,
  <Route key='invoices' path='finance/invoices' element={<Invoices />} />,
  <Route
    key='invoices-info'
    path='finance/invoices/info'
    element={<InvoiceInfo />}
  />,
  <Route key='payments' path='finance/payments' element={<Payments />} />,
  <Route
    key='payments-info'
    path='finance/payments/info'
    element={<PaymentInfo />}
  />
]

export default FinanceRoutes