<script>
  import { _ } from "svelte-i18n";
import AddStatsClientModal from "./AddStatsClientModal.svelte";
import CopyScanStationTokenModal from "./CopyStatsClientTokenModal.svelte";
  import scanstations_empty from "./statsclients_empty.svg";
  let modal_open = false;
  let copy_modal_open = false;
  let new_client = {};
  let current_clients = [];
</script>

<div class="text-center items-center justify-center">
  <p class="mb-16 text-lg text-gray-500">
    <img class="w-full h-44" src={scanstations_empty} alt="" />
    <span class="font-bold">{$_('you-dont-have-any-scanclients-yet')}.</span><br />
    <span>{$_('add-the-first-statsclient')}</span>
  </p>
</div>

<AddStatsClientModal bind:modal_open bind:current_clients bind:new_client bind:copy_modal_open/>
<CopyScanStationTokenModal bind:copy_modal_open bind:new_client />