Fix/force login

apps/web/app/page.tsx

@@ -1,15 +1,6 @@
-import { getServerSession } from "next-auth";
 import { Landing } from "../screens/Landing";
-import { authOptions } from "../lib/auth";
-import { redirect } from "next/navigation";
 
 export default async function Page(): Promise<JSX.Element> {
-  const session = await getServerSession(authOptions);
-
-  if (!session?.user) {
-    return redirect("/auth");
-  }
-
   return (
     <main>
       <Landing />

apps/web/components/LessonView.tsx

@@ -2,6 +2,7 @@ import { Blog } from "../../../packages/ui/src/Blog";
 import { CodeProblemRenderer } from "../../../packages/ui/src/code/CodeProblemRenderer";
 import { Problem, Track, ProblemStatement, CodeLanguage, TestCase } from "@prisma/client";
 import MCQQuestionRenderer from "../../../packages/ui/src/MCQQuestionRenderer";
+import RedirectToLoginCard from '../../../packages/ui/src/RedirectToLoginCard';
 import db from "@repo/db/client";
 import { getServerSession } from "next-auth";
 import { authOptions } from "../lib/auth";
@@ -47,16 +48,37 @@ export const LessonView = async ({
   showAppBar?: Boolean;
   isPdfRequested?: Boolean;
 }) => {
+
+  const session = await getServerSession(authOptions);
+
+  const problemIndex = track.problems.findIndex((p) => p.id === problem.id);
+
+  if(problemIndex > 1 && (!session || !session.user)) {
+    return <RedirectToLoginCard/>
+  }
+
   if (problem.type === "MCQ") {
-    return <MCQQuestionRenderer problem={problem} track={track} showAppBar={!!showAppBar} />;
+    return (
+      <MCQQuestionRenderer problem={problem} track={track} showAppBar={!!showAppBar} problemIndex={problemIndex} />
+    );
   }
   if (problem.type === "Code" && problem.problemStatement) {
     const submissions = await getSubmissions(problem.problemStatement.id);
-    return <CodeProblemRenderer track={track} problem={problem} submissions={submissions} />;
+    return (
+      <CodeProblemRenderer track={track} problem={problem} submissions={submissions} problemIndex={problemIndex} />
+    );
   }
 
   if (problem.type === "Blog") {
-    return <Blog problem={problem} track={track} showAppBar={!!showAppBar} isPdfRequested={isPdfRequested} />;
+    return (
+      <Blog
+        problem={problem}
+        track={track}
+        showAppBar={!!showAppBar}
+        isPdfRequested={isPdfRequested}
+        problemIndex={problemIndex}
+      />
+    );
   }
   return <div>Not found</div>;
 };

packages/ui/src/Blog.tsx

@@ -9,11 +9,13 @@ export const Blog = ({
   track,
   showAppBar,
   isPdfRequested,
+  problemIndex
 }: {
   problem: Problem & { notionRecordMap: any };
   track: Track & { problems: Problem[] };
   showAppBar: Boolean;
   isPdfRequested?: Boolean;
+  problemIndex: number
 }) => {
   const mounted = useMountStatus();
 
@@ -25,7 +27,7 @@ export const Blog = ({
 
   return (
     <div>
-      {showAppBar && <BlogAppbar problem={problem} track={track} />}
+      {showAppBar && <BlogAppbar problem={problem} track={track} problemIndex={problemIndex}/>}
       <NotionRenderer recordMap={problem.notionRecordMap} />
     </div>
   );

packages/ui/src/BlogAppbar.tsx

@@ -14,6 +14,7 @@ import { Codebar } from "./code/Codebar";
 export const BlogAppbar = ({
   problem,
   track,
+  problemIndex
 }: {
   problem: Problem & { notionRecordMap: any } & {
     problemStatement?:
@@ -24,11 +25,8 @@ export const BlogAppbar = ({
       | null;
   };
   track: Track & { problems: Problem[] };
+  problemIndex: number
 }) => {
-  const problemIndex = useMemo(() => {
-    return track.problems.findIndex((p) => p.id === problem.id);
-  }, [track, problem]);
-
   let totalPages = Array.from({ length: track.problems.length }, (_, i) => i + 1);
 
   function setTheme(arg0: string) {

packages/ui/src/MCQQuestionRenderer.tsx

@@ -8,14 +8,16 @@ const MCQQuestionRenderer = ({
   problem,
   track,
   showAppBar,
+  problemIndex
 }: {
   problem: Problem & { notionRecordMap: any };
   track: Track & { problems: Problem[] };
   showAppBar?: Boolean;
+  problemIndex: number
 }) => {
   return (
     <div>
-      {showAppBar && <BlogAppbar problem={problem} track={track} />}
+      {showAppBar && <BlogAppbar problem={problem} track={track} problemIndex={problemIndex}/>}
       <div className="grid grid-cols-3">
         <ScrollArea className="h-screen p-2 rounded-lg col-span-2">
           <div className="w-2/3">

packages/ui/src/code/CodeProblemRenderer.tsx

@@ -7,13 +7,13 @@ import { Problem, Track, Submission, CodeLanguage, ProblemStatement, TestCase }
 import { BlogAppbar } from "../BlogAppbar";
 import { useSession } from "next-auth/react";
 import ProblemStatementPanel from "./ProblemStatementPanel";
-import RedirectToLoginCard from "../RedirectToLoginCard";
 import { Loader } from "lucide-react";
 
 export const CodeProblemRenderer = ({
   problem,
   track,
   submissions,
+  problemIndex
 }: {
   problem: Problem & { notionRecordMap: any } & {
     problemStatement:
@@ -25,14 +25,15 @@ export const CodeProblemRenderer = ({
   };
   track: Track & { problems: Problem[] };
   submissions: (Submission & { language: CodeLanguage })[] | null;
+  problemIndex: number
 }) => {
   const { data, status } = useSession();
   const user = data?.user;
 
   if (problem.problemStatement) {
     return (
       <div>
-        <BlogAppbar problem={problem} track={track} />
+        <BlogAppbar problem={problem} track={track} problemIndex={problemIndex}/>
         {status === "loading" ? (
           <Loader className="animate-spin mx-auto my-40" size={64} />
         ) : user ? (