dannyelo•6mo ago

Patch mutation function is giving me a typescript error

I'm trying to insert a document to a table in various steps. When I insert the first two pieces of data, the record is created and I push the id as searchParams so I can have access in the next form component. And as user keep filling forms, the document needs to receive the remaining data. This is the schema

  export default defineSchema({
  listings: defineTable({
    userSubjectId: v.string(),
    title: v.string(),
    department: v.string(),
    manufacturer: v.optional(v.string()),
    brand: v.optional(v.string()),
    model: v.optional(v.string()),
  }),
});

  export default defineSchema({
  listings: defineTable({
    userSubjectId: v.string(),
    title: v.string(),
    department: v.string(),
    manufacturer: v.optional(v.string()),
    brand: v.optional(v.string()),
    model: v.optional(v.string()),
  }),
});

I first insert data into the required fields This is the function I'm trying to implement now.

export const saveListingMainSpecs = mutation({
  args: {
    listingId: v.id("listings"),
    manufacturer: v.string(),
    brand: v.string(),
    model: v.string(),
  },
  handler: async (ctx, args) => {
    const { listingId } = args;
    await ctx.db.patch(listingId, {
      manufacturer: args.manufacturer,
      brand: args.brand,
      model: args.model,
    });
  },
});

export const saveListingMainSpecs = mutation({
  args: {
    listingId: v.id("listings"),
    manufacturer: v.string(),
    brand: v.string(),
    model: v.string(),
  },
  handler: async (ctx, args) => {
    const { listingId } = args;
    await ctx.db.patch(listingId, {
      manufacturer: args.manufacturer,
      brand: args.brand,
      model: args.model,
    });
  },
});

This is the typescript error I'm getting in the frontend

  function onSubmit(data) {
    const listingId = searchParams.get("listingId");
    saveListingMainSpecs({
      listingId,
      manufacturer: data.manufacturer,
      brand: data.brand,
      model: data.model,
    });
  }

  function onSubmit(data) {
    const listingId = searchParams.get("listingId");
    saveListingMainSpecs({
      listingId,
      manufacturer: data.manufacturer,
      brand: data.brand,
      model: data.model,
    });
  }

Error is at listingId.

Type 'string | null' is not assignable to type 'Id<"listings">'.
  Type 'null' is not assignable to type 'Id<"listings">'.
    Type 'null' is not assignable to type 'string'.ts(2322)
type_utils.d.ts(11, 97): The expected type comes from property 'listingId' which is declared here on type '{ manufacturer: string; brand: string; model: string; listingId: Id<"listings">; }'

Type 'string | null' is not assignable to type 'Id<"listings">'.
  Type 'null' is not assignable to type 'Id<"listings">'.
    Type 'null' is not assignable to type 'string'.ts(2322)
type_utils.d.ts(11, 97): The expected type comes from property 'listingId' which is declared here on type '{ manufacturer: string; brand: string; model: string; listingId: Id<"listings">; }'

Any help is appreciated!

4 Replies

ian•6mo ago

Two issues: searchParams.get might return null if it's not in the search params. You need to check if it's null and throw or return if so - then typescript will know that from then on it's not null. Second: the string might be an Id but it might not. If you want to be safe, pass it up as an ID and do const listingId = db.normalizeId("listings", args.listingId). If you don't want to be safe, you can cast it on the client as Id<"listings">

dannyeloOP•6mo ago

Thanks Ian, I'll try to fix it considering your response I'm taking a good pattern with this implementation? Ian, after normalizing the id, I get error in first parameter of the patch function

dannyeloOP•6mo ago

Oh, I was checking for the wrong variable

dannyeloOP•6mo ago

checked for normalizedListingId instead and everything is good now

Patch mutation function is giving me a typescript error

Did you find this page helpful?