<:Head>
	<title>Pinafore – Notifications</title>
</:Head>

<Layout page='notifications'>
  {{#if $isUserLoggedIn}}
  <LazyTimeline timeline='notifications' />
  {{else}}
  <HiddenFromSSR>
    <FreeTextLayout>
      <h1>Notifications</h1>

      <p>Your notifications will appear here when logged in.</p>
    </FreeTextLayout>
  </HiddenFromSSR>
  {{/if}}
</Layout>

<script>
  import Layout from './_components/Layout.html'
  import LazyTimeline from './_components/timeline/LazyTimeline.html'
  import FreeTextLayout from './_components/FreeTextLayout.html'
  import { store } from './_store/store.js'
  import HiddenFromSSR from './_components/HiddenFromSSR'

  export default {
    store: () => store,
    components: {
      Layout,
      LazyTimeline,
      FreeTextLayout,
      HiddenFromSSR
    }
  };
</script>