Merge branch 'main' of github.com:code100x/daily-code

.prettierrc

@@ -1,8 +1,9 @@
 {
  "singleQuote": false,
- "printWidth":120,
+ "printWidth": 120,
  "bracketSpacing": true,
  "tabWidth": 2,
  "trailingComma": "es5",
- "semi": true
-}
+ "semi": true,
+ "plugins": ["prettier-plugin-tailwindcss"]
+}

apps/web/app/pdf/[...pdfId]/page.tsx

@@ -26,7 +26,9 @@ export default async function TrackComponent({ params }: { params: { pdfId: stri
  if (problemDetails?.notionDocId && trackDetails?.problems) {
  // notionRecordMaps = await notion.getPage(problemDetails.notionDocId);
  notionRecordMaps = await Promise.all(
- trackDetails.problems.map(async (problem: any) => await notion.getPage((await getProblem(problem.id))?.notionDocId!))
+ trackDetails.problems.map(
+ async (problem: any) => await notion.getPage((await getProblem(problem.id))?.notionDocId!)
+ )
  );
  }
 
@@ -36,20 +38,20 @@ export default async function TrackComponent({ params }: { params: { pdfId: stri
  }
  if (trackDetails && problemDetails) {
  return (
-  <div>
-  {trackDetails?.problems.map((problem: any, i: number) => (
-  <LessonView
-  isPdfRequested={true}
-  track={trackDetails}
-  problem={{
-  ...problemDetails,
-  notionRecordMap: notionRecordMaps[i],
-  }}
-  key={i}
-  />
-  ))}
-  <Print />
-  </div>
+ <div>
+ {trackDetails?.problems.map((problem: any, i: number) => (
+ <LessonView
+ isPdfRequested
+ track={trackDetails}
+ problem={{
+ ...problemDetails,
+ notionRecordMap: notionRecordMaps[i],
+ }}
+ key={i}
+ />
+ ))}
+ <Print />
+ </div>
  );
  }
 }

apps/web/app/tracks/[...trackIds]/page.tsx

@@ -87,6 +87,7 @@ export default async function TrackComponent({ params }: { params: { trackIds: s
  return (
  <LessonView
  showAppBar
+ showPagination
  track={trackDetails}
  problem={{
  ...problemDetails,

apps/web/components/Blog.tsx

@@ -1,40 +1,61 @@
 "use client";
+import { useRecoilValue } from "recoil";
+
 import { Problem, Track } from "@prisma/client";
+import { isLegacyViewMode } from "@repo/store";
+
 import { BlogAppbar } from "./BlogAppbar";
 import { NotionRenderer } from "./NotionRenderer";
 import useMountStatus from "../hooks/useMountStatus";
 import TrackTools from "./TrackTools";
+import CustomPagination from "./CustomPagination";
 
 export const Blog = ({
  problem,
  track,
+ showAppBar,
+ showPagination,
  isPdfRequested,
  problemIndex,
 }: {
  problem: Problem & { notionRecordMap: any };
  track: Track & { problems: Problem[] };
- showAppBar: Boolean;
- isPdfRequested?: Boolean;
+ showAppBar?: boolean;
+ showPagination?: boolean;
+ isPdfRequested?: boolean;
  problemIndex: number;
 }) => {
  const mounted = useMountStatus();
+ const isLegacyMode = useRecoilValue(isLegacyViewMode);
 
  if (isPdfRequested == undefined || !isPdfRequested) {
  if (!mounted) {
  return null;
  }
  }
 
- return (
- <div>
- <NotionRenderer recordMap={problem.notionRecordMap} />
- <div className="fixed top-0 w-full">
- <BlogAppbar problem={problem} track={track} problemIndex={problemIndex} />
+ const renderBlog = () =>
+ isLegacyMode ? (
+ <div className="break-after-page">
+ {showAppBar && <BlogAppbar problem={problem} track={track} problemIndex={problemIndex} />}
+ <NotionRenderer recordMap={problem.notionRecordMap} />
+ {showPagination && (
+ <div className="justify-center pt-2">
+ <CustomPagination allProblems={track.problems} track={track} problemIndex={problemIndex} />
+ </div>
+ )}
  </div>
- <div className="fixed bottom-0 itemsc-center justify-center mx-auto w-full">
- <TrackTools allProblems={track.problems} track={track} problemIndex={problemIndex} />
+ ) : (
+ <div>
+ <NotionRenderer recordMap={problem.notionRecordMap} />
+ <div className="fixed top-0 w-full">
+ <BlogAppbar problem={problem} track={track} problemIndex={problemIndex} />
+ </div>
+ <div className="itemsc-center fixed bottom-0 mx-auto w-full justify-center">
+ <TrackTools allProblems={track.problems} track={track} problemIndex={problemIndex} />
+ </div>
  </div>
- </div>
- );
+ );
+
+ return renderBlog();
 };
-