import React from 'react'
import loadable from 'utils/loadable'
import { Skeleton } from 'antd'

export const Viz = loadable(() => import('./'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const DataManagerViz = loadable(() => import('./dataManagerViz'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})
export const DataShareServiceViz = loadable(() => import('./dataShareServiceViz'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const VizList = loadable(() => import('./VizList'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})


export const DataVizList = loadable(() => import('./DataVizList'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const PortalIndex = loadable(() => import('./Portal'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const DataManagerPortalIndex = loadable(() => import('./DataManagerPortal'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const DataShareServicePortalIndex = loadable(() => import('./DataShareServicePortal'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const VizDisplay = loadable(() => import('./Display'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const DataManagerVizDisplay = loadable(() => import('./DataManagerDisplay'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export const DataShareServiceVizDisplay = loadable(() => import('./DataShareServiceDisplay'), {
  fallback: <Skeleton active paragraph={{ rows: 15 }} />
})

export default Viz