Complete translation of manual location picker + better guard for Map when user has not previously clicked on a button

src/components/AddressInput.vue

@@ -17,9 +17,10 @@
 </template>
 
 <script>
-import fetch from 'isomorphic-fetch';
+import { GEOCODING_API_ENDPOINT } from '@/constants';
 
-const API_ENDPOINT = 'https://api-adresse.data.gouv.fr/search/';
+require('es6-promise').polyfill();
+require('isomorphic-fetch');
 
 export default {
     props: {
@@ -50,12 +51,12 @@ export default {
     },
     methods: {
         checkValue() {
-            return (this.selectedItem != null) || 'Invalid selection';
+            return (this.selectedItem != null) || this.$t('locationPicker.invalidSelection');
         },
         queryAPI(value) {
             this.loading = true;
 
-            fetch(`${API_ENDPOINT}?q=${value}`)
+            fetch(`${GEOCODING_API_ENDPOINT}?q=${value}`)
                 .then(response => response.json())
                 .then(data => data.features)
                 .then((data) => {

src/constants.js

@@ -135,3 +135,5 @@ export const TILE_SERVERS = {
     opencyclemap: opencyclemapURL,
 };
 export const DEFAULT_TILE_SERVER = 'cartodb-voyager';
+
+export const GEOCODING_API_ENDPOINT = 'https://api-adresse.data.gouv.fr/search/';

src/i18n/en.js

@@ -29,6 +29,10 @@ export default {
         startReporting: 'Start reporting!',
         welcome: 'Welcome',
     },
+    locationPicker: {
+        invalidSelection: 'Invalid selection',
+        pickALocationManually: 'pick a location manually',
+    },
     menu: {
         About: 'Help',
         Map: 'Map',
@@ -36,6 +40,7 @@ export default {
     },
     misc: {
         discard: 'Discard',
+        or: 'or',
         retry: 'Retry',
         spaceBeforeDoublePunctuations: '',
     },

src/i18n/fr.js

@@ -29,6 +29,10 @@ export default {
         startReporting: 'Commencer à signaler !',
         welcome: 'Bienvenue !',
     },
+    locationPicker: {
+        invalidSelection: 'Sélection invalide',
+        pickALocationManually: 'choisir une position manuellement',
+    },
     menu: {
         About: 'Aide',
         Map: 'Carte',
@@ -36,6 +40,7 @@ export default {
     },
     misc: {
         discard: 'Annuler',
+        or: 'ou',
         retry: 'Réessayer',
         spaceBeforeDoublePunctuations: ' ',
     },

src/views/Map.vue

@@ -27,9 +27,9 @@
                     <p class="text-xs-center">
                         <v-btn role="button" color="blue" dark @click="initializePositionWatching">Retry</v-btn>
                     </p>
-                    <p>or</p>
+                    <p>{{ $t('misc.or') }}</p>
                     <p>
-                        <AddressInput label="pick a location manually" :onInput="onManualLocationPicker" v-model="manualLocation"></AddressInput>
+                        <AddressInput :label="$t('locationPicker.pickALocationManually')" :onInput="onManualLocationPicker" v-model="manualLocation"></AddressInput>
                     </p>
                 </template>
                 <template v-else>
@@ -47,8 +47,10 @@ import AddressInput from '@/components/AddressInput.vue';
 import Map from '@/components/Map.vue';
 import ReportCard from '@/components/ReportCard.vue';
 import ReportDialog from '@/components/ReportDialog/index.vue';
+
 import * as constants from '@/constants';
 import { distance, mockLocation } from '@/tools';
+import store from '@/store';
 
 export default {
     components: {
@@ -57,10 +59,11 @@ export default {
         ReportCard,
         ReportDialog,
     },
-    created() {
-        if (!this.$store.state.hasGoneThroughIntro) {
-            this.$router.replace({ name: 'Onboarding' });
+    beforeRouteEnter(to, from, next) {
+        if (!store.state.hasGoneThroughIntro) {
+            return next({ name: 'Onboarding', replace: true });
         }
+        return next();
     },
     beforeDestroy() {
         this.disableNoSleep();