allowlist, nav drawer, admin, responsive nav menu ➕

.eslintrc.cjs

@@ -22,7 +22,12 @@ const config = {
   parserOptions: {
     project,
   },
-  plugins: ["@typescript-eslint", "simple-import-sort", "promise"],
+  plugins: [
+    "@typescript-eslint",
+    "simple-import-sort",
+    "promise",
+    "mui-path-imports",
+  ],
   extends: [
     "next/core-web-vitals",
     "plugin:@typescript-eslint/recommended",
@@ -38,13 +43,32 @@ const config = {
       },
     ],
     "@typescript-eslint/no-unused-vars": ["warn", { argsIgnorePattern: "^_" }],
+    "@typescript-eslint/naming-convention": [
+      "error",
+      {
+        selector: "typeLike",
+        format: ["PascalCase"],
+      },
+    ],
     eqeqeq: ["error", "smart"],
     "prettier/prettier": ["error", prettierConfig],
     "no-eval": "error",
     "no-var": "error",
     "simple-import-sort/imports": "error",
     "simple-import-sort/exports": "error",
     "no-restricted-imports": ["error", { patterns: [".*"] }],
+    "mui-path-imports/mui-path-imports": "error",
+    "tailwindcss/no-custom-classname": "off",
+    "tailwindcss/classnames-order": "off", // tcss prettier plugin handles this
+    // https://github.com/orgs/react-hook-form/discussions/8622#discussioncomment-4060570
+    "@typescript-eslint/no-misused-promises": [
+      "error",
+      {
+        checksVoidReturn: {
+          attributes: false,
+        },
+      },
+    ],
   },
 };
 

.vscode/settings.json

@@ -17,5 +17,6 @@
         "other": "on",
         "comments": "on",
         "strings": "on"
-    }
+    },
+    "typescript.tsdk": "node_modules/typescript/lib"
 }

package.json

@@ -5,6 +5,8 @@
   "scripts": {
     "build": "next build",
     "dev": "next dev | pino-pretty",
+    "predev": "npm run cock",
+    "postdev": "npm run cock:stop",
     "lint": "next lint",
     "start": "next start",
     "cock": "docker compose up --detach --remove-orphans",
@@ -30,6 +32,7 @@
     "pino": "^8.11.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
+    "react-hook-form": "^7.43.9",
     "superjson": "1.12.2",
     "zod": "^3.21.4"
   },
@@ -45,6 +48,7 @@
     "eslint": "^8.36.0",
     "eslint-config-next": "^13.2.4",
     "eslint-config-prettier": "^8.8.0",
+    "eslint-plugin-mui-path-imports": "^0.0.15",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-promise": "^6.1.1",
     "eslint-plugin-simple-import-sort": "^10.0.0",

prisma/migrations/20230414020651_user_role/migration.sql

@@ -0,0 +1,5 @@
+-- CreateEnum
+CREATE TYPE "UserRole" AS ENUM ('ADMIN', 'USER');
+
+-- AlterTable
+ALTER TABLE "User" ADD COLUMN     "role" "UserRole" NOT NULL DEFAULT 'USER';

prisma/migrations/20230423214119_admin/migration.sql

@@ -0,0 +1,14 @@
+-- CreateTable
+CREATE TABLE "EmailAllowlist" (
+    "email" STRING NOT NULL,
+    "createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP
+);
+
+-- CreateIndex
+CREATE UNIQUE INDEX "EmailAllowlist_email_key" ON "EmailAllowlist"("email");
+
+-- CreateIndex
+CREATE UNIQUE INDEX "EmailAllowlist_createdAt_key" ON "EmailAllowlist"("createdAt");
+
+-- CreateIndex
+CREATE INDEX "EmailAllowlist_email_createdAt_idx" ON "EmailAllowlist"("email", "createdAt" DESC);

prisma/schema.prisma

@@ -7,10 +7,6 @@ generator client {
 
 datasource db {
     provider = "cockroachdb"
-    // NOTE: When using postgresql, mysql or sqlserver, uncomment the @db.Text annotations in model Account below
-    // Further reading:
-    // https://next-auth.js.org/adapters/prisma#create-the-prisma-schema
-    // https://www.prisma.io/docs/reference/api-reference/prisma-schema-reference#string
     url      = env("DATABASE_URL")
 }
 
@@ -51,8 +47,9 @@ model User {
     id            String    @id @default(cuid())
     name          String?
     email         String?   @unique
-    emailVerified DateTime?
+    emailVerified DateTime? /// DONT USE THIS OR ILL KILL U BRO
     image         String?
+    role          UserRole  @default(USER)
     accounts      Account[]
     sessions      Session[]
 }
@@ -64,3 +61,15 @@ model VerificationToken {
 
     @@unique([identifier, token])
 }
+
+model EmailAllowlist {
+    email String @unique
+    createdAt DateTime @default(now()) @unique
+
+    @@index([email, createdAt(sort: Desc)])
+}
+
+enum UserRole {
+    ADMIN
+    USER
+}

src/components/CardComponent.tsx

@@ -1,43 +1,38 @@
 import Image from "next/image";
-import Link from "next/link";
 
-interface cardComponentProps {
+interface CardComponentProps {
   image?: string;
   date?: string; // can change this later
   title?: string;
   description?: string;
 }
 
 const CardComponent = ({
-  image,
+  image = "/placeholder2.jpeg",
+  title = "Example",
   date,
-  title,
   description,
-}: cardComponentProps) => {
+}: CardComponentProps) => {
   return (
     <article className="overflow-hidden rounded-lg shadow transition hover:shadow-lg">
       <Image
         alt="example image"
-        src="/placeholder2.jpeg"
+        src={image}
         className="h-56 w-full object-cover"
         width={1000}
         height={1000}
       />
 
       <div className="bg-white p-4 sm:p-6">
-        <div className="block text-xs text-gray-500">10th Oct 2022</div>
+        {date && <div className="block text-xs text-gray-500">{date}</div>}
 
-        <Link href="/">
-          <h3 className="mt-0.5 text-lg text-gray-900">Example Card</h3>
-        </Link>
+        <h3 className="mt-0.5 text-lg text-gray-900">{title}</h3>
 
-        <div className="mt-2 line-clamp-3 text-sm leading-relaxed text-gray-500">
-          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Recusandae
-          dolores, possimus pariatur animi temporibus nesciunt praesentium
-          dolore sed nulla ipsum eveniet corporis quidem, mollitia itaque minus
-          soluta, voluptates neque explicabo tempora nisi culpa eius atque
-          dignissimos. Molestias explicabo corporis voluptatem?
-        </div>
+        {description && (
+          <div className="mt-2 line-clamp-3 text-sm leading-relaxed text-gray-500">
+            {description}
+          </div>
+        )}
       </div>
     </article>
   );

src/components/InputField.tsx

@@ -1,11 +1,11 @@
-interface inputFieldProps {
+interface InputFieldProps {
   htmlFor: string;
   label: string;
   type: string;
   placeholder: string;
 }
 
-const InputField = (props: inputFieldProps) => {
+const InputField = (props: InputFieldProps) => {
   return (
     <>
       <label