implement i18n with town filter

src/components/directory/DirectoryFilter.vue

@@ -30,15 +30,15 @@ const categories = computed(() => [
   { id: 'other', label: t('directory.categories.other') }
 ])
 
-const towns = [
-  { id: 'all', label: 'All' },
+const towns = computed(() => [
+  { id: 'all', label: t('directory.towns.all') },
   { id: 'San Marcos', label: 'San Marcos' },
   { id: 'Tzununa', label: 'Tzununa' },
   { id: 'San Pablo', label: 'San Pablo' },
   { id: 'San Pedro', label: 'San Pedro' },
   { id: 'Panajachel', label: 'Panajachel' },
   { id: 'Jaibalito', label: 'Jaibalito' }
-]
+])
 </script>
 
 <template>

src/i18n/locales/en.ts

@@ -25,6 +25,9 @@ export default {
       lancha: 'Lanchas',
       other: 'Other'
     },
+    towns: {
+      all: 'All',
+    },
     contact: 'Contact',
     location: 'Location',
     viewMap: 'View on Map',

src/i18n/locales/es.ts

@@ -25,6 +25,9 @@ export default {
       lancha: 'Lanchas',
       other: 'Otros'
     },
+    towns: {
+      all: 'Todos',
+    },
     contact: 'Contacto',
     location: 'Ubicación',
     viewMap: 'Ver en Mapa',