<script lang="ts">
  import type {TrustedEvent} from "@welshman/util"
  import Button from "@lib/components/Button.svelte"
  import Icon from "@lib/components/Icon.svelte"
  import Bookmark from "@assets/icons/bookmark.svg?dataurl"
  import BookmarkListPicker from "@app/components/BookmarkListPicker.svelte"
  import {pushModal} from "@app/util/modal"

  type Props = {
    event: TrustedEvent
  }

  const {event}: Props = $props()

  const bookmark = () => pushModal(BookmarkListPicker, {event})
</script>

<li>
  <Button onclick={bookmark}>
    <Icon size={4} icon={Bookmark} />
    Bookmark
  </Button>
</li>
