From 9732b80298b0e346d67813a2b1db320fcc42d9f1 Mon Sep 17 00:00:00 2001
From: Julie Lenaerts <julielenaerts@gmail.com>
Date: Fri, 20 Sep 2024 13:58:23 +0200
Subject: [PATCH] Implement translation with Symfony translator within vue
 component

---
 .../Resources/public/vuejs/_components/Modal.vue | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue
index 720f91c5d..cd1ffbf23 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/_components/Modal.vue
@@ -17,7 +17,7 @@
                 <slot name="body"></slot>
               </div>
               <div class="modal-footer" v-if="!hideFooter">
-                <button class="btn btn-cancel" @click="$emit('close')">{{ closeKey }}</button>
+                <button class="btn btn-cancel" @click="$emit('close')">{{ trans(modalActionClose) }}</button>
                 <slot name="footer"></slot>
               </div>
             </div>
@@ -55,12 +55,14 @@ export default defineComponent({
       }
    },
    emits: ['close'],
-    computed: {
-       closeKey() {
-           console.log('close key', trans(MODAL_ACTION_CLOSE))
-           return trans(MODAL_ACTION_CLOSE)
-       }
-    }
+    setup() {
+        const modalActionClose = MODAL_ACTION_CLOSE;
+
+        return {
+            modalActionClose,
+            trans
+        };
+    },
 });
 </script>