fix: remove duplicate redirect check and use server props on insight …

…page (#1255)
ElpisHelle · Jun 9, 2023 · cfc4c74 · cfc4c74
1 parent d236773
commit cfc4c74
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 72 deletions.
diff --git a/pages/pages/[userOrg]/[filterName]/[toolName].tsx b/pages/pages/[userOrg]/[filterName]/[toolName].tsx
@@ -1,69 +1,48 @@
-import { createServerSupabaseClient } from "@supabase/auth-helpers-nextjs";
+import { useEffect } from "react";
 import { GetServerSidePropsContext } from "next";
-import { useRouter } from "next/router";
+import { createServerSupabaseClient } from "@supabase/auth-helpers-nextjs";
 
 import Tool from "components/organisms/ToolsDisplay/tools-display";
 
 import HubPageLayout from "layouts/hub-page";
 import { WithPageLayout } from "interfaces/with-page-layout";
 import changeCapitalization from "lib/utils/change-capitalization";
-import useInsight from "lib/hooks/useInsight";
-import { useEffect } from "react";
-import SpinLoader from "components/atoms/SpinLoader/spin-loader";
-import { useUser } from "@supabase/auth-helpers-react";
 
-const HubPage: WithPageLayout = () => {
-  const router = useRouter();
-  const { filterName, toolName } = router.query;
-  const insightId = filterName as string;
-  const { data: insight, isLoading, isError } = useInsight(insightId);
-  const repositories = insight ? insight.repos.map((repo) => repo.repo_id) : [];
+interface InsightPageProps {
+  insight: DbUserInsight;
+  pageName: string;
+}
 
-  const title = `${insight && insight.name} | Open Sauced Insights Hub`;
+const HubPage: WithPageLayout<InsightPageProps> = ({ insight, pageName }: InsightPageProps) => {
+  const repositories = insight.repos.map((repo) => repo.repo_id);
 
-  const user = useUser();
-
-  useEffect(() => {
-    if (!user && !insight?.is_public) router.replace("/javascript/dashboard/filter/recent");
-  },[user]);
+  const title = `${insight.name} | Open Sauced Insights Hub`;
 
   useEffect(() => {
     HubPage.updateSEO!({
-      title: title
+      title: title,
     });
   }, [title]);
 
-  return (
-    <>
-      {isLoading ? <SpinLoader /> : ""}
-      {isError ? <div>Error...</div> : ""}
-      {!isLoading && insight ? (
-        <Tool
-          tool={toolName ? changeCapitalization(toolName.toString(), true) : undefined}
-          repositories={repositories}
-        />
-      ) : (
-        <></>
-      )}
-    </>
-  );
+  return <Tool tool={changeCapitalization(pageName, true)} repositories={repositories} />;
 };
 
 export const getServerSideProps = async (ctx: GetServerSidePropsContext) => {
   const supabase = createServerSupabaseClient(ctx);
 
   const {
-    data: { session }
+    data: { session },
   } = await supabase.auth.getSession();
   const insightId = ctx.params!["filterName"] as string;
+  const pageName = ctx.params!["toolName"] as string;
   const response = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/insights/${insightId}`);
   const insight = response.ok ? ((await response.json()) as DbUserInsight) : null;
 
   if (!insight) {
     return {
       redirect: {
-        destination: "/"
-      }
+        destination: "/",
+      },
     };
   }
 
@@ -74,13 +53,16 @@ export const getServerSideProps = async (ctx: GetServerSidePropsContext) => {
     return {
       redirect: {
         destination: "/",
-        permanent: false
-      }
+        permanent: false,
+      },
     };
   }
 
   return {
-    props: {}
+    props: {
+      insight,
+      pageName,
+    },
   };
 };
 

diff --git a/pages/pages/[userOrg]/[filterName]/[toolName]/filter/[...selectedFilter].tsx b/pages/pages/[userOrg]/[filterName]/[toolName]/filter/[...selectedFilter].tsx
@@ -1,62 +1,48 @@
-import { createServerSupabaseClient } from "@supabase/auth-helpers-nextjs";
+import { useEffect } from "react";
 import { GetServerSidePropsContext } from "next";
-import { useRouter } from "next/router";
+import { createServerSupabaseClient } from "@supabase/auth-helpers-nextjs";
 
 import Tool from "components/organisms/ToolsDisplay/tools-display";
 
 import HubPageLayout from "layouts/hub-page";
 import { WithPageLayout } from "interfaces/with-page-layout";
 import changeCapitalization from "lib/utils/change-capitalization";
-import useInsight from "lib/hooks/useInsight";
-import { useEffect } from "react";
-import SpinLoader from "components/atoms/SpinLoader/spin-loader";
 
-const HubPage: WithPageLayout = () => {
-  const router = useRouter();
-  const { filterName, toolName } = router.query;
-  const insightId = filterName as string;
-  const { data: insight, isLoading, isError } = useInsight(insightId);
-  const repositories = insight ? insight.repos.map((repo) => repo.repo_id) : [];
+interface InsightFilterPageProps {
+  insight: DbUserInsight;
+  pageName: string;
+}
+
+const HubPage: WithPageLayout<InsightFilterPageProps> = ({ insight, pageName }: InsightFilterPageProps) => {
+  const repositories = insight.repos.map((repo) => repo.repo_id);
 
-  const title = `${insight && insight.name} | Open Sauced Insights Hub`;
+  const title = `${insight.name} | Open Sauced Insights Hub`;
 
   useEffect(() => {
     HubPage.updateSEO!({
-      title: title
+      title: title,
     });
   }, [title]);
 
-  return (
-    <>
-      {isLoading ? <SpinLoader /> : ""}
-      {isError ? <div>Error...</div> : ""}
-      {!isLoading && insight ? (
-        <Tool
-          tool={toolName ? changeCapitalization(toolName.toString(), true) : undefined}
-          repositories={repositories}
-        />
-      ) : (
-        <></>
-      )}
-    </>
-  );
+  return <Tool tool={changeCapitalization(pageName, true)} repositories={repositories} />;
 };
 
 export const getServerSideProps = async (ctx: GetServerSidePropsContext) => {
   const supabase = createServerSupabaseClient(ctx);
 
   const {
-    data: { session }
+    data: { session },
   } = await supabase.auth.getSession();
   const insightId = ctx.params!["filterName"] as string;
+  const pageName = ctx.params!["toolName"] as string;
   const response = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/insights/${insightId}`);
   const insight = response.ok ? ((await response.json()) as DbUserInsight) : null;
 
   if (!insight) {
     return {
       redirect: {
-        destination: "/"
-      }
+        destination: "/",
+      },
     };
   }
 
@@ -67,13 +53,16 @@ export const getServerSideProps = async (ctx: GetServerSidePropsContext) => {
     return {
       redirect: {
         destination: "/",
-        permanent: false
-      }
+        permanent: false,
+      },
     };
   }
 
   return {
-    props: {}
+    props: {
+      insight,
+      pageName,
+    },
   };
 };