<template>
  <div>superadmin email</div>

  <div>
    <LayoutContainer>
      <UiLoadingPanel v-if="pending" />

      <div v-else>
        <UiForm
          ref="form"
          :model="AdminAccess"
          :entity="adminAccess"
          :submitActions="submitActions"
        >
          <UiInputText
            field="label"
            v-model="adminAccess.email"
            :rules="rules()"
          />
        </UiForm>
      </div>
    </LayoutContainer>
  </div>
</template>

<script setup lang="ts">
import { useEntityFetch } from '~/composables/data/useEntityFetch'
import { useAccessProfileStore } from '~/stores/accessProfile'
import AdminAccess from '~/models/Access/AdminAccess'

const { fetch } = useEntityFetch()

const accessProfile = useAccessProfileStore()

const id = accessProfile.id
console.log(id)

if (accessProfile.id === null) {
  throw new Error('Missing access profile id')
}

const { data: adminAccess, pending } = fetch(AdminAccess, id)

const i18n = useI18n()

const rules = () => [
  (label: string | null) =>
    (label !== null && label.length > 0) || i18n.t('please_enter_a_value'),
]
</script>
