import type { Ref } from 'vue'
import * as _ from 'lodash-es'

/**
 * @category composables/form
 * Composable pour gérer les expansions des accordéons
 */
export function useExtensionPanel(route: Ref) {
  const panel: Ref<number> = ref(0)
  const activeAccordionId = route.value.query.accordion

  onMounted(() => {
    setTimeout(function () {
      _.each(
        document.getElementsByClassName('v-expansion-panel'),
        (element, index) => {
          if (element.id === activeAccordionId) {
            panel.value = index
          }
        },
      )
      if (!panel.value) {
        panel.value = 0
      }
    }, 0)
  })

  return {
    panel,
  }
}