From b7734cec4639073b59ef9346f6d2d3682550cf32 Mon Sep 17 00:00:00 2001
From: Mazarin <djaiss@users.noreply.github.com>
Date: Thu, 9 Feb 2023 08:06:00 -0500
Subject: [PATCH] feat: list all addresses in vault (monicahq/chandler#422)

---
 .../Services/RemoveAddressFromContact.php     |   4 +
 .../ContactModuleAddressController.php        |   8 +-
 .../ModuleContactAddressesViewHelper.php      |  16 +-
 .../ReportAddressesCitiesController.php       |  24 +
 .../Controllers/ReportAddressesController.php |  23 +
 .../ReportAddressesCountriesController.php    |  24 +
 .../ReportAddressIndexViewHelper.php          |  60 +++
 .../ReportCitiesShowViewHelper.php            |  48 ++
 .../ReportCountriesShowViewHelper.php         |  48 ++
 .../Web/ViewHelpers/ReportIndexViewHelper.php |   3 +
 app/Helpers/WikipediaHelper.php               |  46 ++
 .../Vault/Reports/Address/Cities/Index.vue    | 123 ++++++
 .../Vault/Reports/Address/Countries/Index.vue | 123 ++++++
 .../js/Pages/Vault/Reports/Address/Index.vue  | 118 +++++
 resources/js/Pages/Vault/Reports/Index.vue    |   5 +
 resources/js/Shared/Modules/Addresses.vue     | 417 +++++++++++-------
 routes/web.php                                |   8 +
 .../ModuleContactAddressesViewHelperTest.php  |  28 +-
 .../ReportAddressIndexViewHelperTest.php      |  63 +++
 .../ReportCitiesShowViewHelperTest.php        |  69 +++
 .../ReportCountriesShowViewHelperTest.php     |  69 +++
 .../ViewHelpers/ReportIndexViewHelperTest.php |   1 +
 tests/Unit/Helpers/WikipediaHelperTest.php    |  25 ++
 23 files changed, 1178 insertions(+), 175 deletions(-)
 create mode 100644 app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCitiesController.php
 create mode 100644 app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesController.php
 create mode 100644 app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCountriesController.php
 create mode 100644 app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelper.php
 create mode 100644 app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelper.php
 create mode 100644 app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelper.php
 create mode 100644 app/Helpers/WikipediaHelper.php
 create mode 100644 resources/js/Pages/Vault/Reports/Address/Cities/Index.vue
 create mode 100644 resources/js/Pages/Vault/Reports/Address/Countries/Index.vue
 create mode 100644 resources/js/Pages/Vault/Reports/Address/Index.vue
 create mode 100644 tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelperTest.php
 create mode 100644 tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelperTest.php
 create mode 100644 tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelperTest.php
 create mode 100644 tests/Unit/Helpers/WikipediaHelperTest.php

diff --git a/app/Domains/Contact/ManageContactAddresses/Services/RemoveAddressFromContact.php b/app/Domains/Contact/ManageContactAddresses/Services/RemoveAddressFromContact.php
index 176fa9b6f29..868b38324aa 100644
--- a/app/Domains/Contact/ManageContactAddresses/Services/RemoveAddressFromContact.php
+++ b/app/Domains/Contact/ManageContactAddresses/Services/RemoveAddressFromContact.php
@@ -72,6 +72,10 @@ private function validate(): void
     private function remove(): void
     {
         $this->contact->addresses()->detach($this->address);
+
+        if ($this->address->contacts()->count() === 0) {
+            $this->address->delete();
+        }
     }
 
     private function createFeedItem(): void
diff --git a/app/Domains/Contact/ManageContactAddresses/Web/Controllers/ContactModuleAddressController.php b/app/Domains/Contact/ManageContactAddresses/Web/Controllers/ContactModuleAddressController.php
index 24e6b66434e..4fd33c49685 100644
--- a/app/Domains/Contact/ManageContactAddresses/Web/Controllers/ContactModuleAddressController.php
+++ b/app/Domains/Contact/ManageContactAddresses/Web/Controllers/ContactModuleAddressController.php
@@ -8,6 +8,7 @@
 use App\Domains\Vault\ManageAddresses\Services\CreateAddress;
 use App\Domains\Vault\ManageAddresses\Services\UpdateAddress;
 use App\Http\Controllers\Controller;
+use App\Models\Address;
 use App\Models\Contact;
 use Illuminate\Http\Request;
 use Illuminate\Support\Facades\Auth;
@@ -31,7 +32,12 @@ public function store(Request $request, int $vaultId, int $contactId)
             'longitude' => null,
         ];
 
-        $address = (new CreateAddress())->execute($data);
+        if (! $request->input('existing_address')) {
+            $address = (new CreateAddress())->execute($data);
+        } else {
+            $address = Address::where('vault_id', $vaultId)
+                ->findOrFail($request->input('existing_address_id'));
+        }
 
         (new AssociateAddressToContact())->execute([
             'account_id' => Auth::user()->account_id,
diff --git a/app/Domains/Contact/ManageContactAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelper.php b/app/Domains/Contact/ManageContactAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelper.php
index 088c0c9ca45..b99f943cc4f 100644
--- a/app/Domains/Contact/ManageContactAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelper.php
+++ b/app/Domains/Contact/ManageContactAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelper.php
@@ -12,12 +12,12 @@ class ModuleContactAddressesViewHelper
 {
     public static function data(Contact $contact, User $user): array
     {
-        $activeAddressesCollection = $contact->addresses()
+        $contactActiveAddressesCollection = $contact->addresses()
             ->wherePivot('is_past_address', false)
             ->get()
             ->map(fn (Address $address) => self::dto($contact, $address, $user));
 
-        $inactiveAddressesCollection = $contact->addresses()
+        $contactInactiveAddressesCollection = $contact->addresses()
             ->wherePivot('is_past_address', true)
             ->get()
             ->map(fn (Address $address) => self::dto($contact, $address, $user));
@@ -31,10 +31,18 @@ public static function data(Contact $contact, User $user): array
                 'selected' => false,
             ]);
 
+        $vaultAddressesCollection = $contact->vault->addresses()
+            ->get()
+            ->map(fn (Address $address) => [
+                'id' => $address->id,
+                'address' => MapHelper::getAddressAsString($address),
+            ]);
+
         return [
-            'active_addresses' => $activeAddressesCollection,
-            'inactive_addresses' => $inactiveAddressesCollection,
+            'active_addresses' => $contactActiveAddressesCollection,
+            'inactive_addresses' => $contactInactiveAddressesCollection,
             'address_types' => $addressTypesCollection,
+            'addresses_in_vault' => $vaultAddressesCollection,
             'url' => [
                 'store' => route('contact.address.store', [
                     'vault' => $contact->vault_id,
diff --git a/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCitiesController.php b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCitiesController.php
new file mode 100644
index 00000000000..a3af22a4019
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCitiesController.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\Controllers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportCitiesShowViewHelper;
+use App\Domains\Vault\ManageVault\Web\ViewHelpers\VaultIndexViewHelper;
+use App\Http\Controllers\Controller;
+use App\Models\Vault;
+use Illuminate\Http\Request;
+use Inertia\Inertia;
+
+class ReportAddressesCitiesController extends Controller
+{
+    public function show(Request $request, int $vaultId, string $city)
+    {
+        $vault = Vault::findOrFail($vaultId);
+        $city = utf8_decode(urldecode($city));
+
+        return Inertia::render('Vault/Reports/Address/Cities/Index', [
+            'layoutData' => VaultIndexViewHelper::layoutData($vault),
+            'data' => ReportCitiesShowViewHelper::data($vault, $city),
+        ]);
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesController.php b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesController.php
new file mode 100644
index 00000000000..1a29e7033f5
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesController.php
@@ -0,0 +1,23 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\Controllers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportAddressIndexViewHelper;
+use App\Domains\Vault\ManageVault\Web\ViewHelpers\VaultIndexViewHelper;
+use App\Http\Controllers\Controller;
+use App\Models\Vault;
+use Illuminate\Http\Request;
+use Inertia\Inertia;
+
+class ReportAddressesController extends Controller
+{
+    public function index(Request $request, int $vaultId)
+    {
+        $vault = Vault::findOrFail($vaultId);
+
+        return Inertia::render('Vault/Reports/Address/Index', [
+            'layoutData' => VaultIndexViewHelper::layoutData($vault),
+            'data' => ReportAddressIndexViewHelper::data($vault),
+        ]);
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCountriesController.php b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCountriesController.php
new file mode 100644
index 00000000000..949a9538ab7
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/Controllers/ReportAddressesCountriesController.php
@@ -0,0 +1,24 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\Controllers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportCountriesShowViewHelper;
+use App\Domains\Vault\ManageVault\Web\ViewHelpers\VaultIndexViewHelper;
+use App\Http\Controllers\Controller;
+use App\Models\Vault;
+use Illuminate\Http\Request;
+use Inertia\Inertia;
+
+class ReportAddressesCountriesController extends Controller
+{
+    public function show(Request $request, int $vaultId, string $country)
+    {
+        $vault = Vault::findOrFail($vaultId);
+        $country = utf8_decode(urldecode($country));
+
+        return Inertia::render('Vault/Reports/Address/Countries/Index', [
+            'layoutData' => VaultIndexViewHelper::layoutData($vault),
+            'data' => ReportCountriesShowViewHelper::data($vault, $country),
+        ]);
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelper.php b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelper.php
new file mode 100644
index 00000000000..95715372181
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelper.php
@@ -0,0 +1,60 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Models\Vault;
+use Illuminate\Support\Str;
+
+class ReportAddressIndexViewHelper
+{
+    public static function data(Vault $vault): array
+    {
+        // all the cities in the vault
+        // the distinct method does not do a case-insensitive search, so we need
+        // to do it manually. there would be a way to do it with raw SQL but
+        // it wouldn't work on sqlite
+        $cities = $vault->addresses()
+            ->select('id', 'city')
+            ->whereNotNull('city')
+            ->withCount('contacts')
+            ->distinct('city')
+            ->get()
+            ->map(fn ($address) => [
+                'id' => $address->id,
+                'name' => Str::ucfirst($address->city),
+                'contacts' => $address->contacts_count,
+                'url' => [
+                    'index' => route('vault.reports.addresses.cities.show', [
+                        'vault' => $vault->id,
+                        'city' => urlencode(utf8_encode($address->city)),
+                    ]),
+                ],
+            ])
+            ->unique('name');
+
+        // all the countries in the vault
+        $countries = $vault->addresses()
+            ->select('id', 'country')
+            ->whereNotNull('country')
+            ->withCount('contacts')
+            ->distinct('country')
+            ->get()
+            ->map(fn ($address) => [
+                'id' => $address->id,
+                'name' => Str::ucfirst($address->country),
+                'contacts' => $address->contacts_count,
+                'url' => [
+                    'index' => route('vault.reports.addresses.countries.show', [
+                        'vault' => $vault->id,
+                        'country' => urlencode(utf8_encode($address->country)),
+                    ]),
+                ],
+            ])
+            ->unique('name');
+
+        return [
+            'cities' => $cities,
+            'countries' => $countries,
+        ];
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelper.php b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelper.php
new file mode 100644
index 00000000000..fb85d95fc29
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelper.php
@@ -0,0 +1,48 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Helpers\ContactCardHelper;
+use App\Helpers\MapHelper;
+use App\Helpers\WikipediaHelper;
+use App\Models\Contact;
+use App\Models\Vault;
+use Illuminate\Support\Str;
+
+class ReportCitiesShowViewHelper
+{
+    public static function data(Vault $vault, string $city): array
+    {
+        $addresses = $vault->addresses()
+            ->whereNotNull('city')
+            ->where('city', Str::ucfirst($city))
+            ->orWhere('city', Str::lcfirst($city))
+            ->with('contacts')
+            ->get()
+            ->map(fn ($address) => [
+                'id' => $address->id,
+                'name' => Str::ucfirst($address->city),
+                'address' => MapHelper::getAddressAsString($address),
+                'contacts' => $address->contacts()
+                    ->get()
+                    ->map(fn (Contact $contact) => ContactCardHelper::data($contact)),
+            ]);
+
+        $wikipediaInformation = WikipediaHelper::getInformation($city);
+
+        return [
+            'city' => Str::ucfirst($city),
+            'addresses' => $addresses,
+            'wikipedia' => [
+                'url' => $wikipediaInformation['url'],
+                'description' => $wikipediaInformation['description'],
+                'thumbnail' => $wikipediaInformation['thumbnail'],
+            ],
+            'url' => [
+                'addresses' => route('vault.reports.addresses.index', [
+                    'vault' => $vault->id,
+                ]),
+            ],
+        ];
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelper.php b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelper.php
new file mode 100644
index 00000000000..c0d9a083c28
--- /dev/null
+++ b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelper.php
@@ -0,0 +1,48 @@
+<?php
+
+namespace App\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Helpers\ContactCardHelper;
+use App\Helpers\MapHelper;
+use App\Helpers\WikipediaHelper;
+use App\Models\Contact;
+use App\Models\Vault;
+use Illuminate\Support\Str;
+
+class ReportCountriesShowViewHelper
+{
+    public static function data(Vault $vault, string $country): array
+    {
+        $addresses = $vault->addresses()
+            ->whereNotNull('country')
+            ->where('country', Str::ucfirst($country))
+            ->orWhere('country', Str::lcfirst($country))
+            ->with('contacts')
+            ->get()
+            ->map(fn ($address) => [
+                'id' => $address->id,
+                'name' => Str::ucfirst($address->country),
+                'address' => MapHelper::getAddressAsString($address),
+                'contacts' => $address->contacts()
+                    ->get()
+                    ->map(fn (Contact $contact) => ContactCardHelper::data($contact)),
+            ]);
+
+        $wikipediaInformation = WikipediaHelper::getInformation($country);
+
+        return [
+            'country' => Str::ucfirst($country),
+            'addresses' => $addresses,
+            'wikipedia' => [
+                'url' => $wikipediaInformation['url'],
+                'description' => $wikipediaInformation['description'],
+                'thumbnail' => $wikipediaInformation['thumbnail'],
+            ],
+            'url' => [
+                'addresses' => route('vault.reports.addresses.index', [
+                    'vault' => $vault->id,
+                ]),
+            ],
+        ];
+    }
+}
diff --git a/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelper.php b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelper.php
index 5101ba409e4..ddfa5cc54b4 100644
--- a/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelper.php
+++ b/app/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelper.php
@@ -10,6 +10,9 @@ public static function data(Vault $vault): array
     {
         return [
             'url' => [
+                'addresses' => route('vault.reports.addresses.index', [
+                    'vault' => $vault->id,
+                ]),
                 'mood_tracking_events' => route('vault.reports.mood_tracking_events.index', [
                     'vault' => $vault->id,
                 ]),
diff --git a/app/Helpers/WikipediaHelper.php b/app/Helpers/WikipediaHelper.php
new file mode 100644
index 00000000000..808c9603891
--- /dev/null
+++ b/app/Helpers/WikipediaHelper.php
@@ -0,0 +1,46 @@
+<?php
+
+namespace App\Helpers;
+
+use Illuminate\Support\Facades\Http;
+use Illuminate\Support\Str;
+
+class WikipediaHelper
+{
+    /**
+     * Return the information about the given city or country from Wikipedia.
+     * All API calls are documented here:
+     * https://www.mediawiki.org/w/api.php?action=help&modules=query.
+     *
+     * @param  string  $topic
+     * @return array
+     */
+    public static function getInformation(string $topic): array
+    {
+        $query = http_build_query([
+            'action' => 'query',
+            'prop' => 'description|pageimages',
+            'titles' => $topic,
+            'pithumbsize' => 400,
+            'format' => 'json',
+        ]);
+
+        $url = 'https://en.wikipedia.org/w/api.php?'.$query;
+
+        $response = Http::get($url)->throw();
+
+        if ($response->json('query.pages.*.missing')[0] === true) {
+            return [
+                'url' => null,
+                'description' => null,
+                'thumbnail' => null,
+            ];
+        }
+
+        return [
+            'url' => 'https://en.wikipedia.org/wiki/'.Str::slug($topic),
+            'description' => $response->json('query.pages.*.description')[0],
+            'thumbnail' => $response->json('query.pages.*.thumbnail.source')[0],
+        ];
+    }
+}
diff --git a/resources/js/Pages/Vault/Reports/Address/Cities/Index.vue b/resources/js/Pages/Vault/Reports/Address/Cities/Index.vue
new file mode 100644
index 00000000000..ce68d7786d2
--- /dev/null
+++ b/resources/js/Pages/Vault/Reports/Address/Cities/Index.vue
@@ -0,0 +1,123 @@
+<script setup>
+import Layout from '@/Shared/Layout.vue';
+import ContactCard from '@/Shared/ContactCard.vue';
+
+defineProps({
+  layoutData: Object,
+  data: Object,
+});
+</script>
+
+<template>
+  <Layout :layout-data="layoutData" :inside-vault="true">
+    <!-- breadcrumb -->
+    <nav class="bg-white dark:bg-gray-900 sm:mt-20 sm:border-b">
+      <div class="max-w-8xl mx-auto hidden px-4 py-2 sm:px-6 md:block">
+        <div class="flex items-baseline justify-between space-x-6">
+          <ul class="text-sm">
+            <li class="mr-2 inline text-gray-600 dark:text-gray-400">
+              {{ $t('app.breadcrumb_location') }}
+            </li>
+            <li class="mr-2 inline">
+              <inertia-link :href="layoutData.vault.url.reports" class="text-blue-500 hover:underline"
+                >Reports</inertia-link
+              >
+            </li>
+            <li class="relative mr-2 inline">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon-breadcrumb relative inline h-3 w-3"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+              </svg>
+            </li>
+            <li class="mr-2 inline">
+              <inertia-link :href="data.url.addresses" class="text-blue-500 hover:underline"
+                >List of addresses</inertia-link
+              >
+            </li>
+            <li class="relative mr-2 inline">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon-breadcrumb relative inline h-3 w-3"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+              </svg>
+            </li>
+            <li class="mr-2 inline">{{ data.city }}</li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+
+    <main class="sm:mt-18 relative">
+      <div class="mx-auto max-w-3xl px-2 py-2 sm:py-6 sm:px-6 lg:px-8">
+        <div class="special-grid grid grid-cols-1 gap-6 sm:grid-cols-3">
+          <!-- left -->
+          <div>
+            <h2 class="mb-3 font-bold">{{ data.city }}</h2>
+
+            <div
+              v-if="data.wikipedia.description"
+              class="rounded border border-gray-200 p-2 hover:bg-slate-50 dark:border-gray-700 dark:bg-slate-900 hover:dark:bg-slate-800">
+              <p class="mb-3">{{ data.wikipedia.description }}</p>
+
+              <img :src="data.wikipedia.thumbnail" :alt="'Image of ' + data.city" class="mb-2 rounded" />
+
+              <p class="text-xs"><a :href="data.wikipedia.url" target="_blank">Information from Wikipedia</a></p>
+            </div>
+          </div>
+
+          <!-- right -->
+          <div>
+            <ul class="mb-6 rounded-lg border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-900">
+              <li
+                v-for="address in data.addresses"
+                :key="address.id"
+                class="item-list border-b border-gray-200 px-3 pt-3 pb-2 hover:bg-slate-50 dark:border-gray-700 dark:bg-slate-900 hover:dark:bg-slate-800">
+                <span class="mb-1 block">{{ address.address }}</span>
+                <ul class="list">
+                  <li v-for="contact in address.contacts" :key="contact.id" class="mr-3 inline">
+                    <contact-card :contact="contact" :avatarClasses="'h-5 w-5 rounded-full mr-2'" :displayName="true" />
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </main>
+  </Layout>
+</template>
+
+<style lang="scss" scoped>
+.item-list {
+  &:hover:first-child {
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+  }
+
+  &:last-child {
+    border-bottom: 0;
+  }
+
+  &:hover:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+  }
+}
+
+.special-grid {
+  grid-template-columns: 200px 1fr;
+}
+
+@media (max-width: 480px) {
+  .special-grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
diff --git a/resources/js/Pages/Vault/Reports/Address/Countries/Index.vue b/resources/js/Pages/Vault/Reports/Address/Countries/Index.vue
new file mode 100644
index 00000000000..d4c7682a804
--- /dev/null
+++ b/resources/js/Pages/Vault/Reports/Address/Countries/Index.vue
@@ -0,0 +1,123 @@
+<script setup>
+import Layout from '@/Shared/Layout.vue';
+import ContactCard from '@/Shared/ContactCard.vue';
+
+defineProps({
+  layoutData: Object,
+  data: Object,
+});
+</script>
+
+<template>
+  <Layout :layout-data="layoutData" :inside-vault="true">
+    <!-- breadcrumb -->
+    <nav class="bg-white dark:bg-gray-900 sm:mt-20 sm:border-b">
+      <div class="max-w-8xl mx-auto hidden px-4 py-2 sm:px-6 md:block">
+        <div class="flex items-baseline justify-between space-x-6">
+          <ul class="text-sm">
+            <li class="mr-2 inline text-gray-600 dark:text-gray-400">
+              {{ $t('app.breadcrumb_location') }}
+            </li>
+            <li class="mr-2 inline">
+              <inertia-link :href="layoutData.vault.url.reports" class="text-blue-500 hover:underline"
+                >Reports</inertia-link
+              >
+            </li>
+            <li class="relative mr-2 inline">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon-breadcrumb relative inline h-3 w-3"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+              </svg>
+            </li>
+            <li class="mr-2 inline">
+              <inertia-link :href="data.url.addresses" class="text-blue-500 hover:underline"
+                >List of addresses</inertia-link
+              >
+            </li>
+            <li class="relative mr-2 inline">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon-breadcrumb relative inline h-3 w-3"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+              </svg>
+            </li>
+            <li class="mr-2 inline">{{ data.country }}</li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+
+    <main class="sm:mt-18 relative">
+      <div class="mx-auto max-w-3xl px-2 py-2 sm:py-6 sm:px-6 lg:px-8">
+        <div class="special-grid grid grid-cols-1 gap-6 sm:grid-cols-3">
+          <!-- left -->
+          <div>
+            <h2 class="mb-3 font-bold">{{ data.country }}</h2>
+
+            <div
+              v-if="data.wikipedia.description"
+              class="rounded border border-gray-200 p-2 hover:bg-slate-50 dark:border-gray-700 dark:bg-slate-900 hover:dark:bg-slate-800">
+              <p class="mb-3">{{ data.wikipedia.description }}</p>
+
+              <img :src="data.wikipedia.thumbnail" :alt="'Image of ' + data.country" class="mb-2 rounded" />
+
+              <p class="text-xs"><a :href="data.wikipedia.url" target="_blank">Information from Wikipedia</a></p>
+            </div>
+          </div>
+
+          <!-- right -->
+          <div>
+            <ul class="mb-6 rounded-lg border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-900">
+              <li
+                v-for="address in data.addresses"
+                :key="address.id"
+                class="item-list border-b border-gray-200 px-3 pt-3 pb-2 hover:bg-slate-50 dark:border-gray-700 dark:bg-slate-900 hover:dark:bg-slate-800">
+                <span class="mb-1 block">{{ address.address }}</span>
+                <ul class="list">
+                  <li v-for="contact in address.contacts" :key="contact.id" class="mr-3 inline">
+                    <contact-card :contact="contact" :avatarClasses="'h-5 w-5 rounded-full mr-2'" :displayName="true" />
+                  </li>
+                </ul>
+              </li>
+            </ul>
+          </div>
+        </div>
+      </div>
+    </main>
+  </Layout>
+</template>
+
+<style lang="scss" scoped>
+.item-list {
+  &:hover:first-child {
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+  }
+
+  &:last-child {
+    border-bottom: 0;
+  }
+
+  &:hover:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+  }
+}
+
+.special-grid {
+  grid-template-columns: 200px 1fr;
+}
+
+@media (max-width: 480px) {
+  .special-grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
diff --git a/resources/js/Pages/Vault/Reports/Address/Index.vue b/resources/js/Pages/Vault/Reports/Address/Index.vue
new file mode 100644
index 00000000000..15c8a4a1f05
--- /dev/null
+++ b/resources/js/Pages/Vault/Reports/Address/Index.vue
@@ -0,0 +1,118 @@
+<script setup>
+import Layout from '@/Shared/Layout.vue';
+import { Link } from '@inertiajs/inertia-vue3';
+
+defineProps({
+  layoutData: Object,
+  data: Object,
+});
+</script>
+
+<template>
+  <Layout :layout-data="layoutData" :inside-vault="true">
+    <!-- breadcrumb -->
+    <nav class="bg-white dark:bg-gray-900 sm:mt-20 sm:border-b">
+      <div class="max-w-8xl mx-auto hidden px-4 py-2 sm:px-6 md:block">
+        <div class="flex items-baseline justify-between space-x-6">
+          <ul class="text-sm">
+            <li class="mr-2 inline text-gray-600 dark:text-gray-400">
+              {{ $t('app.breadcrumb_location') }}
+            </li>
+            <li class="mr-2 inline">
+              <inertia-link :href="layoutData.vault.url.reports" class="text-blue-500 hover:underline"
+                >Reports</inertia-link
+              >
+            </li>
+            <li class="relative mr-2 inline">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="icon-breadcrumb relative inline h-3 w-3"
+                fill="none"
+                viewBox="0 0 24 24"
+                stroke="currentColor">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7" />
+              </svg>
+            </li>
+            <li class="inline">List of addresses</li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+
+    <main class="sm:mt-18 relative">
+      <div class="mx-auto max-w-xl px-2 py-2 sm:py-6 sm:px-6 lg:px-8">
+        <div class="special-grid grid grid-cols-1 gap-6 sm:grid-cols-3">
+          <!-- left -->
+          <div>
+            <p class="mb-2 font-semibold"><span class="mr-1">🌍</span> All the countries</p>
+
+            <!-- list of countries -->
+            <ul v-if="data.countries.length > 0">
+              <li v-for="country in data.countries" :key="country.id">
+                <Link :href="country.url.index" class="text-blue-500 hover:underline">{{ country.name }}</Link> ({{
+                  country.contacts
+                }})
+              </li>
+            </ul>
+
+            <!-- blank state -->
+            <div
+              v-if="data.countries.length == 0"
+              class="mb-6 rounded-lg border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-900">
+              <p class="p-5 text-center">No countries have been added yet in any contact's addresses.</p>
+            </div>
+          </div>
+
+          <!-- right -->
+          <div class="p-3 sm:px-3 sm:py-0">
+            <p class="mb-2 font-semibold"><span class="mr-1">🏙️</span> All the cities</p>
+
+            <!-- list of cities -->
+            <ul v-if="data.cities.length > 0">
+              <li v-for="city in data.cities" :key="city.id">
+                <Link :href="city.url.index" class="text-blue-500 hover:underline">{{ city.name }}</Link> ({{
+                  city.contacts
+                }})
+              </li>
+            </ul>
+
+            <!-- blank state -->
+            <div
+              v-if="data.countries.length == 0"
+              class="mb-6 rounded-lg border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-900">
+              <p class="p-5 text-center">No cities have been added yet in any contact's addresses.</p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+  </Layout>
+</template>
+
+<style lang="scss" scoped>
+.item-list {
+  &:hover:first-child {
+    border-top-left-radius: 8px;
+    border-top-right-radius: 8px;
+  }
+
+  &:last-child {
+    border-bottom: 0;
+  }
+
+  &:hover:last-child {
+    border-bottom-left-radius: 8px;
+    border-bottom-right-radius: 8px;
+  }
+}
+
+.special-grid {
+  grid-template-columns: 1fr 1fr;
+}
+
+@media (max-width: 480px) {
+  .special-grid {
+    grid-template-columns: 1fr;
+  }
+}
+</style>
diff --git a/resources/js/Pages/Vault/Reports/Index.vue b/resources/js/Pages/Vault/Reports/Index.vue
index de34173485e..c40c042463f 100644
--- a/resources/js/Pages/Vault/Reports/Index.vue
+++ b/resources/js/Pages/Vault/Reports/Index.vue
@@ -15,6 +15,11 @@ defineProps({
         <h2 class="mb-6 text-center text-lg">All the reports</h2>
         <div class="mb-12 rounded-lg border border-gray-200 bg-white p-5 dark:border-gray-700 dark:bg-gray-900">
           <ul>
+            <li class="mb-2 flex justify-start">
+              <Link :href="data.url.addresses" class="text-blue-500 hover:underline">
+                List of addresses of the contacts in the vault
+              </Link>
+            </li>
             <li class="mb-2 flex justify-start">
               <Link :href="data.url.mood_tracking_events" class="text-blue-500 hover:underline">
                 Mood tracking events
diff --git a/resources/js/Shared/Modules/Addresses.vue b/resources/js/Shared/Modules/Addresses.vue
index 2157d3c9fd9..aff2ee456d5 100644
--- a/resources/js/Shared/Modules/Addresses.vue
+++ b/resources/js/Shared/Modules/Addresses.vue
@@ -1,3 +1,159 @@
+<script setup>
+import PrettyButton from '@/Shared/Form/PrettyButton.vue';
+import PrettySpan from '@/Shared/Form/PrettySpan.vue';
+import TextInput from '@/Shared/Form/TextInput.vue';
+import Errors from '@/Shared/Form/Errors.vue';
+import Dropdown from '@/Shared/Form/Dropdown.vue';
+import JetConfirmationModal from '@/Components/Jetstream/ConfirmationModal.vue';
+import JetDangerButton from '@/Components/Jetstream/DangerButton.vue';
+import JetSecondaryButton from '@/Components/Jetstream/SecondaryButton.vue';
+import { onMounted, ref } from 'vue';
+import { useForm } from '@inertiajs/inertia-vue3';
+
+const props = defineProps({
+  layoutData: Object,
+  data: Object,
+});
+
+const loadingState = ref('');
+const createAddressModalShown = ref(false);
+const inactiveAddressesShown = ref(false);
+const localActiveAddresses = ref([]);
+const localInactiveAddresses = ref([]);
+const editedAddressId = ref(0);
+const choiceChooseExisting = ref(true);
+const deleteAddressModalShown = ref(false);
+const processAddressDeletion = ref(false);
+const addressToDelete = ref(null);
+
+const form = useForm({
+  existing_address: false,
+  existing_address_id: 0,
+  type: '',
+  address_type_id: 0,
+  is_past_address: false,
+  line_1: '',
+  line_2: '',
+  city: '',
+  province: '',
+  postal_code: '',
+  country: '',
+  errors: [],
+});
+
+onMounted(() => {
+  localActiveAddresses.value = props.data.active_addresses;
+  localInactiveAddresses.value = props.data.inactive_addresses;
+  if (props.data.active_addresses.length > 0) {
+    choiceChooseExisting.value = true;
+  } else {
+    choiceChooseExisting.value = false;
+  }
+});
+
+const showCreateAddressModal = () => {
+  form.errors = [];
+  form.is_past_address = false;
+  form.address_type_id = 0;
+  form.line_1 = '';
+  form.line_2 = '';
+  form.city = '';
+  form.province = '';
+  form.postal_code = '';
+  form.country = '';
+  createAddressModalShown.value = true;
+};
+
+const toggleInactiveAdresses = () => {
+  inactiveAddressesShown.value = !inactiveAddressesShown.value;
+};
+
+const showEditAddressModal = (address) => {
+  editedAddressId.value = address.id;
+  form.errors = [];
+  form.is_past_address = address.is_past_address;
+  form.address_type_id = address.type ? address.type.id : 0;
+  form.line_1 = address.line_1;
+  form.line_2 = address.line_2;
+  form.city = address.city;
+  form.province = address.province;
+  form.postal_code = address.postal_code;
+  form.country = address.country;
+};
+
+const showDeleteAddressModal = (address) => {
+  addressToDelete.value = address;
+  deleteAddressModalShown.value = true;
+};
+
+const submit = () => {
+  loadingState.value = 'loading';
+  form.existing_address = choiceChooseExisting.value;
+
+  axios
+    .post(props.data.url.store, form)
+    .then((response) => {
+      if (form.is_past_address) {
+        localInactiveAddresses.value.unshift(response.data.data);
+      } else {
+        localActiveAddresses.value.unshift(response.data.data);
+      }
+
+      loadingState.value = '';
+      createAddressModalShown.value = false;
+    })
+    .catch((error) => {
+      loadingState.value = '';
+      form.errors = error.response.data;
+    });
+};
+
+const update = (address) => {
+  loadingState.value = 'loading';
+
+  axios
+    .put(address.url.update, form)
+    .then((response) => {
+      loadingState.value = '';
+
+      if (form.is_past_address) {
+        localInactiveAddresses.value[localInactiveAddresses.value.findIndex((x) => x.id === address.id)] =
+          response.data.data;
+      } else {
+        localActiveAddresses.value[localActiveAddresses.value.findIndex((x) => x.id === address.id)] =
+          response.data.data;
+      }
+      editedAddressId.value = 0;
+    })
+    .catch((error) => {
+      loadingState.value = '';
+      form.errors = error.response.data;
+    });
+};
+
+const destroy = () => {
+  processAddressDeletion.value = true;
+
+  axios
+    .delete(addressToDelete.value.url.destroy)
+    .then(() => {
+      processAddressDeletion.value = false;
+      if (addressToDelete.value.is_past_address) {
+        const id = localInactiveAddresses.value.findIndex((x) => x.id === addressToDelete.value.id);
+        localInactiveAddresses.value.splice(id, 1);
+      } else {
+        const id2 = localActiveAddresses.value.findIndex((x) => x.id === addressToDelete.value.id);
+        localActiveAddresses.value.splice(id2, 1);
+      }
+      deleteAddressModalShown.value = false;
+    })
+    .catch((error) => {
+      loadingState.value = null;
+      form.errors = error.response.data;
+    });
+};
+</script>
+
 <template>
   <div class="mb-10">
     <!-- title + cta -->
@@ -36,7 +192,73 @@
         v-if="createAddressModalShown"
         class="bg-form mb-6 rounded-lg border border-gray-200 dark:border-gray-700 dark:bg-gray-900"
         @submit.prevent="submit()">
-        <div class="border-b border-gray-200 dark:border-gray-700">
+        <!-- radio button: choose existing or create new address -->
+        <div
+          v-if="props.data.addresses_in_vault.length > 0"
+          class="mb-2 border-b border-gray-200 p-5 dark:border-gray-700">
+          <div class="mb-2 flex items-center">
+            <input
+              id="chooseExisting"
+              :checked="choiceChooseExisting"
+              @change="choiceChooseExisting = true"
+              name="exist"
+              type="radio"
+              class="h-4 w-4 border-gray-300 text-sky-500 dark:border-gray-700" />
+            <label
+              for="chooseExisting"
+              class="ml-3 block cursor-pointer text-sm font-medium text-gray-700 dark:text-gray-300">
+              Choose an existing address
+            </label>
+          </div>
+
+          <div class="flex items-center">
+            <input
+              id="createNew"
+              :checked="!choiceChooseExisting"
+              @change="choiceChooseExisting = false"
+              name="exist"
+              type="radio"
+              class="h-4 w-4 border-gray-300 text-sky-500 dark:border-gray-700" />
+            <label
+              for="createNew"
+              class="ml-3 block cursor-pointer text-sm font-medium text-gray-700 dark:text-gray-300">
+              Create a new address
+            </label>
+          </div>
+        </div>
+
+        <!-- existing addresses -->
+        <div
+          v-if="choiceChooseExisting && props.data.addresses_in_vault.length > 0"
+          class="h-40 overflow-auto border-b border-gray-200 p-3 dark:border-gray-700">
+          <ul class="rounded-lg border border-gray-200 bg-white dark:border-gray-700 dark:bg-gray-900">
+            <li
+              v-for="address in props.data.addresses_in_vault"
+              :key="address.id"
+              class="item-list border-b border-gray-200 px-3 py-2 hover:bg-slate-50 dark:border-gray-700 dark:bg-slate-900 hover:dark:bg-slate-800">
+              <!-- detail of the address type -->
+              <div class="flex items-center">
+                <input
+                  :id="'address-' + address.id"
+                  v-model="form.existing_address_id"
+                  :value="address.id"
+                  name="date-format"
+                  type="radio"
+                  class="h-4 w-4 border-gray-300 text-sky-500 dark:border-gray-700" />
+                <label
+                  :for="'address-' + address.id"
+                  class="ml-3 block cursor-pointer text-sm font-medium text-gray-700 dark:text-gray-300">
+                  {{ address.address }}
+                </label>
+              </div>
+            </li>
+          </ul>
+        </div>
+
+        <!-- create new address -->
+        <div
+          v-if="!choiceChooseExisting || props.data.addresses_in_vault.length == 0"
+          class="border-b border-gray-200 dark:border-gray-700">
           <div v-if="form.errors.length > 0" class="p-5">
             <errors :errors="form.errors" />
           </div>
@@ -184,7 +406,9 @@
               <li class="inline cursor-pointer text-blue-500 hover:underline" @click="showEditAddressModal(address)">
                 {{ $t('app.edit') }}
               </li>
-              <li class="ml-4 inline cursor-pointer text-red-500 hover:text-red-900" @click="destroy(address)">
+              <li
+                class="ml-4 inline cursor-pointer text-red-500 hover:text-red-900"
+                @click="showDeleteAddressModal(address)">
                 {{ $t('app.delete') }}
               </li>
             </ul>
@@ -484,173 +708,34 @@
         </div>
       </div>
     </div>
+
+    <!-- delete modal -->
+    <JetConfirmationModal :show="deleteAddressModalShown" @close="deleteAddressModalShown = false">
+      <template #title>
+        {{ $t('Delete the address') }}
+      </template>
+
+      <template #content>
+        {{ $t('Are you sure? The address will be deleted immediately.') }}
+      </template>
+
+      <template #footer>
+        <JetSecondaryButton @click="deleteAddressModalShown = false">
+          {{ $t('Cancel') }}
+        </JetSecondaryButton>
+
+        <JetDangerButton
+          class="ml-3"
+          :class="{ 'opacity-25': processAddressDeletion }"
+          :disabled="processAddressDeletion"
+          @click="destroy()">
+          {{ $t('Delete') }}
+        </JetDangerButton>
+      </template>
+    </JetConfirmationModal>
   </div>
 </template>
 
-<script>
-import PrettyButton from '@/Shared/Form/PrettyButton.vue';
-import PrettySpan from '@/Shared/Form/PrettySpan.vue';
-import TextInput from '@/Shared/Form/TextInput.vue';
-import Errors from '@/Shared/Form/Errors.vue';
-import Dropdown from '@/Shared/Form/Dropdown.vue';
-
-export default {
-  components: {
-    PrettyButton,
-    PrettySpan,
-    TextInput,
-    Errors,
-    Dropdown,
-  },
-
-  props: {
-    layoutData: {
-      type: Object,
-      default: null,
-    },
-    data: {
-      type: Object,
-      default: null,
-    },
-  },
-
-  data() {
-    return {
-      loadingState: '',
-      createAddressModalShown: false,
-      inactiveAddressesShown: false,
-      localActiveAddresses: [],
-      localInactiveAddresses: [],
-      editedAddressId: 0,
-      warning: '',
-      form: {
-        type: '',
-        address_type_id: 0,
-        is_past_address: false,
-        line_1: '',
-        line_2: '',
-        city: '',
-        province: '',
-        postal_code: '',
-        country: '',
-        errors: [],
-      },
-    };
-  },
-
-  created() {
-    this.localActiveAddresses = this.data.active_addresses;
-    this.localInactiveAddresses = this.data.inactive_addresses;
-  },
-
-  methods: {
-    showCreateAddressModal() {
-      this.form.errors = [];
-
-      this.form.is_past_address = false;
-      this.form.address_type_id = 0;
-      this.form.line_1 = '';
-      this.form.line_2 = '';
-      this.form.city = '';
-      this.form.province = '';
-      this.form.postal_code = '';
-      this.form.country = '';
-      this.createAddressModalShown = true;
-
-      this.$nextTick(() => {
-        this.$refs.line_1.focus();
-      });
-    },
-
-    toggleInactiveAdresses() {
-      this.inactiveAddressesShown = !this.inactiveAddressesShown;
-    },
-
-    showEditAddressModal(address) {
-      this.editedAddressId = address.id;
-      this.form.errors = [];
-      this.form.is_past_address = address.is_past_address;
-      this.form.address_type_id = address.type ? address.type.id : 0;
-      this.form.line_1 = address.line_1;
-      this.form.line_2 = address.line_2;
-      this.form.city = address.city;
-      this.form.province = address.province;
-      this.form.postal_code = address.postal_code;
-      this.form.country = address.country;
-    },
-
-    submit() {
-      this.loadingState = 'loading';
-
-      axios
-        .post(this.data.url.store, this.form)
-        .then((response) => {
-          this.flash(this.$t('contact.addresses_new_success'), 'success');
-
-          if (this.form.is_past_address) {
-            this.localInactiveAddresses.unshift(response.data.data);
-          } else {
-            this.localActiveAddresses.unshift(response.data.data);
-          }
-
-          this.loadingState = '';
-          this.createAddressModalShown = false;
-        })
-        .catch((error) => {
-          this.loadingState = '';
-          this.form.errors = error.response.data;
-        });
-    },
-
-    update(address) {
-      this.loadingState = 'loading';
-
-      axios
-        .put(address.url.update, this.form)
-        .then((response) => {
-          this.loadingState = '';
-          this.flash(this.$t('contact.addresses_edit_success'), 'success');
-
-          if (this.form.is_past_address) {
-            this.localInactiveAddresses[this.localInactiveAddresses.findIndex((x) => x.id === address.id)] =
-              response.data.data;
-          } else {
-            this.localActiveAddresses[this.localActiveAddresses.findIndex((x) => x.id === address.id)] =
-              response.data.data;
-          }
-          this.editedAddressId = 0;
-        })
-        .catch((error) => {
-          this.loadingState = '';
-          this.form.errors = error.response.data;
-        });
-    },
-
-    destroy(address) {
-      if (confirm(this.$t('contact.addresses_delete_confirm'))) {
-        axios
-          .delete(address.url.destroy)
-          .then(() => {
-            this.flash(this.$t('contact.addresses_delete_success'), 'success');
-
-            if (address.is_past_address) {
-              const id = this.localInactiveAddresses.findIndex((x) => x.id === address.id);
-              this.localInactiveAddresses.splice(id, 1);
-            } else {
-              const id2 = this.localActiveAddresses.findIndex((x) => x.id === address.id);
-              this.localActiveAddresses.splice(id2, 1);
-            }
-          })
-          .catch((error) => {
-            this.loadingState = null;
-            this.form.errors = error.response.data;
-          });
-      }
-    },
-  },
-};
-</script>
-
 <style lang="scss" scoped>
 .icon-sidebar {
   color: #737e8d;
diff --git a/routes/web.php b/routes/web.php
index 40e5a21adcd..cd5689288e2 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -95,6 +95,9 @@
 use App\Domains\Vault\ManageJournals\Web\Controllers\PostTagController;
 use App\Domains\Vault\ManageJournals\Web\Controllers\SliceOfLifeController;
 use App\Domains\Vault\ManageJournals\Web\Controllers\SliceOfLifeCoverImageController;
+use App\Domains\Vault\ManageReports\Web\Controllers\ReportAddressesCitiesController;
+use App\Domains\Vault\ManageReports\Web\Controllers\ReportAddressesController;
+use App\Domains\Vault\ManageReports\Web\Controllers\ReportAddressesCountriesController;
 use App\Domains\Vault\ManageReports\Web\Controllers\ReportImportantDateSummaryController;
 use App\Domains\Vault\ManageReports\Web\Controllers\ReportIndexController;
 use App\Domains\Vault\ManageReports\Web\Controllers\ReportMoodTrackingEventController;
@@ -183,6 +186,11 @@
             Route::prefix('reports')->group(function () {
                 Route::get('', [ReportIndexController::class, 'index'])->name('vault.reports.index');
 
+                // contact addresses
+                Route::get('addresses', [ReportAddressesController::class, 'index'])->name('vault.reports.addresses.index');
+                Route::get('addresses/city/{city}', [ReportAddressesCitiesController::class, 'show'])->name('vault.reports.addresses.cities.show');
+                Route::get('addresses/country/{country}', [ReportAddressesCountriesController::class, 'show'])->name('vault.reports.addresses.countries.show');
+
                 // mood tracking event
                 Route::get('moodTrackingEvents', [ReportMoodTrackingEventController::class, 'index'])->name('vault.reports.mood_tracking_events.index');
 
diff --git a/tests/Unit/Domains/Vault/ManageAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelperTest.php b/tests/Unit/Domains/Vault/ManageAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelperTest.php
index 5294dbeb46c..a6c728d71ee 100644
--- a/tests/Unit/Domains/Vault/ManageAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelperTest.php
+++ b/tests/Unit/Domains/Vault/ManageAddresses/Web/ViewHelpers/ModuleContactAddressesViewHelperTest.php
@@ -3,6 +3,7 @@
 namespace Tests\Unit\Domains\Vault\ManageAddresses\Web\ViewHelpers;
 
 use App\Domains\Contact\ManageContactAddresses\Web\ViewHelpers\ModuleContactAddressesViewHelper;
+use App\Helpers\MapHelper;
 use App\Models\Address;
 use App\Models\AddressType;
 use App\Models\Contact;
@@ -21,10 +22,14 @@ public function it_gets_the_data_needed_for_the_view(): void
         $contact = Contact::factory()->create();
         $user = User::factory()->create();
 
-        $address = Address::factory()->create();
+        $address = Address::factory()->create([
+            'vault_id' => $contact->vault_id,
+        ]);
         $address->contacts()->attach($contact, ['is_past_address' => true]);
-        $address = Address::factory()->create();
-        $address->contacts()->attach($contact, ['is_past_address' => false]);
+        $otherAddress = Address::factory()->create([
+            'vault_id' => $contact->vault_id,
+        ]);
+        $otherAddress->contacts()->attach($contact, ['is_past_address' => false]);
 
         $addressType = AddressType::factory()->create([
             'account_id' => $contact->vault->account_id,
@@ -34,13 +39,14 @@ public function it_gets_the_data_needed_for_the_view(): void
         $array = ModuleContactAddressesViewHelper::data($contact, $user);
 
         $this->assertEquals(
-            4,
+            5,
             count($array)
         );
 
         $this->assertArrayHasKey('active_addresses', $array);
         $this->assertArrayHasKey('inactive_addresses', $array);
         $this->assertArrayHasKey('address_types', $array);
+        $this->assertArrayHasKey('addresses_in_vault', $array);
         $this->assertArrayHasKey('url', $array);
 
         $this->assertEquals(
@@ -64,6 +70,20 @@ public function it_gets_the_data_needed_for_the_view(): void
             $array['inactive_addresses']->count()
         );
 
+        $this->assertEquals(
+            [
+                0 => [
+                    'id' => $address->id,
+                    'address' => MapHelper::getAddressAsString($address),
+                ],
+                1 => [
+                    'id' => $otherAddress->id,
+                    'address' => MapHelper::getAddressAsString($otherAddress),
+                ],
+            ],
+            $array['addresses_in_vault']->toArray()
+        );
+
         $this->assertEquals(
             [
                 'store' => env('APP_URL').'/vaults/'.$contact->vault->id.'/contacts/'.$contact->id.'/addresses',
diff --git a/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelperTest.php b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelperTest.php
new file mode 100644
index 00000000000..6d4ebba7a8e
--- /dev/null
+++ b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportAddressIndexViewHelperTest.php
@@ -0,0 +1,63 @@
+<?php
+
+namespace Tests\Unit\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportAddressIndexViewHelper;
+use App\Models\Address;
+use App\Models\Contact;
+use App\Models\Vault;
+use Illuminate\Foundation\Testing\DatabaseTransactions;
+use Tests\TestCase;
+
+class ReportAddressIndexViewHelperTest extends TestCase
+{
+    use DatabaseTransactions;
+
+    /** @test */
+    public function it_gets_the_data_needed_for_the_view(): void
+    {
+        $vault = Vault::factory()->create();
+        $contact = Contact::factory()->create([
+            'vault_id' => $vault->id,
+        ]);
+        $address = Address::factory()->create([
+            'vault_id' => $vault->id,
+            'city' => 'montreal',
+            'country' => 'canada',
+        ]);
+        $contact->addresses()->attach($address);
+
+        $array = ReportAddressIndexViewHelper::data($vault);
+
+        $this->assertCount(2, $array);
+        $this->assertArrayHasKey('cities', $array);
+        $this->assertArrayHasKey('countries', $array);
+
+        $this->assertEquals(
+            [
+                0 => [
+                    'id' => $address->id,
+                    'name' => 'Montreal',
+                    'contacts' => 1,
+                    'url' => [
+                        'index' => env('APP_URL').'/vaults/'.$vault->id.'/reports/addresses/city/montreal',
+                    ],
+                ],
+            ],
+            $array['cities']->toArray()
+        );
+        $this->assertEquals(
+            [
+                0 => [
+                    'id' => $address->id,
+                    'name' => 'Canada',
+                    'contacts' => 1,
+                    'url' => [
+                        'index' => env('APP_URL').'/vaults/'.$vault->id.'/reports/addresses/country/canada',
+                    ],
+                ],
+            ],
+            $array['countries']->toArray()
+        );
+    }
+}
diff --git a/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelperTest.php b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelperTest.php
new file mode 100644
index 00000000000..93a85b80af8
--- /dev/null
+++ b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCitiesShowViewHelperTest.php
@@ -0,0 +1,69 @@
+<?php
+
+namespace Tests\Unit\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportCitiesShowViewHelper;
+use App\Helpers\ContactCardHelper;
+use App\Helpers\MapHelper;
+use App\Models\Address;
+use App\Models\Contact;
+use App\Models\Vault;
+use Illuminate\Foundation\Testing\DatabaseTransactions;
+use Tests\TestCase;
+
+class ReportCitiesShowViewHelperTest extends TestCase
+{
+    use DatabaseTransactions;
+
+    /** @test */
+    public function it_gets_the_data_needed_for_the_view(): void
+    {
+        $vault = Vault::factory()->create();
+        $contact = Contact::factory()->create([
+            'vault_id' => $vault->id,
+        ]);
+        $address = Address::factory()->create([
+            'vault_id' => $vault->id,
+            'city' => 'montreal',
+            'country' => 'canada',
+        ]);
+        $contact->addresses()->attach($address);
+
+        $array = ReportCitiesShowViewHelper::data($vault, 'montreal');
+
+        $this->assertCount(4, $array);
+        $this->assertArrayHasKey('city', $array);
+        $this->assertArrayHasKey('addresses', $array);
+        $this->assertArrayHasKey('url', $array);
+        $this->assertArrayHasKey('wikipedia', $array);
+
+        $this->assertEquals(
+            'Montreal',
+            $array['city']
+        );
+        $this->assertEquals(
+            $address->id,
+            $array['addresses']->toArray()[0]['id']
+        );
+        $this->assertEquals(
+            'Montreal',
+            $array['addresses']->toArray()[0]['name']
+        );
+        $this->assertEquals(
+            MapHelper::getAddressAsString($address),
+            $array['addresses']->toArray()[0]['address']
+        );
+        $this->assertEquals(
+            [
+                0 => ContactCardHelper::data($contact),
+            ],
+            $array['addresses']->toArray()[0]['contacts']->toArray()
+        );
+        $this->assertEquals(
+            [
+                'addresses' => env('APP_URL').'/vaults/'.$vault->id.'/reports/addresses',
+            ],
+            $array['url']
+        );
+    }
+}
diff --git a/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelperTest.php b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelperTest.php
new file mode 100644
index 00000000000..242f6fdd908
--- /dev/null
+++ b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportCountriesShowViewHelperTest.php
@@ -0,0 +1,69 @@
+<?php
+
+namespace Tests\Unit\Domains\Vault\ManageReports\Web\ViewHelpers;
+
+use App\Domains\Vault\ManageReports\Web\ViewHelpers\ReportCountriesShowViewHelper;
+use App\Helpers\ContactCardHelper;
+use App\Helpers\MapHelper;
+use App\Models\Address;
+use App\Models\Contact;
+use App\Models\Vault;
+use Illuminate\Foundation\Testing\DatabaseTransactions;
+use Tests\TestCase;
+
+class ReportCountriesShowViewHelperTest extends TestCase
+{
+    use DatabaseTransactions;
+
+    /** @test */
+    public function it_gets_the_data_needed_for_the_view(): void
+    {
+        $vault = Vault::factory()->create();
+        $contact = Contact::factory()->create([
+            'vault_id' => $vault->id,
+        ]);
+        $address = Address::factory()->create([
+            'vault_id' => $vault->id,
+            'city' => 'montreal',
+            'country' => 'canada',
+        ]);
+        $contact->addresses()->attach($address);
+
+        $array = ReportCountriesShowViewHelper::data($vault, 'canada');
+
+        $this->assertCount(4, $array);
+        $this->assertArrayHasKey('country', $array);
+        $this->assertArrayHasKey('addresses', $array);
+        $this->assertArrayHasKey('url', $array);
+        $this->assertArrayHasKey('wikipedia', $array);
+
+        $this->assertEquals(
+            'Canada',
+            $array['country']
+        );
+        $this->assertEquals(
+            $address->id,
+            $array['addresses']->toArray()[0]['id']
+        );
+        $this->assertEquals(
+            'Canada',
+            $array['addresses']->toArray()[0]['name']
+        );
+        $this->assertEquals(
+            MapHelper::getAddressAsString($address),
+            $array['addresses']->toArray()[0]['address']
+        );
+        $this->assertEquals(
+            [
+                0 => ContactCardHelper::data($contact),
+            ],
+            $array['addresses']->toArray()[0]['contacts']->toArray()
+        );
+        $this->assertEquals(
+            [
+                'addresses' => env('APP_URL').'/vaults/'.$vault->id.'/reports/addresses',
+            ],
+            $array['url']
+        );
+    }
+}
diff --git a/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelperTest.php b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelperTest.php
index f96269c8dd1..5512450cd69 100644
--- a/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelperTest.php
+++ b/tests/Unit/Domains/Vault/ManageReports/Web/ViewHelpers/ReportIndexViewHelperTest.php
@@ -20,6 +20,7 @@ public function it_gets_the_data_needed_for_the_view(): void
         $this->assertEquals(
             [
                 'url' => [
+                    'addresses' => env('APP_URL').'/vaults/'.$vault->id.'/reports/addresses',
                     'mood_tracking_events' => env('APP_URL').'/vaults/'.$vault->id.'/reports/moodTrackingEvents',
                     'important_date_summary' => env('APP_URL').'/vaults/'.$vault->id.'/reports/importantDates',
                 ],
diff --git a/tests/Unit/Helpers/WikipediaHelperTest.php b/tests/Unit/Helpers/WikipediaHelperTest.php
new file mode 100644
index 00000000000..f37b064531b
--- /dev/null
+++ b/tests/Unit/Helpers/WikipediaHelperTest.php
@@ -0,0 +1,25 @@
+<?php
+
+namespace Tests\Unit\Helpers;
+
+use App\Helpers\WikipediaHelper;
+use Illuminate\Foundation\Testing\DatabaseTransactions;
+use Tests\TestCase;
+
+class WikipediaHelperTest extends TestCase
+{
+    use DatabaseTransactions;
+
+    /** @test */
+    public function it_gets_information_about_the_city_or_country(): void
+    {
+        $city = 'Montreal';
+
+        $array = WikipediaHelper::getInformation($city);
+
+        $this->assertCount(3, $array);
+        $this->assertArrayHasKey('description', $array);
+        $this->assertArrayHasKey('thumbnail', $array);
+        $this->assertArrayHasKey('url', $array);
+    }
+}