From 77db625b111e49ceab6b811d652bdd7b3a198530 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A2u=20Cao?= <raucao@kosmos.org>
Date: Wed, 19 Aug 2026 12:39:50 -0600
Subject: [PATCH] Fix WhatsApp links/numbers

Our links would work after opening WhatsApp, but not render e.g. known
business names associated with the number on the intermediate page that
you open the app or web app from
---
 app/components/place-details.gjs              |  2 +-
 .../components/place-details-test.gjs         | 33 +++++++++++++++++--
 2 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/app/components/place-details.gjs b/app/components/place-details.gjs
index a118445..7dfe87c 100644
--- a/app/components/place-details.gjs
+++ b/app/components/place-details.gjs
@@ -232,7 +232,7 @@ export default class PlaceDetails extends Component {
       return htmlSafe(
         parts
           .map((p) => {
-            const safeTel = p.replace(/[\s-]+/g, '');
+            const safeTel = p.replace(/[\s()+.-]/g, '');
             return `<a href="https://wa.me/${safeTel}" target="_blank" rel="noopener noreferrer">${p}</a>`;
           })
           .join('<br>')
diff --git a/tests/integration/components/place-details-test.gjs b/tests/integration/components/place-details-test.gjs
index 6a70d2b..59f1c12 100644
--- a/tests/integration/components/place-details-test.gjs
+++ b/tests/integration/components/place-details-test.gjs
@@ -320,14 +320,14 @@ module('Integration | Component | place-details', function (hooks) {
     const links = whatsappBlock.querySelectorAll('a[href^="https://wa.me/"]');
     assert.strictEqual(links.length, 2, 'Rendered exactly 2 WhatsApp links');
 
-    // Verify it stripped the dashes and spaces for the wa.me URL
+    // Verify it stripped the dashes, spaces and leading plus for the wa.me URL
     assert.strictEqual(
       links[0].getAttribute('href'),
-      'https://wa.me/+44987654321'
+      'https://wa.me/44987654321'
     );
     assert.strictEqual(
       links[1].getAttribute('href'),
-      'https://wa.me/+12345678900'
+      'https://wa.me/12345678900'
     );
 
     // Verify it kept the dashes and spaces for the visible text
@@ -335,6 +335,33 @@ module('Integration | Component | place-details', function (hooks) {
     assert.dom(links[1]).hasText('+1 234-567 8900');
   });
 
+  test('it strips parentheses, dots and the leading plus from whatsapp hrefs', async function (assert) {
+    const place = {
+      title: 'Chat Shop',
+      osmTags: {
+        whatsapp: '+504-9850-3802;(504) 9850.3802;+1.234.567.8900',
+      },
+    };
+
+    await render(<template><PlaceDetails @place={{place}} /></template>);
+
+    const links = this.element.querySelectorAll('a[href^="https://wa.me/"]');
+    assert.strictEqual(links.length, 3, 'Rendered exactly 3 WhatsApp links');
+
+    assert.strictEqual(
+      links[0].getAttribute('href'),
+      'https://wa.me/50498503802'
+    );
+    assert.strictEqual(
+      links[1].getAttribute('href'),
+      'https://wa.me/50498503802'
+    );
+    assert.strictEqual(
+      links[2].getAttribute('href'),
+      'https://wa.me/12345678900'
+    );
+  });
+
   test('it renders correct OpenStreetMap link for an OSM place', async function (assert) {
     const place = {
       title: 'OSM Place',