Leveraging keyof and Pick from a single source list for type definitions

Question

Leveraging keyof and Pick from a single source list for type definitions

In order to streamline the process, I want to define the necessary properties in a single list[], and then use that as the template for both types I am utilizing. Currently, I have to manually input them in two separate locations.

By employing keyof, I can ensure that I am only choosing from available props

type DealPropertiesKeys = keyof DealProperties

This enables me to specify which properties need to be retrieved from the API

  const deal = await hubSpotClient.crm.deals.basicApi.getById(dealId, [
    'dealname',
    'loan_type',
    'asset_type',
    'a_c_square_footage',
    'borrowing_entity_type',
    'borrowing_entity',
    'date_of_formation',
    'estimated_value',
    'exit_strategy',
    'fixed_or_arm',
    'intended_use',
    'lender',
    'loan_channel',
    'loan_program',
    'ltv',
    'project_name',
    'property_address',
    'property_type',
    'requested_terms',
    'subject_property_address',
    'subject_property_city',
    'subject_property_state',
    'subject_property_zip_code',
    'year_built',
    'amount',
    'hubspot_owner_id',
    'outstanding_mortgage_balance',
  ] as DealPropertiesKeys[])

When working with the returned object, I aim to type it according to the selected properties on the request.

type DealProps = Pick<
  DealProperties,
  | 'dealname'
  | 'loan_type'
  | 'asset_type'
  | 'a_c_square_footage'
  | 'borrowing_entity_type'
  | 'borrowing_entity'
  | 'date_of_formation'
  | 'estimated_value'
  | 'exit_strategy'
  | 'fixed_or_arm'
  | 'intended_use'
  | 'lender'
  | 'loan_channel'
  | 'loan_program'
  | 'ltv'
  | 'project_name'
  | 'property_address'
  | 'property_type'
  | 'requested_terms'
  | 'subject_property_address'
  | 'subject_property_city'
  | 'subject_property_state'
  | 'subject_property_zip_code'
  | 'year_built'
  | 'amount'
  | 'hubspot_owner_id'
  | 'outstanding_mortgage_balance'
>

typescript hubspot

Answer 1

Answer №1

This code snippet demonstrates a clever approach to working with arrays in TypeScript. By first defining the array as a constant and then using typeof theArray[number], all elements of the array are obtained as a union type. Additionally, since the properties of the const array will be passed to the getById function, it's important to declare the parameter as readonly (as indicated by the comments in the code).

type DealPropertiesKeys = keyof DealProperties

const requestDealProperties = [
  'dealname',
  'loan_type',
  ...
] as const                          // <- Defined as const here

// v Obtaining union type - `typeof theArray[number]`
type RequestDealProperties = typeof requestDealProperties[number]

type DealProps = Pick<
  DealProperties,
  RequestDealProperties            // <- Using union type here
>

// Dummy DealProperties placeholder - providing type declaration for keys
interface DealProperties {
  dealname: string
  loan_type: string
  asset_type: string
  ...
}

// Testing the getById function
function getById(
  dealId: string,
  properties: readonly DealPropertiesKeys[],  // <- Declaring as readonly array
) {
  console.log(dealId, properties)
}

getById('1234', requestDealProperties)

Answer 2

This code snippet demonstrates a clever approach to working with arrays in TypeScript. By first defining the array as a constant and then using typeof theArray[number], all elements of the array are obtained as a union type. Additionally, since the properties of the const array will be passed to the getById function, it's important to declare the parameter as readonly (as indicated by the comments in the code).

type DealPropertiesKeys = keyof DealProperties

const requestDealProperties = [
  'dealname',
  'loan_type',
  ...
] as const                          // <- Defined as const here

// v Obtaining union type - `typeof theArray[number]`
type RequestDealProperties = typeof requestDealProperties[number]

type DealProps = Pick<
  DealProperties,
  RequestDealProperties            // <- Using union type here
>

// Dummy DealProperties placeholder - providing type declaration for keys
interface DealProperties {
  dealname: string
  loan_type: string
  asset_type: string
  ...
}

// Testing the getById function
function getById(
  dealId: string,
  properties: readonly DealPropertiesKeys[],  // <- Declaring as readonly array
) {
  console.log(dealId, properties)
}

getById('1234', requestDealProperties)

Leveraging keyof and Pick from a single source list for type definitions

Answer №1

Similar questions

Error: Module './App' not found in webpack module

Errors during TypeScript compilation in Twilio Functions

Experiencing difficulties while trying to showcase a PDF within the Expo Go app

Using the useContext hook in a TypeScript class component: a step-by-step guide

Is it possible to include a conditional type in TypeScript using inlining?

What techniques can be used to determine which exact key was matched by a generic?

Enable child classes to overwrite using either a function attribute or a method

Utilizing the polymer paper-dialog component in an Angular 2 TypeScript application

Is it necessary to manually unsubscribe from observables in the main Angular component?

Tips for effectively utilizing the Angular ngIf directive for toggling the visibility of elements

When the boolean is initially set to false, it will return true in an if statement without using

Tips for waiting for an observable loop

Incorporating Imported Modules into the Final Build of a Typescript Project

A guide on implementing Redux Toolkit in an SPFX (typescript) project

Unveiling the secrets of the Google Region Lookup API

Ditch the if-else ladder approach and instead, opt for implementing a strategic design

Issue with TypeChecking in Angular4's HttpClient

Is there a way to loop through objects in Angular 2

Is it possible to indicate the base type for a generic function?

Error message: "Incompatible types in Typescript"