feat: put some dots in the is

PupoSDC · Jan 17, 2024 · eafbac5 · eafbac5
1 parent c6623cb
commit eafbac5
Show file tree

Hide file tree

Showing 45 changed files with 672 additions and 387 deletions.
diff --git a/apps/next-app/pages/modules/[questionBank]/flashcards/[collectionId]/[seed].page.tsx b/apps/next-app/pages/modules/[questionBank]/flashcards/[collectionId]/[seed].page.tsx
@@ -3,6 +3,7 @@ import { AppHead } from "@chair-flight/react/components";
 import { FlashcardTest, LayoutModule } from "@chair-flight/react/containers";
 import { ssrHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { NextPage } from "next";
 
 type PageProps = {
@@ -17,16 +18,24 @@ type PageParams = {
   seed: string;
 };
 
-const Page: NextPage<PageProps> = ({ questionBank, collectionId, seed }) => (
-  <LayoutModule questionBank={questionBank} fixedHeight>
-    <AppHead />
-    <FlashcardTest
-      questionBank={questionBank}
-      collectionId={collectionId}
-      seed={seed}
-    />
-  </LayoutModule>
-);
+const Page: NextPage<PageProps> = ({ questionBank, collectionId, seed }) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    ["Flashcards", `/modules/${questionBank}/flashcards`],
+    collectionId,
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule questionBank={questionBank} breadcrumbs={crumbs} fixedHeight>
+      <AppHead />
+      <FlashcardTest
+        questionBank={questionBank}
+        collectionId={collectionId}
+        seed={seed}
+      />
+    </LayoutModule>
+  );
+};
 
 export const getServerSideProps = ssrHandler<PageProps, PageParams>(
   async ({ helper, params }) => {

diff --git a/apps/next-app/pages/modules/[questionBank]/flashcards/[collectionId]/index.page.tsx b/apps/next-app/pages/modules/[questionBank]/flashcards/[collectionId]/index.page.tsx
@@ -4,6 +4,7 @@ import { AppHead } from "@chair-flight/react/components";
 import { FlashcardList, LayoutModule } from "@chair-flight/react/containers";
 import { staticHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { GetStaticPaths, NextPage } from "next";
 
 type PageProps = {
@@ -16,12 +17,20 @@ type PageParams = {
   collectionId: string;
 };
 
-const FlashcardsThemePage: NextPage<PageProps> = (props) => (
-  <LayoutModule noPadding {...props}>
-    <AppHead />
-    <FlashcardList {...props} />
-  </LayoutModule>
-);
+const Page: NextPage<PageProps> = ({ questionBank, collectionId }) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    ["Flashcards", `/modules/${questionBank}/flashcards`],
+    collectionId,
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule noPadding questionBank={questionBank} breadcrumbs={crumbs}>
+      <AppHead />
+      <FlashcardList questionBank={questionBank} collectionId={collectionId} />
+    </LayoutModule>
+  );
+};
 
 export const getStaticProps = staticHandler<PageProps, PageParams>(
   async ({ params, helper }) => {
@@ -51,4 +60,4 @@ export const getStaticPaths: GetStaticPaths<PageParams> = async () => {
   return { fallback: false, paths };
 };
 
-export default FlashcardsThemePage;
+export default Page;
diff --git a/apps/next-app/pages/modules/[questionBank]/flashcards/index.page.tsx b/apps/next-app/pages/modules/[questionBank]/flashcards/index.page.tsx
@@ -7,6 +7,7 @@ import {
 } from "@chair-flight/react/containers";
 import { staticHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { GetStaticPaths, NextPage } from "next";
 
 type PageParams = {
@@ -17,41 +18,48 @@ type PageProps = {
   questionBank: QuestionBankName;
 };
 
-const Page: NextPage<PageProps> = ({ questionBank }) => (
-  <LayoutModule noPadding questionBank="prep">
-    <AppHead
-      title="Chair Flight - Flash Cards"
-      linkTitle="Chair Flight - Flash Cards"
-      linkDescription={[
-        "Use these flash cards to practice for your interview. You can review",
-        "all flash cards at once, or get 10 random cards to review. Try to",
-        "answer the question outloud as you would in an interview. Consider",
-        "recording your answer and playing it back to see how you sound.",
-        "\n\n",
-        "Once you are satisfied with the answer, Flip the card to see if you",
-        "are close enough.",
-      ].join(" ")}
-    />
-    <Box component="section" maxWidth="lg" margin="auto" p={2}>
-      <Typography level="h1">Flash Cards</Typography>
-      <Typography>
-        Practice for open-ended interview questions.
-        <br />
-        Use these flash cards to practice for your interview. You can review all
-        flash cards at once, or get 10 random cards to review. Try to answer the
-        question outloud as you would in an interview. Consider recording your
-        answer and playing it back to see how you sound.
-        <br />
-        Once you are satisfied with the answer, Flip the card to see if you are
-        close enough.
-      </Typography>
-      <Typography level="h3" sx={{ mt: 3, color: "primary.500" }}>
-        Have fun!
-      </Typography>
-    </Box>
-    <FlashcardCollectionList questionBank={questionBank} />
-  </LayoutModule>
-);
+const Page: NextPage<PageProps> = ({ questionBank }) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    "Flashcards",
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule noPadding questionBank={questionBank} breadcrumbs={crumbs}>
+      <AppHead
+        title="Chair Flight - Flash Cards"
+        linkTitle="Chair Flight - Flash Cards"
+        linkDescription={[
+          "Use these flash cards to practice for your interview. You can review",
+          "all flash cards at once, or get 10 random cards to review. Try to",
+          "answer the question outloud as you would in an interview. Consider",
+          "recording your answer and playing it back to see how you sound.",
+          "\n\n",
+          "Once you are satisfied with the answer, Flip the card to see if you",
+          "are close enough.",
+        ].join(" ")}
+      />
+      <Box component="section" maxWidth="lg" margin="auto" p={2}>
+        <Typography level="h1">Flash Cards</Typography>
+        <Typography>
+          Practice for open-ended interview questions.
+          <br />
+          Use these flash cards to practice for your interview. You can review
+          all flash cards at once, or get 10 random cards to review. Try to
+          answer the question outloud as you would in an interview. Consider
+          recording your answer and playing it back to see how you sound.
+          <br />
+          Once you are satisfied with the answer, Flip the card to see if you
+          are close enough.
+        </Typography>
+        <Typography level="h3" sx={{ mt: 3, color: "primary.500" }}>
+          Have fun!
+        </Typography>
+      </Box>
+      <FlashcardCollectionList questionBank={questionBank} />
+    </LayoutModule>
+  );
+};
 
 export const getStaticProps = staticHandler<PageProps, PageParams>(
   async ({ params, helper }) => {

diff --git a/apps/next-app/pages/modules/[questionBank]/index.page.tsx b/apps/next-app/pages/modules/[questionBank]/index.page.tsx
@@ -1,9 +1,13 @@
 import * as fs from "node:fs/promises";
-import { Divider, Link, Typography } from "@mui/joy";
 import { AppHead } from "@chair-flight/react/components";
-import { LayoutModule, OverviewModules } from "@chair-flight/react/containers";
+import {
+  LayoutModule,
+  OverviewModule,
+  OverviewModules,
+} from "@chair-flight/react/containers";
 import { staticHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { GetStaticPaths, NextPage } from "next";
 
 type PageProps = {
@@ -14,22 +18,22 @@ type PageParams = {
   questionBank: QuestionBankName;
 };
 
-const Page: NextPage<PageProps> = ({ questionBank }) => (
-  <LayoutModule questionBank={questionBank}>
-    <AppHead />
-    <Typography level="h2">Question Bank</Typography>
-    <Divider />
-    <OverviewModules questionBank={questionBank} sx={{ my: 2 }} />
-    <Typography level="h2">Tests</Typography>
-    <Divider sx={{ mb: 2 }} />
-    <Link href={`/modules/${questionBank}/tests/create`}>Create New Test</Link>
-  </LayoutModule>
-);
+const Page: NextPage<PageProps> = ({ questionBank }) => {
+  const crumbs = [questionBank.toUpperCase()] as Breadcrumbs;
+
+  return (
+    <LayoutModule questionBank={questionBank} breadcrumbs={crumbs}>
+      <AppHead />
+      <OverviewModules questionBank={questionBank} sx={{ mb: 2 }} />
+    </LayoutModule>
+  );
+};
 
 export const getStaticProps = staticHandler<PageProps, PageParams>(
   async ({ params, helper }) => {
     await OverviewModules.getData({ helper, params });
     await LayoutModule.getData({ helper, params });
+    await OverviewModule.getData({ helper, params });
     return { props: params };
   },
   fs,

diff --git a/.../next-app/pages/modules/[questionBank]/learning-objectives/[learningObjectiveId].page.tsx b/.../next-app/pages/modules/[questionBank]/learning-objectives/[learningObjectiveId].page.tsx
@@ -5,6 +5,7 @@ import {
 } from "@chair-flight/react/containers";
 import { ssrHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { NextPage } from "next";
 
 type PageParams = {
@@ -17,12 +18,27 @@ type PageProps = {
   learningObjectiveId: string;
 };
 
-export const Page: NextPage<PageProps> = (props) => (
-  <LayoutModule {...props}>
-    <AppHead />
-    <LearningObjectiveOverview sx={{ p: 2 }} {...props} />
-  </LayoutModule>
-);
+export const Page: NextPage<PageProps> = ({
+  questionBank,
+  learningObjectiveId,
+}) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    ["Learning Objectives", `/modules/${questionBank}/learning-objectives`],
+    learningObjectiveId,
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule questionBank={questionBank} breadcrumbs={crumbs}>
+      <AppHead />
+      <LearningObjectiveOverview
+        sx={{ p: 2 }}
+        questionBank={questionBank}
+        learningObjectiveId={learningObjectiveId}
+      />
+    </LayoutModule>
+  );
+};
 
 export const getServerSideProps = ssrHandler<PageProps, PageParams>(
   async ({ helper, params }) => {

diff --git a/apps/next-app/pages/modules/[questionBank]/learning-objectives/index.page.tsx b/apps/next-app/pages/modules/[questionBank]/learning-objectives/index.page.tsx
@@ -6,6 +6,7 @@ import {
 } from "@chair-flight/react/containers";
 import { staticHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { GetStaticPaths, NextPage } from "next";
 
 type PageProps = {
@@ -16,12 +17,19 @@ type PageParams = {
   questionBank: QuestionBankName;
 };
 
-export const Page: NextPage<PageProps, PageParams> = (props) => (
-  <LayoutModule fixedHeight {...props}>
-    <AppHead />
-    <LearningObjectivesSearch {...props} />
-  </LayoutModule>
-);
+export const Page: NextPage<PageProps, PageParams> = ({ questionBank }) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    "Learning Objectives",
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule fixedHeight questionBank={questionBank} breadcrumbs={crumbs}>
+      <AppHead />
+      <LearningObjectivesSearch questionBank={questionBank} />
+    </LayoutModule>
+  );
+};
 
 export const getStaticProps = staticHandler<PageProps, PageParams>(
   async ({ params, helper }) => {

diff --git a/apps/next-app/pages/modules/[questionBank]/questions/[questionId]/edit.page.tsx b/apps/next-app/pages/modules/[questionBank]/questions/[questionId]/edit.page.tsx
@@ -2,6 +2,7 @@ import { AppHead } from "@chair-flight/react/components";
 import { LayoutModule, QuestionEditor } from "@chair-flight/react/containers";
 import { ssrHandler } from "@chair-flight/trpc/server";
 import type { QuestionBankName } from "@chair-flight/base/types";
+import type { Breadcrumbs } from "@chair-flight/react/containers";
 import type { NextPage } from "next";
 
 type PageProps = {
@@ -17,12 +18,26 @@ type PageParams = {
 export const EditQuestionPage: NextPage<PageProps, PageParams> = ({
   questionBank,
   questionId,
-}) => (
-  <LayoutModule questionBank={questionBank} fixedHeight noPadding>
-    <AppHead title={questionId} />
-    <QuestionEditor questionBank={questionBank} questionId={questionId} />
-  </LayoutModule>
-);
+}) => {
+  const crumbs = [
+    [questionBank.toUpperCase(), `/modules/${questionBank}`],
+    ["Questions", `/modules/${questionBank}/questions`],
+    [questionId, `/modules/${questionBank}/questions/${questionId}`],
+    "edit",
+  ] as Breadcrumbs;
+
+  return (
+    <LayoutModule
+      questionBank={questionBank}
+      breadcrumbs={crumbs}
+      fixedHeight
+      noPadding
+    >
+      <AppHead title={questionId} />
+      <QuestionEditor questionBank={questionBank} questionId={questionId} />
+    </LayoutModule>
+  );
+};
 
 export const getServerSideProps = ssrHandler<PageProps, PageParams>(
   async ({ params, helper }) => {