How to define mutually exclusive properties on a type in TypeScript?

Question

I have the a class hierarchy like this:

export interface interfaceA {
  property1: string;
  property2: interfaceB;
}
    
export interface interfaceB{
  property3: interfaceC;
  property4: interfaceD;
}
    
export interface interfaceC{
  property5: string;
}
    
export interface interfaceD{
  property6: string;
}

I have to send data to an API, which will accept data where interfaceB have to contain only interfaceC when interfaceD is null and vice versa. Or it can contain both. The API is out of our hand to change.

Here are some examples:

When interfaceC is null (it needs to be the same way when interfaceD is null):

{
interfaceA :{
 property1: "somevalue",
 property2: {
  interfaceB:{
    property4: 
    {
      property6: "somevalue";
    }
   }
  }
 }
}

When both interfaceC and interfaceD both have values:

{
interfaceA :{
 property1: "somevalue",
 property2: {
  interfaceB:{
    property3: 
    {
      property5: "somevalue";
    },
    property4: 
    {
      property6: "somevalue";
    }
   }
  }
 }
}

How to create the JSON from TyepScript so that it can be sent to the API? I'm very new to TypeScript.

Answer 1

You need to enable strictNullChecks in your TS-Config so that null and undefined are not part of your types by default. (Consider activating all strict checks.)

Then you could define interfaceB like this:

export type interfaceB = {
  property3: interfaceC;
  property4: interfaceD;
} | {
  property3: interfaceC;
  property4: null; // you might try to remove this line
} | {
  property3: null; // you might try to remove this line
  property4: interfaceD;
};

This means that the data has to either contain property3 or property4 or both of them.