Fix support link in footer

hotosm · Apr 6, 2022 · fc81d4a · fc81d4a
1 parent bd7d128
commit fc81d4a
Showing 1 changed file with 29 additions and 9 deletions.
diff --git a/frontend/src/components/footer.js b/frontend/src/components/footer.js
@@ -2,8 +2,14 @@ import React from 'react';
 import { useSelector } from 'react-redux';
 import { Link } from '@reach/router';
 import { FormattedMessage } from 'react-intl';
-
-import { TwitterIcon, FacebookIcon, YoutubeIcon, GithubIcon, InstagramIcon } from './svgIcons';
+import {
+  TwitterIcon,
+  FacebookIcon,
+  YoutubeIcon,
+  GithubIcon,
+  InstagramIcon,
+  ExternalLinkIcon,
+} from './svgIcons';
 import messages from './messages';
 import { getMenuItensForUser } from './header';
 import {
@@ -43,13 +49,27 @@ export function Footer({ location }: Object) {
           </div>
           <div className="pt2 mb2 w-50-l w-100 tl tr-l fr">
             {getMenuItensForUser(userDetails).map((item, n) => (
-              <Link
-                key={n}
-                to={item.link}
-                className="link barlow-condensed white f5 ttu di-l dib pt3 pt3-m ml4-l w-100 w-auto-l"
-              >
-                <FormattedMessage {...item.label} />
-              </Link>
+              <>
+                {!item.serviceDesk ? (
+                  <Link
+                    key={n}
+                    to={item.link}
+                    className="link barlow-condensed white f5 ttu di-l dib pt3 pt3-m ml4-l w-100 w-auto-l"
+                  >
+                    <FormattedMessage {...item.label} />
+                  </Link>
+                ) : (
+                  <a
+                    href={item.link}
+                    target="_blank"
+                    rel="noreferrer"
+                    className="link barlow-condensed white f5 ttu di-l dib pt3 pt3-m ml4-l w-100 w-auto-l nowrap"
+                  >
+                    <FormattedMessage {...item.label} />
+                    <ExternalLinkIcon className="pl2 v-cen" style={{ height: '11px' }} />
+                  </a>
+                )}
+              </>
             ))}
             <p className="pt5-l pt4 pb3">
               {socialNetworks