TypeScript and Prisma Best Practices

This guide documents best practices for working with TypeScript and Prisma in VidsGenius, focusing on preventing common type errors and deployment issues.

Working with Prisma Enums

Problem: Type 'string' is not assignable to type 'EnumName'

One of the most common deployment errors occurs when string values are assigned to fields that Prisma expects to be enum values:

// ❌ WRONG: Using string where Prisma enum is expected
interface AutoAnalysisCreateRequest {
  triggerType: string; // Error: Type 'string' is not assignable to type 'TriggerType'
}

Solution: Define Local Type Unions

When working with Prisma enums in API routes or other files:

1. Define a local type that matches the Prisma enum values:

// ✅ CORRECT: Define a type that mirrors the Prisma enum
type TriggerType = 'manual' | 'auto' | 'per_video' | 'batch_3' | 'batch_5';
 
interface AutoAnalysisCreateRequest {
  triggerType: TriggerType; // Properly typed
}

2. When validating input, cast to string for operation:

if (!["per_video", "batch_3", "batch_5"].includes(triggerType as string)) {
  return NextResponse.json({ error: "Invalid triggerType" }, { status: 400 });
}

Testing For Type Errors Locally

To catch these issues before deployment:

1. Run type checking regularly during development:

# Run TypeScript type check
npm run type-check
 
# Or, if you have a specific command
npx tsc --noEmit

2. Set up pre-commit hooks to catch type errors before pushing to remote.

Common Prisma Enum Patterns

Where Prisma Defines Enums

In our schema, we define enums like:

// In schema.prisma
enum TriggerType {
  manual
  auto
  per_video
  batch_3
  batch_5
}

How to Access Enums in Code

There are multiple ways to handle Prisma enums in TypeScript:

1. Type Union (Recommended for API Routes):

   type TriggerType = 'manual' | 'auto' | 'per_video' | 'batch_3' | 'batch_5';

   Copy

2. Direct Import from Generated Client (Not Always Available):

   // This pattern may not work in all environments
   import { Prisma } from '@prisma/client';
   type MyEnum = Prisma.EnumName;

   Copy

3. Using as const Arrays:

   const TRIGGER_TYPES = ['manual', 'auto', 'per_video', 'batch_3', 'batch_5'] as const;
   type TriggerType = typeof TRIGGER_TYPES[number];

   Copy

Handling API Request Bodies

When receiving data from API requests, always:

1. Define proper types for request bodies:

   interface MyRequestBody {
     enumField: MyEnumType;
     // other fields
   }

   Copy

2. Validate inputs against enum values before using them with Prisma:

   const validEnumValues = ['value1', 'value2', 'value3'];
   if (!validEnumValues.includes(input as string)) {
     return NextResponse.json({ error: "Invalid value" }, { status: 400 });
   }

   Copy

Debugging Type Errors

If you encounter type errors with Prisma enums:

1. Check the actual schema.prisma definition of the enum
2. Ensure your type definitions match exactly (including case)
3. Use explicit type annotations with interfaces/types
4. Use the as operator cautiously for runtime operations like array inclusion checks

Recommended VSCode Extensions

• ESLint
• Prisma
• Error Lens
• TypeScript Error Translator

These extensions can help catch type errors early in the development process.

Pre-Deployment Checklist

Before deploying:

• Run npm run type-check or equivalent
• Verify any Prisma enum usage has proper typing
• Test API routes with valid and invalid enum values
• Review any type assertions (as keyword usage) for correctness

By following these practices, you'll avoid the common deployment errors related to TypeScript and Prisma enums.