Usando propriedades condicionais em TypeScript: um exemplo prático

No TypeScript, as propriedades condicionais nos permitem criar interfaces flexíveis e com segurança de tipo que se adaptam com base em determinadas condições. Isto é particularmente útil ao lidar com estruturas de dados complexas onde certas propriedades só deveriam estar presentes em circunstâncias específicas. Nesta postagem do blog, exploraremos como usar propriedades condicionais com um exemplo prático envolvendo grupos de recompensa.

O cenário

Imagine que temos um sistema que gerencia diferentes tipos de recompensas. Cada recompensa pode ser de um tipo específico, como “FINANÇAS” ou “ENVIO”.

Dependendo do tipo de recompensa, determinados atributos devem ser incluídos ou excluídos. Por exemplo, as recompensas financeiras devem incluir atributos financeiros, enquanto as recompensas de envio devem incluir atributos de envio. Além disso, queremos garantir que determinados atributos sejam incluídos apenas com base no tipo de recompensa e nas condições da recompensa.

Definindo os tipos

Primeiro, vamos definir os tipos básicos e interfaces com os quais trabalharemos:

type RewardType = "FINANCE" | "SHIPPING" | "OTHER"; // Example values for RewardType

interface ItemConditionAttribute {
  // Define the properties of ItemConditionAttribute here
}

interface RewardAttributes {
  // Define the properties of RewardAttributes here
}

interface ShippingAttributes {
  // Define the properties of ShippingAttributes here
}

interface FinanceAttributes {
  // Define the properties of FinanceAttributes here
}

interface RewardGroupBase {
  groupId: number;
  rewardType: RewardType;
  rewardOn: string;
  itemConditionAttributes: ItemConditionAttribute[];
}

Usando tipos condicionais

Para garantir que financeAttributes seja incluído apenas quando rewardType é “FINANCE” e rewardAttributes não seja incluído quando rewardOn é “Finance", podemos usar tipos condicionais. Veja como definimos o tipo RewardGroup :

type RewardGroup = RewardGroupBase & (
  { rewardType: "FINANCE"; rewardOn: "Finance"; financeAttributes: FinanceAttributes; rewardAttributes?: never; shippingAttributes?: never } |
  { rewardType: "SHIPPING"; rewardOn: Exclude; shippingAttributes: ShippingAttributes; financeAttributes?: never; rewardAttributes: RewardAttributes } |
  { rewardType: Exclude; rewardOn: Exclude; financeAttributes?: never; shippingAttributes?: never; rewardAttributes: RewardAttributes }
);

Explicação

Interface básica:
RewardGroupBase contém as propriedades comuns que estão sempre presentes, independentemente do tipo de recompensa.

Tipos condicionais:
Usamos uma união de três tipos para lidar com as propriedades condicionais.

• Quando rewardType é "FINANCE" e rewardOn é "Finance", financeAttributes é obrigatório,
  e rewardAttributes e shippingAttributes não são permitidos.

• Quando rewardType é "SHIPPING" e rewardOn não é "Finance", shippingAttributes é obrigatório e financeAttributes não é permitido, mas rewardAttributes está incluído.

• Para qualquer outro rewardType e rewardOn que não seja "Finance", rewardAttributes está incluído, mas nem financeAttributes nem shippingAttributes estão incluídos.

Exemplo de uso

Veja como você pode usar o tipo RewardGroup na prática:

const financeReward: RewardGroup = {
  groupId: 1,
  rewardType: "FINANCE",
  rewardOn: "Finance",
  itemConditionAttributes: [ /* properties */ ],
  financeAttributes: { /* properties */ }
};

const shippingReward: RewardGroup = {
  groupId: 2,
  rewardType: "SHIPPING",
  rewardOn: "Delivery",
  itemConditionAttributes: [ /* properties */ ],
  shippingAttributes: { /* properties */ },
  rewardAttributes: { /* properties */ }
};

// This will cause a TypeScript error because financeAttributes is not allowed for rewardType "SHIPPING"
const invalidReward: RewardGroup = {
  groupId: 3,
  rewardType: "SHIPPING",
  rewardOn: "Delivery",
  itemConditionAttributes: [ /* properties */ ],
  financeAttributes: { /* properties */ } // Error: financeAttributes
};