<script lang="ts">
  import {onMount} from "svelte"
  import {get} from "svelte/store"
  import {page} from "$app/stores"
  import type {MakeNonOptional} from "@welshman/lib"
  import {append, uniq} from "@welshman/lib"
  import {pubkey} from "@welshman/app"
  import Chat from "@app/components/Chat.svelte"
  import EnableNotificationsPrompt from "@app/components/EnableNotificationsPrompt.svelte"
  import {splitChatId} from "@app/core/state"
  import {areNotificationsEnabled, dmNotificationsPrompted} from "@app/util/notifications"
  import {pushModal} from "@app/util/modal"

  const {chat} = $page.params as MakeNonOptional<typeof $page.params>
  const pubkeys = uniq(append($pubkey!, splitChatId(chat)))

  onMount(() => {
    if (!areNotificationsEnabled() && !get(dmNotificationsPrompted)) {
      dmNotificationsPrompted.set(true)
      pushModal(EnableNotificationsPrompt)
    }
  })
</script>

<Chat {pubkeys} />
