Update requests to use the new composable that avoids chaos

client/.env

@@ -0,0 +1,4 @@
+# If the client is being served by the server itself, set to TRUE.
+# If you're serving this from a CDN, set to FALSE and update the SERVER variable to point to the server URL.
+VITE_STATIC='true'
+VITE_SERVER='http://localhost:3000'

client/src/App.vue

@@ -50,6 +50,5 @@ import { RouterLink, RouterView } from 'vue-router';
 import { ref } from "vue";
 
 const about = ref();
-
 const isProd = ref(import.meta.env.PROD);
 </script>

client/src/components/JoinPartyLine.vue

@@ -12,6 +12,7 @@
 import { computed, onMounted, ref } from 'vue';
 import { usePartyLineStore } from '../stores/partyLine';
 import { storeToRefs } from "pinia";
+import { useGetServer } from "@/composables/useGetServer.ts";
 
 const partyLineName = ref('');
 const status = ref('');
@@ -48,7 +49,7 @@ const joinPartyLine = async () => {
       await partyLineStore.disconnectCurrentPartyLine();
     }
 
-    fetch(`http://localhost:3000/joinPartyLine?partyLine=${encodeURIComponent(partyLineName.value)}`, {
+    fetch(`${useGetServer()}/joinPartyLine?partyLine=${encodeURIComponent(partyLineName.value)}`, {
       method: 'GET',
       headers: {
         'Content-Type': 'application/json',

client/src/components/SendRumor.vue

@@ -10,6 +10,7 @@
 import { computed, ref } from 'vue';
 import { usePartyLineStore } from "@/stores/partyLine.ts";
 import { storeToRefs } from "pinia";
+import { useGetServer } from "@/composables/useGetServer.ts";
 
 const partyLineStore = usePartyLineStore();
 const { partyLine } = storeToRefs(partyLineStore);
@@ -27,7 +28,7 @@ const partyLineModel = computed({
 const sendRumor = async () => {
   if (partyLine.value.trim() && rumor.value.trim()) {
     try {
-      const response = await fetch('http://localhost:3000/rumor', {
+      const response = await fetch(useGetServer() + '/rumor', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',

client/src/composables/useGetServer.ts

@@ -0,0 +1,7 @@
+export const useGetServer = (): string => {
+  if (Boolean(import.meta.env.VITE_STATIC)) {
+    return window.location.origin;
+  } else {
+    return import.meta.env.VITE_SERVER;
+  }
+}

client/src/stores/partyLine.ts

@@ -1,5 +1,6 @@
 import { defineStore } from 'pinia';
 import { ref } from 'vue';
+import { useGetServer } from "@/composables/useGetServer.ts";
 
 export const usePartyLineStore = defineStore('partyLine', () => {
     const partyLine = ref('');
@@ -16,7 +17,7 @@ export const usePartyLineStore = defineStore('partyLine', () => {
         await disconnectCurrentPartyLine(); // Ensure we disconnect first
 
         console.log(`Connecting to party line: ${currentPartyLine}`);
-        eventSource.value = new EventSource(`http://localhost:3000/connectPartyLine?partyLine=${encodeURIComponent(currentPartyLine)}`);
+        eventSource.value = new EventSource(`${useGetServer()}/connectPartyLine?partyLine=${encodeURIComponent(currentPartyLine)}`);
 
         eventSource.value.addEventListener('open', () => {
             console.log('Connected to party line:', currentPartyLine);
@@ -54,7 +55,7 @@ export const usePartyLineStore = defineStore('partyLine', () => {
 
     const fetchPartyLines = async () => {
         try {
-            const response = await fetch('http://localhost:3000/partyLines');
+            const response = await fetch(useGetServer() + '/partyLines');
             const data = await response.json();
             partyLines.value = data.allPartyLines;
         } catch (error: any) {
@@ -64,7 +65,7 @@ export const usePartyLineStore = defineStore('partyLine', () => {
 
     const createPartyLine = async (partyLine: string) => {
         try {
-            const response = await fetch('http://localhost:3000/createPartyLine', {
+            const response = await fetch(useGetServer() + '/createPartyLine', {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
@@ -88,7 +89,7 @@ export const usePartyLineStore = defineStore('partyLine', () => {
 
     const deletePartyLine = async (partyLine: string) => {
         try {
-            const response = await fetch('http://localhost:3000/deletePartyLine', {
+            const response = await fetch(useGetServer() + '/deletePartyLine', {
                 method: 'DELETE',
                 headers: {
                     'Content-Type': 'application/json',