import React from 'react'
import {JaenSectionProvider} from './context'
import {useSectionData} from './useSectionData'

export const useSection = (sectionName: string) => {
  const {data, sectionPath} = useSectionData(sectionName, {
    forceUpdate: true
  })

  const withJaenSection = (
    sectionId: string,
    children: React.ReactNode
  ): React.ReactNode => {
    return (
      <JaenSectionProvider
        path={sectionPath}
        id={sectionId}
        position={0}
        Component={undefined}>
        {children}
      </JaenSectionProvider>
    )
  }

  return {
    data,
    sectionPath,
    withJaenSection
  }
}