feat: use configuration api path for frontend properties

Author: Quentin-Guillemin

.env.example

@@ -3,8 +3,6 @@ VITE_API_URI="/"
 VITE_NEXTCLOUD_URI="/nextcloud"
 VITE_AXIOS_TIMEOUT=10000
 
-VITE_WEBSOCKET_API_URL=""
-
 VITE_USER_INFO_API_URI=""
 
 VITE_PROXY_API_URL="http://localhost:8090"

.env.production

@@ -2,6 +2,4 @@ VITE_BASE_URI="/collabsoft"
 VITE_API_URI="/collabsoft"
 VITE_AXIOS_TIMEOUT=10000
 
-VITE_WEBSOCKET_API_URL=""
-
 VITE_USER_INFO_API_URI="/portail/api/v5-1/userinfo?claims=private,name&groups="

src/main/java/fr/recia/collabsoft/configuration/CollabsoftProperties.java

@@ -17,6 +17,7 @@
 
 import com.fasterxml.jackson.core.JsonProcessingException;
 import fr.recia.collabsoft.configuration.bean.CorsProperties;
+import fr.recia.collabsoft.configuration.bean.FrontProperties;
 import fr.recia.collabsoft.configuration.bean.SecurityProperties;
 import fr.recia.collabsoft.configuration.bean.SoffitProperties;
 import fr.recia.collabsoft.configuration.bean.StorageProperties;
@@ -39,6 +40,7 @@
 public class CollabsoftProperties {
 
   private CorsProperties cors = new CorsProperties();
+  private FrontProperties front = new FrontProperties();
   private SecurityProperties security = new SecurityProperties();
   private SoffitProperties soffit = new SoffitProperties();
   private StorageProperties storage = new StorageProperties();
@@ -52,6 +54,7 @@ private void init() throws JsonProcessingException {
   public String toString() {
     return "{\n"
       + cors + ",\n"
+      + front + ",\n"
       + security + ",\n"
       + soffit + "\n"
       + storage

src/main/java/fr/recia/collabsoft/configuration/bean/FrontProperties.java

@@ -0,0 +1,46 @@
+/*
+ * Copyright (C) 2023 GIP-RECIA, Inc.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+package fr.recia.collabsoft.configuration.bean;
+
+import lombok.Data;
+
+@Data
+public class FrontProperties {
+
+  private WebsocketProperties websocket = new WebsocketProperties();
+
+  @Data
+  public static class WebsocketProperties {
+
+    private String url;
+
+    @Override
+    public String toString() {
+      return "{" +
+        "\n\t\t\"url\": \"" + url + "\"" +
+        "\n}";
+    }
+
+  }
+
+  @Override
+  public String toString() {
+    return "\"FrontProperties\": {" +
+      "\n\t\"websocket\": \"" + websocket + "\"" +
+      "\n}";
+  }
+
+}

src/main/java/fr/recia/collabsoft/web/rest/ConfigurationController.java

@@ -15,21 +15,32 @@
  */
 package fr.recia.collabsoft.web.rest;
 
+import fr.recia.collabsoft.configuration.CollabsoftProperties;
 import lombok.extern.slf4j.Slf4j;
+import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.http.HttpStatus;
 import org.springframework.http.ResponseEntity;
 import org.springframework.web.bind.annotation.GetMapping;
 import org.springframework.web.bind.annotation.RequestMapping;
 import org.springframework.web.bind.annotation.RestController;
 
+import java.util.HashMap;
+import java.util.Map;
+
 @Slf4j
 @RestController
 @RequestMapping(value = "/api/config")
 public class ConfigurationController {
 
+  @Autowired
+  private CollabsoftProperties collabsoftProperties;
+
   @GetMapping
   public ResponseEntity<Object> getConfiguration() {
-    return new ResponseEntity<>(HttpStatus.OK);
+    Map<String, Object> data = new HashMap<>();
+    data.put("websocketApiUrl", collabsoftProperties.getFront().getWebsocket().getUrl());
+
+    return new ResponseEntity<>(data, HttpStatus.OK);
   }
 
 }

src/main/resources/config/application-prod.example.yml

@@ -21,3 +21,10 @@ app:
 
   soffit:
     jwt-signature-key: ''
+
+  storage:
+    location: ''
+
+  front:
+    websocket:
+      url: ''

src/main/resources/config/application.yml

@@ -64,3 +64,10 @@ app:
 
   soffit:
     jwt-signature-key: ''
+
+  storage:
+    location: ''
+
+  front:
+    websocket:
+      url: ''

src/main/webapp/src/stores/configurationStore.ts

@@ -86,6 +86,7 @@ export const useConfigurationStore = defineStore('configuration', () => {
   const isSettings = ref<boolean>(false);
 
   return {
+    configuration,
     init,
     isReady,
     user,

src/main/webapp/src/types/configurationType.ts

@@ -1 +1,3 @@
-export type Configuration = {};
+export type Configuration = {
+  websocketApiUrl: string;
+};

src/main/webapp/src/views/app/tldraw/CollaborativeTldrawView.vue

@@ -1,13 +1,17 @@
 <script setup lang="ts">
-import { useCollaborativeStore } from '@/stores/collaborativeStore';
+import { useCollaborativeStore } from '@/stores/collaborativeStore.ts';
+import { useConfigurationStore } from '@/stores/configurationStore.ts';
 import { AppSlug } from '@/types/enums/AppSlug.ts';
 import { headObserver, styleObserver } from '@/utils/tldrawUtils.ts';
 import { storeToRefs } from 'pinia';
 import { onMounted, onUnmounted } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import { useTheme } from 'vuetify';
 
-const { VITE_API_URI, VITE_WEBSOCKET_API_URL, VITE_USER_INFO_API_URI } = import.meta.env;
+const { VITE_API_URI, VITE_USER_INFO_API_URI } = import.meta.env;
+
+const configurationStore = useConfigurationStore();
+const { configuration } = configurationStore;
 
 const collaborativeStore = useCollaborativeStore();
 const { initFileId } = storeToRefs(collaborativeStore);
@@ -33,7 +37,7 @@ onUnmounted(() => {
 
 <template>
   <tldraw-multiplayer
-    :websocket-api-url="VITE_WEBSOCKET_API_URL"
+    :websocket-api-url="configuration?.websocketApiUrl"
     :room-id="`${roomId}-${AppSlug.tldraw}`"
     :init-url="initFileId ? `${VITE_API_URI}/api/file/${initFileId}` : ''"
     :user-info-api-url="VITE_USER_INFO_API_URI"