<template>
  <template v-if="authStore.isSuperuser">
    <AddShowModal ref="addShowModal" v-bind="attrs" />

    <button
      type="button"
      :data-testid="testId"
      class="btn btn-default md:tw-whitespace-nowrap"
      @click="addShowModal.open()"
    >
      {{ t('showCreator.title') }}
    </button>
  </template>
</template>

<script lang="ts" setup>
import { ref, useAttrs } from 'vue'

import AddShowModal from './AddShowModal.vue'
import { useI18n } from '@/i18n'
import { useAuthStore } from '@/stores/auth'

defineOptions({
  inheritAttrs: false,
})

defineProps<{
  testId?: string
}>()

const attrs = useAttrs()
const authStore = useAuthStore()
const { t } = useI18n()

const addShowModal = ref()
</script>