<script lang="ts">
    import type { GuildEntry, PostEntry } from "$lib/backend";
    import Feed from "$lib/Feed.svelte";
    import GuildAbout from "$lib/GuildAbout.svelte";
    import GuildMenu from "$lib/GuildMenu.svelte";
    import SLayout from "$lib/SLayout.svelte";

    let { data } : { data: { guild: GuildEntry , feed: PostEntry[] } } = $props();
    let { guild, feed = [] } = $derived(data);

</script>

<SLayout title={guild.display_name? `${guild.display_name} (+${guild.name})` :`+${guild.name}`}>
  <Feed posts={feed} />

  {#snippet left()}
    <GuildMenu {guild} />
  {/snippet}

  {#snippet right()}
    <GuildAbout {guild} />
  {/snippet}
</SLayout>