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 `${p}`;
})
.join('
')
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();
+
+ 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',