From de18c874753ad3a7ef7412e3b4492f6dc8a83941 Mon Sep 17 00:00:00 2001
From: Patrick Erichsen <patrick.a.erichsen@gmail.com>
Date: Fri, 3 Dec 2021 16:57:14 -0600
Subject: [PATCH] feat: add discord server link (#35)

* feat: add discord server link

Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com>

* feat: bump manifest

Signed-off-by: Patrick Erichsen <patrick.a.erichsen@gmail.com>
---
 assets/manifest.json                          |  2 +-
 .../InfoPopover/InfoPopoverFooter.tsx         | 40 +++++++++++--------
 2 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/assets/manifest.json b/assets/manifest.json
index efb18ed..5912b20 100644
--- a/assets/manifest.json
+++ b/assets/manifest.json
@@ -2,7 +2,7 @@
   "name": "Offie - Airbnb Wifi Reviews",
   "description": "View Wifi and workspace info from the Airbnb search results page.",
   "manifest_version": 3,
-  "version": "0.0.10",
+  "version": "0.0.11",
   "icons": {
     "16": "img/offie-logo-16.png",
     "48": "img/offie-logo-48.png",
diff --git a/src/content/components/InfoPopover/InfoPopoverFooter.tsx b/src/content/components/InfoPopover/InfoPopoverFooter.tsx
index 3032d7f..8c0e912 100644
--- a/src/content/components/InfoPopover/InfoPopoverFooter.tsx
+++ b/src/content/components/InfoPopover/InfoPopoverFooter.tsx
@@ -1,45 +1,51 @@
 import { Typography } from '@mui/material';
-import { OFFIE_URL } from '../../utils';
 import AirbnbLink from '../AirbnbLink';
 
-const InfoPopoverFooter = (): JSX.Element => {
+const InfoPopoverFooter = (): JSX.Element | null => {
+    const discordInviteUrl = process.env.DISCORD_INVITE_URL;
+
+    if (!discordInviteUrl) {
+        return null;
+    }
+
     return (
         <footer
             style={{
-                height: 48,
-                padding: '0 24px',
+                height: 64,
+                padding: '12px 24px',
                 display: 'flex',
-                justifyContent: 'space-between',
+                justifyContent: 'center',
                 alignItems: 'center',
                 position: 'relative',
+                flexWrap: 'wrap',
             }}
         >
             <Typography
                 variant="subtitle2"
+                textAlign="center"
                 style={{
+                    width: '100%',
                     color: '#717171',
                 }}
             >
-                <AirbnbLink href={`${OFFIE_URL}/feedback`} variant="subtitle2">
-                    Feedback
+                <AirbnbLink
+                    href={discordInviteUrl}
+                    variant="subtitle2"
+                    target="_blank"
+                >
+                    Join the Offie Discord
                 </AirbnbLink>
             </Typography>
 
             <Typography
-                variant="subtitle2"
+                textAlign="center"
+                variant="caption"
                 style={{
+                    width: '100%',
                     color: '#717171',
                 }}
             >
-                Made by{' '}
-                <AirbnbLink
-                    href={OFFIE_URL}
-                    target="_blank"
-                    rel="noopener"
-                    variant="subtitle2"
-                >
-                    Offie
-                </AirbnbLink>
+                Connect with other remote professional workers
             </Typography>
         </footer>
     );