Unable to associate a model with an additional attribute in objection because of a TypeScript issue

I'm attempting to establish a connection between two models while adding an additional property called "url":

if (typeof session.id === "number") {
  const sessionUser = await Session.relatedQuery("users")
    .for(session.id)
    .relate({
      id: 12345, // encountering error here
      url: "test",
    });
}

The typescript error message I'm receiving is:

Argument of type '{ id: number; url: string; }' is not assignable to parameter of type 'string | number | CompositeId | MaybeCompositeId[] | PartialModelObject | PartialModelObject[]'. Object literal may only specify known properties, and 'id' does not exist in type 'CompositeId | MaybeCompositeId[] | PartialModelObject | PartialModelObject[]'.

However, when I attempt to relate the models without the extra property, it runs smoothly:

if (typeof session.id === "number") {
  const sessionUser = await Session.relatedQuery("users")
    .for(session.id)
    .relate(userId); //userId is simply a number e.g. 5
}

Below is my Session model. I have also added the extra property on my User model as a precaution:

export class Session extends Model {
  host_id?: number;
  url?: string;

  static get tableName() {
    return "sessions";
  }

  static relationMappings = {
    users: {
      relation: Model.ManyToManyRelation,
      modelClass: path.join(__dirname, "User"),
      join: {
        from: "sessions.id",
        through: {
          from: "sessions_users.session_id",
          to: "sessions_users.user_id",
          extra: ["url"],
        },
        to: "users.id",
      },
    },
  };
}

Here are the resources regarding extra properties:

Is there something obvious that I might be overlooking?

Answer №1

I believe type inference may struggle to determine the specific model you are referencing in this context. It seems that a straightforward approach could be:

.relate({
  id: 12345,
  url: "test",
} as PartialModelObject<User>);

Instead of pre-defining the object literal, like so:

const related: PartialModelObject<User> = { id: 12345, url: "test" };

This is just another way of achieving the same goal without declaring the object ahead of time. Though untested, this conveys the general concept.

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

Issue encountered when importing a font in TypeScript due to an error in the link tag's crossorigin

How do I troubleshoot a TypeScript error when importing a custom font, such as a Google font? <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin /> Below is the specific error message: Type 'boolean' is ...

When using Typescript type aliases, make sure to let Intellisense display the alias name instead of the source

Take a look at this brief code snippet type A = number; declare function f(): A; const a = f(); // `a` is number, not A What could be the reason for TS displaying a: number instead of a: A? ...

Angular 2 - Utilizing a Shared Service for Subscriptions

After referencing this guide: Parent and children communicate via a service I have decided to utilize a shared service instead of EventEmitter. The reason being that EventEmitter only facilitates communication between parent and child components, which do ...

Tips for ensuring a method is not invoked more than once with identical arguments

I'm grappling with a challenge in JavaScript (or typescript) - ensuring that developers cannot call a method multiple times with the same argument. For instance: const foo = (name: string) => {} foo("ABC") // ok foo ("123") ...

Inheritance in Angular with TypeScript Using Generic Types

Looking for some assistance from the angular2 / typescript experts out there to guide me in the right direction before I lose my mind :-) Here's what I'm trying to achieve: I want to create a parent class that implements its own defined parent ...

What are some effective ways to create a flexible framework in Typescript for Node.js applications utilizing the native MongoDB driver?

When using node.js and the native mongodb driver, is there a way to implement a schema/schemaless structure by utilizing classes or interfaces with Typescript (ES6)? For instance, if we have a collection named users and perform actions like ...

Tips for utilizing 'safe-json-stringify' within Angular 4 Application

I have a specific requirement to convert a JSON object to a string. However, simply using JSON.stringify() does not work due to circular references. After some research online, I came across a package that can handle this issue for me. The only problem is ...

Prevent redundancy by caching svg icons to minimize repeated requests

I have a collection of info cards on my page, each featuring its own unique illustration along with a set of common icons (SVG) for options such as edit, delete, and more. While the illustrations vary from card to card, the icons remain consistent across a ...

"Encountering the error of 'require is not defined' in an Electron-React-Webpack-Typescript application when utilizing

When I add these lines to /src/renderer.ts in an Electron-React-Webpack-Typescript app: ipcRenderer.on('messageFromMain', (event, message) => { console.log(`This is the message from the second window sent via main: ${message}`); }); I encou ...

Tips for generating a hyperlink in a Typescript file using Angular version 16 and above

I am encountering an issue with my consts.ts file in the project. Specifically, I have defined a constant LINK1 as <a href='https://sample.com/'>LINK 1</a>; However, this setup is not working as expected. What I actually want is to d ...

Warning: An alert has been triggered while generating files using create-react-app

npm WARN <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e896999d9c81849ba8dbccd1ded8d4cfdcd0c59bc6cbca">[email protected]</a> requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= ...

Issue encountered with Ionic and ssh2: process.binding is not supported

I am currently delving into the world of Ionic and experimenting with creating a basic application that utilizes SSH2 to establish an ssh connection between the app and a server. Here is a breakdown of the steps I took to encounter the issue: Steps to Rep ...

What is the best way to arrange the information in JSON in ascending order and display it in a table format?

I am working with a mat-table and have used GET to display my data. I now want to sort the data in ascending order based on the db-nr from my JSON. Here is an excerpt from my JSON: { "period": 12.0, " ...

Angular - Implementing *ngIf based on URL parameters

Is it possible to display an element based on specific queryParams included in the URL? For example: ngOnInit() { this.route.queryParams.subscribe(params => { console.log(params); }); } If I want to achieve something similar to this: ...

Guide on sending a message to a specific channel using Discord.js version 13 with TypeScript

After recently diving into TypeScript and seeing that Discord.js has made the move to v13, I have encountered an issue with sending messages to a specific channel using a Channel ID. Below is the code snippet I am currently using: // Define Channel ID cons ...

Regular expressions that identify text located at the conclusion of a URL

Although the title may not be entirely appropriate, my goal is to create a regex that will remove any trailing '/' at the end of a URL under certain conditions. For example: http://stackoverflow.com/questions/ask/ to http://stackoverflow.com/qu ...

Error: The binding element titled implicitly possesses a type of 'any'

Encountering the following issue: ERROR in src/components/Header.tsx:6:18 TS7031: Binding element 'title' implicitly has an 'any' type. 4 | 5 | 6 | const Header = ({title}) => { | ^^^^^ 7 | return( 8 | ...

Angular - Highlight a section of a string variable

Is there a way to apply bold formatting to part of a string assigned to a variable? I attempted the following: boldTxt = 'bold' message = 'this text should be ' + this.boldTxt.toUpperCase().bold() ; However, the HTML output is: thi ...

Example of Using Bluebird in a Chain of Catch and Then Functions

I am struggling to understand how promises work in my code flow setup. I want to create a register function with multiple steps, but I'm unsure of what is achievable and what is not. Imagine I have a register function where I need to: register a u ...

Using React to iterate over an array of objects and generate Date TextFields in Material UI

I have an array of objects representing different stages in a specific process, each stage identified by an id and name. The structure of the array is as follows: const stages = [ { id: 1, name: initialize }, { id: 2, name: execute ...