feat: Add event details in roster builder

- Added `webhookBotProfilePicture` field to
  `TeamDiscordIntegrationSchema`.
- Updated `DiscordIntegrationForm.vue` to include profile picture input.
- Created migration to add `webhook_bot_profile_picture` column.
- Updated `Team` model to handle new profile picture field.
- Modified `TeamDiscordIntegration` and `TeamDiscordIntegrationSchema`
  to include the new profile picture attribute.

availabili.tf/src/client/index.ts

@@ -16,7 +16,8 @@ export type { CreateEventJson } from './models/CreateEventJson';
 export type { CreateTeamJson } from './models/CreateTeamJson';
 export type { EditMemberRolesJson } from './models/EditMemberRolesJson';
 export type { EventSchema } from './models/EventSchema';
-export type { EventSchemaList } from './models/EventSchemaList';
+export type { EventWithPlayerSchema } from './models/EventWithPlayerSchema';
+export type { EventWithPlayerSchemaList } from './models/EventWithPlayerSchemaList';
 export type { GetEventPlayersResponse } from './models/GetEventPlayersResponse';
 export type { PlayerEventRolesSchema } from './models/PlayerEventRolesSchema';
 export type { PlayerRoleSchema } from './models/PlayerRoleSchema';

availabili.tf/src/client/models/EventSchemaList.ts

@@ -1,6 +0,0 @@
-/* generated using openapi-typescript-codegen -- do not edit */
-/* istanbul ignore file */
-/* tslint:disable */
-/* eslint-disable */
-import type { EventSchema } from './EventSchema';
-export type EventSchemaList = Array<EventSchema>;

availabili.tf/src/client/models/EventWithPlayerSchema.ts

@@ -0,0 +1,11 @@
+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { EventSchema } from './EventSchema';
+import type { PlayerEventRolesSchema } from './PlayerEventRolesSchema';
+export type EventWithPlayerSchema = {
+    event: EventSchema;
+    playerEvent: (PlayerEventRolesSchema | null);
+};
+

availabili.tf/src/client/models/EventWithPlayerSchemaList.ts

@@ -0,0 +1,6 @@
+/* generated using openapi-typescript-codegen -- do not edit */
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+import type { EventWithPlayerSchema } from './EventWithPlayerSchema';
+export type EventWithPlayerSchemaList = Array<EventWithPlayerSchema>;

availabili.tf/src/client/models/TeamDiscordIntegrationSchema.ts

@@ -4,6 +4,7 @@
 /* eslint-disable */
 export type TeamDiscordIntegrationSchema = {
     webhookBotName: string;
+    webhookBotProfilePicture: (string | null);
     webhookUrl: string;
 };
 

availabili.tf/src/client/services/DefaultService.ts

@@ -7,7 +7,8 @@ import type { CreateEventJson } from '../models/CreateEventJson';
 import type { CreateTeamJson } from '../models/CreateTeamJson';
 import type { EditMemberRolesJson } from '../models/EditMemberRolesJson';
 import type { EventSchema } from '../models/EventSchema';
-import type { EventSchemaList } from '../models/EventSchemaList';
+import type { EventWithPlayerSchema } from '../models/EventWithPlayerSchema';
+import type { EventWithPlayerSchemaList } from '../models/EventWithPlayerSchemaList';
 import type { GetEventPlayersResponse } from '../models/GetEventPlayersResponse';
 import type { PlayerSchema } from '../models/PlayerSchema';
 import type { PutScheduleForm } from '../models/PutScheduleForm';
@@ -50,12 +51,12 @@ export class DefaultService {
     /**
      * get_team_events <GET>
      * @param teamId
-     * @returns EventSchemaList OK
+     * @returns EventWithPlayerSchemaList OK
      * @throws ApiError
      */
     public getTeamEvents(
         teamId: number,
-    ): CancelablePromise<EventSchemaList> {
+    ): CancelablePromise<EventWithPlayerSchemaList> {
         return this.httpRequest.request({
             method: 'GET',
             url: '/api/events/team/id/{team_id}',
@@ -128,6 +129,46 @@ export class DefaultService {
             },
         });
     }
+    /**
+     * unattend_event <DELETE>
+     * @param eventId
+     * @returns EventWithPlayerSchema OK
+     * @throws ApiError
+     */
+    public unattendEvent(
+        eventId: number,
+    ): CancelablePromise<EventWithPlayerSchema> {
+        return this.httpRequest.request({
+            method: 'DELETE',
+            url: '/api/events/{event_id}/attendance',
+            path: {
+                'event_id': eventId,
+            },
+            errors: {
+                422: `Unprocessable Content`,
+            },
+        });
+    }
+    /**
+     * attend_event <PUT>
+     * @param eventId
+     * @returns EventWithPlayerSchema OK
+     * @throws ApiError
+     */
+    public attendEvent(
+        eventId: number,
+    ): CancelablePromise<EventWithPlayerSchema> {
+        return this.httpRequest.request({
+            method: 'PUT',
+            url: '/api/events/{event_id}/attendance',
+            path: {
+                'event_id': eventId,
+            },
+            errors: {
+                422: `Unprocessable Content`,
+            },
+        });
+    }
     /**
      * get_event_players <GET>
      * @param eventId
@@ -165,52 +206,6 @@ export class DefaultService {
             },
         });
     }
-    /**
-     * unattend_event <DELETE>
-     * @param eventId
-     * @param teamId
-     * @returns void
-     * @throws ApiError
-     */
-    public deleteApiEventsEventIdTeamIdTeamIdAttendance(
-        eventId: number,
-        teamId: number,
-    ): CancelablePromise<void> {
-        return this.httpRequest.request({
-            method: 'DELETE',
-            url: '/api/events/{event_id}/team/id/{team_id}/attendance',
-            path: {
-                'event_id': eventId,
-                'team_id': teamId,
-            },
-            errors: {
-                422: `Unprocessable Content`,
-            },
-        });
-    }
-    /**
-     * attend_event <PUT>
-     * @param eventId
-     * @param teamId
-     * @returns void
-     * @throws ApiError
-     */
-    public putApiEventsEventIdTeamIdTeamIdAttendance(
-        eventId: number,
-        teamId: number,
-    ): CancelablePromise<void> {
-        return this.httpRequest.request({
-            method: 'PUT',
-            url: '/api/events/{event_id}/team/id/{team_id}/attendance',
-            path: {
-                'event_id': eventId,
-                'team_id': teamId,
-            },
-            errors: {
-                422: `Unprocessable Content`,
-            },
-        });
-    }
     /**
      * logout <DELETE>
      * @returns void

availabili.tf/src/components/DiscordIntegrationForm.vue

@@ -16,6 +16,7 @@ function enableIntegration() {
   model.value = {
     webhookUrl: "",
     webhookBotName: "",
+    webhookBotProfilePicture: null,
   };
   saveIntegration();
 }
@@ -38,6 +39,10 @@ function disableIntegration() {
       <h3>Webhook Bot Name</h3>
       <input v-model="model.webhookBotName">
     </div>
+    <div class="form-group margin">
+      <h3>Webhook Bot Profile Picture URL (optional)</h3>
+      <input v-model="model.webhookBotProfilePicture">
+    </div>
     <div class="form-group margin">
       <div class="action-buttons">
         <button class="destructive-on-hover" @click="disableIntegration">

availabili.tf/src/components/EventCard.vue

@@ -1,15 +1,19 @@
 <script setup lang="ts">
-import type { EventSchema } from "@/client";
+import type { EventSchema, EventWithPlayerSchema } from "@/client";
+import { useRosterStore } from "@/stores/roster";
 import { useTeamsStore } from "@/stores/teams";
+import { useTeamsEventsStore } from "@/stores/teams/events";
 import moment from "moment";
 import { computed } from "vue";
 
 const teamsStore = useTeamsStore();
+const rosterStore = useRosterStore();
+const teamEventsStore = useTeamsEventsStore();
 
-const date = computed(() => moment(props.event.startTime));
+const date = computed(() => moment(props.event.event.startTime));
 
 const formattedTime = computed(() => {
-  const team = teamsStore.teams[props.event.teamId];
+  const team = teamsStore.teams[props.event.event.teamId];
   const offsetDate = date.value.clone().tz(team.tzTimezone);
   return `${date.value.format("LT")} (${offsetDate.format("LT z")})`;
 });
@@ -23,8 +27,24 @@ const shortMonth = computed(() => {
 });
 
 const props = defineProps<{
-  event: EventSchema;
+  event: EventWithPlayerSchema;
 }>();
+
+function attend() {
+  teamEventsStore.attendEvent(props.event.event.id);
+}
+
+function unattend() {
+  teamEventsStore.unattendEvent(props.event.event.id);
+}
+
+function attendOrUnattend() {
+  if (props.event.playerEvent?.hasConfirmed) {
+    unattend();
+  } else {
+    attend();
+  }
+}
 </script>
 
 <template>
@@ -39,7 +59,7 @@ const props = defineProps<{
     </div>
     <div class="details">
       <div>
-        <h3>{{ event.name }}</h3>
+        <h3>{{ event.event.name }}</h3>
         <div>
           <span>
             <i class="bi bi-clock-fill margin" />
@@ -48,11 +68,33 @@ const props = defineProps<{
         </div>
       </div>
       <div class="subdetails">
-        <span v-if="event.description">{{ event.description }}</span>
+        <span v-if="event.event.description">{{ event.event.description }}</span>
         <em v-else class="subtext">No description provided.</em>
-        <button class="class-info">
-          <i class="tf2class tf2-PocketScout margin" />
-          Accept as Pocket Scout
+      </div>
+      <div class="button-group">
+        <button
+          @click="attendOrUnattend()"
+          v-if="event.playerEvent"
+          :class="{
+            'class-info': true,
+            'confirmed': event.playerEvent.hasConfirmed,
+          }"
+        >
+          <template v-if="!event.playerEvent.hasConfirmed">
+            <i class="bi bi-check2" />
+            Confirm
+          </template>
+          <template v-else>
+            <i class="bi bi-check2-all" />
+            Confirmed
+          </template>
+          <span v-if="event.playerEvent.role">
+            as {{ rosterStore.roleNames[event.playerEvent.role.role] }}
+          </span>
+        </button>
+        <button @click="attend" v-else>
+          <i class="bi bi-check2" />
+          Attend
         </button>
       </div>
     </div>
@@ -62,11 +104,8 @@ const props = defineProps<{
 <style scoped>
 .event-card {
   display: flex;
-  padding: 1rem;
   align-items: center;
   /*background-color: white;*/
-  border: 1px solid var(--text);
-  border-radius: 8px;
   align-items: stretch;
 }
 
@@ -77,6 +116,10 @@ const props = defineProps<{
   justify-content: center;
   line-height: 1;
   flex-basis: 4rem;
+  padding: 1rem;
+  background-color: var(--text);
+  color: var(--base);
+  border-radius: 8px 0 0 8px;
 }
 
 .date .month {
@@ -91,8 +134,12 @@ const props = defineProps<{
 }
 
 .details {
+  padding: 1rem;
+  border: 1px solid var(--text);
+  border-radius: 0 8px 8px 0;
   display: flex;
   flex-direction: column;
+  width: 100%;
   gap: 0.5rem;
 }
 
@@ -110,4 +157,15 @@ const props = defineProps<{
   font-size: 1.2rem;
   vertical-align: middle;
 }
+
+.button-group {
+  display: flex;
+  gap: 0.5rem;
+  justify-content: flex-end;
+}
+
+button.confirmed {
+  background-color: var(--text);
+  color: var(--base);
+}
 </style>

availabili.tf/src/components/EventList.vue

@@ -1,15 +1,15 @@
 <script setup lang="ts">
-import type { EventSchema } from "@/client";
+import type { EventWithPlayerSchema } from "@/client";
 import EventCard from "./EventCard.vue";
 
 const props = defineProps<{
-  events: EventSchema[];
+  events: EventWithPlayerSchema[];
 }>();
 </script>
 
 <template>
   <div class="events-list" v-if="props.events?.length > 0">
-    <EventCard v-for="event in props.events" :key="event.id" :event="event" />
+    <EventCard v-for="event in props.events" :key="event.event.id" :event="event" />
   </div>
   <div class="events-list" v-else>
     <em class="subtext">No upcoming events.</em>

availabili.tf/src/components/EventSchedulerForm.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import { useRosterStore } from "@/stores/roster";
+import moment from "moment";
+import { useRoute, useRouter } from "vue-router";
+
+const route = useRoute();
+const router = useRouter();
+
+const rosterStore = useRosterStore();
+
+function saveRoster() {
+  rosterStore.saveRoster(Number(route.params.teamId))
+    .then(() => {
+      router.push({
+        name: "team-details",
+        params: {
+          id: route.params.teamId
+        }
+      });
+    });
+}
+</script>
+
+<template>
+  <div class="event-scheduler-container">
+    <h1 class="roster-title">
+      Roster for Snus Brotherhood
+    </h1>
+    <div v-if="rosterStore.startTime">
+      <span class="aside date">
+        {{ moment.unix(rosterStore.startTime).format("LL LT") }}
+      </span>
+    </div>
+    <div class="form-group margin">
+      <h3>Event Name</h3>
+      <input v-model="rosterStore.title" />
+    </div>
+    <div class="form-group margin">
+      <h3>Description (optional)</h3>
+      <input v-model="rosterStore.description" />
+    </div>
+    <div class="form-group margin">
+      <div class="action-buttons">
+        <button class="accent" @click="saveRoster">Save roster</button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+em.aside.date {
+  font-size: 11pt;
+}
+</style>

availabili.tf/src/composables/event-form.ts

@@ -0,0 +1,14 @@
+import type { PlayerRoleSchema } from "@/client";
+import { ref } from "vue";
+
+export function useEventForm() {
+  const title = ref("");
+  const description = ref("");
+  const players = ref<PlayerRoleSchema[]>([]);
+
+  return {
+    title,
+    description,
+    players,
+  }
+}

availabili.tf/src/stores/roster.ts

@@ -6,6 +6,7 @@ import { type EventSchema, type CreateEventJson, type PlayerRoleSchema } from "@
 import { useTeamDetails } from "@/composables/team-details";
 import moment from "moment";
 import { useRoute, useRouter } from "vue-router";
+import { useEventForm } from "@/composables/event-form";
 
 export const useRosterStore = defineStore("roster", () => {
   const clientStore = useClientStore();
@@ -169,6 +170,8 @@ export const useRosterStore = defineStore("roster", () => {
 
   const startTime = ref<number>();
 
+  const { title, description } = useEventForm();
+
   function saveRoster(teamId: number) {
     if (startTime.value == undefined) {
       throw new Error("No start time set");
@@ -176,8 +179,8 @@ export const useRosterStore = defineStore("roster", () => {
 
     if (!currentEvent.value) {
       const body: CreateEventJson = {
-        name: "Test",
-        description: "test description",
+        name: title.value,
+        description: description.value,
         startTime: startTime.value.toString(),
         playerRoles: Object.values(selectedPlayers).map((player) => ({
           player: {
@@ -191,12 +194,10 @@ export const useRosterStore = defineStore("roster", () => {
         })),
       };
 
-      clientStore.client.default.createEvent(teamId, body)
-        .then(() => {
-
-        });
+      return clientStore.client.default.createEvent(teamId, body);
     } else {
       // TODO: update event
+      throw "Not implemented";
     }
   }
 
@@ -217,5 +218,7 @@ export const useRosterStore = defineStore("roster", () => {
     fetchPlayersFromEvent,
     startTime,
     saveRoster,
+    title,
+    description,
   }
 });

availabili.tf/src/stores/teams/events.ts

@@ -1,45 +1,62 @@
 import { defineStore } from "pinia";
 import { useClientStore } from "../client";
-import type { EventSchema, EventSchemaList } from "@/client";
+import type { EventWithPlayerSchema } from "@/client";
 import { useEventsStore } from "../events";
-import { computed } from "vue";
+import { computed, reactive } from "vue";
 
 export const useTeamsEventsStore = defineStore("teamsEvents", () => {
   const clientStore = useClientStore();
   const client = clientStore.client;
-  const eventsStore = useEventsStore();
+  //const eventsStore = useEventsStore();
 
-  const teamEvents = computed(() => {
-    console.log("Recomputing teamEvents");
+  const teamEvents = reactive<{ [teamId: number]: EventWithPlayerSchema[] }>({ });
+  //const teamEvents = computed(() => {
+  //  console.log("Recomputing teamEvents");
 
-    // map events to objects with teamId as key, and array of events as value
-    return eventsStore.events
-      .reduce((acc, event) => {
-        if (!acc[event.teamId]) {
-          acc[event.teamId] = [];
-        }
-        acc[event.teamId].push(event);
-        return acc;
-      }, { } as { [teamId: number]: EventSchema[] });
-  });
+  //  // map events to objects with teamId as key, and array of events as value
+  //  return eventsStore.events
+  //    .reduce((acc, event) => {
+  //      if (!acc[event.teamId]) {
+  //        acc[event.teamId] = [];
+  //      }
+  //      acc[event.teamId].push(event);
+  //      return acc;
+  //    }, { } as { [teamId: number]: EventSchema[] });
+  //});
 
   function fetchTeamEvents(teamId: number) {
     return clientStore.call(
       fetchTeamEvents.name,
       () => client.default.getTeamEvents(teamId),
-      (result: EventSchemaList) => {
-        result.forEach((event) => {
-          // insert into event store
-          //eventsStore.events[event.id] = event;
-          eventsStore.events.push(event);
-        });
+      (result: EventWithPlayerSchema[]) => {
+        teamEvents[teamId] = result;
         return result;
       }
     );
   }
 
+  function attendEvent(eventId: number) {
+    client.default.attendEvent(eventId)
+      .then((response) => {
+        let index = teamEvents[response.event.teamId]
+          .findIndex((event) => event.event.id == response.event.id);
+        teamEvents[response.event.teamId][index] = response;
+      });
+  }
+
+  function unattendEvent(eventId: number) {
+    client.default.unattendEvent(eventId)
+      .then((response) => {
+        let index = teamEvents[response.event.teamId]
+          .findIndex((event) => event.event.id == response.event.id);
+        teamEvents[response.event.teamId][index].playerEvent = null;
+      });
+  }
+
   return {
     teamEvents,
     fetchTeamEvents,
+    attendEvent,
+    unattendEvent,
   }
 });

availabili.tf/src/views/RosterBuilderView.vue

@@ -1,12 +1,11 @@
 <script setup lang="ts">
 import PlayerCard from "../components/PlayerCard.vue";
-import RoleSlot from "../components/RoleSlot.vue";
-import PlayerTeamRole from "../player.ts";
 import { computed, reactive, onMounted } from "vue";
 import { useRosterStore } from "../stores/roster";
 import { useRoute } from "vue-router";
 import moment from "moment";
 import { useEventsStore } from "@/stores/events";
+import EventSchedulerForm from "@/components/EventSchedulerForm.vue";
 
 const rosterStore = useRosterStore();
 const eventsStore = useEventsStore();
@@ -23,10 +22,6 @@ const hasAlternates = computed(() => {
 
 const eventId = computed<number | undefined>(() => Number(route.params.eventId));
 
-function saveRoster() {
-  rosterStore.saveRoster(Number(route.params.teamId));
-}
-
 onMounted(async () => {
   if (eventId.value) {
     const event = await eventsStore.fetchEvent(eventId.value);
@@ -42,26 +37,19 @@ onMounted(async () => {
 <template>
   <main>
     <div class="top">
-      <h1 class="roster-title">
-        Roster for Snus Brotherhood
-        <em class="aside date" v-if="rosterStore.startTime">
-          @
-          {{ moment.unix(rosterStore.startTime).format("L LT") }}
-        </em>
-      </h1>
-      <div class="button-group">
-        <button>Cancel</button>
-        <button class="accent" @click="saveRoster">Save Roster</button>
-      </div>
+      <a>
+        <i class="bi bi-arrow-left" />
+        Back
+      </a>
     </div>
     <div class="columns">
-      <div class="column">
+      <div class="form-group margin column">
         <PlayerCard v-for="role in rosterStore.neededRoles"
                     :player="rosterStore.selectedPlayers[role]"
                     :role-title="role"
                     is-roster />
       </div>
-      <div class="column">
+      <div class="form-group margin column" v-if="rosterStore.selectedRole">
         <PlayerCard v-for="player in rosterStore.mainRoles"
                     :player="player"
                     :role-title="player.role" />
@@ -75,6 +63,15 @@ onMounted(async () => {
         <PlayerCard v-if="rosterStore.selectedRole"
                     is-ringer
                     :role-title="rosterStore.selectedRole" />
+        <div class="action-buttons">
+          <button class="accent">
+            <i class="bi bi-check" />
+            Done
+          </button>
+        </div>
+      </div>
+      <div class="column" v-else>
+        <EventSchedulerForm />
       </div>
     </div>
   </main>
@@ -120,9 +117,4 @@ onMounted(async () => {
   display: flex;
   gap: 0.5em;
 }
-
-em.aside.date {
-  font-size: 14px;
-  vertical-align: middle;
-}
 </style>

backend-flask/events.py

@@ -7,12 +7,14 @@
 
 
 from datetime import datetime
+from typing import Optional
 
 from flask import Blueprint, abort, make_response
 from spectree import Response
+from sqlalchemy import Row
 from sqlalchemy.sql import tuple_
 from models.player import Player
-from models.player_event import PlayerEvent, PlayerEventRolesSchema
+from models.player_event import EventWithPlayerSchema, PlayerEvent, PlayerEventRolesSchema
 from models.player_team_availability import PlayerTeamAvailability
 from models.player_team_role import PlayerRoleSchema, PlayerTeamRole
 from models.team import Team
@@ -43,23 +45,30 @@ def get_event(event_id: int):
 @api_events.get("/team/id/<int:team_id>")
 @spec.validate(
     resp=Response(
-        HTTP_200=list[EventSchema],
+        HTTP_200=list[EventWithPlayerSchema],
     ),
     operation_id="get_team_events",
 )
-def get_team_events(team_id: int):
-    events = db.session.query(
-        Event
-    ).filter(
+@requires_authentication
+@requires_team_membership()
+def get_team_events(player_team: PlayerTeam, team_id: int, **_):
+    rows = db.session.query(
+        Event, PlayerEvent
+    ).outerjoin(
+        PlayerEvent,
+        (PlayerEvent.event_id == Event.id) & (PlayerEvent.player_id == player_team.player_id)
+    ).where(
         Event.team_id == team_id
     ).order_by(
         Event.start_time
     ).all()
 
-    def map_to_schema(event: Event):
-        return EventSchema.from_model(event).dict(by_alias=True)
+    def map_to_schema(row: Row[tuple[Event, PlayerEvent]]):
+        return EventWithPlayerSchema.from_event_player_event(
+            *row.tuple()
+        ).dict(by_alias=True)
 
-    return list(map(map_to_schema, events))
+    return list(map(map_to_schema, rows))
 
 @api_events.get("/user/id/<int:user_id>")
 def get_user_events(user_id: int):
@@ -129,28 +138,33 @@ def create_event(player_team: PlayerTeam, team_id: int, json: CreateEventJson, *
 @api_events.put("/<int:event_id>/attendance")
 @spec.validate(
     resp=Response(
-        HTTP_204=None,
-    )
+        HTTP_200=EventWithPlayerSchema,
+    ),
+    operation_id="attend_event",
 )
 @requires_authentication
-@requires_team_membership()
-def attend_event(player_team: PlayerTeam, event_id: int, **_):
+def attend_event(player: Player, event_id: int, **_):
+    event = db.session.query(Event).where(Event.id == event_id).one_or_none()
+
+    if not event:
+        abort(404)
+
+    assert_team_membership(player, event.team)
+
     player_event = db.session.query(
         PlayerEvent
     ).where(
         PlayerEvent.event_id == event_id
     ).where(
-        PlayerEvent.player_id == player_team.player_id
+        PlayerEvent.player_id == player.steam_id
     ).join(
         Event
-    ).where(
-        Event.team_id == player_team.team_id
     ).one_or_none()
 
     if not player_event:
         player_event = PlayerEvent()
         player_event.event_id = event_id
-        player_event.player_id = player_team.player_id
+        player_event.player_id = player.steam_id
         db.session.add(player_event)
 
     player_event.has_confirmed = True
@@ -159,27 +173,28 @@ def attend_event(player_team: PlayerTeam, event_id: int, **_):
 
     player_event.event.update_discord_message()
 
-    return make_response({ }, 204)
+    return EventWithPlayerSchema.from_event_player_event(
+        player_event.event,
+        player_event,
+    ).dict(by_alias=True)
 
 @api_events.delete("/<int:event_id>/attendance")
 @spec.validate(
     resp=Response(
-        HTTP_204=None,
-    )
+        HTTP_200=EventWithPlayerSchema,
+    ),
+    operation_id="unattend_event",
 )
 @requires_authentication
-@requires_team_membership()
-def unattend_event(player_team: PlayerTeam, event_id: int, **_):
+def unattend_event(player: Player, event_id: int, **_):
     result = db.session.query(
         PlayerEvent, Event
     ).where(
-        PlayerEvent.event_id == event_id
-    ).where(
-        PlayerEvent.player_id == player_team.player_id
+        PlayerEvent.player_id == player.steam_id
     ).join(
         Event
     ).where(
-        Event.team_id == player_team.team_id
+        Event.id == event_id
     ).one_or_none()
 
     if not result:
@@ -192,7 +207,10 @@ def unattend_event(player_team: PlayerTeam, event_id: int, **_):
 
     event.update_discord_message()
 
-    return make_response({ }, 204)
+    return EventWithPlayerSchema.from_event_player_event(
+        event,
+        None,
+    ).dict(by_alias=True)
 
 class GetEventPlayersResponse(BaseModel):
     players: list[PlayerEventRolesSchema]

backend-flask/migrations/versions/c242e3f99c64_add_webhook_profile_picture.py

@@ -0,0 +1,32 @@
+"""Add webhook profile picture
+
+Revision ID: c242e3f99c64
+Revises: 286ee26b9e5d
+Create Date: 2024-11-27 10:40:39.027786
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = 'c242e3f99c64'
+down_revision = '286ee26b9e5d'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table('team_discord_integrations', schema=None) as batch_op:
+        batch_op.add_column(sa.Column('webhook_bot_profile_picture', sa.String(), nullable=True))
+
+    # ### end Alembic commands ###
+
+
+def downgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table('team_discord_integrations', schema=None) as batch_op:
+        batch_op.drop_column('webhook_bot_profile_picture')
+
+    # ### end Alembic commands ###

backend-flask/models/event.py

@@ -1,4 +1,5 @@
 from datetime import datetime
+import threading
 from sqlalchemy.orm import mapped_column, relationship
 from sqlalchemy.orm.attributes import Mapped
 from sqlalchemy.orm.properties import ForeignKey
@@ -63,7 +64,7 @@ class Event(app_db.BaseModel):
             f"<t:{start_timestamp}:f>",
             "\n".join(players_info),
             "",
-            "[Confirm availability here]" +
+            "[Confirm attendance here]" +
                 f"(https://availabili.tf/team/id/{self.team.id}/events/{self.id})",
         ])
 
@@ -81,16 +82,23 @@ class Event(app_db.BaseModel):
             return DiscordWebhook(
                 integration.webhook_url,
                 id=str(self.discord_message_id),
+                username=integration.webhook_bot_name,
+                avatar_url=integration.webhook_bot_profile_picture,
             )
         else:
-            return DiscordWebhook(integration.webhook_url)
+            return DiscordWebhook(
+                integration.webhook_url,
+                username=integration.webhook_bot_name,
+                avatar_url=integration.webhook_bot_profile_picture,
+            )
 
     def update_discord_message(self):
         webhook = self.get_or_create_webhook()
         if webhook:
             webhook.content = self.get_discord_content()
             if webhook.id:
-                webhook.edit()
+                # fire and forget
+                threading.Thread(target=webhook.edit).start()
             else:
                 webhook.execute()
                 if webhook_id := webhook.id:

backend-flask/models/player_event.py

@@ -26,6 +26,24 @@ class PlayerEvent(app_db.BaseModel):
     )
     role: Mapped["PlayerTeamRole"] = relationship("PlayerTeamRole")
 
+class EventWithPlayerSchema(spec.BaseModel):
+    event: "EventSchema"
+    player_event: Optional["PlayerEventRolesSchema"]
+
+    @classmethod
+    def from_event_player_event(cls, event: "Event", player_event: Optional["PlayerEvent"]):
+        res = cls(
+            event=EventSchema.from_model(event),
+            player_event=None,
+        )
+
+        if player_event:
+            res.player_event = PlayerEventRolesSchema.from_event_player_team(
+                player_event, player_event.player_team
+            )
+
+        return res
+
 class PlayerEventRolesSchema(spec.BaseModel):
     player: "PlayerSchema"
     role: Optional["RoleSchema"]
@@ -44,7 +62,7 @@ class PlayerEventRolesSchema(spec.BaseModel):
         )
 
 
-from models.event import Event
+from models.event import Event, EventSchema
 from models.player import Player, PlayerSchema
 from models.player_team_role import PlayerTeamRole, RoleSchema
 from models.player_team import PlayerTeam

backend-flask/models/team.py

@@ -36,7 +36,6 @@ class Team(app_db.BaseModel):
 
     def update_integrations(self, integrations: "TeamIntegrationSchema"):
         if integrations.discord_integration:
-            print("DISCORD!!!")
             discord_integration = self.discord_integration \
                 or TeamDiscordIntegration()
             discord_integration.webhook_url = integrations \
@@ -44,6 +43,10 @@ class Team(app_db.BaseModel):
             discord_integration.webhook_bot_name = integrations \
                 .discord_integration.webhook_bot_name
 
+            if integrations.discord_integration.webhook_bot_profile_picture:
+                discord_integration.webhook_bot_profile_picture = integrations \
+                    .discord_integration.webhook_bot_profile_picture
+
             if discord_integration.team_id is None:
                 discord_integration.team_id = self.id
                 app_db.db.session.add(discord_integration)

backend-flask/models/team_integration.py

@@ -1,3 +1,4 @@
+from typing import Optional
 from sqlalchemy.orm import mapped_column, relationship
 from sqlalchemy.orm.attributes import Mapped
 from sqlalchemy.orm.properties import ForeignKey
@@ -12,18 +13,21 @@ class TeamDiscordIntegration(app_db.BaseModel):
     team_id: Mapped[int] = mapped_column(ForeignKey("teams.id"), primary_key=True)
     webhook_url: Mapped[str] = mapped_column(String)
     webhook_bot_name: Mapped[str] = mapped_column(String)
+    webhook_bot_profile_picture: Mapped[str] = mapped_column(String(255), nullable=True)
 
     team: Mapped["Team"] = relationship("Team", back_populates="discord_integration")
 
 class TeamDiscordIntegrationSchema(spec.BaseModel):
     webhook_url: str
     webhook_bot_name: str
+    webhook_bot_profile_picture: Optional[str]
 
     @classmethod
     def from_model(cls, model: TeamDiscordIntegration) -> "TeamDiscordIntegrationSchema":
         return cls(
             webhook_url=model.webhook_url,
             webhook_bot_name=model.webhook_bot_name,
+            webhook_bot_profile_picture=model.webhook_bot_profile_picture,
         )
 
 class TeamLogsTfIntegration(app_db.BaseModel):