Export a TypeScript type dynamically

Question

Export a TypeScript type dynamically

I'm currently developing an application and I have a query regarding dynamically exporting a type.

My API call retrieves a list of categories.

const getCategories = async () => {
  const fetchedCategories = await axios.get(uri)

  // Expected output: ["fruits", "clothes", "shoes", "groceries", ...]
}

// Looking to create a unique export type Category containing only strings from the retrieved categories.
export type Category = "fruits" | "clothes" | "shoes" | "groceries" | ...

Can this be achieved in TypeScript? If not, I would appreciate alternative suggestions.

Thank you for your assistance!

typescript

Answer 1

Answer №1

To simplify, create a filter array and extract specific values:

const filterList = ['fruits', 'clothes', 'shoes', 'groceries'] as const;
const fetchData = async () => {
  const items = await axios.get(uri) as string[];
  const result = items.filter(item => filterList.includes(item));
}

// Define Category type that includes only strings from the filtered categories.
export type Category = typeof filterList[number];

Answer 2

To simplify, create a filter array and extract specific values:

const filterList = ['fruits', 'clothes', 'shoes', 'groceries'] as const;
const fetchData = async () => {
  const items = await axios.get(uri) as string[];
  const result = items.filter(item => filterList.includes(item));
}

// Define Category type that includes only strings from the filtered categories.
export type Category = typeof filterList[number];

Export a TypeScript type dynamically

Answer №1

Similar questions

Issue with Nodemon and Typescript causing errors with Worker Threads

Encountering errors when examining local variables during unit testing on an Angular component

What is the best way to eliminate a particular element from an array produced using the .map() function in

The specified property cannot be found on the object type in a Svelte application when using TypeScript

Having issues with unexpected token in Typescript while using "as HTMLElement" type?

You must include an argument for 'model' in the Angular service

Limiting the scope of TypeScript types to specific keys, such as Exact/DeepExact

The initial values of Typescript class members are merged directly into the class constructor

Exploring Angular 12: Techniques for Monitoring Property Changes in a Service

Experience a new way to log in with signInWithPopup, leaving the Email

Are there advantages to incorporating d3.js through npm in an Angular 2 TypeScript project?

Ways to input a return value that may be an array depending on the input

When trying to reference a vanilla JavaScript file in TypeScript, encountering the issue of the file not being recognized

What is the correct way to exclude and remove a portion of the value within an object using TypeScript?

Tips for updating a selected value without altering the reference value

What is the best way to retrieve a cookie sent from the server on a subdomain's domain within the client request headers using getServerSideProps

Is it possible that React useState is not allowing a default value to be set in this case?

Bringing in Static Functions Typescript

Tips for sharing data between two components

Steps for deactivating a button based on the list's size