import '@libeilong/react-media-view/index.css'
import { registerPreviewPlugin } from '@libeilong/react-media-view'
import { useObserver } from '@libeilong/react-reactive'
import { ConfigProvider as AntdConfigProvider, theme } from 'antd'
import { RouterProvider } from '@tanstack/react-router'
import { ManagerProvider } from 'oh-popup-react'
import 'oh-popup-react/dist/index.css'
import { createRoot } from 'react-dom/client'
import './assets/css/index.css'
import { router } from './router'
import { popupManager } from './shared/popupManager'
import { stores } from './stores'
import { assetPlugin } from './shared/func/previewAsset'

// 注册 Asset 实例预览插件（图片 / 视频 / 音频自动识别）
registerPreviewPlugin(assetPlugin)

function App() {
  return useObserver(() => (
    <AntdConfigProvider
      theme={{
        cssVar: {},
        algorithm: stores.profile.isDark
          ? theme.darkAlgorithm
          : theme.defaultAlgorithm,
        token: { colorPrimary: '#6e6de9' },
      }}
    >
      <ManagerProvider manager={popupManager} />
      <RouterProvider router={router} />
    </AntdConfigProvider>
  ))
}

createRoot(document.getElementById('root')!).render(<App />)