From 82af8ee0f82964b14e3f9d8b76c50fa1148be0e5 Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 12:02:47 -0400
Subject: [PATCH 1/8] Fixed issue where low spec cookie was not saving

---
 packages/fakeyou/src/App.tsx                 |  9 +++----
 packages/fakeyou/src/v2/view/NewTopNavFc.tsx | 27 +++++++++-----------
 2 files changed, 16 insertions(+), 20 deletions(-)

diff --git a/packages/fakeyou/src/App.tsx b/packages/fakeyou/src/App.tsx
index b31b0bf709..ebc92ce08c 100644
--- a/packages/fakeyou/src/App.tsx
+++ b/packages/fakeyou/src/App.tsx
@@ -177,19 +177,18 @@ class App extends React.Component<Props, State> {
   }
 
   componentWillMount() {
-    // Handle redesign
-    console.log("componentWillMount");
-
     // Check to see if there is a cookie for darkMode;
     if (!window.localStorage.getItem("darkMode")) {
       // if not, set one to false to ensure we are defualting to dark mode.
       window.localStorage.setItem("darkMode", "false");
     }
 
+    // Check to see if there is a cookie for lowSpec;
     if (!window.localStorage.getItem("lowSpec")) {
-      // if not, set one to false to ensure we are defualting to dark mode.
-      window.localStorage.setItem("lowSpec", "false");
+      // if not, set one to true to ensure we are defualting to low spec mode.
+      window.localStorage.setItem("lowSpec", "true");
     }
+
     require("./AppOld.scss");
     require("./v2/view/_css/footer.scss");
   }
diff --git a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
index dbf0c05583..91a1053e97 100644
--- a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
@@ -51,8 +51,9 @@ function NewTopNavFc(props: Props) {
   const [darkModes, toggleDarkModes] = useState(
     defaultColourView === "false" ? true : false
   );
+
   const [lowSpecView, toggleLowSpecs] = useState(
-    defaultLowSpecView === "true" ? true : false
+    defaultLowSpecView === "false" ? true : false
   );
 
   let history = useHistory();
@@ -225,9 +226,8 @@ function NewTopNavFc(props: Props) {
             </p> */}
 
             <Tippy
-              content={`${
-                darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
-              }`}
+              content={`${darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
+                }`}
             >
               <button
                 className={`btn btn-toggle ${darkModes ? "dark" : ""}`}
@@ -237,9 +237,8 @@ function NewTopNavFc(props: Props) {
               </button>
             </Tippy>
             <Tippy
-              content={`${
-                lowSpecView ? "Turn on animations" : "Turn off animations"
-              }`}
+              content={`${lowSpecView ? "Turn on animations" : "Turn off animations"
+                }`}
             >
               <button
                 className={`btn btn-toggle  ${darkModes ? "dark" : ""}`}
@@ -452,9 +451,8 @@ function NewTopNavFc(props: Props) {
                   <div className="d-flex gap-4 py-2">
                     <div className="top-bar-text mobile">Options:</div>
                     <Tippy
-                      content={`${
-                        darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
-                      }`}
+                      content={`${darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
+                        }`}
                     >
                       <button
                         className={`btn btn-toggle ${darkModes ? "dark" : ""}`}
@@ -464,11 +462,10 @@ function NewTopNavFc(props: Props) {
                       </button>
                     </Tippy>
                     <Tippy
-                      content={`${
-                        lowSpecView
-                          ? "Turn on animations"
-                          : "Turn off animations"
-                      }`}
+                      content={`${lowSpecView
+                        ? "Turn on animations"
+                        : "Turn off animations"
+                        }`}
                     >
                       <button
                         className={`btn btn-toggle  ${darkModes ? "dark" : ""}`}

From c2360b4ba741b5c3419de8f109c5897e34325d34 Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 12:20:53 -0400
Subject: [PATCH 2/8] added name to button

---
 packages/dashboard.power.stream/src/layout/TopNav.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/dashboard.power.stream/src/layout/TopNav.tsx b/packages/dashboard.power.stream/src/layout/TopNav.tsx
index 7cb5304f19..abe07b814f 100644
--- a/packages/dashboard.power.stream/src/layout/TopNav.tsx
+++ b/packages/dashboard.power.stream/src/layout/TopNav.tsx
@@ -30,6 +30,7 @@ function TopNav(props: Props) {
             data-bs-target="#offcanvasNavbar2"
             aria-controls="offcanvasNavbar2"
           >
+            <span className="sr-only">Navbar toggle</span>
             <span className="navbar-toggler-icon"></span>
           </button>
           <div

From d32ea02bd327173ffb2093fe852617f3ac7a60d6 Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 12:23:57 -0400
Subject: [PATCH 3/8] Added titles to sodcial links

---
 packages/fakeyou/src/v2/view/NewFooterNavFc.tsx | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx b/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
index 8d3addae7d..5f90331ce8 100644
--- a/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
@@ -86,6 +86,7 @@ function NewFooterNavFc(props: Props) {
             href="https://discord.gg/fakeyou"
             target="_blank"
             rel="noopener noreferrer"
+            title="Join our Discord Server"
           >
             <FontAwesomeIcon icon={faDiscord} className="me-2" />
           </a>
@@ -94,6 +95,7 @@ function NewFooterNavFc(props: Props) {
             href="https://twitch.tv/FakeYouLabs"
             target="_blank"
             rel="noopener noreferrer"
+            title="Subscribe to our Twitch Channel"
           >
             <FontAwesomeIcon icon={faTwitch} className="me-2" />
           </a>
@@ -102,6 +104,7 @@ function NewFooterNavFc(props: Props) {
             href="https://twitter.com/intent/follow?screen_name=FakeYouApp"
             target="_blank"
             rel="noopener noreferrer"
+            title="Follow us on Twitter"
           >
             <FontAwesomeIcon icon={faTwitter} className="me-2" />
           </a>
@@ -110,6 +113,7 @@ function NewFooterNavFc(props: Props) {
             href="https://facebook.com/vocodes"
             target="_blank"
             rel="noopener noreferrer"
+            title="Like us on Facebook"
           >
             <FontAwesomeIcon icon={faFacebook} className="me-2" />
           </a>
@@ -118,6 +122,7 @@ function NewFooterNavFc(props: Props) {
             href="https://www.patreon.com/FakeYou"
             target="_blank"
             rel="noopener noreferrer"
+            title="Support us by becoming a patreon"
           >
             <FontAwesomeIcon icon={faPatreon} className="me-2" />
           </a>

From c78e43cb53e7afc8238396dbba4edef91f330aaa Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 12:27:57 -0400
Subject: [PATCH 4/8] updateed duplicative ID's

---
 packages/fakeyou/src/v2/view/NewTopNavFc.tsx | 32 +++++++++-----------
 1 file changed, 14 insertions(+), 18 deletions(-)

diff --git a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
index dbf0c05583..42ba6c7a31 100644
--- a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
@@ -225,9 +225,8 @@ function NewTopNavFc(props: Props) {
             </p> */}
 
             <Tippy
-              content={`${
-                darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
-              }`}
+              content={`${darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
+                }`}
             >
               <button
                 className={`btn btn-toggle ${darkModes ? "dark" : ""}`}
@@ -237,9 +236,8 @@ function NewTopNavFc(props: Props) {
               </button>
             </Tippy>
             <Tippy
-              content={`${
-                lowSpecView ? "Turn on animations" : "Turn off animations"
-              }`}
+              content={`${lowSpecView ? "Turn on animations" : "Turn off animations"
+                }`}
             >
               <button
                 className={`btn btn-toggle  ${darkModes ? "dark" : ""}`}
@@ -325,7 +323,7 @@ function NewTopNavFc(props: Props) {
                   <a
                     className="nav-link dropdown-toggle"
                     href="/"
-                    id="offcanvasNavbarLgDropdown"
+                    id="offcanvasNavbarLgDropdown-tts"
                     role="button"
                     data-bs-toggle="dropdown"
                     aria-expanded="false"
@@ -335,7 +333,7 @@ function NewTopNavFc(props: Props) {
                   </a>
                   <ul
                     className="dropdown-menu"
-                    aria-labelledby="offcanvasNavbarLgDropdown"
+                    aria-labelledby="offcanvasNavbarLgDropdown-tts"
                   >
                     <li data-bs-toggle="offcanvas">
                       <Link className="dropdown-item" to="/">
@@ -357,7 +355,7 @@ function NewTopNavFc(props: Props) {
                   <a
                     className="nav-link dropdown-toggle"
                     href="/"
-                    id="offcanvasNavbarLgDropdown"
+                    id="offcanvasNavbarLgDropdown-community"
                     role="button"
                     data-bs-toggle="dropdown"
                   >
@@ -366,7 +364,7 @@ function NewTopNavFc(props: Props) {
                   </a>
                   <ul
                     className="dropdown-menu"
-                    aria-labelledby="offcanvasNavbarLgDropdown"
+                    aria-labelledby="offcanvasNavbarLgDropdown-community"
                   >
                     <li data-bs-toggle="offcanvas">
                       <Link className="dropdown-item" to="/contribute">
@@ -452,9 +450,8 @@ function NewTopNavFc(props: Props) {
                   <div className="d-flex gap-4 py-2">
                     <div className="top-bar-text mobile">Options:</div>
                     <Tippy
-                      content={`${
-                        darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
-                      }`}
+                      content={`${darkModes ? "Toggle Light Mode" : "Toggle Dark Mode"
+                        }`}
                     >
                       <button
                         className={`btn btn-toggle ${darkModes ? "dark" : ""}`}
@@ -464,11 +461,10 @@ function NewTopNavFc(props: Props) {
                       </button>
                     </Tippy>
                     <Tippy
-                      content={`${
-                        lowSpecView
-                          ? "Turn on animations"
-                          : "Turn off animations"
-                      }`}
+                      content={`${lowSpecView
+                        ? "Turn on animations"
+                        : "Turn off animations"
+                        }`}
                     >
                       <button
                         className={`btn btn-toggle  ${darkModes ? "dark" : ""}`}

From 1a7485b9982b7e8b4f95eba8afae88fe3e3f86c3 Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 12:59:09 -0400
Subject: [PATCH 5/8] title added to toggle

---
 packages/dashboard.power.stream/src/layout/TopNav.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/dashboard.power.stream/src/layout/TopNav.tsx b/packages/dashboard.power.stream/src/layout/TopNav.tsx
index abe07b814f..0e7fd99c11 100644
--- a/packages/dashboard.power.stream/src/layout/TopNav.tsx
+++ b/packages/dashboard.power.stream/src/layout/TopNav.tsx
@@ -29,6 +29,7 @@ function TopNav(props: Props) {
             data-bs-toggle="offcanvas"
             data-bs-target="#offcanvasNavbar2"
             aria-controls="offcanvasNavbar2"
+            title="toggle navbar"
           >
             <span className="sr-only">Navbar toggle</span>
             <span className="navbar-toggler-icon"></span>

From 3a0a8a68c098f64d0a4f915756cacbaa2f8ae2ee Mon Sep 17 00:00:00 2001
From: Angelica Chung <angelica.ramos.91@gmail.com>
Date: Sat, 27 Aug 2022 13:27:09 -0400
Subject: [PATCH 6/8] minor replacements in NewTopNavFc.tsx

---
 packages/fakeyou/src/v2/view/NewTopNavFc.tsx | 26 ++++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
index 42ba6c7a31..d2adc7dfea 100644
--- a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
@@ -358,6 +358,7 @@ function NewTopNavFc(props: Props) {
                     id="offcanvasNavbarLgDropdown-community"
                     role="button"
                     data-bs-toggle="dropdown"
+                    aria-label="Community dropdown"
                   >
                     <FontAwesomeIcon icon={faUsers} className="me-2" />
                     Community
@@ -367,34 +368,32 @@ function NewTopNavFc(props: Props) {
                     aria-labelledby="offcanvasNavbarLgDropdown-community"
                   >
                     <li data-bs-toggle="offcanvas">
-                      <Link className="dropdown-item" to="/contribute">
+                      <Link className="dropdown-item" to="/contribute" title="to Upload page">
                         <FontAwesomeIcon icon={faUpload} className="me-2" />
                         Contribute/Upload
                       </Link>
                     </li>
                     <li data-bs-toggle="offcanvas">
-                      <Link className="dropdown-item" to="/leaderboard">
+                      <Link className="dropdown-item" to="/leaderboard" title="to leaderboard">
                         <FontAwesomeIcon icon={faTrophy} className="me-2" />
                         Leaderboard
                       </Link>
                     </li>
                     <li data-bs-toggle="offcanvas">
-                      <Link className="dropdown-item" to="/patrons">
+                      <Link className="dropdown-item" to="/patrons" title="to patron list">
                         <FontAwesomeIcon icon={faPatreon} className="me-2" />
                         Patrons
                       </Link>
                     </li>
                     <li data-bs-toggle="offcanvas">
-                      <Link className="dropdown-item" to="/firehose">
+                      <Link className="dropdown-item" to="/firehose" title="to feed">
                         <FontAwesomeIcon icon={faList} className="me-2" />
                         Feed
                       </Link>
                     </li>
-                    <li>
-                      <div className="dropdown-divider"></div>
-                    </li>
+                    <hr className='dropdown-divider' />
                     <li data-bs-toggle="offcanvas">
-                      <Link className="dropdown-item" to={myDataLink}>
+                      <Link className="dropdown-item" to={myDataLink} title="my profile">
                         <FontAwesomeIcon icon={faUser} className="me-2" />
                         My Data
                       </Link>
@@ -403,13 +402,13 @@ function NewTopNavFc(props: Props) {
                 </li>
 
                 <li data-bs-toggle="offcanvas" className="nav-item d-lg-none">
-                  <Link className="nav-link" aria-current="page" to="/about">
+                  <Link className="nav-link" aria-current="page" to="/about" title="About Us">
                     About
                   </Link>
                 </li>
 
                 <li data-bs-toggle="offcanvas" className="nav-item d-lg-none">
-                  <Link className="nav-link" aria-current="page" to="/terms">
+                  <Link className="nav-link" aria-current="page" title="Terms of Use" to="/terms">
                     Terms of Use
                   </Link>
                 </li>
@@ -419,13 +418,14 @@ function NewTopNavFc(props: Props) {
                   <a
                     className="nav-link"
                     aria-current="page"
+                    title="to API"
                     href={FrontendUrlConfig.developerDocs()}
                   >
                     Developers
                   </a>
                 </li>
                 <li className="d-lg-none">
-                  <div className="dropdown-divider dropdown-divider-white mt-3"></div>
+                  <hr className="dropdown-divider dropdown-divider-white" />
                 </li>
 
                 <li className="ps-3 d-lg-none">
@@ -443,7 +443,7 @@ function NewTopNavFc(props: Props) {
                 </li>
 
                 <li className="d-lg-none">
-                  <div className="dropdown-divider dropdown-divider-white mt-3"></div>
+                  <hr className="dropdown-divider dropdown-divider-white" />
                 </li>
 
                 <li className="ps-3 d-lg-none">
@@ -480,7 +480,7 @@ function NewTopNavFc(props: Props) {
                 </li>
 
                 <li className="d-lg-none">
-                  <div className="dropdown-divider dropdown-divider-white"></div>
+                  <hr className="dropdown-divider dropdown-divider-white" />
                 </li>
               </ul>
               <div className="d-grid d-flex justify-content-start align-items-center pt-4 ps-3 pt-lg-0 ps-lg-0">

From 784b576024b716871fcbeca32fa8657ebdffda50 Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Sun, 4 Sep 2022 00:44:43 -0400
Subject: [PATCH 7/8] Add scripts to publish to production

Eventually a central deploy system that doesn't push from developer
machines should be the standard mechanism. This will work for now.
---
 publish_production_fakeyou.sh     | 21 +++++++++++++++++++++
 publish_production_storyteller.sh | 21 +++++++++++++++++++++
 2 files changed, 42 insertions(+)
 create mode 100755 publish_production_fakeyou.sh
 create mode 100755 publish_production_storyteller.sh

diff --git a/publish_production_fakeyou.sh b/publish_production_fakeyou.sh
new file mode 100755
index 0000000000..57ec5a9364
--- /dev/null
+++ b/publish_production_fakeyou.sh
@@ -0,0 +1,21 @@
+#!/bin/bash
+
+set -euxo pipefail
+
+MASTER_BRANCH='master'
+PRODUCTION_BRANCH='production-fakeyou'
+
+git stash
+git checkout $MASTER_BRANCH
+git pull
+
+if git show-ref --verify --quiet "refs/heads/$PRODUCTION_BRANCH"; then
+    echo "Deleting branch ${PRODUCTION_BRANCH}"
+    git branch -D $PRODUCTION_BRANCH
+fi
+
+git checkout -b $PRODUCTION_BRANCH
+git push --set-upstream origin $PRODUCTION_BRANCH
+
+git checkout $MASTER_BRANCH
+
diff --git a/publish_production_storyteller.sh b/publish_production_storyteller.sh
new file mode 100755
index 0000000000..129cac9e4b
--- /dev/null
+++ b/publish_production_storyteller.sh
@@ -0,0 +1,21 @@
+#!/bin/bash
+
+set -euxo pipefail
+
+MASTER_BRANCH='master'
+PRODUCTION_BRANCH='production-storyteller'
+
+git stash
+git checkout $MASTER_BRANCH
+git pull
+
+if git show-ref --verify --quiet "refs/heads/$PRODUCTION_BRANCH"; then
+    echo "Deleting branch ${PRODUCTION_BRANCH}"
+    git branch -D $PRODUCTION_BRANCH
+fi
+
+git checkout -b $PRODUCTION_BRANCH
+git push --set-upstream origin $PRODUCTION_BRANCH
+
+git checkout $MASTER_BRANCH
+

From d3cfa903b8f8fb191f347909e53af3bee943f618 Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Sun, 4 Sep 2022 22:49:36 -0400
Subject: [PATCH 8/8] Collect common 3rd party links as central constants;
 dropdown Discord

---
 .../components/src/constants/ThirdPartyLinks.ts   | 15 +++++++++++++++
 packages/components/src/elements/DiscordLink.tsx  |  3 ++-
 packages/components/src/elements/DiscordLink2.tsx |  3 ++-
 packages/components/src/elements/PatreonLink.tsx  |  3 ++-
 packages/components/src/elements/TwitterLink.tsx  |  3 ++-
 packages/fakeyou/src/v2/view/NewFooterNavFc.tsx   |  7 ++++---
 packages/fakeyou/src/v2/view/NewTopNavFc.tsx      | 13 ++++++++++++-
 .../src/v2/view/about/terms_page/TermsPage.tsx    |  3 ++-
 .../fakeyou/src/v2/view/patrons/PatronPage.tsx    |  3 ++-
 .../w2l/w2l_template_view/W2lTemplateViewFc.tsx   |  3 ++-
 .../src/pages/index/IndexPage.tsx                 |  7 ++++---
 11 files changed, 49 insertions(+), 14 deletions(-)
 create mode 100644 packages/components/src/constants/ThirdPartyLinks.ts

diff --git a/packages/components/src/constants/ThirdPartyLinks.ts b/packages/components/src/constants/ThirdPartyLinks.ts
new file mode 100644
index 0000000000..e25de2e5be
--- /dev/null
+++ b/packages/components/src/constants/ThirdPartyLinks.ts
@@ -0,0 +1,15 @@
+/**
+ * Define links to third party sources here so we can update them in one place.
+ */
+class ThirdPartyLinks {
+    // This should only need to change if our Nitro expires.
+    // Old FakeYou Discord invite link: https://discord.gg/H72KFXm
+    public static readonly FAKEYOU_DISCORD = "https://discord.gg/fakeyou";
+
+    // A link to Twitter that will open a "Follow" prompt
+    public static readonly FAKEYOU_TWITTER_WITH_FOLLOW_INTENT = "https://twitter.com/intent/follow?screen_name=FakeYouApp";
+
+    public static readonly FAKEYOU_PATREON = "https://www.patreon.com/fakeyou";
+}
+
+export { ThirdPartyLinks }
\ No newline at end of file
diff --git a/packages/components/src/elements/DiscordLink.tsx b/packages/components/src/elements/DiscordLink.tsx
index f8eaed3fbb..2c7911cc12 100644
--- a/packages/components/src/elements/DiscordLink.tsx
+++ b/packages/components/src/elements/DiscordLink.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { faDiscord } from "@fortawesome/free-brands-svg-icons";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { ThirdPartyLinks } from "../constants/ThirdPartyLinks";
 
 interface Props {
   text?: string;
@@ -24,7 +25,7 @@ function DiscordLink(props: Props) {
   );
   return (
     <a
-      href="https://discord.gg/fakeyou"
+      href={ThirdPartyLinks.FAKEYOU_DISCORD}
       target="_blank"
       rel="noopener noreferrer"
     >
diff --git a/packages/components/src/elements/DiscordLink2.tsx b/packages/components/src/elements/DiscordLink2.tsx
index a158611416..a825c0483e 100644
--- a/packages/components/src/elements/DiscordLink2.tsx
+++ b/packages/components/src/elements/DiscordLink2.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { faDiscord } from "@fortawesome/free-brands-svg-icons";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { ThirdPartyLinks } from "../constants/ThirdPartyLinks";
 
 interface Props {
   hideIcon?: boolean;
@@ -35,7 +36,7 @@ function DiscordLink2(props: Props) {
 
   return (
     <a
-      href="https://discord.gg/H72KFXm"
+      href={ThirdPartyLinks.FAKEYOU_DISCORD}
       target="_blank"
       rel="noopener noreferrer"
     >
diff --git a/packages/components/src/elements/PatreonLink.tsx b/packages/components/src/elements/PatreonLink.tsx
index a037bdb9b7..4556c03f8a 100644
--- a/packages/components/src/elements/PatreonLink.tsx
+++ b/packages/components/src/elements/PatreonLink.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { faPatreon } from "@fortawesome/free-brands-svg-icons";
+import { ThirdPartyLinks } from "../constants/ThirdPartyLinks";
 
 interface Props {
   text?: string;
@@ -24,7 +25,7 @@ function PatreonLink(props: Props) {
   );
   return (
     <a
-      href="https://www.patreon.com/FakeYou"
+      href={ThirdPartyLinks.FAKEYOU_PATREON}
       target="_blank"
       rel="noopener noreferrer"
     >
diff --git a/packages/components/src/elements/TwitterLink.tsx b/packages/components/src/elements/TwitterLink.tsx
index e76de793f7..2e90b857f2 100644
--- a/packages/components/src/elements/TwitterLink.tsx
+++ b/packages/components/src/elements/TwitterLink.tsx
@@ -2,6 +2,7 @@ import React from "react";
 import { faTwitter } from "@fortawesome/free-brands-svg-icons";
 import { IconProp } from "@fortawesome/fontawesome-svg-core";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { ThirdPartyLinks } from "../constants/ThirdPartyLinks";
 
 interface Props {
   hideIcon?: boolean;
@@ -35,7 +36,7 @@ function TwitterLink(props: Props) {
 
   return (
     <a
-      href="https://twitter.com/intent/follow?screen_name=FakeYouApp"
+      href={ThirdPartyLinks.FAKEYOU_TWITTER_WITH_FOLLOW_INTENT}
       target="_blank"
       rel="noopener noreferrer"
     >
diff --git a/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx b/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
index 5f90331ce8..d2cebc53a7 100644
--- a/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewFooterNavFc.tsx
@@ -15,6 +15,7 @@ import {
   faTwitter,
   faFacebook,
 } from "@fortawesome/free-brands-svg-icons";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks";
 
 interface Props {
   sessionWrapper: SessionWrapper;
@@ -83,7 +84,7 @@ function NewFooterNavFc(props: Props) {
         <div className="d-flex justify-content-center gap-4">
           <a
             className="social-icon"
-            href="https://discord.gg/fakeyou"
+            href={ThirdPartyLinks.FAKEYOU_DISCORD}
             target="_blank"
             rel="noopener noreferrer"
             title="Join our Discord Server"
@@ -101,7 +102,7 @@ function NewFooterNavFc(props: Props) {
           </a>
           <a
             className="social-icon"
-            href="https://twitter.com/intent/follow?screen_name=FakeYouApp"
+            href={ThirdPartyLinks.FAKEYOU_TWITTER_WITH_FOLLOW_INTENT}
             target="_blank"
             rel="noopener noreferrer"
             title="Follow us on Twitter"
@@ -119,7 +120,7 @@ function NewFooterNavFc(props: Props) {
           </a>
           <a
             className="social-icon"
-            href="https://www.patreon.com/FakeYou"
+            href={ThirdPartyLinks.FAKEYOU_PATREON}
             target="_blank"
             rel="noopener noreferrer"
             title="Support us by becoming a patreon"
diff --git a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
index 9e9c0fd71a..14ee9ffa6c 100644
--- a/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
+++ b/packages/fakeyou/src/v2/view/NewTopNavFc.tsx
@@ -19,7 +19,7 @@ import {
   faComputer,
   faLaptop,
 } from "@fortawesome/free-solid-svg-icons";
-import { faPatreon } from "@fortawesome/free-brands-svg-icons";
+import { faDiscord, faPatreon } from "@fortawesome/free-brands-svg-icons";
 import { Logout } from "@storyteller/components/src/api/session/Logout";
 import { Gravatar } from "@storyteller/components/src/elements/Gravatar";
 import {
@@ -37,6 +37,7 @@ import {
 import Tippy from "@tippyjs/react";
 import "tippy.js/dist/tippy.css";
 import "tippy.js/animations/shift-away.css";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks";
 
 interface Props {
   sessionWrapper: SessionWrapper;
@@ -380,6 +381,16 @@ function NewTopNavFc(props: Props) {
                         Leaderboard
                       </Link>
                     </li>
+                    <li data-bs-toggle="offcanvas">
+                      <a className="dropdown-item" 
+                          href={ThirdPartyLinks.FAKEYOU_DISCORD} 
+                          title="discord chat" 
+                          target="_blank" 
+                          rel="noopener noreferrer">
+                        <FontAwesomeIcon icon={faDiscord} className="me-2" />
+                        Discord Chat
+                      </a>
+                    </li>
                     <li data-bs-toggle="offcanvas">
                       <Link className="dropdown-item" to="/patrons" title="to patron list">
                         <FontAwesomeIcon icon={faPatreon} className="me-2" />
diff --git a/packages/fakeyou/src/v2/view/about/terms_page/TermsPage.tsx b/packages/fakeyou/src/v2/view/about/terms_page/TermsPage.tsx
index 21eafae204..65da2e2a3a 100644
--- a/packages/fakeyou/src/v2/view/about/terms_page/TermsPage.tsx
+++ b/packages/fakeyou/src/v2/view/about/terms_page/TermsPage.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import { motion } from "framer-motion";
 import { container, item, panel } from "../../../../data/animation";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks";
 
 interface Props {}
 
@@ -28,7 +29,7 @@ function TermsPage(props: Props) {
               We do not condone the use of FakeYou for any type of deception,
               slur, abuse, or mistreatment of any individual or group. Please
               report such abuses to our{" "}
-              <a href="https://discord.gg/H72KFXm">
+              <a href={ThirdPartyLinks.FAKEYOU_DISCORD}>
                 community staff on Discord
               </a>
               . Bad actors will have their access revoked and materials deleted.
diff --git a/packages/fakeyou/src/v2/view/patrons/PatronPage.tsx b/packages/fakeyou/src/v2/view/patrons/PatronPage.tsx
index 3cf640d906..200ad23b8f 100644
--- a/packages/fakeyou/src/v2/view/patrons/PatronPage.tsx
+++ b/packages/fakeyou/src/v2/view/patrons/PatronPage.tsx
@@ -6,6 +6,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faPatreon } from "@fortawesome/free-brands-svg-icons";
 import { motion } from "framer-motion";
 import { container, item, image, panel } from "../../../data/animation";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks";
 interface Props {
   sessionWrapper: SessionWrapper;
 }
@@ -29,7 +30,7 @@ function PatronPage(props: Props) {
 
             <motion.div className="d-flex" variants={item}>
               <a
-                href="https://www.patreon.com/fakeyou"
+                href={ThirdPartyLinks.FAKEYOU_PATREON}
                 target="_blank"
                 rel="noreferrer"
                 className="btn btn-primary"
diff --git a/packages/fakeyou/src/v2/view/w2l/w2l_template_view/W2lTemplateViewFc.tsx b/packages/fakeyou/src/v2/view/w2l/w2l_template_view/W2lTemplateViewFc.tsx
index 423e3053dc..334f11fc9a 100644
--- a/packages/fakeyou/src/v2/view/w2l/w2l_template_view/W2lTemplateViewFc.tsx
+++ b/packages/fakeyou/src/v2/view/w2l/w2l_template_view/W2lTemplateViewFc.tsx
@@ -25,6 +25,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faEdit, faTrash } from "@fortawesome/free-solid-svg-icons";
 import { motion } from "framer-motion";
 import { container, item, panel } from "../../../../data/animation";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks";
 
 interface EnqueueJobResponsePayload {
   success: boolean;
@@ -190,7 +191,7 @@ function W2lTemplateViewFc(props: Props) {
         <span>
           Not yet (ask for approval in our&nbsp;
           <a
-            href="https://discord.gg/H72KFXm"
+            href={ThirdPartyLinks.FAKEYOU_DISCORD}
             target="_blank"
             rel="noopener noreferrer"
           >
diff --git a/packages/storyteller-home/src/pages/index/IndexPage.tsx b/packages/storyteller-home/src/pages/index/IndexPage.tsx
index 507a403de8..bb4faa2e8e 100644
--- a/packages/storyteller-home/src/pages/index/IndexPage.tsx
+++ b/packages/storyteller-home/src/pages/index/IndexPage.tsx
@@ -27,6 +27,7 @@ import { useEffect } from "react";
 import gsap from "gsap";
 import SplitType from "split-type";
 import Scene from "./Scene";
+import { ThirdPartyLinks } from "@storyteller/components/src/constants/ThirdPartyLinks"
 import { Swiper, SwiperSlide } from "swiper/react";
 import "swiper/css";
 import "swiper/css/pagination";
@@ -164,7 +165,7 @@ function IndexPage() {
             data-scroll-position="top"
           >
             <Tippy content="Discord" placement="right">
-              <a href="https://discord.gg/fakeyou">
+              <a href={ThirdPartyLinks.FAKEYOU_DISCORD}>
                 <FontAwesomeIcon icon={faDiscord} />
               </a>
             </Tippy>
@@ -591,7 +592,7 @@ function IndexPage() {
                 </p>
                 <div>
                   <a
-                    href="https://discord.gg/fakeyou"
+                    href={ThirdPartyLinks.FAKEYOU_DISCORD}
                     rel="noreferrer"
                     target="_blank"
                     className="btn btn-primary mt-4"
@@ -687,7 +688,7 @@ function IndexPage() {
                   </p>
                   <div>
                     <a
-                      href="https://discord.gg/fakeyou"
+                      href={ThirdPartyLinks.FAKEYOU_DISCORD}
                       rel="noreferrer"
                       target="_blank"
                       className="btn btn-primary mt-3"