Add applying to event

WebApp/ts/eventView.ts

@@ -1,4 +1,4 @@
-import { getEvent, getMyAccount, unhideElementById } from './generalUseHelpers.js';
+import { getEvent, getMyAccount, unhideElementById, getMyRegisteredEventIds } from './generalUseHelpers.js';
 
 const queryString = window.location.search;
 const urlParams = new URLSearchParams(queryString);
@@ -9,6 +9,7 @@ document.addEventListener("DOMContentLoaded", async () => {
     var container   = document.getElementById("mainContainer");
     const modifyBtn = document.getElementById("editBtn");
     const removeBtn = document.getElementById("removeBtn");
+    const applyBtn = document.getElementById("applyBtn");
     var org_id: number = -1;
 
     try {
@@ -28,11 +29,11 @@ document.addEventListener("DOMContentLoaded", async () => {
     try {
         if (eventId) thisEvent = await getEvent(eventId);
     } catch (err) {
-        if (container !== null) container.innerHTML = `<p class="text-danger">To wydarzenie nie istnieje! <a href="/" style="color:#2898BD;">Powrót -></a></p>`;
+        if (container !== null) container.innerHTML = `<p class="text-danger">To wydarzenie nie istnieje! <a href="/" style="color:#2898BD;">Powr<EFBFBD>t -></a></p>`;
     }
 
     if (thisEvent == null) {
-        if (container !== null) container.innerHTML = `<p class="text-danger">B³¹d we wczytywaniu wydarzenia. <a href="/" style="color:#2898BD;">Powrót -></a></p>`;
+        if (container !== null) container.innerHTML = `<p class="text-danger">Błąd we wczytywaniu wydarzenia. <a href="/" style="color:#2898BD;">Powrót -></a></p>`;
     } else {
 
         const titleText     = document.getElementById(    "titleText") as HTMLElement;
@@ -51,13 +52,20 @@ document.addEventListener("DOMContentLoaded", async () => {
         organizerText.innerHTML = "Organized by: " + thisEvent.organisationName;
 
         if (org_id == thisEvent.organisationId) {
-            // U¿ytkownik jest organizacj¹, która
+            // Użytkownik jest organizacją, która
-            // stworzy³a to wydarzenie
+            // stworzyła to wydarzenie
             unhideElementById(document, "editBtn");
             unhideElementById(document, "removeBtn");
         } else if (org_id == -1) {
-            // U¿ytkownik jest wolontariuszem
+            // Użytkownik jest wolontariuszem
-            unhideElementById(document, "applyBtn");
+            const registeredIds = await getMyRegisteredEventIds();
+            const isRegistered = registeredIds.includes(Number(eventId));
+
+            if (isRegistered) {
+                unhideElementById(document, "leaveBtn");
+            } else {
+                unhideElementById(document, "applyBtn");
+            }
         }
 
         unhideElementById(document, "mainContainer");
@@ -76,7 +84,7 @@ document.addEventListener("DOMContentLoaded", async () => {
             if (!confirmed) return;
 
             try {
-                // Wysy³a ¿¹danie DELETE do API
+                // Wysyła żądanie DELETE do API
                 const response = await fetch(`/api/events/${eventId}`, {
                     method: "DELETE"
                 });
@@ -94,4 +102,32 @@ document.addEventListener("DOMContentLoaded", async () => {
         });
     }
 
-});
+    if (applyBtn) {
+        applyBtn.addEventListener("click", async (e) => {
+            try {
+                const response = await fetch(`/api/events/join/${eventId}`, {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json"
+                    },
+                });
+
+                const result: {
+                    success: boolean;
+                    error_msg?: string;
+                } = await response.json();
+
+                if (result.success) {
+                    (applyBtn as HTMLButtonElement).disabled = true;
+                    (applyBtn as HTMLButtonElement).textContent = "Applied Succesfully";
+                } else {
+                    alert(`Error: ${result.error_msg ?? "Unknown error occurred."}`);
+                }
+            } catch (error) {
+                console.error("Failed to apply:", error);
+                alert("Failed to apply due to a network or server error.");
+            }
+        });
+    }
+
+});

WebApp/ts/generalUseHelpers.ts

@@ -36,9 +36,20 @@ export async function getEvent(id: string): Promise<EventData> {
 export async function getMyAccount(): Promise<MyAccount> {
     const res = await fetch("/api/auth/my_account");
     if (!res.ok) {
-        throw Error("U¿ytkownik niezalogowany!");
+        throw Error("U<EFBFBD>ytkownik niezalogowany!");
     }
     const data = await res.json();
     return data;
 }
 
+export async function getMyRegisteredEventIds(): Promise<number[]> {
+    const res = await fetch("/api/auth/my_events");
+
+    if (!res.ok) {
+        throw Error("Użytkownik niezalogowany!");
+    }
+
+    const events = await res.json();
+
+    return events.map((event: { eventId: number }) => event.eventId);
+}

WebApp/wwwroot/js/eventView.js

@@ -7,7 +7,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
         step((generator = generator.apply(thisArg, _arguments || [])).next());
     });
 };
-import { getEvent, getMyAccount, unhideElementById } from './generalUseHelpers.js';
+import { getEvent, getMyAccount, unhideElementById, getMyRegisteredEventIds } from './generalUseHelpers.js';
 const queryString = window.location.search;
 const urlParams = new URLSearchParams(queryString);
 const eventId = urlParams.get('event');
@@ -15,6 +15,7 @@ document.addEventListener("DOMContentLoaded", () => __awaiter(void 0, void 0, vo
     var container = document.getElementById("mainContainer");
     const modifyBtn = document.getElementById("editBtn");
     const removeBtn = document.getElementById("removeBtn");
+    const applyBtn = document.getElementById("applyBtn");
     var org_id = -1;
     try {
         var user = yield getMyAccount();
@@ -63,7 +64,14 @@ document.addEventListener("DOMContentLoaded", () => __awaiter(void 0, void 0, vo
         }
         else if (org_id == -1) {
             // Użytkownik jest wolontariuszem
-            unhideElementById(document, "applyBtn");
+            const registeredIds = yield getMyRegisteredEventIds();
+            const isRegistered = registeredIds.includes(Number(eventId));
+            if (isRegistered) {
+                unhideElementById(document, "leaveBtn");
+            }
+            else {
+                unhideElementById(document, "applyBtn");
+            }
         }
         unhideElementById(document, "mainContainer");
     }
@@ -96,4 +104,29 @@ document.addEventListener("DOMContentLoaded", () => __awaiter(void 0, void 0, vo
             }
         }));
     }
+    if (applyBtn) {
+        applyBtn.addEventListener("click", (e) => __awaiter(void 0, void 0, void 0, function* () {
+            var _b;
+            try {
+                const response = yield fetch(`/api/events/join/${eventId}`, {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json"
+                    },
+                });
+                const result = yield response.json();
+                if (result.success) {
+                    applyBtn.disabled = true;
+                    applyBtn.textContent = "Applied Succesfully";
+                }
+                else {
+                    alert(`Error: ${(_b = result.error_msg) !== null && _b !== void 0 ? _b : "Unknown error occurred."}`);
+                }
+            }
+            catch (error) {
+                console.error("Failed to apply:", error);
+                alert("Failed to apply due to a network or server error.");
+            }
+        }));
+    }
 }));

WebApp/wwwroot/js/generalUseHelpers.js

@@ -35,3 +35,13 @@ export function getMyAccount() {
         return data;
     });
 }
+export function getMyRegisteredEventIds() {
+    return __awaiter(this, void 0, void 0, function* () {
+        const res = yield fetch("/api/auth/my_events");
+        if (!res.ok) {
+            throw Error("Użytkownik niezalogowany!");
+        }
+        const events = yield res.json();
+        return events.map((event) => event.eventId);
+    });
+}

WebApp/wwwroot/view.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!DOCTYPE html>
 <html lang="pl">
 <head>
     <meta charset="UTF-8">
@@ -64,6 +64,7 @@
             <h4 id="descText"></h4><br />
 
             <button id="applyBtn" class="button hidden-before-load"><span>Apply</span><span>&#11166;</span></button>
+            <button id="leaveBtn" class="button hidden-before-load"><span>Leave</span><span>&#11166;</span></button>
             <button id="editBtn" class="button hidden-before-load"><span>Modify</span><span>&#11166;</span></button>
             <button id="removeBtn" class="button hidden-before-load" style="background-color: red;"><span>Remove permanently</span><span>&#11166;</span></button>