Add Facebook and Instagram links

app/components/icon.gjs

@@ -6,8 +6,10 @@ import activity from 'feather-icons/dist/icons/activity.svg?raw';
 import bookmark from 'feather-icons/dist/icons/bookmark.svg?raw';
 import clock from 'feather-icons/dist/icons/clock.svg?raw';
 import edit from 'feather-icons/dist/icons/edit.svg?raw';
+import facebook from 'feather-icons/dist/icons/facebook.svg?raw';
 import globe from 'feather-icons/dist/icons/globe.svg?raw';
 import home from 'feather-icons/dist/icons/home.svg?raw';
+import instagram from 'feather-icons/dist/icons/instagram.svg?raw';
 import logIn from 'feather-icons/dist/icons/log-in.svg?raw';
 import logOut from 'feather-icons/dist/icons/log-out.svg?raw';
 import map from 'feather-icons/dist/icons/map.svg?raw';
@@ -31,8 +33,10 @@ const ICONS = {
   bookmark,
   clock,
   edit,
+  facebook,
   globe,
   home,
+  instagram,
   'log-in': logIn,
   'log-out': logOut,
   map,

app/components/place-details.gjs

@@ -4,6 +4,7 @@ import { on } from '@ember/modifier';
 import { htmlSafe } from '@ember/template';
 import { humanizeOsmTag } from '../utils/format-text';
 import { getLocalizedName, getPlaceType } from '../utils/osm';
+import { getSocialInfo } from '../utils/social-links';
 import Icon from '../components/icon';
 import PlaceEditForm from './place-edit-form';
 
@@ -159,6 +160,14 @@ export default class PlaceDetails extends Component {
       .join(', ');
   }
 
+  get facebook() {
+    return getSocialInfo(this.tags, 'facebook');
+  }
+
+  get instagram() {
+    return getSocialInfo(this.tags, 'instagram');
+  }
+
   get wikipedia() {
     const val = this.tags.wikipedia;
     if (!val) return null;
@@ -292,6 +301,36 @@ export default class PlaceDetails extends Component {
           </p>
         {{/if}}
 
+        {{#if this.facebook}}
+          <p class="content-with-icon">
+            <Icon @name="facebook" @title="Facebook" />
+            <span>
+              <a
+                href={{this.facebook.url}}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                {{this.facebook.username}}
+              </a>
+            </span>
+          </p>
+        {{/if}}
+
+        {{#if this.instagram}}
+          <p class="content-with-icon">
+            <Icon @name="instagram" @title="Instagram" />
+            <span>
+              <a
+                href={{this.instagram.url}}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                {{this.instagram.username}}
+              </a>
+            </span>
+          </p>
+        {{/if}}
+
         {{#if this.wikipedia}}
           <p class="content-with-icon">
             <Icon @name="wikipedia" @title="Wikipedia" @filled={{true}} />