"Property 'value' does not exist on type XYZ"- but it exists. What am I doing wrong?

import { type CourseChapter, type Course, UserInstructor, User } from 'wasp/entities';

// ... other code

function CourseForm({ courseId }: { courseId: string }) {

  const { data: instructors } = useQuery(getUserInstructors)

// other code...
            <select>
              {instructors?.map((instructor: UserInstructor) => (
                <option key={instructor.id} value={String(instructor.id)}>
                  {instructor.user.username}
                </option>
              ))}
            </select>
// ...

import { Course, CourseCategory, CourseChapter, UserInstructor } from 'wasp/entities'
import { type GetCourseCategories, type GetUserInstructors, type GetCourses, type GetCourseChapters } from 'wasp/server/operations'

// ... other code

export const getUserInstructors: GetUserInstructors<void, UserInstructor[]> = async (args, context) => {
  return context.entities.UserInstructor.findMany({
    orderBy: { id: 'asc' },
    include: {
      user: {
        select: {
          id: true,
          username: true
        }
      }
    },
  })
}

// ...
model UserInstructor {
    id        Int     @id @default(autoincrement())
    user      User    @relation(fields: [userId], references: [id])
    userId    String  @unique
    courses   Course[]
}