create-ej-app 3.2.0 → 5.0.0

package/template/base/src/app/(app)/tasks/actions.ts

@@ -1,69 +1,39 @@
 'use server'
 
-import { Task, TaskStatus } from '@prisma/client'
+import { z } from 'zod'
 
-import { getAuthSession } from '@/lib/auth'
-import { prisma } from '@/lib/db'
-import { UnwrapPromise } from '@/types/UnwrapPromise'
+import { authActionClient } from '@/lib/safe-action'
+import { SortOrderEnum } from '@/lib/sortOrderEnum'
+import { getTasksWithUserUseCase } from '@/use-case/task'
+import { TaskStatusEnumArr } from './statusEnum'
 
-export const getTasks = async ({
-  page,
-  limit,
-  sortBy,
-  sortOrder,
-  title,
-  status
-}: {
-  page: number
-  limit: number
-  sortBy?: keyof Task
-  sortOrder?: 'asc' | 'desc'
-  title?: string
-  status?: TaskStatus[]
-}) => {
-  const session = await getAuthSession()
-  if (!session) throw new Error('Unauthorized')
-
-  const where = {
-    title: title
-      ? { contains: title, mode: 'insensitive' as const }
-      : undefined,
-    status: status?.length ? { in: status } : undefined
-  }
-  const [tasks, total] = await Promise.all([
-    prisma.task.findMany({
-      where,
-      select: {
-        id: true,
-        title: true,
-        status: true,
-        createdAt: true,
-        updatedAt: true,
-        createdBy: {
-          select: {
-            id: true,
-            name: true
-          }
-        },
-        updatedBy: {
-          select: {
-            id: true,
-            name: true
-          }
-        }
-      },
-      skip: (page - 1) * limit,
-      take: limit,
-      orderBy: {
-        [sortBy || 'createdAt']: sortOrder || 'desc'
-      }
-    }),
-    prisma.task.count({
-      where
+export const getTasksAction = authActionClient
+  .schema(
+    z.object({
+      page: z.number().gte(1),
+      limit: z.number().gte(1).lte(1000),
+      sortBy: z
+        .enum(['id', 'title', 'status', 'createdAt', 'updatedAt'])
+        .optional(),
+      sortOrder: z.enum(SortOrderEnum).optional(),
+      title: z.string().optional(),
+      status: z.array(z.enum(TaskStatusEnumArr)).optional()
     })
-  ])
-
-  return { tasks, total }
-}
-
-export type GetTasksFnDataType = UnwrapPromise<ReturnType<typeof getTasks>>
+  )
+  .action(async ({ parsedInput, ctx }) => {
+    return await getTasksWithUserUseCase(ctx.user, {
+      page: parsedInput.page,
+      limit: parsedInput.limit,
+      sortBy: parsedInput.sortBy,
+      sortOrder: parsedInput.sortOrder,
+      filters:
+        parsedInput.title || parsedInput.status?.length
+          ? {
+              title: parsedInput.title || undefined,
+              status: parsedInput.status?.length
+                ? parsedInput.status
+                : undefined
+            }
+          : undefined
+    })
+  })

package/template/base/src/app/(app)/tasks/page.tsx

@@ -1,8 +1,9 @@
-import { Task, TaskStatus } from '@prisma/client'
 import { Metadata } from 'next'
+import { notFound } from 'next/navigation'
 
+import { authGuard, getAuthSession } from '@/lib/auth'
 import { siteConfig } from '@/lib/siteConfig'
-import { getTasks } from './actions'
+import { getTasksAction } from './actions'
 import { Render } from './render'
 
 export const metadata: Metadata = {
@@ -20,25 +21,28 @@ const TasksPage = async ({
     status?: string
   }
 }) => {
+  const session = await getAuthSession()
+  if (!session) return notFound()
+
+  const g = await authGuard(session, 'TaskList')
+  if (!g) return notFound()
+
   const page = searchParams.page ? parseInt(searchParams.page) : 1
   const limit = searchParams.limit ? parseInt(searchParams.limit) : 10
 
   const [sortBy, sortOrder] =
     typeof searchParams.sort === 'string'
-      ? (searchParams.sort.split('.') as [
-          keyof Task | undefined,
-          'asc' | 'desc' | undefined
-        ])
+      ? (searchParams.sort.split('.') as [any, 'asc' | 'desc' | undefined])
       : []
 
   const title = searchParams.title
 
   const status =
     typeof searchParams.status === 'string'
-      ? (searchParams.status.split('.') as TaskStatus[])
+      ? (searchParams.status.split('.') as any[])
       : undefined
 
-  const data = await getTasks({
+  const tasks = await getTasksAction({
     page,
     limit,
     sortBy,
@@ -47,7 +51,9 @@ const TasksPage = async ({
     status
   })
 
-  return <Render data={data} />
+  if (!tasks?.data) throw new Error('Tasks data not found')
+
+  return <Render data={tasks.data} />
 }
 
 export default TasksPage

package/template/base/src/app/(app)/tasks/render.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { TaskStatus } from '@prisma/client'
+import { InferSelectModel } from 'drizzle-orm'
 import Link from 'next/link'
 import { FC } from 'react'
 
@@ -10,17 +10,35 @@ import { Heading } from '@/components/heading'
 import { Icons } from '@/components/icons'
 import { Shell } from '@/components/shell'
 import { Button } from '@/components/ui/button'
+import { Task } from '@/db/schema'
 import { formatDateTime, timesAgo } from '@/lib/formatDate'
 import { generateLabel } from '@/lib/generateLabel'
-import { GetTasksFnDataType } from './actions'
+import { TaskStatusEnumArr } from './statusEnum'
 
-const statuses = Object.values(TaskStatus).map(x => ({
+const statuses = TaskStatusEnumArr.map(x => ({
   label: generateLabel(x),
   value: x
 }))
 
 export const Render: FC<{
-  data: GetTasksFnDataType
+  data: {
+    tasks: {
+      id: string
+      title: string
+      status: InferSelectModel<typeof Task>['status']
+      createdBy: {
+        id: string
+        name?: string | null
+      }
+      updatedBy?: {
+        id: string
+        name?: string | null
+      } | null
+      createdAt: Date
+      updatedAt?: Date | null
+    }[]
+    total: number
+  }
 }> = ({ data }) => {
   return (
     <Shell>
@@ -68,7 +86,8 @@ export const Render: FC<{
             header: ({ column }) => (
               <DataTableColumnHeader column={column} title="Updated By" />
             ),
-            cell: ({ row }) => row.original.updatedBy.name,
+            cell: ({ row }) =>
+              row.original.updatedBy ? row.original.updatedBy.name : undefined,
             enableSorting: false
           },
           {
@@ -83,7 +102,10 @@ export const Render: FC<{
             header: ({ column }) => (
               <DataTableColumnHeader column={column} title="Updated At" />
             ),
-            cell: ({ row }) => timesAgo(row.original.updatedAt)
+            cell: ({ row }) =>
+              row.original.updatedAt
+                ? timesAgo(row.original.updatedAt)
+                : undefined
           }
         ]}
         data={data.tasks}

package/template/base/src/app/(app)/tasks/statusEnum.ts

@@ -0,0 +1,3 @@
+import { Task } from '@/db/schema'
+
+export const TaskStatusEnumArr = Task.status.enumValues

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

@@ -1,83 +1,68 @@
 'use server'
 
 import { revalidatePath } from 'next/cache'
+import { z } from 'zod'
 
-import { getAuthSession } from '@/lib/auth'
-import { prisma } from '@/lib/db'
-import { UnwrapPromise } from '@/types/UnwrapPromise'
+import { authActionClient } from '@/lib/safe-action'
+import { getRolesMiniUseCase } from '@/use-case/role'
+import {
+  createUserUseCase,
+  deleteUserUseCase,
+  getUserByIdUseCase,
+  updateUserUseCase
+} from '@/use-case/user'
+import { UserCreateUpdateSchema, UserUpdateServerSchema } from './validation'
 
-export const getUser = async (id: string) => {
-  const session = await getAuthSession()
-  if (!session) throw new Error('Unauthorized')
-
-  return await prisma.user.findUnique({
-    where: {
-      id
-    }
+export const getUserAction = authActionClient
+  .schema(z.string())
+  .action(async ({ parsedInput: id, ctx }) => {
+    return await getUserByIdUseCase(ctx.user.type, id)
   })
-}
 
-export type GetUserFnDataType = UnwrapPromise<ReturnType<typeof getUser>>
+export const createUserAction = authActionClient
+  .schema(UserCreateUpdateSchema)
+  .action(async ({ parsedInput, ctx }) => {
+    const id = await createUserUseCase(ctx.user.type, parsedInput)
 
-export const createUser = async ({
-  name,
-  email
-}: {
-  name: string
-  email: string
-}) => {
-  const session = await getAuthSession()
-  if (!session) throw new Error('Unauthorized')
+    revalidatePath('/users')
+    revalidatePath(`/users/${id}`)
 
-  const { id } = await prisma.user.create({
-    data: {
-      name,
-      email
+    return {
+      success: true,
+      id
     }
   })
 
-  revalidatePath('/users')
-  revalidatePath(`/users/${id}`)
-
-  return id
-}
+export const updateUserAction = authActionClient
+  .schema(UserUpdateServerSchema)
+  .action(async ({ parsedInput: { id, name, type, roleId }, ctx }) => {
+    await updateUserUseCase(ctx.user.type, id, {
+      name,
+      type,
+      roleId
+    })
 
-export const updateUser = async ({
-  id,
-  name,
-  email
-}: {
-  id: string
-  name: string
-  email: string
-}) => {
-  const session = await getAuthSession()
-  if (!session) throw new Error('Unauthorized')
+    revalidatePath('/users')
+    revalidatePath(`/users/${id}`)
 
-  await prisma.user.update({
-    where: {
-      id
-    },
-    data: {
-      name,
-      email
+    return {
+      success: true
     }
   })
 
-  revalidatePath('/users')
-  revalidatePath(`/users/${id}`)
-}
+export const deleteUserAction = authActionClient
+  .schema(z.string())
+  .action(async ({ parsedInput: id, ctx }) => {
+    await deleteUserUseCase(ctx.user.type, id)
 
-export const deleteUser = async (id: string) => {
-  const session = await getAuthSession()
-  if (!session) throw new Error('Unauthorized')
+    revalidatePath('/users')
+    revalidatePath(`/users/${id}`)
 
-  await prisma.user.delete({
-    where: {
-      id
-    }
+    return { success: true }
   })
 
-  revalidatePath('/users')
-  revalidatePath(`/users/${id}`)
-}
+export const getRolesMiniAction = authActionClient
+  .schema(z.undefined())
+  .action(async ({ ctx }) => {
+    return await getRolesMiniUseCase(ctx.user.type)
+  })

package/template/base/src/app/(app)/users/[id]/page.tsx

@@ -1,8 +1,9 @@
 import { Metadata } from 'next'
 import { notFound } from 'next/navigation'
 
+import { authGuard, getAuthSession } from '@/lib/auth'
 import { siteConfig } from '@/lib/siteConfig'
-import { GetUserFnDataType, getUser } from './actions'
+import { getRolesMiniAction, getUserAction } from './actions'
 import { Render } from './render'
 
 export const generateMetadata = async (props: {
@@ -18,15 +19,21 @@ const UserPage = async ({
     id: string
   }
 }) => {
-  let user: GetUserFnDataType | undefined
+  const session = await getAuthSession()
+  if (!session) return notFound()
 
-  if (id !== 'new') {
-    const x = await getUser(id)
-    if (!x) return notFound()
-    user = x
-  }
+  const g = await authGuard(session)
+  if (!g) return notFound()
+
+  const roles = await getRolesMiniAction(undefined)
+  if (!roles?.data) return notFound()
+
+  if (id === 'new') return <Render roles={roles.data} />
+
+  const user = await getUserAction(id)
+  if (!user?.data) return notFound()
 
-  return <Render user={user} />
+  return <Render user={user.data} roles={roles.data} />
 }
 
 export default UserPage

package/template/base/src/app/(app)/users/[id]/render.tsx

@@ -5,6 +5,7 @@ import Link from 'next/link'
 import { useRouter } from 'next/navigation'
 import { FC, useState } from 'react'
 import { useForm } from 'react-hook-form'
+import { toast } from 'sonner'
 import { z } from 'zod'
 
 import { Heading } from '@/components/heading'
@@ -32,30 +33,49 @@ import {
   FormMessage
 } from '@/components/ui/form'
 import { Input } from '@/components/ui/input'
-import { toast } from '@/components/ui/use-toast'
-import { formatDateTime, timesAgo } from '@/lib/formatDate'
 import {
-  GetUserFnDataType,
-  createUser,
-  deleteUser,
-  updateUser
-} from './actions'
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@/components/ui/select'
+import { User } from '@/db/schema'
+import { formatDateTime, timesAgo } from '@/lib/formatDate'
+import { generateLabel } from '@/lib/generateLabel'
+import { InferSelectModel } from 'drizzle-orm'
+import { createUserAction, deleteUserAction, updateUserAction } from './actions'
+import { UserCreateUpdateSchema, UserTypeEnumArr } from './validation'
 
-const UserSchema = z.object({
-  name: z.string().nonempty(),
-  email: z.string().email()
-})
+type FormData = z.infer<typeof UserCreateUpdateSchema>
 
-type FormData = z.infer<typeof UserSchema>
+const types = UserTypeEnumArr.map(x => ({
+  label: generateLabel(x),
+  value: x
+}))
 
 export const Render: FC<{
-  user: GetUserFnDataType | undefined
-}> = ({ user }) => {
+  user?: {
+    id: string
+    name?: string | null
+    email: string
+    type: InferSelectModel<typeof User>['type']
+    roleId?: string | null
+    createdAt: Date
+    updatedAt?: Date | null
+  } | null
+  roles: {
+    id: string
+    name: string
+  }[]
+}> = ({ user, roles }) => {
   const form = useForm<FormData>({
-    resolver: zodResolver(UserSchema),
+    resolver: zodResolver(UserCreateUpdateSchema),
     defaultValues: {
       name: user?.name ?? '',
-      email: user?.email ?? ''
+      email: user?.email ?? '',
+      type: user?.type ?? 'Normal',
+      roleId: user?.roleId
     }
   })
   const router = useRouter()
@@ -66,21 +86,23 @@ export const Render: FC<{
     setIsSaving(true)
     try {
       if (!user) {
-        const newId = await createUser(data)
-        router.replace(`/users/${newId}`)
+        const res = await createUserAction(data)
+        if (!res?.data?.success)
+          throw new Error(res?.serverError || 'No success returned from server')
+        if (!res?.data?.id) throw new Error('No id returned from server')
+        router.replace(`/users/${res.data.id}`)
       } else {
-        await updateUser({
+        const res = await updateUserAction({
           id: user.id,
           ...data
         })
+        if (!res?.data?.success)
+          throw new Error(res?.serverError || 'No success returned from server')
       }
-      toast({
-        title: 'User saved'
-      })
+      toast('User saved')
     } catch (err) {
-      toast({
-        title: 'Error saving user',
-        variant: 'destructive'
+      toast('Error saving user', {
+        description: (err as any).message || undefined
       })
     }
     setIsSaving(false)
@@ -140,15 +162,18 @@ export const Render: FC<{
                       onClick={async () => {
                         setIsDeleting(true)
                         try {
-                          await deleteUser(user.id)
-                          toast({
-                            title: 'User deleted'
-                          })
-                          router.push('/users')
+                          const res = await deleteUserAction(user.id)
+                          if (!res?.data?.success)
+                            throw new Error(
+                              res?.serverError ||
+                                'No success returned from server'
+                            )
+                          toast('User deleted')
+                          router.replace('/users')
                         } catch (err) {
-                          toast({
-                            title: 'Error deleting user',
-                            variant: 'destructive'
+                          toast('Error deleting user', {
+                            description:
+                              (err as any).message || 'Something went wrong'
                           })
                         }
                         setIsDeleting(false)
@@ -215,6 +240,66 @@ export const Render: FC<{
               </FormItem>
             )}
           />
+
+          <FormField
+            control={form.control}
+            name="type"
+            render={({ field }) => (
+              <FormItem>
+                <FormLabel>Type</FormLabel>
+                <Select
+                  onValueChange={field.onChange}
+                  defaultValue={field.value}
+                  disabled={isSaving}
+                >
+                  <FormControl>
+                    <SelectTrigger>
+                      <SelectValue placeholder="Select type" />
+                    </SelectTrigger>
+                  </FormControl>
+                  <SelectContent>
+                    {types.map(({ label, value }) => (
+                      <SelectItem key={value} value={value}>
+                        {label}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+
+          {form.getValues('type') === 'Normal' ? (
+            <FormField
+              control={form.control}
+              name="roleId"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>Role</FormLabel>
+                  <Select
+                    onValueChange={field.onChange}
+                    defaultValue={field.value || undefined}
+                    disabled={isSaving}
+                  >
+                    <FormControl>
+                      <SelectTrigger>
+                        <SelectValue placeholder="Select role" />
+                      </SelectTrigger>
+                    </FormControl>
+                    <SelectContent>
+                      {roles.map(({ id, name }) => (
+                        <SelectItem key={id} value={id}>
+                          {name}
+                        </SelectItem>
+                      ))}
+                    </SelectContent>
+                  </Select>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+          ) : undefined}
         </form>
       </Form>
       {user ? (
@@ -230,7 +315,7 @@ export const Render: FC<{
             },
             {
               label: 'Updated At',
-              value: timesAgo(user.updatedAt)
+              value: user.updatedAt ? timesAgo(user.updatedAt) : '-'
             }
           ]}
         />

package/template/base/src/app/(app)/users/[id]/validation.ts

@@ -0,0 +1,18 @@
+import { z } from 'zod'
+
+import { User } from '@/db/schema'
+
+export const UserTypeEnumArr = User.type.enumValues
+
+export const UserCreateUpdateSchema = z.object({
+  name: z.string().min(1).trim(),
+  email: z.string().email().toLowerCase().trim(),
+  type: z.enum(UserTypeEnumArr),
+  roleId: z.string().optional().nullable()
+})
+
+export const UserUpdateServerSchema = UserCreateUpdateSchema.merge(
+  z.object({
+    id: z.string().min(1)
+  })
+)