create-ej-app 24.0.0 → 26.0.0

package/template/saas-starter/src/app/(app)/actions/members.ts

@@ -0,0 +1,163 @@
+'use server'
+
+import { and, asc, count, desc, eq, ilike, inArray, or } from 'drizzle-orm'
+import { z } from 'zod'
+import { SortOrderEnum } from '~/components/data-table/enum'
+import { db } from '~/db'
+import { invitationsTable, membersTable, usersTable } from '~/db/schema'
+import { getPaginationSchema, getSortSchema } from '~/lib/actions'
+import { assertUserCanManageOrganization } from '~/lib/organization-access'
+import { authActionClient } from '~/lib/safe-action'
+import { resolveImageUrl } from '~/lib/storage'
+import { stringValidation } from '~/lib/validations'
+
+export const getMembers = authActionClient
+  .inputSchema(
+    z.object({
+      organizationId: stringValidation,
+      ...getPaginationSchema(),
+      ...getSortSchema(['name', 'email', 'role', 'createdAt']),
+      search: z.string().trim().optional(),
+      filters: z
+        .object({
+          role: z.array(z.string()).optional()
+        })
+        .optional()
+    })
+  )
+  .action(
+    async ({
+      parsedInput: {
+        organizationId,
+        page,
+        limit,
+        sortBy,
+        sortOrder,
+        search,
+        filters
+      }
+    }) => {
+      await assertUserCanManageOrganization(organizationId)
+
+      const where = and(
+        eq(membersTable.organizationId, organizationId),
+        search
+          ? or(
+              ilike(usersTable.name, `%${search}%`),
+              ilike(usersTable.email, `%${search}%`)
+            )
+          : undefined,
+        filters?.role && filters.role.length > 0
+          ? inArray(membersTable.role, filters.role)
+          : undefined
+      )
+
+      const sortColumn =
+        sortBy === 'name'
+          ? usersTable.name
+          : sortBy === 'email'
+            ? usersTable.email
+            : sortBy === 'role'
+              ? membersTable.role
+              : membersTable.createdAt
+
+      const direction = sortOrder === SortOrderEnum.ASC ? asc : desc
+
+      const [rows, total] = await Promise.all([
+        db
+          .select({
+            id: membersTable.id,
+            userId: usersTable.id,
+            name: usersTable.name,
+            email: usersTable.email,
+            image: usersTable.image,
+            role: membersTable.role,
+            createdAt: membersTable.createdAt
+          })
+          .from(membersTable)
+          .innerJoin(usersTable, eq(membersTable.userId, usersTable.id))
+          .where(where)
+          .orderBy(direction(sortColumn))
+          .limit(limit)
+          .offset((page - 1) * limit),
+        db
+          .select({ count: count() })
+          .from(membersTable)
+          .innerJoin(usersTable, eq(membersTable.userId, usersTable.id))
+          .where(where)
+      ])
+
+      const data = rows.map(row => ({
+        ...row,
+        image: resolveImageUrl(row.image)
+      }))
+
+      return [data, total[0]?.count ?? 0] as const
+    }
+  )
+
+export const getInvitations = authActionClient
+  .inputSchema(
+    z.object({
+      organizationId: stringValidation,
+      ...getPaginationSchema(),
+      ...getSortSchema(['email', 'status', 'createdAt', 'expiresAt']),
+      search: z.string().trim().optional(),
+      filters: z
+        .object({
+          status: z.array(z.string()).optional()
+        })
+        .optional()
+    })
+  )
+  .action(
+    async ({
+      parsedInput: {
+        organizationId,
+        page,
+        limit,
+        sortBy,
+        sortOrder,
+        search,
+        filters
+      }
+    }) => {
+      await assertUserCanManageOrganization(organizationId)
+
+      const where = and(
+        eq(invitationsTable.organizationId, organizationId),
+        search ? ilike(invitationsTable.email, `%${search}%`) : undefined,
+        filters?.status && filters.status.length > 0
+          ? inArray(invitationsTable.status, filters.status)
+          : undefined
+      )
+
+      const sortColumn = invitationsTable[sortBy ?? 'createdAt']
+      const direction = sortOrder === SortOrderEnum.ASC ? asc : desc
+
+      const [rows, total] = await Promise.all([
+        db.query.invitationsTable.findMany({
+          where,
+          with: {
+            user: { columns: { name: true } }
+          },
+          limit,
+          offset: (page - 1) * limit,
+          orderBy: [direction(sortColumn)]
+        }),
+        db.select({ count: count() }).from(invitationsTable).where(where)
+      ])
+
+      const data = rows.map(row => ({
+        id: row.id,
+        email: row.email,
+        role: row.role ?? 'member',
+        status: row.status,
+        expiresAt: row.expiresAt,
+        createdAt: row.createdAt,
+        inviterName: row.user?.name ?? null
+      }))
+
+      return [data, total[0]?.count ?? 0] as const
+    }
+  )

package/template/saas-starter/src/app/(app)/actions/organization.ts

@@ -0,0 +1,92 @@
+'use server'
+
+import { and, eq } from 'drizzle-orm'
+import { z } from 'zod'
+import { db } from '~/db'
+import { membersTable, organizationsTable } from '~/db/schema'
+import {
+  assertUserCanManageOrganization,
+  getUserMembershipCached
+} from '~/lib/organization-access'
+import { authActionClient } from '~/lib/safe-action'
+import { confirmUpload, isR2Configured, isR2Key } from '~/lib/storage'
+import { stringValidation } from '~/lib/validations'
+
+export const updateOrganizationLogoAction = authActionClient
+  .inputSchema(
+    z.object({
+      organizationId: stringValidation,
+      key: z.string().min(1),
+      oldKey: z.string().min(1).nullish()
+    })
+  )
+  .action(async ({ parsedInput }) => {
+    if (!isR2Configured() || !isR2Key(parsedInput.key)) {
+      return { success: true }
+    }
+
+    await assertUserCanManageOrganization(parsedInput.organizationId)
+
+    const org = await db.query.organizationsTable.findFirst({
+      where: eq(organizationsTable.id, parsedInput.organizationId),
+      columns: {
+        id: true,
+        logo: true
+      }
+    })
+
+    if (!org) {
+      throw new Error('Organization not found')
+    }
+
+    if (org.logo !== parsedInput.key) {
+      throw new Error(
+        'Organization logo key does not match the current logo key'
+      )
+    }
+
+    await confirmUpload(parsedInput.key, parsedInput.oldKey)
+    return true
+  })
+
+export const transferOrganizationOwnershipAction = authActionClient
+  .inputSchema(
+    z.object({
+      organizationId: stringValidation,
+      targetMemberId: stringValidation
+    })
+  )
+  .action(async ({ parsedInput: { organizationId, targetMemberId } }) => {
+    const membership = await getUserMembershipCached(organizationId)
+    if (!membership || membership.role !== 'owner') {
+      throw new Error('Only the organization owner can transfer ownership')
+    }
+
+    if (targetMemberId === membership.id) {
+      throw new Error('You are already the owner of this organization')
+    }
+
+    const target = await db.query.membersTable.findFirst({
+      where: and(
+        eq(membersTable.id, targetMemberId),
+        eq(membersTable.organizationId, organizationId)
+      )
+    })
+    if (!target) {
+      throw new Error('Selected member does not belong to this organization')
+    }
+
+    await db.transaction(async tx => {
+      await tx
+        .update(membersTable)
+        .set({ role: 'owner' })
+        .where(eq(membersTable.id, target.id))
+
+      await tx
+        .update(membersTable)
+        .set({ role: 'admin' })
+        .where(eq(membersTable.id, membership.id))
+    })
+
+    return true
+  })

package/template/saas-starter/src/app/(app)/app/[orgId]/dashboard/page.tsx

@@ -0,0 +1,20 @@
+'use client'
+
+import { LayoutGrid } from 'lucide-react'
+import { PageHeading } from '~/components/page-heading'
+import { useOrganizationContext } from '../../_components/organization-context'
+
+export default function Page() {
+  const org = useOrganizationContext()
+
+  return (
+    <div className="space-y-6">
+      <PageHeading
+        title={org.name}
+        description="Your organization's home base."
+        icon={LayoutGrid}
+      />
+      Hello, World!
+    </div>
+  )
+}

package/template/saas-starter/src/app/(app)/app/[orgId]/layout.tsx

@@ -0,0 +1,34 @@
+import { redirect } from 'next/navigation'
+import { getUserOrganizationsCached } from '~/lib/organization-access'
+import { OrganizationContextProvider } from '../_components/organization-context'
+
+export default async function Layout({
+  children,
+  params
+}: {
+  children: React.ReactNode
+  params: Promise<{ orgId: string }>
+}) {
+  const { orgId } = await params
+
+  const organizations = await getUserOrganizationsCached()
+  const org = organizations.find(o => o.id === orgId)
+
+  if (!org) {
+    return redirect('/app')
+  }
+
+  return (
+    <OrganizationContextProvider
+      value={{
+        id: org.id,
+        name: org.name,
+        role: org.role,
+        memberId: org.memberId,
+        userId: org.userId
+      }}
+    >
+      {children}
+    </OrganizationContextProvider>
+  )
+}

package/template/saas-starter/src/app/(app)/app/[orgId]/settings/_components/billing-email-form.tsx

@@ -0,0 +1,100 @@
+'use client'
+
+import { zodResolver } from '@hookform/resolvers/zod'
+import { Loader2 } from 'lucide-react'
+import { useRouter } from 'next/navigation'
+import { useForm } from 'react-hook-form'
+import { z } from 'zod'
+import { updateBillingEmailAction } from '~/app/(app)/actions/billing'
+import { Button } from '~/components/ui/button'
+import {
+  Field,
+  FieldContent,
+  FieldDescription,
+  FieldError,
+  FieldTitle
+} from '~/components/ui/field'
+import { Input } from '~/components/ui/input'
+import { useSafeActionMutation } from '~/lib/safe-action-client'
+import { toastErrorMessage, toastSuccessMessage } from '~/lib/toast-message'
+import { emailValidation } from '~/lib/validations'
+
+const schema = z.object({
+  billingEmail: emailValidation
+})
+
+type Form = z.infer<typeof schema>
+
+export function BillingEmailForm({
+  orgId,
+  defaultBillingEmail
+}: {
+  orgId: string
+  defaultBillingEmail: string | null
+}) {
+  const router = useRouter()
+  const { mutateAsync: updateBillingEmail } = useSafeActionMutation(
+    updateBillingEmailAction
+  )
+
+  const {
+    register,
+    handleSubmit,
+    reset,
+    formState: { errors, isDirty, isSubmitting }
+  } = useForm<Form>({
+    resolver: zodResolver(schema),
+    defaultValues: { billingEmail: defaultBillingEmail ?? '' }
+  })
+
+  async function onSubmit(values: Form) {
+    try {
+      await updateBillingEmail({
+        organizationId: orgId,
+        billingEmail: values.billingEmail
+      })
+      reset({ billingEmail: values.billingEmail })
+      toastSuccessMessage('Billing email updated')
+      router.refresh()
+    } catch (error) {
+      toastErrorMessage(
+        error instanceof Error
+          ? error.message
+          : 'Failed to update billing email'
+      )
+    }
+  }
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)} className="flex flex-col gap-6">
+      <Field orientation="vertical">
+        <FieldContent>
+          <FieldTitle className="text-foreground mb-1.5 text-[13px] font-semibold">
+            Billing email
+          </FieldTitle>
+          <Input
+            type="email"
+            placeholder="billing@company.com"
+            {...register('billingEmail')}
+            aria-invalid={!!errors.billingEmail}
+          />
+          <FieldDescription className="mt-1.5 text-[13px]">
+            Invoices and receipts are sent here. Required before purchasing a
+            plan.
+          </FieldDescription>
+          <FieldError
+            errors={[errors.billingEmail]}
+            className="mt-1.5 text-[13px]"
+          />
+        </FieldContent>
+      </Field>
+
+      <div>
+        <Button type="submit" disabled={isSubmitting || !isDirty}>
+          {isSubmitting && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+          Save billing email
+        </Button>
+      </div>
+    </form>
+  )
+}