interepting routes

kodius · Mar 1, 2024 · ac5a9b2 · ac5a9b2
1 parent c529b9a
commit ac5a9b2
Show file tree

Hide file tree

Showing 12 changed files with 88 additions and 9 deletions.
diff --git a/apps/bible/app/_templates/basic-list.tsx b/apps/bible/app/_templates/basic-list.tsx
@@ -10,7 +10,7 @@ export const BasicList: FC<Props> = (props) => {
   return (
     <Stack>
       <Text>{props.title}</Text>
-      <Stack className="max-h-[200px] overflow-scroll p-md border-4">
+      <Stack className="max-h-[200px] rounded-lg overflow-scroll p-md border-4">
         {props.children}
       </Stack>
     </Stack>

diff --git a/apps/bible/app/bible/data-fetching/parrallel-and-sequential/components/parallel-fetching.tsx b/apps/bible/app/bible/data-fetching/parrallel-and-sequential/components/parallel-fetching.tsx
@@ -9,7 +9,7 @@ export const ParrallelFetching = async () => {
   const usersPromise = getUsers("parrallel example");
   const [todos, users] = await Promise.all([todosPromise, usersPromise]);
 
-  // One more bad example
+  // One more sequential example
   // const todos = await getTodos("good example");
   // const users = await getUsers("good example");
 

diff --git a/apps/bible/app/bible/data-fetching/parrallel-and-sequential/page.tsx b/apps/bible/app/bible/data-fetching/parrallel-and-sequential/page.tsx
@@ -11,7 +11,7 @@ const ParrallelAndSequentialPage = () => {
         </Suspense>
       </div>
       <div>
-        <Suspense fallback="parrallel example loading..">
+        <Suspense fallback="parrallel rxample loading..">
           <ParrallelFetching />
         </Suspense>
       </div>

diff --git a/apps/bible/app/bible/project-structure/page.tsx b/apps/bible/app/bible/project-structure/page.tsx
diff --git a/apps/bible/app/bible/routing/intercepting-routes/@modal/(...)todo/[id]/page.tsx b/apps/bible/app/bible/routing/intercepting-routes/@modal/(...)todo/[id]/page.tsx
@@ -0,0 +1,5 @@
+const TodoModalPage = () => {
+  <div>task by id page modal</div>;
+};
+
+export default TodoModalPage;
diff --git a/apps/bible/app/bible/routing/intercepting-routes/page.tsx b/apps/bible/app/bible/routing/intercepting-routes/page.tsx
@@ -0,0 +1,5 @@
+const InterceptingRoutes = () => {
+  return <div>hi</div>;
+};
+
+export default InterceptingRoutes;
diff --git a/apps/bible/app/layout.tsx b/apps/bible/app/layout.tsx
@@ -13,11 +13,12 @@ export const metadata: Metadata = {
   description: "Generated by create next app",
 };
 
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
+export default function RootLayout(
+  props: Readonly<{
+    children: React.ReactNode;
+  }>,
+) {
+  console.log(props);
   return (
     <html lang="en">
       <body className={cn(inter.className, "p-sm")}>
@@ -29,7 +30,7 @@ export default function RootLayout({
         >
           <Sidebar>
             <BibleSide />
-            {children}
+            {props.children}
           </Sidebar>
         </ThemeProvider>
       </body>

diff --git a/apps/bible/module/todo/api/index.ts b/apps/bible/module/todo/api/index.ts
@@ -0,0 +1,14 @@
+import { api } from "@/site/api";
+import { Todo } from "../todo";
+
+export type GetTodosResponse = {
+  todos: Todo[];
+};
+
+export const getTodos = async (
+  init?: RequestInit,
+): Promise<GetTodosResponse> => {
+  const resJSON = await fetch(`${api.route}/todos`, init);
+  const data = (await resJSON.json()) as GetTodosResponse;
+  return data;
+};
diff --git a/apps/bible/module/todo/components/todo-card.tsx b/apps/bible/module/todo/components/todo-card.tsx
@@ -0,0 +1,11 @@
+import { FC } from "react";
+import { Text } from "@/components/typography/text";
+import type { Todo } from "../todo";
+
+export const TodoCard: FC<Todo> = (todo) => {
+  return (
+    <div className="p-md border rounded">
+      <Text>{todo.todo}</Text>
+    </div>
+  );
+};
diff --git a/apps/bible/module/todo/todo.tsx b/apps/bible/module/todo/todo.tsx
@@ -0,0 +1,20 @@
+import { getTodos } from "./api";
+import { TodoCard } from "./components/todo-card";
+
+type Todo = {
+  id: number;
+  todo: string;
+  completed: boolean;
+  userId: number;
+};
+
+const api = {
+  get_todos: getTodos,
+};
+
+const components = {
+  todoCard: TodoCard,
+};
+
+export type { Todo };
+export { api, components };
diff --git a/apps/bible/site/bible-contents.ts b/apps/bible/site/bible-contents.ts
@@ -20,4 +20,22 @@ export const bibleContents: BibleContent[] = [
       },
     ],
   },
+  {
+    title: "Routing",
+    children: [
+      {
+        title: "Intercepting Routes",
+        href: routes.bible.routing.interceptingRoutes.index,
+      },
+    ],
+  },
+  {
+    title: "Routing",
+    children: [
+      {
+        title: "Intercepting Routes",
+        href: routes.bible.routing.interceptingRoutes.index,
+      },
+    ],
+  },
 ];
diff --git a/apps/bible/site/routes.ts b/apps/bible/site/routes.ts
@@ -8,5 +8,10 @@ export const routes = {
         index: "/bible/data-fetching/parrallel-and-sequential",
       },
     },
+    routing: {
+      interceptingRoutes: {
+        index: "/bible/routing/intercepting-routes",
+      },
+    },
   },
 } as const;