create-ej-app 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Ekansh Jain
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,5 @@
+# create-ej-app
+
+```
+npx create-ej-app
+```

package/cli.js

@@ -0,0 +1,68 @@
+#!/usr/bin/env node
+
+const { program } = require('commander')
+const fs = require('fs')
+const path = require('path')
+const { prompt } = require('enquirer')
+const copydir = require('copy-dir')
+
+program
+  .version('1.0.0')
+  .description('CLI tool to bootstrap a Next.js App')
+  .action(async () => {
+    const response = await prompt([
+      {
+        type: 'input',
+        name: 'projectName',
+        message: 'Enter the project name:',
+        initial: 'my-app'
+      },
+      {
+        type: 'input',
+        name: 'description',
+        message: 'Enter a description for the project:',
+        initial: 'A Legendary Next.js App'
+      }
+    ])
+
+    const { projectName, description } = response
+
+    // Create a directory with the project name
+    const projectDir = path.join(process.cwd(), projectName)
+
+    if (fs.existsSync(projectDir)) {
+      console.error(`Error: Directory '${projectName}' already exists.`)
+      process.exit(1)
+    }
+
+    fs.mkdirSync(projectDir)
+
+    // Copy all files and subdirectories from your template folder to the new project directory
+    const templateDir = path.join(__dirname, 'template')
+    copydir.sync(templateDir, projectDir)
+
+    // Modify package.json in the new project directory to set the project name and description
+    const packageJsonFile = path.join(projectDir, 'package.json')
+    const packageJson = JSON.parse(fs.readFileSync(packageJsonFile, 'utf-8'))
+    packageJson.name = projectName
+    packageJson.description = description
+    fs.writeFileSync(packageJsonFile, JSON.stringify(packageJson, null, 2))
+
+    // Modify src/lib/siteConfig.ts in the new project directory to set the project name and description
+    const siteConfigFile = path.join(projectDir, 'src', 'lib', 'siteConfig.ts')
+    let siteConfig = fs.readFileSync(siteConfigFile, 'utf-8')
+    siteConfig = siteConfig.replace('Project Name', projectName)
+    siteConfig = siteConfig.replace('Project Description', description)
+    fs.writeFileSync(siteConfigFile, siteConfig)
+
+    console.log(`Created a new Next.js app called '${projectName}'
+
+
+To get started, run the following commands:
+
+cd ${projectName}
+npm install
+npm run dev`)
+  })
+
+program.parse(process.argv)

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "create-ej-app",
+  "version": "1.0.0",
+  "description": "Bootstrap a next.js app with my preferred setup",
+  "main": "cli.js",
+  "scripts": {
+    "start": "node ."
+  },
+  "bin": {
+    "create-ej-app": "cli.js"
+  },
+  "keywords": [
+    "create-ej-app",
+    "nextjs",
+    "typescript",
+    "nextauth",
+    "prisma",
+    "tailwind",
+    "shadcn"
+  ],
+  "author": "Ekansh Jain",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/ejekanshjain/create-ej-app.git"
+  },
+  "bugs": {
+    "url": "https://github.com/ejekanshjain/create-ej-app/issues"
+  },
+  "homepage": "https://github.com/ejekanshjain/create-ej-app#readme",
+  "dependencies": {
+    "commander": "^11.0.0",
+    "copy-dir": "^1.3.0",
+    "enquirer": "^2.4.1"
+  }
+}

package/template/.env.example

@@ -0,0 +1,12 @@
+DATABASE_URL="postgresql://postgres:postgres@localhost:5432/postgres?schema=public"
+NEXTAUTH_SECRET="secret"
+NEXTAUTH_URL="http://localhost:3000"
+EMAIL_SERVER_HOST="example.com"
+EMAIL_SERVER_PORT="123"
+EMAIL_SERVER_USER="example@example.com"
+EMAIL_SERVER_PASSWORD="password"
+EMAIL_FROM="example@example.com"
+GOOGLE_ID=""
+GOOGLE_SECRET=""
+GITHUB_ID=""
+GITHUB_SECRET=""

package/template/.eslintrc.cjs

@@ -0,0 +1,24 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
+const path = require('path')
+
+/** @type {import("eslint").Linter.Config} */
+const eslintConfig = {
+  overrides: [
+    {
+      extends: [],
+      files: ['*.ts', '*.tsx'],
+      parserOptions: {
+        project: path.join(__dirname, 'tsconfig.json')
+      }
+    }
+  ],
+  parser: '@typescript-eslint/parser',
+  parserOptions: {
+    project: path.join(__dirname, 'tsconfig.json')
+  },
+  plugins: ['@typescript-eslint'],
+  extends: ['next/core-web-vitals'],
+  rules: {}
+}
+
+module.exports = eslintConfig

package/template/components.json

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "default",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "tailwind.config.cjs",
+    "css": "src/app/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true
+  },
+  "aliases": {
+    "components": "@/components",
+    "utils": "@/lib/cn"
+  }
+}

package/template/next.config.mjs

@@ -0,0 +1,18 @@
+/**
+ * Run `build` or `dev` with `SKIP_ENV_VALIDATION` to skip env validation. This is especially useful
+ * for Docker builds.
+ */
+await import('./src/env.mjs')
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  experimental: {
+    serverActions: true
+  },
+  i18n: {
+    locales: ['en'],
+    defaultLocale: 'en'
+  }
+}
+
+export default nextConfig

package/template/package.json

@@ -0,0 +1,68 @@
+{
+  "name": "my-app",
+  "version": "1.0.0",
+  "description": "A Legendary Next.js App",
+  "private": true,
+  "scripts": {
+    "postinstall": "prisma generate",
+    "lint": "next lint",
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "prisma:push": "prisma db push",
+    "prisma:gen": "prisma generate",
+    "prisma:studio": "prisma studio"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "^3.3.1",
+    "@next-auth/prisma-adapter": "^1.0.7",
+    "@prisma/client": "^5.3.1",
+    "@radix-ui/react-alert-dialog": "^1.0.4",
+    "@radix-ui/react-avatar": "^1.0.3",
+    "@radix-ui/react-checkbox": "^1.0.4",
+    "@radix-ui/react-dialog": "^1.0.4",
+    "@radix-ui/react-dropdown-menu": "^2.0.5",
+    "@radix-ui/react-label": "^2.0.2",
+    "@radix-ui/react-popover": "^1.0.6",
+    "@radix-ui/react-select": "^1.2.2",
+    "@radix-ui/react-separator": "^1.0.3",
+    "@radix-ui/react-slot": "^1.0.2",
+    "@radix-ui/react-toast": "^1.1.4",
+    "@t3-oss/env-nextjs": "^0.6.1",
+    "@tanstack/react-table": "^8.10.1",
+    "@types/eslint": "^8.44.2",
+    "@types/lodash": "^4.14.199",
+    "@types/node": "^20.6.3",
+    "@types/nodemailer": "^6.4.10",
+    "@types/react": "^18.2.22",
+    "@types/react-dom": "^18.2.7",
+    "@typescript-eslint/eslint-plugin": "^6.7.2",
+    "@typescript-eslint/parser": "^6.7.2",
+    "@vercel/analytics": "^1.0.2",
+    "autoprefixer": "^10.4.16",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.0.0",
+    "cmdk": "^0.2.0",
+    "dayjs": "^1.11.10",
+    "eslint": "^8.50.0",
+    "eslint-config-next": "^13.5.2",
+    "lodash": "^4.17.21",
+    "lucide-react": "^0.274.0",
+    "next": "^13.5.2",
+    "next-auth": "^4.23.1",
+    "next-themes": "^0.2.1",
+    "nodemailer": "^6.9.5",
+    "postcss": "^8.4.30",
+    "prettier": "^3.0.3",
+    "prettier-plugin-tailwindcss": "^0.5.4",
+    "prisma": "^5.3.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-hook-form": "^7.46.2",
+    "tailwind-merge": "^1.14.0",
+    "tailwindcss": "^3.3.3",
+    "tailwindcss-animate": "^1.0.7",
+    "typescript": "^5.2.2",
+    "zod": "^3.22.2"
+  }
+}

package/template/postcss.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {}
+  }
+}

package/template/prettier.config.ts

@@ -0,0 +1,11 @@
+import type { Config } from 'prettier'
+
+const prettierConfig: Config = {
+  plugins: [require.resolve('prettier-plugin-tailwindcss')],
+  arrowParens: 'avoid',
+  trailingComma: 'none',
+  semi: false,
+  singleQuote: true
+}
+
+module.exports = prettierConfig

package/template/prisma/schema.prisma

@@ -0,0 +1,136 @@
+generator client {
+    provider = "prisma-client-js"
+}
+
+datasource db {
+    provider = "postgresql"
+    url      = env("DATABASE_URL")
+}
+
+model Account {
+    id                String  @id @default(cuid())
+    userId            String
+    type              String
+    provider          String
+    providerAccountId String
+    refresh_token     String? @db.Text
+    access_token      String? @db.Text
+    expires_at        Int?
+    token_type        String?
+    scope             String?
+    id_token          String? @db.Text
+    session_state     String?
+
+    user User @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+    createdAt DateTime @default(now()) @db.Timestamptz()
+    updatedAt DateTime @default(now()) @updatedAt @db.Timestamptz()
+
+    @@unique([provider, providerAccountId])
+    @@map("Accounts")
+}
+
+model Session {
+    id           String   @id @default(cuid())
+    sessionToken String   @unique
+    userId       String
+    expires      DateTime @db.Timestamptz()
+
+    user User @relation(fields: [userId], references: [id], onDelete: Cascade)
+
+    createdAt DateTime @default(now()) @db.Timestamptz()
+    updatedAt DateTime @default(now()) @updatedAt @db.Timestamptz()
+
+    @@map("Sessions")
+}
+
+model Role {
+    id   String @id @default(cuid())
+    name String @unique
+
+    createdAt DateTime @default(now()) @db.Timestamptz()
+    updatedAt DateTime @default(now()) @updatedAt @db.Timestamptz()
+
+    permissions RolePermission[] @relation("rolePermissions")
+    users       User[]           @relation("userRole")
+
+    @@map("Roles")
+}
+
+enum Permissions {
+    TaskList
+    TaskView
+    TaskCreate
+    TaskUpdate
+    TaskDelete
+}
+
+model RolePermission {
+    id         String      @id @default(cuid())
+    roleId     String
+    permission Permissions
+
+    role Role @relation("rolePermissions", fields: [roleId], references: [id], onDelete: Cascade)
+
+    @@map("RolePermissions")
+}
+
+enum UserType {
+    Root
+    Normal
+}
+
+model User {
+    id            String    @id @default(cuid())
+    name          String?
+    email         String?   @unique
+    emailVerified DateTime? @db.Timestamptz()
+    image         String?
+    type          UserType  @default(Normal)
+    roleId        String?
+
+    createdAt DateTime @default(now()) @db.Timestamptz()
+    updatedAt DateTime @default(now()) @updatedAt @db.Timestamptz()
+
+    accounts Account[]
+    sessions Session[]
+    role     Role?     @relation("userRole", fields: [roleId], references: [id])
+
+    createdTasks Task[] @relation("createdTasks")
+    updatedTasks Task[] @relation("updatedTasks")
+
+    @@map("Users")
+}
+
+model VerificationToken {
+    identifier String
+    token      String   @unique
+    expires    DateTime @db.Timestamptz()
+
+    @@unique([identifier, token])
+    @@map("VerificationTokens")
+}
+
+enum TaskStatus {
+    Backlog
+    Todo
+    In_Progress
+    Done
+    Cancelled
+}
+
+model Task {
+    id          String     @id @default(cuid())
+    title       String
+    status      TaskStatus
+    description String?
+
+    createdAt   DateTime @default(now()) @db.Timestamptz()
+    updatedAt   DateTime @default(now()) @updatedAt @db.Timestamptz()
+    createdById String
+    createdBy   User     @relation("createdTasks", fields: [createdById], references: [id], onDelete: Cascade)
+    updatedById String
+    updatedBy   User     @relation("updatedTasks", fields: [updatedById], references: [id], onDelete: Cascade)
+
+    @@map("Tasks")
+}

package/template/public/next.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

package/template/src/app/(app)/dashboard/page.tsx

@@ -0,0 +1,19 @@
+import { Metadata } from 'next'
+
+import { Heading } from '@/components/heading'
+import { Shell } from '@/components/shell'
+import { siteConfig } from '@/lib/siteConfig'
+
+export const metadata: Metadata = {
+  title: 'Dashboard' + ' | ' + siteConfig.name
+}
+
+const DashboardPage = () => {
+  return (
+    <Shell>
+      <Heading heading="Dashboard" />
+    </Shell>
+  )
+}
+
+export default DashboardPage

package/template/src/app/(app)/layout.tsx

@@ -0,0 +1,117 @@
+import { notFound } from 'next/navigation'
+import { ReactNode } from 'react'
+
+import { AppNavCommand } from '@/components/app-nav-command'
+import { MainNav } from '@/components/main-nav'
+import { SideNav } from '@/components/side-nav'
+import { SiteFooter } from '@/components/site-footer'
+import { UserAccountNav } from '@/components/user-account-nav'
+import { checkForPermission, getAuthSession } from '@/lib/auth'
+
+const Layout = async ({ children }: { children: ReactNode }) => {
+  const session = await getAuthSession()
+
+  if (!session?.user) return notFound()
+
+  const isRoot = session.user.type === 'Root'
+  const [isTask] = await Promise.all([checkForPermission('TaskList', session)])
+
+  return (
+    <div className="flex min-h-screen flex-col space-y-6">
+      <header className="sticky top-0 z-40 border-b bg-background">
+        <div className="container flex h-16 items-center justify-between py-4">
+          <MainNav
+            logoLink="/dashboard"
+            items={[
+              {
+                title: 'Dashboard',
+                href: '/dashboard'
+              },
+              ...(isRoot
+                ? [
+                    {
+                      title: 'Users',
+                      href: '/users'
+                    },
+                    {
+                      title: 'Roles',
+                      href: '/roles'
+                    }
+                  ]
+                : []),
+              ...(isTask
+                ? [
+                    {
+                      title: 'Tasks',
+                      href: '/tasks'
+                    }
+                  ]
+                : [])
+            ]}
+          />
+          <div className="flex items-center justify-center space-x-4">
+            <AppNavCommand
+              modules={{
+                task: true
+              }}
+            />
+            <UserAccountNav
+              user={{
+                name: session.user.name,
+                image: session.user.image,
+                email: session.user.email
+              }}
+            />
+          </div>
+        </div>
+      </header>
+      <div className="container grid flex-1 gap-12 md:grid-cols-[200px_1fr]">
+        <aside className="hidden w-[200px] flex-col md:flex">
+          <SideNav
+            items={[
+              {
+                title: 'Dashboard',
+                href: '/dashboard',
+                icon: 'dashboard'
+              },
+              ...(isRoot
+                ? [
+                    {
+                      title: 'Users',
+                      href: '/users',
+                      icon: 'user' as const
+                    },
+                    {
+                      title: 'Roles',
+                      href: '/roles',
+                      icon: 'mixer' as const
+                    }
+                  ]
+                : []),
+              ...(isTask
+                ? [
+                    {
+                      title: 'Tasks',
+                      href: '/tasks',
+                      icon: 'task' as const
+                    }
+                  ]
+                : []),
+              {
+                title: 'Settings',
+                href: '/settings',
+                icon: 'settings'
+              }
+            ]}
+          />
+        </aside>
+        <main className="flex w-full flex-1 flex-col overflow-hidden">
+          {children}
+        </main>
+      </div>
+      <SiteFooter className="border-t" />
+    </div>
+  )
+}
+
+export default Layout

package/template/src/app/(app)/roles/[id]/actions.ts

@@ -0,0 +1,100 @@
+'use server'
+
+import { Permissions } from '@prisma/client'
+import { revalidatePath } from 'next/cache'
+
+import { authGuard } from '@/lib/auth'
+import { prisma } from '@/lib/db'
+import { UnwrapPromise } from '@/types/UnwrapPromise'
+
+export const getRole = async (id: string) => {
+  const session = await authGuard(['Root'])
+  if (!session) throw new Error('Unauthorized')
+
+  return await prisma.role.findUnique({
+    where: {
+      id
+    },
+    include: {
+      permissions: true
+    }
+  })
+}
+
+export type GetRoleFnDataType = UnwrapPromise<ReturnType<typeof getRole>>
+
+export const createRole = async ({
+  name,
+  permissions
+}: {
+  name: string
+  permissions: Permissions[]
+}) => {
+  const session = await authGuard(['Root'])
+  if (!session) throw new Error('Unauthorized')
+
+  const { id } = await prisma.role.create({
+    data: {
+      name,
+      permissions: {
+        createMany: {
+          data: permissions.map(permission => ({
+            permission
+          }))
+        }
+      }
+    }
+  })
+
+  revalidatePath('/roles')
+  revalidatePath(`/roles/${id}`)
+
+  return id
+}
+
+export const updateRole = async ({
+  id,
+  name,
+  permissions
+}: {
+  id: string
+  name: string
+  permissions: Permissions[]
+}) => {
+  const session = await authGuard(['Root'])
+  if (!session) throw new Error('Unauthorized')
+
+  await prisma.role.update({
+    where: {
+      id
+    },
+    data: {
+      name
+    }
+  })
+  await prisma.rolePermission.deleteMany({
+    where: {
+      roleId: id
+    }
+  })
+  await prisma.rolePermission.createMany({
+    data: permissions.map(permission => ({ permission, roleId: id }))
+  })
+
+  revalidatePath('/roles')
+  revalidatePath(`/roles/${id}`)
+}
+
+export const deleteRole = async (id: string) => {
+  const session = await authGuard(['Root'])
+  if (!session) throw new Error('Unauthorized')
+
+  await prisma.role.delete({
+    where: {
+      id
+    }
+  })
+
+  revalidatePath('/roles')
+  revalidatePath(`/roles/${id}`)
+}