fix(server): fix spawned actors immediately dissapearing, add initial…

… support for chat messages
DanielMcAssey · Jan 14, 2025 · f9098bc · f9098bc
1 parent d063364
commit f9098bc
Show file tree

Hide file tree

Showing 5 changed files with 101 additions and 32 deletions.
diff --git a/GLOKON.Baiters.Client/src/App.vue b/GLOKON.Baiters.Client/src/App.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref, watchEffect, computed, inject, watch } from 'vue';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
 import ApplicationMark from '@/components/ApplicationMark.vue';
 import Banner from '@/components/Banner.vue';
 import Dropdown from '@/components/Dropdown.vue';
@@ -16,6 +16,7 @@ import type { AxiosInstance } from 'axios';
 import { useToast } from 'primevue/usetoast';
 
 const auth = useAuthStore();
+const router = useRouter();
 const route = useRoute();
 const toast = useToast();
 const showingNavigationDropdown = ref(false);
@@ -71,6 +72,12 @@ watch(() => auth.user, (user) => {
   }
 }, { immediate: true });
 
+router.afterEach(() => {
+  if (auth.user) {
+    fetchServerInfo();
+  }
+});
+
 watchEffect(async () => {
   // TODO: Get this working
   //flashBannerStyle.value = page.props.flash?.bannerStyle || 'success';
@@ -107,7 +114,7 @@ watchEffect(async () => {
                   Actors
                 </NavLink>
                 <NavLink href="/chats" :active="isActiveRoute('/chats/*')">
-                  Chats
+                  Chat
                 </NavLink>
                 <NavLink href="/plugins" :active="isActiveRoute('/plugins/*')">
                   Plugins
@@ -205,7 +212,7 @@ watchEffect(async () => {
               Actors
             </ResponsiveNavLink>
             <ResponsiveNavLink href="/chats" :active="isActiveRoute('/chats/*')">
-              Chats
+              Chat
             </ResponsiveNavLink>
             <ResponsiveNavLink href="/plugins" :active="isActiveRoute('/plugins/*')">
               Plugins

diff --git a/GLOKON.Baiters.Client/src/pages/Actors.vue b/GLOKON.Baiters.Client/src/pages/Actors.vue
@@ -21,7 +21,7 @@ const spawnableItems = computed(() => spawnables.value.map((spawnable) => {
   return {
     label: `Spawn ${spawnable}`,
     icon: 'fas fa-fw fa-wrench',
-    command: () => spawnActor(null, spawnable),
+    command: () => spawnActor(undefined, spawnable),
   };
 }));
 
@@ -79,7 +79,7 @@ function fetchSpawnables(): void {
     });
 }
 
-function spawnActor(event: Event, type: string): void {
+function spawnActor(event: Event | undefined, type: string): void {
   confirm.require({
     target: event?.currentTarget as HTMLElement | undefined,
     group: event ? undefined : 'modal',

diff --git a/GLOKON.Baiters.Client/src/pages/Chats.vue b/GLOKON.Baiters.Client/src/pages/Chats.vue
@@ -1,13 +1,14 @@
 <script setup lang="ts">
 import { inject, onMounted, ref } from "vue";
 import {useToast} from "primevue/usetoast";
-import {useConfirm} from "primevue/useconfirm";
-import DataTable from 'primevue/datatable';
-import Column from 'primevue/column';
+import ColorPicker from 'primevue/colorpicker';
+import VirtualScroller from 'primevue/virtualscroller';
+import Select from 'primevue/select';
 import Button from 'primevue/button';
-import ButtonGroup from 'primevue/buttongroup';
+import InputText from 'primevue/inputtext';
+import InputGroup from 'primevue/inputgroup';
+import InputGroupAddon from 'primevue/inputgroupaddon';
 import type { AxiosInstance } from 'axios';
-const confirm = useConfirm();
 const toast = useToast();
 
 const isLoading = ref(false);
@@ -17,6 +18,11 @@ const results = ref<any[]>([]);
 /* eslint-disable  @typescript-eslint/no-explicit-any */
 const users = ref<any[]>([]);
 
+const defaultMessageColour = '#ff0000';
+const messageColour = ref<string>(defaultMessageColour);
+const userToMessage = ref<number | undefined>(undefined);
+const messageToSend = ref<string>('');
+
 function fetchData(): void {
   isLoading.value = true;
   $http.get(`/api/chats/`)
@@ -71,8 +77,26 @@ function fetchUsers(): void {
     });
 }
 
-function sendMessage(steamId?: string): void {
-  // TODO: Ask for message then send it
+function sendMessage(): void {
+  const steamId = userToMessage.value ?? '';
+  $http.post(`/api/chats/messages/${steamId}`, {
+    message: messageToSend.value.replace('#', ''),
+    colour: messageColour.value,
+  })
+    .then(() => {
+      messageColour.value = defaultMessageColour;
+      messageToSend.value = '';
+      userToMessage.value = undefined;
+    })
+    .catch((err: Error) => {
+      console.error(err, 'Couldn\'t send message');
+      toast.add({
+        severity: 'error',
+        summary: 'Problem Sending Message',
+        detail: 'There was a problem sending the message',
+        life: 10000,
+      });
+    });
 }
 
 onMounted(() => {
@@ -83,26 +107,53 @@ onMounted(() => {
 <template>
   <div class="mx-auto sm:max-w-7xl sm:px-6 lg:px-8">
     <div class="text-xl font-bold leading-tight mb-4 px-4">
-      <i class="fas fa-message mr-2"></i>Chat Messages<span v-if="results" class="ml-1">({{ results.length }})</span>
+      <i class="fas fa-message mr-2"></i>Chat
     </div>
     <div class="bg-white overflow-hidden shadow sm:rounded-lg">
-      <div class="p-4 flex justify-between sm:justify-end gap-2 flex-wrap">
-        <p class="text-sm mr-auto">
-          Here you will the server chat
-        </p>
+      <div class="p-4">
+        <VirtualScroller :items="results" :itemSize="50" class="border border-surface-200 dark:border-surface-700 rounded w-full h-96">
+          <template v-slot:item="{ item, options }">
+            <div :class="['flex items-center p-2', { 'bg-surface-100 dark:bg-surface-700': options.odd }]" style="height: 50px">
+              <p>
+                [<span class="text-blue-400 italic">{{ item.senderId }}</span>]
+              </p>
+              <p class="ml-1 bg-surface-500 px-1 rounded">
+                <span class="font-medium" :style="{ color: '#' + (item.colour.length === 8 ? item.colour.slice(0, -2) : item.colour) }">{{ item.senderName }}:</span>
+              </p>
+              <p class="ml-2">
+                {{ item.message }}
+              </p>
+            </div>
+          </template>
+        </VirtualScroller>
+        <div class="mt-4">
+          <form @submit.prevent="sendMessage">
+            <InputGroup>
+              <Select v-model="userToMessage"
+                      :options="users"
+                      optionLabel="fisherName"
+                      optionValue="steamId"
+                      empty-message="No users in server"
+                      filter
+                      showClear
+                      class="max-w-52"
+                      placeholder="All Players" />
+              <InputText v-model="messageToSend"
+                         type="text"
+                         placeholder="Message to send" />
+              <InputGroupAddon>
+                <ColorPicker v-model="messageColour" class="border rounded-lg border-primary-500" />
+              </InputGroupAddon>
+              <Button type="submit"
+                      icon="fas fa-paper-plane"
+                      :disabled="!messageToSend || messageToSend.length === 0"
+                      label="Send"
+                      severity="success"
+                      v-tooltip.bottom="'Send Letter'" />
+            </InputGroup>
+          </form>
+        </div>
       </div>
-      <DataTable :value="results" data-key="id" paginator :row-hover="true" :loading="isLoading"
-                 :rows="50" :rowsPerPageOptions="[25, 50, 100]" stripedRows responsiveLayout="scroll">
-        <template #empty>
-          No chats found.
-        </template>
-        <template #loading>
-          Loading chats. Please wait&hellip;
-        </template>
-        <Column field="senderName" header="Name" :sortable="true"></Column>
-        <Column field="message" header="Message" :sortable="true"></Column>
-        <Column field="senderId" header="Steam ID" :sortable="true"></Column>
-      </DataTable>
     </div>
   </div>
 </template>
diff --git a/GLOKON.Baiters.Core/Models/Actor/Actor.cs b/GLOKON.Baiters.Core/Models/Actor/Actor.cs
@@ -51,7 +51,7 @@ protected set
 
         public virtual void OnUpdate()
         {
-            if (_despawnAt.HasValue && !IsDespawned && _despawnAt.Value >= DateTimeOffset.UtcNow)
+            if (_despawnAt.HasValue && !IsDespawned && _despawnAt.Value <= DateTimeOffset.UtcNow)
             {
                 IsDespawned = true; // Server tick will clean this actor up
             }

diff --git a/GLOKON.Baiters.Server/Controllers/ChatsController.cs b/GLOKON.Baiters.Server/Controllers/ChatsController.cs
@@ -1,6 +1,7 @@
 using GLOKON.Baiters.Core;
+using GLOKON.Baiters.Core.Constants;
+using GLOKON.Baiters.Core.Models.Chat;
 using GLOKON.Baiters.Server.Requests;
-using GLOKON.Baiters.Server.Responses;
 using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Mvc;
 
@@ -14,7 +15,17 @@ public class ChatsController(GameManager gm) : Controller
         [HttpGet]
         public IActionResult Index()
         {
-            return Ok();
+            // TODO: Add support for chat logs
+            return Ok(new List<ChatLog>
+            {
+                new()
+                {
+                    SenderId = gm.Server.ServerId,
+                    SenderName = "Server",
+                    Message = "Chat Window coming soon…",
+                    Colour = MessageColour.Error,
+                }
+            });
         }
 
         [HttpPost("messages/{steamId?}")]