<script lang="ts">
  import CrudPopup from '@components/admin/popup/CrudPopup.svelte';
  import { addDirectInvitation, fetchDirectInvitations } from '@app/admin/directInvitations/directInvitations.ts';

  // states
  let createPopupOpen = $state(false);

  // lifecycle
  $effect(() => {
    fetchDirectInvitations();
  });
</script>

<div>
  <button class="btn btn-soft w-full" onclick={() => (createPopupOpen = true)}>
    <span class="iconify iconify-[heroicons--plus-16-solid]"></span>
    <span>Neue direkte Einladung</span>
  </button>
</div>

<CrudPopup
  texts={{
    title: 'Direkte Einladung erstellen',
    submitButtonTitle: 'Erstellen',
    confirmPopupTitle: 'Direkte Einladung erstellen',
    confirmPopupMessage: 'Bist du sicher, dass die direkte Einladung erstellt werden soll?.'
  }}
  target={null}
  onSubmit={addDirectInvitation}
  bind:open={createPopupOpen}
/>
