<!-- Page de détails de l'organization courante -->

<template>
  <div>
    <LayoutContainer v-if="organization">
      <!-- Définit le contenu des trois slots du header de la page -->
      <LayoutBannerTop>
        <template #block1>
          {{ organization.name }}
        </template>
        <template #block2> N°Siret : {{ organization.siretNumber }} </template>
        <template #block3>
          {{ organization.description }}
        </template>
      </LayoutBannerTop>

      <!-- Rend le contenu de la page -->
      <NuxtPage />
    </LayoutContainer>
    <LayoutContainer v-else> Pending : {{ emPending }} </LayoutContainer>
  </div>
</template>

<script setup lang="ts">
import { computed, ComputedRef } from 'vue'
import { useEntityManager } from '~/composables/data/useEntityManager'
import { useEntityFetch } from '~/composables/data/useEntityFetch'
import { useOrganizationProfileStore } from '~/stores/organizationProfile'
import Organization from '~/models/Organization/Organization'
import ContactPoint from '~/models/Core/ContactPoint'
import BankAccount from '~/models/Core/BankAccount'
import OrganizationAddressPostal from '~/models/Organization/OrganizationAddressPostal'
import AddressPostal from '~/models/Core/AddressPostal'
import Country from '~/models/Core/Country'
import TypeOfPractice from '~/models/Organization/TypeOfPractice'
import Network from '~/models/Network/Network'
import NetworkOrganization from '~/models/Network/NetworkOrganization'
import OrganizationArticle from '~/models/Organization/OrganizationArticle'
import File from '~/models/Core/File'

const { em, pending: emPending } = useEntityManager()

const id: number | null = useOrganizationProfileStore().id
if (id === null) {
  throw new Error('Missing organization id')
}

const { fetch } = useEntityFetch()

const { pending } = fetch(Organization, id)

// Get file from store
const organization: ComputedRef<Organization> = computed(() => {
  return em.find(Organization, id)
})

// TODO: restaurer le middleware  (peut-être utiliser beforeMount?)
// middleware({ $ability, redirect }) {
//   if(!$ability.can('display', 'organization_page'))
//     return redirect('/error')
// }

onBeforeUnmount(() => {
  console.log('flush store') // TODO: vérifier le bon fonctionnement
  em.flush(Organization)
  em.flush(ContactPoint)
  em.flush(BankAccount)
  em.flush(OrganizationAddressPostal)
  em.flush(AddressPostal)
  em.flush(Country)
  em.flush(TypeOfPractice)
  em.flush(Network)
  em.flush(NetworkOrganization)
  em.flush(OrganizationArticle)
  em.flush(File)
})
</script>
