From 3be6ddede45f59e76adb8db91f2a5db5950cc4df Mon Sep 17 00:00:00 2001
From: BFlat <bombayapirat@gmail.com>
Date: Tue, 27 Feb 2024 18:52:47 +0700
Subject: [PATCH] hide footer bug fix

---
 .../fakeyou.com/src/v2/view/PageContainer.tsx |   6 +-
 .../fakeyou.com/src/v2/view/nav/FooterNav.tsx | 278 +++++++++---------
 2 files changed, 145 insertions(+), 139 deletions(-)

diff --git a/packages/fakeyou.com/src/v2/view/PageContainer.tsx b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
index 943b1ac057..71531e9a8b 100644
--- a/packages/fakeyou.com/src/v2/view/PageContainer.tsx
+++ b/packages/fakeyou.com/src/v2/view/PageContainer.tsx
@@ -216,8 +216,6 @@ interface Props {
   ) => void;
 }
 
-const isOnStudioPage = window.location.pathname === "/studio";
-
 interface State {}
 
 class PageContainer extends React.Component<
@@ -1575,9 +1573,7 @@ class PageContainer extends React.Component<
                   </Route>
                 </Switch>
               </div>
-              {!isOnStudioPage && (
-                <FooterNav sessionWrapper={this.props.sessionWrapper} />
-              )}
+              <FooterNav sessionWrapper={this.props.sessionWrapper} />
             </div>
           </div>
         </SearchProvider>
diff --git a/packages/fakeyou.com/src/v2/view/nav/FooterNav.tsx b/packages/fakeyou.com/src/v2/view/nav/FooterNav.tsx
index d36f06f6a1..9e5190bd5d 100644
--- a/packages/fakeyou.com/src/v2/view/nav/FooterNav.tsx
+++ b/packages/fakeyou.com/src/v2/view/nav/FooterNav.tsx
@@ -79,147 +79,157 @@ function FooterNav(props: Props) {
     );
   }
 
+  const isOnStudioPage = window.location.pathname.includes("/studio");
+
   return (
-    <footer id="footer">
-      <Container type="panel" className="py-5">
-        <div className="row g-5">
-          <div className="col-12 col-lg-3 d-flex flex-column gap-4 align-items-center align-items-lg-start">
-            <Link to="/">
-              <img
-                src={domain.logo}
-                alt={`${domain.title}: Cartoon and Celebrity Text to Speech`}
-                height="34"
-              />
-            </Link>
-            <div className="d-flex gap-3">
-              <a
-                className="social-icon"
-                href={ThirdPartyLinks.FAKEYOU_DISCORD}
-                target="_blank"
-                rel="noopener noreferrer"
-                title="Join our Discord Server"
-              >
-                <FontAwesomeIcon icon={faDiscord} className="me-2" />
-              </a>
-              <a
-                className="social-icon"
-                href={ThirdPartyLinks.FAKEYOU_TWITTER_WITH_FOLLOW_INTENT}
-                target="_blank"
-                rel="noopener noreferrer"
-                title="Follow us on Twitter"
-              >
-                <FontAwesomeIcon icon={faTwitter} className="me-2" />
-              </a>
-              <a
-                className="social-icon"
-                href={ThirdPartyLinks.FAKEYOU_TIKTOK}
-                target="_blank"
-                rel="noopener noreferrer"
-                title="Follow us on Tiktok"
-              >
-                <FontAwesomeIcon icon={faTiktok} className="me-2" />
-              </a>
-              <a
-                className="social-icon"
-                href={ThirdPartyLinks.FAKEYOU_TWITCH}
-                target="_blank"
-                rel="noopener noreferrer"
-                title="Subscribe to our Twitch Channel"
-              >
-                <FontAwesomeIcon icon={faTwitch} className="me-2" />
-              </a>
+    <>
+      {!isOnStudioPage && (
+        <footer id="footer">
+          <Container type="panel" className="py-5">
+            <div className="row g-5">
+              <div className="col-12 col-lg-3 d-flex flex-column gap-4 align-items-center align-items-lg-start">
+                <Link to="/">
+                  <img
+                    src={domain.logo}
+                    alt={`${domain.title}: Cartoon and Celebrity Text to Speech`}
+                    height="34"
+                  />
+                </Link>
+                <div className="d-flex gap-3">
+                  <a
+                    className="social-icon"
+                    href={ThirdPartyLinks.FAKEYOU_DISCORD}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    title="Join our Discord Server"
+                  >
+                    <FontAwesomeIcon icon={faDiscord} className="me-2" />
+                  </a>
+                  <a
+                    className="social-icon"
+                    href={ThirdPartyLinks.FAKEYOU_TWITTER_WITH_FOLLOW_INTENT}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    title="Follow us on Twitter"
+                  >
+                    <FontAwesomeIcon icon={faTwitter} className="me-2" />
+                  </a>
+                  <a
+                    className="social-icon"
+                    href={ThirdPartyLinks.FAKEYOU_TIKTOK}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    title="Follow us on Tiktok"
+                  >
+                    <FontAwesomeIcon icon={faTiktok} className="me-2" />
+                  </a>
+                  <a
+                    className="social-icon"
+                    href={ThirdPartyLinks.FAKEYOU_TWITCH}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    title="Subscribe to our Twitch Channel"
+                  >
+                    <FontAwesomeIcon icon={faTwitch} className="me-2" />
+                  </a>
+                </div>
+              </div>
+              <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
+                <p className="fw-bold">{t("productsTitle")}</p>
+                <li>
+                  <Link to="/tts">{t("productTts")}</Link>
+                </li>
+
+                <li>
+                  <Link to="/voice-conversion">{t("productVc")}</Link>
+                </li>
+
+                <li>
+                  <Link to="/voice-designer">Voice Designer</Link>
+                </li>
+
+                <li>
+                  <Link to="/face-animator">{t("productFaceAnimator")}</Link>
+                </li>
+
+                <li>
+                  <Link to="/contribute">{t("productUploadModels")}</Link>
+                </li>
+              </div>
+              <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
+                <p className="fw-bold">{t("communityTitle")}</p>
+
+                <li>
+                  <a
+                    href={ThirdPartyLinks.FAKEYOU_DISCORD}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                  >
+                    {t("communityDiscord")}
+                  </a>
+                </li>
+
+                <li>
+                  <Link to="/leaderboard">{t("communityLeaderboard")}</Link>
+                </li>
+
+                <li>
+                  <Link to="/guide">{t("communityGuide")}</Link>
+                </li>
+
+                <li>
+                  <Link to={myDataLink}>{t("communityProfile")}</Link>
+                </li>
+              </div>
+              <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
+                <p className="fw-bold">{t("infoTitle")}</p>
+                <li>
+                  <Link to={WebUrl.pricingPageWithReferer("footer")}>
+                    {t("infoPricing")}
+                  </Link>
+                </li>
+                <li>
+                  <Link to={WebUrl.aboutUsPage()}>{t("infoAbout")}</Link>
+                </li>
+
+                <li>
+                  <Link to={WebUrl.termsPage()}>{t("infoTerms")}</Link>
+                </li>
+
+                <li>
+                  <Link to={WebUrl.privacyPage()}>
+                    {t("infoPrivacyPolicy")}
+                  </Link>
+                </li>
+                <li>
+                  <a href={WebUrl.developerDocs()}>{t("infoApiDocs")}</a>
+                </li>
+              </div>
             </div>
-          </div>
-          <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
-            <p className="fw-bold">{t("productsTitle")}</p>
-            <li>
-              <Link to="/tts">{t("productTts")}</Link>
-            </li>
 
-            <li>
-              <Link to="/voice-conversion">{t("productVc")}</Link>
-            </li>
+            <div className="pt-4">
+              <hr />
+            </div>
 
-            <li>
-              <Link to="/voice-designer">Voice Designer</Link>
-            </li>
+            <div className="d-flex flex-column flex-lg-row pt-2 align-items-center gap-2 gap-xl-4 flex-wrap">
+              <span className="flex-grow-1 opacity-75">
+                © {domain.title} 2024
+              </span>
 
-            <li>
-              <Link to="/face-animator">{t("productFaceAnimator")}</Link>
-            </li>
+              <div className="d-flex flex-column flex-lg-row align-items-center mt-4 mt-lg-0">
+                {moderationLink}
+              </div>
 
-            <li>
-              <Link to="/contribute">{t("productUploadModels")}</Link>
-            </li>
-          </div>
-          <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
-            <p className="fw-bold">{t("communityTitle")}</p>
+              {serverGitSha}
 
-            <li>
-              <a
-                href={ThirdPartyLinks.FAKEYOU_DISCORD}
-                target="_blank"
-                rel="noopener noreferrer"
-              >
-                {t("communityDiscord")}
-              </a>
-            </li>
-
-            <li>
-              <Link to="/leaderboard">{t("communityLeaderboard")}</Link>
-            </li>
-
-            <li>
-              <Link to="/guide">{t("communityGuide")}</Link>
-            </li>
-
-            <li>
-              <Link to={myDataLink}>{t("communityProfile")}</Link>
-            </li>
-          </div>
-          <div className="py-2 col-12 col-lg-3 d-flex flex-column gap-2 gap-lg-3 align-items-center align-items-lg-start">
-            <p className="fw-bold">{t("infoTitle")}</p>
-            <li>
-              <Link to={WebUrl.pricingPageWithReferer("footer")}>
-                {t("infoPricing")}
-              </Link>
-            </li>
-            <li>
-              <Link to={WebUrl.aboutUsPage()}>{t("infoAbout")}</Link>
-            </li>
-
-            <li>
-              <Link to={WebUrl.termsPage()}>{t("infoTerms")}</Link>
-            </li>
-
-            <li>
-              <Link to={WebUrl.privacyPage()}>{t("infoPrivacyPolicy")}</Link>
-            </li>
-            <li>
-              <a href={WebUrl.developerDocs()}>{t("infoApiDocs")}</a>
-            </li>
-          </div>
-        </div>
-
-        <div className="pt-4">
-          <hr />
-        </div>
-
-        <div className="d-flex flex-column flex-lg-row pt-2 align-items-center gap-2 gap-xl-4 flex-wrap">
-          <span className="flex-grow-1 opacity-75">© {domain.title} 2024</span>
-
-          <div className="d-flex flex-column flex-lg-row align-items-center mt-4 mt-lg-0">
-            {moderationLink}
-          </div>
-
-          {serverGitSha}
-
-          <div className="d-flex flex-column flex-lg-row align-items-center">
-            <GitSha prefix="FE: " />
-          </div>
-        </div>
-      </Container>
-    </footer>
+              <div className="d-flex flex-column flex-lg-row align-items-center">
+                <GitSha prefix="FE: " />
+              </div>
+            </div>
+          </Container>
+        </footer>
+      )}
+    </>
   );
 }