import DefaultTheme from 'vitepress/theme'
import type { Theme } from 'vitepress'
import { h } from 'vue'
import { useData } from 'vitepress'

import ProjectList from './components/ProjectList.vue'
import HomePage from './components/HomePage.vue'
import CapabilityTabs from './components/CapabilityTabs.vue'
import FeatureGrid from './components/FeatureGrid.vue'

import './styles/portal.css'

/**
 * 首页用 layout: page 承载自定义整页排版，
 * 这里给它套一层 .portal-page，把默认窄栏与 padding 去掉。
 */
const PortalLayout = () => {
  const { frontmatter } = useData()
  const isPortal = frontmatter.value.layout === 'page'
  return h('div', { class: isPortal ? 'portal-page' : '' }, h(DefaultTheme.Layout))
}

export default {
  extends: DefaultTheme,
  Layout: PortalLayout,
  enhanceApp({ app }) {
    app.component('ProjectList', ProjectList)
    app.component('HomePage', HomePage)
    app.component('CapabilityTabs', CapabilityTabs)
    app.component('FeatureGrid', FeatureGrid)
  },
} satisfies Theme