wip: planning-slot test

polylan_submitter/src/Home.vue

@@ -4,7 +4,7 @@ import { useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
 import { useTitle } from "@vueuse/core";
 import { useQuery } from "@tanstack/vue-query";
-import { eventGamesQuery } from "@/queries";
+import { eventGamesQuery, eventPlanningQuery } from "@/queries";
 import type { GamesApiListEventGamesResponse } from "./api/types.gen";
 
 interface Props {
@@ -19,6 +19,8 @@ useTitle(computed(() => t("home.title")));
 
 const { data: games, isPending: loading } = useQuery(eventGamesQuery(props.eventPath));
 const hasSteamGames = computed(() => games.value?.some((game) => game.steam_app_id) ?? false);
+const { data: planning } = useQuery(eventPlanningQuery(props.eventPath));
+const hasPlanning = computed(() => !!planning.value?.length);
 const imageErrors = ref<Set<number>>(new Set());
 
 const getHeaderImage = (game: GamesApiListEventGamesResponse[number]) => {
@@ -86,9 +88,13 @@ const goToGame = (game: GamesApiListEventGamesResponse[number]) => {
         </div>
       </div>
 
-      <!-- Link to the Steam games page -->
-      <div v-if="!loading && hasSteamGames" class="text-center mt-12">
-        <RouterLink :to="{ name: 'games', params: { eventPath } }" class="btn btn-outline">
+      <!-- Links to the planning and the Steam games page -->
+      <div v-if="!loading && (hasPlanning || hasSteamGames)" class="flex flex-wrap justify-center gap-4 mt-12">
+        <RouterLink v-if="hasPlanning" :to="{ name: 'planning', params: { eventPath } }" class="btn btn-outline">
+          <i class="mdi mdi-calendar-clock mr-2"></i>
+          {{ t("home.planning") }}
+        </RouterLink>
+        <RouterLink v-if="hasSteamGames" :to="{ name: 'games', params: { eventPath } }" class="btn btn-outline">
           <i class="mdi mdi-steam mr-2"></i>
           {{ t("home.getTheGames") }}
         </RouterLink>