Is the Prisma model not reachable through Prisma Client?

I'm currently attempting to retrieve a specific property of a Prisma model using Prisma Client. The model in question is related to restaurants and includes a reviews property that also corresponds with a separate Review model.

schema.prisma file:

// This here is your Prisma schema document,
// read further about it in the documentation: https://pris.ly/d/prisma-schema

generator client {
  provider = "prisma-client-js"
}

datasource db {
  provider = "postgresql"
  url      = env("DATABASE_URL")
}

model Restaurant {
  id          Int      @id @default(autoincrement())
  name        String
  main_img    String
  images      String[]
  description String
  price       PRICE
  opens_at    String
  closes_at   String
  slug        String   @unique
  created_at  DateTime @default(now())
  updated_at  DateTime @updatedAt
  item        Item[]
  location_id Int      @unique
  location    Location @relation(fields: [location_id], references: [id])
  cuisine_id  Int      @unique
  cuisine     Cuisine  @relation(fields: [cuisine_id], references: [id])
  review_id   Int      @unique
  reviews     Review[]
}

... (repeated various other schemas)

enum RATING {
  HALF
  ONE
  ONE_HALF
  TWO
  TWO_HALF
  THREE
  THREE_HALF
  FOUR
  FOUR_HALF
  FIVE
}

The objective is to execute queries on this schema from a page.tsx file by leveraging the Prisma client.

Interacting with Prisma Client:

import { PrismaClient, Cuisine, Location, PRICE, Review } from "@prisma/client";

const prisma = new PrismaClient();

export interface IRestaurantCardType {
  id: number;
  name: string;
  price: PRICE;
  main_img: string;
  location: Location;
  cuisine: Cuisine;
  slug: string;
  reviews: Review[];
}


const fetchRestaurants = async (): Promise <IRestaurantCardType[]> => {
  const restaurants = await prisma.restaurant.findMany({
    select: {
      id: true,
      name: true,
      price: true,
      main_img: true,
      location: true,
      cuisine: true,
      slug: true,
      reviews: true,
    }
  });

  return restaurants;
};

However, there are two issues arising from the provided code. The first problem involves an error within the import declaration, specifically when attempting to import the Review type.

Module '"@prisma/client"' has no exported member 'Review'.ts(2305)
The remainder of the imports do not trigger this particular error.

The second issue occurs within the fetchRestaurants function, specifically pertaining to the object restaurants in the select property at reviews: true,.

Type '{ id: true; name: true; price: true; main_img: true; location: true; cuisine: true; slug: true; reviews: true; }' is not assignable to type 'RestaurantSelect'.
  Object literal may only specify known properties, and 'reviews' does not exist in type 'RestaurantSelect'.ts(2322)

I am employing Next.js 13 with the experimental app directory structure in combination with Prisma for my ORM operations based on Postgres.

Update:

I managed to remove the node_modules directory and reinstated it through running npm install, thereby resolving both errors. Nonetheless, if I attempt to log restaurants.reviews, it returns as undefined. Additionally, inspecting the restaurants variable reveals the reviews property returning as reviews: [ [Object] ].

Answer №1

  • One possible issue could be that you forgot to migrate after adding the Review model. Make sure to execute the following command:

    npx prisma db push
    

Refer to this documentation for more information: here

The 'db push' command utilizes the same engine as Prisma Migrate to synchronize your Prisma schema with your database schema. It performs the following tasks:

1- Analyzes the database structure and implements the necessary changes to align it with your Prisma schema.

2- By default, once the database schema is updated, generators like Prisma Client are triggered automatically. There is no need to manually run 'prisma generate'.

  • If you want to generate types using Prisma, run the following command:

    npx prisma generate
    

Lastly, remember to restart the server after performing these steps.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the solution for resolving the Next.js 14 next/link routing 404 error page problem?

After performing a fresh installation of Next.js on Windows using an elevated shell with the command npx create-next-app@latest, I encountered an issue. In my /src/app/components/Header.tsx file, the code looks like this: import React from 'react&apos ...

Angular: Connecting template data to different visual presentations

Looking for a solution to display data and map values to another presentation without needing complex ngIf statements or creating multiple components. Check out this sample: https://stackblitz.com/edit/angular-9l1vff The 'vals' variable contain ...

core.js encountered an error at line 6237: Unable to assign value to property 'area' as it is undefined

HTML: I have created a form but encounter an error when clicking the submit button. Can someone please assist me in identifying the issue? <h3 class="page-header">Operator Form</h3> <div class="outer-container"> <form class="form-s ...

JavaScript: Manipulating Data with Dual Arrays of Objects

//Original Data export const data1 = [ { addKey: '11', address: '12', value: 0 }, { addKey: '11', address: '12', value: 0 }, { addKey: '12', address: '11', value: 0 }, { addKey: &a ...

Angular 12: TypeScript Issue TS2339 - Unable to Locate Property on Type

Whenever I use the code below, I encounter error TS2339: Property 'timestamp' does not exist on type 'LogRepair[]' In the component's HTML file, I am attempting to loop through an array of properties defined in the LogRepair typ ...

Create a unique custom design for your Mapbox GL control

When developing the website, we utilized Angular 8, Typescript, and SCSS. We are using mgl-map to display a map, and I wanted to create a custom control for it with unique styles. I added the custom control to the map using: const centerOnCoordinatesC ...

Tips for concealing tick labels in d3 using TypeScript

When trying to hide tick labels by passing an empty string to the .tickFormat("") method, I encountered an issue with Typescript. The error message received was as follows: TS2769: No overload matches this call. Overload 1 of 3, '(format: null): Axi ...

Display an API generated popup list using Vue's rendering capabilities

I'm attempting to generate a pop-up within a displayed list using custom content retrieved from an API request. Currently, my code looks like this: <template> <div class="biblio__all"> <a v-for="i in items" ...

Automatically fill in 'Edit' within an open Dialog using Angular Material

Can you pre-populate and edit a form in Angular Material's openDialog? The form is reactive. The main component has the user's URL with their ID. When the button is clicked, the openDialog should pop up with a populated form based on the passed I ...

Struggling to make prettier-plugin-tailwindcss functional on my Next.js application

Recently, I went ahead and installed Prettier and the prettier tailwind plugin for my Next.js app configured with Tailwind. My understanding was that after running the command to install these plugins, they should work seamlessly. In Visual Studio Code, I ...

`Developing reusable TypeScript code for both Node.js and Vue.js`

I'm struggling to figure out the solution for my current setup. Here are the details: Node.js 16.1.x Vue.js 3.x TypeScript 4.2.4 This is how my directory structure looks: Root (Node.js server) shared MySharedFile.ts ui (Vue.js code) MySharedFi ...

The userEvent.click function in Testing Library seems to be malfunctioning

After developing a project with NextJS, I encountered an issue while trying to test the pathname of a link in the navbar using Jest and Testing Library. It seems that userEvent.click is not working properly as the pathname doesn't change or it keeps r ...

The property "state" of RouteComponentProps location does not exist in the provided type {}

We recently encountered a new error that was not present before. Previously, our code compiled without any issues and the compilation process went smoothly. However, individuals who installed the react application from scratch are now facing an error speci ...

Discover the exclusive Error 404 dynamic routes available only in the production version of NEXT13! Don

Hey everyone, I'm encountering an issue with NEXT's dynamic routing (Next 13). My folder structure looks like this: - user/ -- [id]/ --- page.js It works fine in dev mode but not in production. What am I trying to do? I've created a "page ...

Is there a way to dynamically exclude files from the TypeScript compiler?

Currently, I am in the process of setting up a node/typescript server for a real-time application. Both my server and client are located within the same folder. My goal is to exclude "src/client" from the typescript compiler when executing the "server:dev ...

What is the process of using observables in Angular to retrieve a number or variable?

While working on an angular service that calls an API and processes a large amount of data, I encountered an issue. I was trying to count the occurrences of each type in the data and send back that count along with the data itself. However, I found that wh ...

Encountering the error message "This expression cannot be invoked" within a Typescript React Application

I'm working on separating the logic from the layout component in my Typescript React Application, but I suspect there's an issue with the return type of my controller function. I attempted to define a type to specify the return type, but TypeScr ...

The module is missing a declaration file and therefore has an implicit type of 'any'. This error (TS7016) occurs in TypeScript version 2.0

So I've been experimenting with the module react-image-gallery. Surprisingly, there seems to be no types available for this package when trying to install it using npm. When attempting npm install @types/react-image-gallery, all I get is a 404 error. ...

What is the correct way to wrap an http.get in TypeScript?

My understanding of Typescript is limited, so I have a basic question related to my web application's frontend. In most http get-requests, I need to include two parameters. To simplify this process, I created a simple wrapper for HttpClient (from "ang ...

What could be the reason for the Angular2 Component property not appearing on my webpage?

Here is the code snippet I am working with: import {Component} from "@angular/core"; @Component({ selector: 'my-app', template: ` <h1>{{title}}</h1> <h2>{{secondTitle}}</h2> <main-page></ma ...