From 1fff71ee0e4017d614a64fd48ca3cfdac1e3e4f1 Mon Sep 17 00:00:00 2001
From: Thomas Citharel <tcit@tcit.fr>
Date: Fri, 16 Apr 2021 17:18:41 +0200
Subject: [PATCH] Allow to remove user location setting

Closes #671

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
---
 .../components/Event/AddressAutoComplete.vue  |  2 +-
 .../Event/FullAddressAutoComplete.vue         | 12 +++++++++
 js/src/types/current-user.model.ts            |  6 ++---
 js/src/views/Settings/Preferences.vue         | 27 +++++++++++++++++--
 4 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/js/src/components/Event/AddressAutoComplete.vue b/js/src/components/Event/AddressAutoComplete.vue
index 9be4b29a..a3b39c96 100644
--- a/js/src/components/Event/AddressAutoComplete.vue
+++ b/js/src/components/Event/AddressAutoComplete.vue
@@ -150,7 +150,7 @@ export default class AddressAutoComplete extends Vue {
   }
 
   get queryText(): string {
-    if (this.value) {
+    if (this.value !== undefined) {
       return new Address(this.value).fullName;
     }
     return this.initialQueryText;
diff --git a/js/src/components/Event/FullAddressAutoComplete.vue b/js/src/components/Event/FullAddressAutoComplete.vue
index 35581015..4c73150e 100644
--- a/js/src/components/Event/FullAddressAutoComplete.vue
+++ b/js/src/components/Event/FullAddressAutoComplete.vue
@@ -46,6 +46,12 @@
           </div>
         </template>
       </b-autocomplete>
+      <b-button
+        :disabled="!queryText"
+        @click="resetAddress"
+        class="reset-area"
+        icon-left="close"
+      />
     </b-field>
     <div class="map" v-if="selected && selected.geom && selected.poiInfos">
       <map-leaflet
@@ -295,6 +301,12 @@ export default class FullAddressAutoComplete extends Vue {
       );
     });
   }
+
+  resetAddress(): void {
+    this.$emit("input", null);
+    this.queryText = "";
+    this.selected = new Address();
+  }
 }
 </script>
 <style lang="scss">
diff --git a/js/src/types/current-user.model.ts b/js/src/types/current-user.model.ts
index 051b31f7..352b2f2a 100644
--- a/js/src/types/current-user.model.ts
+++ b/js/src/types/current-user.model.ts
@@ -13,9 +13,9 @@ export interface ICurrentUser {
 }
 
 export interface IUserPreferredLocation {
-  range?: number;
-  name?: string;
-  geohash?: string;
+  range?: number | null;
+  name?: string | null;
+  geohash?: string | null;
 }
 
 export interface IUserSettings {
diff --git a/js/src/views/Settings/Preferences.vue b/js/src/views/Settings/Preferences.vue
index 29ae9229..b779aec0 100644
--- a/js/src/views/Settings/Preferences.vue
+++ b/js/src/views/Settings/Preferences.vue
@@ -80,6 +80,12 @@
             </option>
           </b-select>
         </b-field>
+        <b-button
+          :disabled="address == undefined"
+          @click="resetArea"
+          class="reset-area"
+          icon-left="close"
+        />
       </b-field>
       <p>
         {{
@@ -239,11 +245,11 @@ export default class Preferences extends Vue {
     }
   }
 
-  get locationRange(): number | undefined {
+  get locationRange(): number | undefined | null {
     return this.loggedUser?.settings?.location?.range;
   }
 
-  set locationRange(locationRange: number | undefined) {
+  set locationRange(locationRange: number | undefined | null) {
     if (locationRange) {
       this.updateUserSettings({
         location: {
@@ -253,6 +259,16 @@ export default class Preferences extends Vue {
     }
   }
 
+  resetArea(): void {
+    this.updateUserSettings({
+      location: {
+        geohash: null,
+        name: null,
+        range: null,
+      },
+    });
+  }
+
   private async updateUserSettings(userSettings: IUserSettings) {
     await this.$apollo.mutate<{ setUserSetting: string }>({
       mutation: SET_USER_SETTINGS,
@@ -262,3 +278,10 @@ export default class Preferences extends Vue {
   }
 }
 </script>
+<style lang="scss" scoped>
+.reset-area {
+  align-self: center;
+  position: relative;
+  top: 10px;
+}
+</style>