From efcb12f95a1b2af15c289984c6a66b0e381fe328 Mon Sep 17 00:00:00 2001
From: frost768 <droidplus99@gmail.com>
Date: Sun, 26 Mar 2023 10:41:39 +0300
Subject: [PATCH 1/2] exclude dev routes from production

---
 src/setup/App.tsx                          | 54 ++++++++++++++++------
 src/views/developer/DeveloperView.tsx      |  2 +-
 src/views/developer/EmbedTesterView.tsx    |  2 +-
 src/views/developer/ProviderTesterView.tsx |  2 +-
 src/views/developer/TestView.tsx           |  2 +-
 src/views/developer/VideoTesterView.tsx    |  2 +-
 6 files changed, 45 insertions(+), 19 deletions(-)

diff --git a/src/setup/App.tsx b/src/setup/App.tsx
index f2c63d91..70cca9d1 100644
--- a/src/setup/App.tsx
+++ b/src/setup/App.tsx
@@ -1,3 +1,4 @@
+import { lazy } from "react";
 import { Redirect, Route, Switch } from "react-router-dom";
 import { BookmarkContextProvider } from "@/state/bookmark";
 import { WatchedContextProvider } from "@/state/watched";
@@ -8,13 +9,8 @@ import { MediaView } from "@/views/media/MediaView";
 import { SearchView } from "@/views/search/SearchView";
 import { MWMediaType } from "@/backend/metadata/types";
 import { V2MigrationView } from "@/views/other/v2Migration";
-import { DeveloperView } from "@/views/developer/DeveloperView";
-import { VideoTesterView } from "@/views/developer/VideoTesterView";
-import { ProviderTesterView } from "@/views/developer/ProviderTesterView";
-import { EmbedTesterView } from "@/views/developer/EmbedTesterView";
 import { BannerContextProvider } from "@/hooks/useBanner";
 import { Layout } from "@/setup/Layout";
-import { TestView } from "@/views/developer/TestView";
 
 function App() {
   return (
@@ -44,15 +40,45 @@ function App() {
                 />
 
                 {/* other */}
-                <Route exact path="/dev" component={DeveloperView} />
-                <Route exact path="/dev/test" component={TestView} />
-                <Route exact path="/dev/video" component={VideoTesterView} />
-                <Route
-                  exact
-                  path="/dev/providers"
-                  component={ProviderTesterView}
-                />
-                <Route exact path="/dev/embeds" component={EmbedTesterView} />
+                {process.env.NODE_ENV === "development" && (
+                  <>
+                    <Route
+                      exact
+                      path="/dev"
+                      component={lazy(
+                        () => import("@/views/developer/DeveloperView")
+                      )}
+                    />
+                    <Route
+                      exact
+                      path="/dev/test"
+                      component={lazy(
+                        () => import("@/views/developer/TestView")
+                      )}
+                    />
+                    <Route
+                      exact
+                      path="/dev/video"
+                      component={lazy(
+                        () => import("@/views/developer/VideoTesterView")
+                      )}
+                    />
+                    <Route
+                      exact
+                      path="/dev/providers"
+                      component={lazy(
+                        () => import("@/views/developer/ProviderTesterView")
+                      )}
+                    />
+                    <Route
+                      exact
+                      path="/dev/embeds"
+                      component={lazy(
+                        () => import("@/views/developer/EmbedTesterView")
+                      )}
+                    />
+                  </>
+                )}
                 <Route path="*" component={NotFoundPage} />
               </Switch>
             </Layout>
diff --git a/src/views/developer/DeveloperView.tsx b/src/views/developer/DeveloperView.tsx
index c671786f..6168758b 100644
--- a/src/views/developer/DeveloperView.tsx
+++ b/src/views/developer/DeveloperView.tsx
@@ -3,7 +3,7 @@ import { ThinContainer } from "@/components/layout/ThinContainer";
 import { ArrowLink } from "@/components/text/ArrowLink";
 import { Title } from "@/components/text/Title";
 
-export function DeveloperView() {
+export default function DeveloperView() {
   return (
     <div className="py-48">
       <Navigation />
diff --git a/src/views/developer/EmbedTesterView.tsx b/src/views/developer/EmbedTesterView.tsx
index dd4cef10..9b659bb7 100644
--- a/src/views/developer/EmbedTesterView.tsx
+++ b/src/views/developer/EmbedTesterView.tsx
@@ -105,7 +105,7 @@ function EmbedScraperSelector(props: EmbedScraperSelectorProps) {
   );
 }
 
-export function EmbedTesterView() {
+export default function EmbedTesterView() {
   const [embed, setEmbed] = useState<MWEmbed | null>(null);
   const [embedScraperId, setEmbedScraperId] = useState<string | null>(null);
   const embedScraper = useMemo(
diff --git a/src/views/developer/ProviderTesterView.tsx b/src/views/developer/ProviderTesterView.tsx
index 7883428a..0862b2b8 100644
--- a/src/views/developer/ProviderTesterView.tsx
+++ b/src/views/developer/ProviderTesterView.tsx
@@ -96,7 +96,7 @@ function ProviderSelector(props: ProviderSelectorProps) {
   );
 }
 
-export function ProviderTesterView() {
+export default function ProviderTesterView() {
   const [media, setMedia] = useState<DetailedMeta | null>(null);
   const [providerId, setProviderId] = useState<string | null>(null);
 
diff --git a/src/views/developer/TestView.tsx b/src/views/developer/TestView.tsx
index 8dc1ccdd..2b9e3817 100644
--- a/src/views/developer/TestView.tsx
+++ b/src/views/developer/TestView.tsx
@@ -1,4 +1,4 @@
 // simple empty view, perfect for putting in tests
-export function TestView() {
+export default function TestView() {
   return <div />;
 }
diff --git a/src/views/developer/VideoTesterView.tsx b/src/views/developer/VideoTesterView.tsx
index c4e148ee..7e3a409f 100644
--- a/src/views/developer/VideoTesterView.tsx
+++ b/src/views/developer/VideoTesterView.tsx
@@ -33,7 +33,7 @@ const testMeta: DetailedMeta = {
   },
 };
 
-export function VideoTesterView() {
+export default function VideoTesterView() {
   const [video, setVideo] = useState<VideoData | null>(null);
   const [videoType, setVideoType] = useState<MWStreamType>(MWStreamType.MP4);
   const [url, setUrl] = useState("");

From 92ef687ddce3d36f3bc19bc28f6c5fd187a7e57d Mon Sep 17 00:00:00 2001
From: frost768 <droidplus99@gmail.com>
Date: Fri, 31 Mar 2023 21:07:58 +0300
Subject: [PATCH 2/2] change: use ternary instead of short circuit

---
 src/setup/App.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/setup/App.tsx b/src/setup/App.tsx
index 70cca9d1..6aef8905 100644
--- a/src/setup/App.tsx
+++ b/src/setup/App.tsx
@@ -40,7 +40,7 @@ function App() {
                 />
 
                 {/* other */}
-                {process.env.NODE_ENV === "development" && (
+                {process.env.NODE_ENV === "development" ? (
                   <>
                     <Route
                       exact
@@ -78,7 +78,7 @@ function App() {
                       )}
                     />
                   </>
-                )}
+                ) : null}
                 <Route path="*" component={NotFoundPage} />
               </Switch>
             </Layout>