teilweise/frontend/src/views/HomeView.vue

<script setup lang="ts">
import CreateNewList from '../components/CreateNewList.vue'
import ItemList from '@/components/ItemList.vue'
import ItemListElement from '@/components/ItemListElement.vue'
import { useUserStore } from '@/stores/userStore'
import { useBoardStore } from '@/stores/boardStore'
import { computed } from 'vue'

const userStore = useUserStore()
const boardStore = useBoardStore()

const loggedInUser = computed(() => userStore.getLogedInUser())
const userBoards = computed(() => {
  const user = loggedInUser.value
  return user ? boardStore.getBoardsForUser(user) : []
})
</script>

<template>
  <div class="grid h-full justify-center pt-4">
    <div class="flex flex-col gap-4">
      <ItemList v-if="userBoards.length > 0" title="Meine Listen">
        <router-link v-for="board in userBoards" :key="board.guid" :to="'/boards/' + board.guid">
          <ItemListElement
            :title="board.name"
            :subtitle="board.getUsers().length + ' Mitglieder'"
          />
        </router-link>
      </ItemList>
      <CreateNewList></CreateNewList>
    </div>
  </div>
</template>