From b1a7680b5e963e674d48c766920b4316d07c5866 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Julien=20Fastr=C3=A9?= <julien.fastre@champs-libres.coop>
Date: Sat, 16 Aug 2025 00:29:43 +0200
Subject: [PATCH] [WIP] Create Address button that will open AddressPicker in a
 modal

---
 .../vuejs/AddressPicker/AddressButton.vue     | 33 +++++++++++++++++++
 .../public/vuejs/AddressPicker/index.ts       |  4 +--
 2 files changed, 35 insertions(+), 2 deletions(-)
 create mode 100644 src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressButton.vue

diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressButton.vue b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressButton.vue
new file mode 100644
index 000000000..70480fdb2
--- /dev/null
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/AddressButton.vue
@@ -0,0 +1,33 @@
+<script setup lang="ts">
+
+import Modal from "ChillMainAssets/vuejs/_components/Modal.vue";
+import AddressPicker from "ChillMainAssets/vuejs/AddressPicker/AddressPicker.vue";
+import {Ref, ref} from "vue";
+
+const showModal: Ref<boolean> = ref(false);
+
+const modalDialogClasses = {"modal-dialog": true, "modal-dialog-scrollable": true, "modal-xl": true};
+
+const clickButton = () => {
+    showModal.value = true;
+}
+
+const closeModal = () => {
+    showModal.value = false;
+}
+
+</script>
+
+<template>
+    <modal v-if="showModal" :modal-dialog-class="modalDialogClasses" @close="closeModal">
+        <template v-slot:header>TODO</template>
+        <template v-slot:body>
+            <AddressPicker></AddressPicker>
+        </template>
+    </modal>
+    <button class="btn btn-submit" type="button" @click="clickButton">SEARCH ADDRESS</button>
+</template>
+
+<style scoped lang="scss">
+
+</style>
diff --git a/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts
index 3bbc6a162..1a8541157 100644
--- a/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts
+++ b/src/Bundle/ChillMainBundle/Resources/public/vuejs/AddressPicker/index.ts
@@ -1,11 +1,11 @@
 import { createApp } from "vue";
-import AddressPicker from "ChillMainAssets/vuejs/AddressPicker/AddressPicker.vue";
+import AddressButton from "ChillMainAssets/vuejs/AddressPicker/AddressButton.vue";
 
 document.addEventListener("DOMContentLoaded", async () => {
     document
         .querySelectorAll<HTMLDivElement>("div[data-address-picker]")
         .forEach((elem): void => {
-            const app = createApp(AddressPicker);
+            const app = createApp(AddressButton);
 
             app.mount(elem);
         });