imported my nextjs boilerplate

felixlaii · Mar 9, 2024 · 61c4c96 · 61c4c96
1 parent 9e37d7d
commit 61c4c96
Show file tree

Hide file tree

Showing 15 changed files with 114 additions and 75 deletions.
diff --git a/.env b/.env
@@ -0,0 +1 @@
+OPENAI_API_KEY=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
diff --git a/src/app/favicon.ico b/src/app/favicon.ico
diff --git a/src/app/globals.css b/src/app/globals.css
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
diff --git a/src/app/page.tsx b/src/app/page.tsx
diff --git a/src/components/layout/ProjectLayout.tsx b/src/components/layout/ProjectLayout.tsx
@@ -0,0 +1,19 @@
+import { PropsWithChildren } from "react";
+import { Content } from "./project-layout/Content";
+import Footer from "./project-layout/Footer";
+import { Header } from "./project-layout/Header";
+import { Wrapper } from "./project-layout/Wrapper";
+
+/**
+ * Responsive web UI layout for RheumInfo.
+ * Includes a header with responsive navigation menu and a footer.
+ */
+export const ProjectLayout: React.FC<PropsWithChildren> = ({ children }) => {
+  return (
+    <Wrapper>
+      <Header />
+      <Content>{children}</Content>
+      <Footer />
+    </Wrapper>
+  );
+};
diff --git a/src/components/layout/project-layout/Content.tsx b/src/components/layout/project-layout/Content.tsx
@@ -0,0 +1,24 @@
+import type { PropsWithChildren } from "react";
+import clsx from "clsx";
+
+export interface ContentProps {
+  containerPaddingStyle?: string;
+  extraClassName?: string;
+}
+
+/**
+ * Content wrapper of ProjectLayout that sets responsive max widths, padding, etc. and renders its
+ * children inside of a `<main>..</main>` block.
+ */
+export const Content: React.FC<PropsWithChildren<ContentProps>> = ({
+  extraClassName,
+  children,
+}) => {
+  return (
+    <main
+      className={clsx("flex-1 w-screen pb-12 xl:py-0 mx-0 z-0", extraClassName)}
+    >
+      {children}
+    </main>
+  );
+};
diff --git a/src/components/layout/project-layout/Footer.tsx b/src/components/layout/project-layout/Footer.tsx
@@ -0,0 +1,5 @@
+const Footer: React.FC = () => {
+  return <div className="w-screen"></div>;
+};
+
+export default Footer;
diff --git a/src/components/layout/project-layout/Header.tsx b/src/components/layout/project-layout/Header.tsx
@@ -0,0 +1,3 @@
+export const Header: React.FC = () => {
+  return <div></div>;
+};
diff --git a/src/components/layout/project-layout/Wrapper.tsx b/src/components/layout/project-layout/Wrapper.tsx
@@ -0,0 +1,8 @@
+import { PropsWithChildren } from "react";
+
+/**
+ * Wrapper component for children of ProjectLayout that resets z-index and defines the base flex column layout.
+ */
+export const Wrapper: React.FC<PropsWithChildren<{}>> = ({ children }) => {
+  return <div className="min-h-screen">{children}</div>;
+};
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
@@ -0,0 +1,17 @@
+import { ProjectLayout } from "@/components/layout/ProjectLayout";
+import "@/styles/globals.css";
+import type { AppProps } from "next/app";
+import Head from "next/head";
+
+export default function App({ Component, pageProps }: AppProps) {
+  return (
+    <div>
+      <Head>
+        <title></title>
+      </Head>
+      <ProjectLayout>
+        <Component {...pageProps} />
+      </ProjectLayout>
+    </div>
+  );
+}
diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
@@ -0,0 +1,13 @@
+import { Html, Head, Main, NextScript } from 'next/document'
+
+export default function Document() {
+  return (
+    <Html lang="en">
+      <Head />
+      <body>
+        <Main />
+        <NextScript />
+      </body>
+    </Html>
+  )
+}
diff --git a/src/pages/api/hello.ts b/src/pages/api/hello.ts
@@ -0,0 +1,13 @@
+// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
+import type { NextApiRequest, NextApiResponse } from 'next'
+
+type Data = {
+  name: string
+}
+
+export default function handler(
+  req: NextApiRequest,
+  res: NextApiResponse<Data>
+) {
+  res.status(200).json({ name: 'John Doe' })
+}
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -0,0 +1,8 @@
+import React, { useState } from "react";
+import { Inter } from "next/font/google";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export default function Home() {
+  return <div></div>;
+}
diff --git a/src/styles/globals.css b/src/styles/globals.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		OPENAI_API_KEY=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