<script lang="ts">
  /**
   * Wrapper around 'OpeningHours' so that the latter can deal with the opening_hours object directly
   */
  import { Store, UIEventSource } from "../../../Logic/UIEventSource"
  import type opening_hours from "opening_hours"
  import Translations from "../../i18n/Translations"
  import Loading from "../../Base/Loading.svelte"
  import Tr from "../../Base/Tr.svelte"
  import OpeningHours from "./OpeningHours.svelte"

  export let tags: UIEventSource<Record<string, string>>
  export let opening_hours_obj: Store<opening_hours | "error">
  export let key: string
</script>

{#if $tags._country === undefined}
  <Loading>
    <Tr t={Translations.t.general.opening_hours.loadingCountry} />
  </Loading>
{:else if $opening_hours_obj === undefined}
  <div class="alert">No opening hours defined with key {key}</div>
{:else if $opening_hours_obj === "error"}
  <Tr cls="alert" t={Translations.t.general.opening_hours.error_loading} />
{:else}
  <OpeningHours opening_hours_obj={$opening_hours_obj} />
{/if}
