Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – TypeScript type error on my servfer action next.js

need help on a server action on my Next.js applicastion, giving me a type error and can’t pinpoint the reason, it appears when there are 3 values on the db.insert for the orderProduct and it always errors out the first value whatever it field it is.

create-order.tsx

products.map(async ({ productId, quantity, variantId }) => {
  await db.insert(orderProduct).values({
    productVariantId: variantId,
    productId: productId,
    quantity,
    orderId: order[0].id,
  })
})

schema

export const orderProduct = pgTable('order_product', {
  id: serial('id').primaryKey(),
  quantity: integer('quantity').notNull(),
  productVariantId: serial('productVariantId')
    .notNull()
    .references(() => productVariants.id, { onDelete: 'cascade' }),
  productId: serial('productId')
    .notNull()
    .references(() => products.id, { onDelete: 'cascade' }),
  orderId: serial('orderId')
    .notNull()
    .references(() => orders.id, { onDelete: 'cascade' }),
})

Types

import * as z from 'zod'

export const createOrderSchema = z.object({
  total: z.number(),
  status: z.string(),
  paymentIntentId: z.string(),
  products: z.array(
    z.object({
      quantity: z.number(),
      productId: z.string(),
      variantId: z.string(),
    }),
  ),
})

Error message

No overload matches this call.
  Overload 2 of 2, '(values: { quantity: number | SQL<unknown> | Placeholder<string, any>; id?: number | SQL<unknown> | Placeholder<string, any> | undefined; productId?: number | SQL<...> | Placeholder<...> | undefined; productVariantId?: number | ... 2 more ... | undefined; orderId?: number | ... 2 more ... | undefined; }[]): PgInsertBase<...>', gave the following error.
    Object literal may only specify known properties, and 'productVariantId' does not exist in type '{ quantity: number | SQL<unknown> | Placeholder<string, any>; id?: number | SQL<unknown> | Placeholder<string, any> | undefined; productId?: number | SQL<...> | Placeholder<...> | undefined; productVariantId?: number | ... 2 more ... | undefined; orderId?: number | ... 2 more ... | undefined; }[]'.ts(2769)

Here’s the error, it will be the same if i move around the values of my db.insert

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Found the answer, on my types it should be z.number() instead of z.string() for the productId and variantId

    import * as z from 'zod'

export const createOrderSchema = z.object({
  total: z.number(),
  status: z.string(),
  paymentIntentId: z.string(),
  products: z.array(
    z.object({
      quantity: z.number(),
      productId: z.number(),
      variantId: z.number(),
    }),
  ),
})

  2. 0

    Modular Design:

    • Always define base schemas (DbProductSchema, DbOrderSchema) to ensure
      a single source of truth for common fields.
    • Use extend, pick, or omit methods to customize schemas for specific
      use cases.

    Schema Naming Conventions:

    • Use Db as a prefix for base schemas that represent database
      structures (e.g., DbProductSchema).
    • Use descriptive names like create, read, update, or basic for
      specific operation schemas.

    order-product.schema.ts

    import * as z from 'zod';

// Base schema for a product. Reused for consistency across operations.
const DbProductOrderSchema = z.object({
  productId: z.number(),
  quantity: z.number(),
  variantId: z.number(),
});

// Specific schemas for product operations like creation, reading, or basic use cases.
export const OrderProductSchema = {
  create: DbProductOrderSchema,
  read: DbProductOrderSchema.extend({
    id: z.string().uuid(), // Includes unique ID for identification
  }),
};

    order.schema.ts

    import * as z from 'zod';
import { OrderProductSchema } from './order-product.schema'; // Import product schema for reusability

// Base schema for order data. Includes products using the basic ProductSchema.
const DbOrderSchema = z.object({
  total: z.number(),
  status: z.string(),
  paymentIntentId: z.string(),
  orderDate: z.date(),
  products: z.array(OrderProductSchema.create), // Ensures products conform to the basic schema
});

// Specific schemas for order operations like creation and reading.
export const OrderSchema = {
  create: DbOrderSchema.omit({ orderDate: true }).extend({
    orderDate: z.coerce.date(), // String needs to be coerced to date
  }), // Used for creating new orders
  read: DbOrderSchema.extend({
    id: z.string().uuid(), // Includes unique ID for order identification
  }),
};

    This will assist you in managing any type of project. I’ve included an example for a date. In the same way, you can add product schema.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search