I’m trying to update the user role in my database but it’s not updating the database at all instead it keeps failing to update the user role. Not sure what I’m doing wrong here:

"use client"

import { useState } from 'react';
import { useForm } from 'react-hook-form';
import { zodResolver } from '@hookform/resolvers/zod';
import * as z from 'zod';
import { useToast } from '@/components/ui/use-toast';
import { useParams, useRouter } from 'next/navigation';
import { PrismaClient } from '@prisma/client';
import { Heading } from '@/components/ui/heading'; // Import the Heading component
import { Separator } from "@/components/ui/separator";

// Define the role options
const roleOptions = ['user', 'admin', 'superadmin'] as const;
type Role = typeof roleOptions[number];

// Define the form schema using Zod
const roleFormSchema = z.object({
  role: z.enum(roleOptions),
});
type RoleFormValues = z.infer<typeof roleFormSchema>;

export const RoleForm = ({ userId, workspace, initialRole }: { userId: string; workspace: { id: string }; initialRole: string }) => {
  const { toast } = useToast();
  const { register, handleSubmit } = useForm<RoleFormValues>({
    resolver: zodResolver(roleFormSchema),
  });
  const [error, setError] = useState<string | null>(null);
  const router = useRouter();
  const prisma = new PrismaClient();

  const onSubmit = async (data: RoleFormValues) => {
    try {
      // Update the user's role in the workspace_users table
      await prisma.workspaceUser.updateMany({
        where: {
          userId: userId,
          workspaceId: workspace.id,
        },
        data: {
          role: data.role,
          updatedAt: new Date(),
        },
      });

      // Update the user's role in the users table
      await prisma.user.update({
        where: {
          id: userId,
        },
        data: {
          role: data.role,
          updatedAt: new Date(),
        },
      });

      // Redirect the user to the appropriate page
      await router.push(`/${workspace.id}/users`);
    } catch (err) {
      // Handle the error and set the error state
      toast({ title: 'Failed to update user role' });
    }
  };

  return (
    <>
      <div className="flex items-center justify-between">
        <Heading
          title="Update User Role"
          description="Manage user roles"
        />
      </div>
      <Separator />
    <form onSubmit={handleSubmit(onSubmit)} className="space-y-8 w-full">
      <div className="grid grid-cols-3 gap-8">
        <label className="mt-2">Role</label>
        <select
          {...register('role')}
          defaultValue={initialRole}
          className="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
        >
          {roleOptions.map((option) => (
            <option key={option} value={option}>
              {option}
            </option>
          ))}
        </select>
      </div>
      <div className="flex items-center justify-between">
        <button
          className="ml-auto"
          type="submit">
          Update Role
        </button>
        {error && <div className="text-red-500">{error}</div>}
      </div>
    </form>
    </>
  );
};

I have two tables in MongoDB where the user roles needs to be able to be updated:

One called ‘users’ with columns:
_id,
name,
email,
email_verified,
role,
createdAt,
updatedAt

One called users with columns:
_id,
workspace_id,
user_id,
role,
granted,
createdAt,
updatedAt